working login

src/layouts/MainLayout.vue

@@ -15,6 +15,18 @@
           Auburn Oil
         </q-toolbar-title>
         <div>
+        <div v-if="user">
+           Welcome {{employee.employee_first_name}} {{employee.employee_last_name}}
+        </div>
+        <div v-else>
+            <router-link :to="{ name: 'login' }" class="">
+            <q-btn color="secondary" label="Login"/>
+          </router-link>
+
+        </div>
+
+
+
         </div>
       </q-toolbar>
     </q-header>
@@ -25,6 +37,18 @@
       bordered
     >
       <q-list padding>
+        <router-link :to="{ name: 'home' }" class="nodec">
+          <q-item clickable v-ripple>
+            <q-item-section avatar>
+              <q-icon name="inbox"/>
+            </q-item-section>
+
+            <q-item-section>
+              Home
+            </q-item-section>
+          </q-item>
+        </router-link>
+
         <router-link :to="{ name: 'today' }" class="nodec">
           <q-item clickable v-ripple>
             <q-item-section avatar>
@@ -38,8 +62,8 @@
         </router-link>
 
         <router-link :to="{ name: 'stats' }" class="nodec">
-          <q-item  clickable v-ripple>
-            <q-item-section avatar>
+          <q-item clickable v-ripple>
+            <q-item-section avatar>label
               <q-icon name="star"/>
             </q-item-section>
 
@@ -87,7 +111,8 @@
 import {defineComponent} from 'vue'
 import EssentialLink from 'components/EssentialLink.vue'
 import {useRoute} from 'vue-router' //
-
+import authHeader from "../services/auth.header"
+import axios from "axios"
 
 export default defineComponent({
   name: 'MainLayout',
@@ -98,15 +123,79 @@ export default defineComponent({
 
   data() {
     return {
+      user: {
+        user_id: 0,
+        uuid: '',
+        api_key: '',
+        username: '',
+        password_hash: '',
+        member_since: '',
+        email: '',
+        last_seen: '',
+        admin: 0,
+        admin_role: 0,
+        confirmed: 0,
+
+      },
+      loaded: false,
+      employee: {
+        id: '',
+        employee_last_name: "",
+        employee_first_name: "",
+        employee_town: "",
+        employee_address: "",
+        employee_apt: "",
+        employee_zip: "",
+        employee_birthday: "",
+        employee_phone_number: "",
+        employee_start_date: "",
+        employee_end_date: "",
+        employee_type: '',
+        employee_state: '',
+      },
       leftDrawerOpen: false,
 
     }
   },
+  created() {
+    this.userStatus()
 
+  },
   methods: {
     toggleLeftDrawer() {
       this.leftDrawerOpen = !this.leftDrawerOpen
-    }
+    },
+    userStatus() {
+      let path = import.meta.env.VITE_BASE_URL + '/auth/whoami';
+      axios({
+        method: 'get',
+        url: path,
+        withCredentials: true,
+        headers: authHeader(),
+      })
+        .then((response: any) => {
+          if (response.data.ok) {
+            this.user = response.data.user;
+            this.getEmployee(this.user.user_id)
+          }
+        })
+    },
+    getEmployee(userid: any) {
+      let path = import.meta.env.VITE_BASE_URL + "/employee/" + userid;
+      axios({
+        method: "get",
+        url: path,
+        withCredentials: true,
+        headers: authHeader(),
+      })
+        .then((response: any) => {
+          if (response.data) {
+
+            this.employee = response.data;
+            this.loaded = true;
+          }
+        })
+    },
   }
 })
 </script>
@@ -114,8 +203,8 @@ export default defineComponent({
 <style>
 
 .nodec {
-    text-decoration: none;
-  }
+  text-decoration: none;
+}
 
 
 </style>