From c678ec0ae90c25121f80e26565dc5d0a4c03d1b4 Mon Sep 17 00:00:00 2001
From: Aaron Claydon <claydon.aaron@gmail.com>
Date: Thu, 23 May 2024 23:41:29 +0100
Subject: [PATCH] Assistant

---
 src/App.vue                   |  4 +--
 src/routes.js                 |  8 +++++
 src/views/Assistant/Home.vue  | 63 +++++++++++++++++++++++++++++++++++
 src/views/Timetables/Home.vue |  2 +-
 4 files changed, 74 insertions(+), 3 deletions(-)
 create mode 100644 src/views/Assistant/Home.vue

diff --git a/src/App.vue b/src/App.vue
index 6617fc4..7f07cfa 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -35,8 +35,8 @@ export default {
           route: { name: 'timetables/home' }
         },
         {
-          name: 'Statistics',
-          route: { name: 'statistics/home' }
+          name: 'Assistant',
+          route: { name: 'assistant/home' }
         },
         {
           name: 'Account',
diff --git a/src/routes.js b/src/routes.js
index d304a80..b94a69d 100644
--- a/src/routes.js
+++ b/src/routes.js
@@ -134,5 +134,13 @@ export const routes = [
     },
     component: () => import('./views/Services/View.vue')
   },
+  {
+    name: 'assistant/home',
+    path: '/assistant',
+    meta: { 
+      title: 'Assistant'
+    },
+    component: () => import('./views/Assistant/Home.vue')
+  },
   { path: '/:path(.*)', component: NotFound },
 ]
diff --git a/src/views/Assistant/Home.vue b/src/views/Assistant/Home.vue
new file mode 100644
index 0000000..47026e7
--- /dev/null
+++ b/src/views/Assistant/Home.vue
@@ -0,0 +1,63 @@
+<template>
+  <div>
+    <PageTitle>
+      Assistant
+    </PageTitle>
+    <Card>
+      <div>
+        <div
+          class="pb-2"
+          v-for="(message, index) in this.messageHistory" v-bind:key="index"
+        >
+          <h3 class="text-gray-500 font-semibold text-lg">{{ message.actor }}</h3>
+          {{ message.text }}
+        </div>
+      </div>
+    </Card>
+
+    <div class="absolute bottom-5 z-50">
+        <input type="text" id="destination" 
+          class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
+          placeholder="Enter your message" required
+          v-model="userMessage"
+          autocomplete="off"
+        />
+        <button 
+          type="submit" 
+          class="text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
+          @click.stop.prevent="submit()"
+        >
+          Send
+        </button>
+    </div>
+  </div>
+</template>
+
+<script>
+import Card from '@/components/Card.vue'
+import PageTitle from '@/components/PageTitle.vue'
+
+export default {
+  name: 'AssistantHome',
+  components: {
+    Card,
+    PageTitle,
+  },
+  data(){
+    return {
+      messageHistory: [
+        {"actor": "user", "text": "Hi"},
+        {"actor": "ai", "text": "Hello there"},
+        {"actor": "user", "text": "Can you help me?"},
+        {"actor": "user", "text": "No"}
+      ],
+      userMessage: ""
+    }
+  },
+  methods: {
+    submit(){
+      this.messageHistory.push({"actor": "user", "text": this.userMessage})
+    }
+  }
+}
+</script>
\ No newline at end of file
diff --git a/src/views/Timetables/Home.vue b/src/views/Timetables/Home.vue
index 237e645..2de0d37 100644
--- a/src/views/Timetables/Home.vue
+++ b/src/views/Timetables/Home.vue
@@ -7,7 +7,7 @@
       <strong>Coming Soon</strong>
 
       <p>
-        Here you will be able to see scheduled timings for bus services.
+        Here you will be able to see scheduled timings for transport services.
       </p>
     </Card>
   </div>