202 lines
4.8 KiB
Vue
202 lines
4.8 KiB
Vue
<template>
|
|
<q-layout view="lHh Lpr lFf">
|
|
<q-header elevated>
|
|
<q-toolbar>
|
|
<q-btn
|
|
flat
|
|
dense
|
|
round
|
|
icon="menu"
|
|
aria-label="Menu"
|
|
@click="toggleLeftDrawer"
|
|
/>
|
|
|
|
<q-toolbar-title>
|
|
Auburn Oil
|
|
</q-toolbar-title>
|
|
<div>
|
|
<div v-if="user.user_id > 0">
|
|
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>
|
|
|
|
<q-drawer
|
|
v-model="leftDrawerOpen"
|
|
show-if-above
|
|
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>
|
|
<q-icon name="inbox"/>
|
|
</q-item-section>
|
|
<q-item-section>
|
|
Todays Deliveries
|
|
</q-item-section>
|
|
</q-item>
|
|
</router-link>
|
|
<router-link :to="{ name: 'tomorrow' }" class="nodec">
|
|
<q-item clickable v-ripple>
|
|
<q-item-section avatar>
|
|
<q-icon name="drafts"/>
|
|
</q-item-section>
|
|
<q-item-section>
|
|
Tomorrow Deliveries
|
|
</q-item-section>
|
|
</q-item>
|
|
</router-link>
|
|
<router-link :to="{ name: 'waiting' }" class="nodec">
|
|
<q-item clickable v-ripple>
|
|
<q-item-section avatar>
|
|
<q-icon name="drafts"/>
|
|
</q-item-section>
|
|
<q-item-section>
|
|
Waiting Deliveries
|
|
</q-item-section>
|
|
</q-item>
|
|
</router-link>
|
|
<router-link :to="{ name: 'stats' }" class="nodec">
|
|
<q-item clickable v-ripple>
|
|
<q-item-section avatar>
|
|
<q-icon name="star"/>
|
|
</q-item-section>
|
|
<q-item-section>
|
|
Stats
|
|
</q-item-section>
|
|
</q-item>
|
|
</router-link>
|
|
<router-link :to="{ name: 'stats' }" class="nodec">
|
|
<q-item clickable v-ripple>
|
|
<q-item-section avatar>
|
|
<q-icon name="send"/>
|
|
</q-item-section>
|
|
<q-item-section>
|
|
Automatics
|
|
</q-item-section>
|
|
</q-item>
|
|
</router-link>
|
|
|
|
|
|
</q-list>
|
|
|
|
</q-drawer>
|
|
|
|
<q-page-container>
|
|
<router-view/>
|
|
</q-page-container>
|
|
</q-layout>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import {defineComponent} from 'vue'
|
|
import authHeader from "../services/auth.header"
|
|
import axios from "axios"
|
|
|
|
export default defineComponent({
|
|
name: 'MainLayout',
|
|
|
|
components: {},
|
|
|
|
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() {
|
|
const 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)
|
|
} else {
|
|
this.user.user_id = 0
|
|
}
|
|
})
|
|
},
|
|
getEmployee(userid: any) {
|
|
const 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>
|
|
|
|
<style>
|
|
|
|
.nodec {
|
|
text-decoration: none;
|
|
}
|
|
</style>
|