MainLayout.vue
2.46 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
<template>
<q-layout view="lHh Lpr lFf">
<q-header bordered class="header-style" elevated>
<q-toolbar class="row justify-between">
<div>
<q-btn
flat
dense
round
icon="menu"
aria-label="Menu"
@click="leftDrawerOpen = !leftDrawerOpen"
/>
<q-btn icon="home" @click="navigateToHome" flat />
</div>
<div class="menu-user row items-center">
<q-fab square class="btn" icon="person" :label="adminName" direction="down" flat
no-caps>
<q-fab-action class="btn-logout" @click="logout" text-color="white">
Sair
</q-fab-action>
</q-fab>
</div>
</q-toolbar>
</q-header>
<q-drawer
v-model="leftDrawerOpen"
show-if-above
bordered
>
<q-list class="side-menu column justify-between">
<div>
<q-item-label
header
class="text-grey-8"
>
<div class="menu-logo row justify-center">
<q-img class="image-logo" src="../assets/logo/primaryLogo.png" />
</div>
</q-item-label>
<Menu></Menu>
<q-item-label
class="self-end"
>
</q-item-label>
</div>
<div class="menu-logo-ifes row justify-center">
<q-img class="image-logo" src="../assets/ifes-logo.png" />
</div>
</q-list>
</q-drawer>
<q-page-container>
<router-view />
</q-page-container>
<q-footer class="footer-style row justify-center items-center">
Desenvolvido por Herik S.Lorenção
</q-footer>
</q-layout>
</template>
<script lang="ts">
import { Vue, Component } from 'vue-property-decorator';
import Menu from "components/menu/Menu.vue";
import AdminService from "src/services/AdminService";
@Component({
components: { Menu },
})
export default class MainLayout extends Vue {
leftDrawerOpen = false;
adminName = '';
navigateToHome() {
if (this.$route.path !== '/') {
this.$router.push('/');
}
}
logout() {
this.$store.commit('login/defineUserId', null);
this.$router.push('/login');
}
async mounted() {
const adminService = new AdminService();
const userId = this.$store.getters['login/getIdUsuario'];
const admin = await adminService.find(userId);
if (admin && admin.name) {
this.adminName = admin.name;
}
}
}
</script>