refactor(login): change to Setup store instead of Options store, fix auth frontend flow
This commit is contained in:
parent
6006c3fb42
commit
7399232ed8
|
|
@ -1,7 +1,7 @@
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { RouterView } from 'vue-router';
|
import { RouterView } from 'vue-router';
|
||||||
import HeaderBar from 'src/modules/shared/components/navigation/header-bars/header-bar.vue';
|
import HeaderBar from 'src/modules/shared/components/navigation/header-bar.vue';
|
||||||
import FooterBar from 'src/modules/shared/components/navigation/footer-bars/footer-bar.vue';
|
import FooterBar from 'src/modules/shared/components/navigation/footer-bar.vue';
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
||||||
|
|
@ -1,59 +1,48 @@
|
||||||
/* eslint-disable */
|
/* eslint-disable */
|
||||||
import { defineStore } from "pinia";
|
import { defineStore } from "pinia";
|
||||||
import { api } from "src/boot/axios";
|
|
||||||
import { User } from "src/modules/users/types/user-interface";
|
import { User } from "src/modules/users/types/user-interface";
|
||||||
import { AuthState } from "./types/auth-interface";
|
import { AuthState } from "./types/auth-interface";
|
||||||
|
import { AuthService } from "./services/services-auth";
|
||||||
|
import { computed, ref } from "vue";
|
||||||
|
|
||||||
|
|
||||||
export const useAuthStore = defineStore('auth', {
|
export const useAuthStore = defineStore('auth', () => {
|
||||||
state: (): AuthState => ({
|
const user = ref ({
|
||||||
token: "",
|
firstName: 'Unknown',
|
||||||
user: {
|
lastName: 'Unknown',
|
||||||
firstName: 'Unknown',
|
email: 'guest@guest.com',
|
||||||
lastName: 'Unknown',
|
role: 'guest'
|
||||||
email: 'guest@guest.com',
|
} as User);
|
||||||
role: 'guest'
|
const error = ref("");
|
||||||
} as User,
|
const isAuthorizedUser = computed( () => user.value.role !== 'guest');
|
||||||
loading: false,
|
|
||||||
error: "",
|
|
||||||
}),
|
|
||||||
|
|
||||||
getters: {
|
const login = () => {
|
||||||
hasAuthToken: (state) => !!state.token,
|
//TODO: manage customer login process
|
||||||
},
|
};
|
||||||
|
|
||||||
actions: {
|
const oidcLogin = () => {
|
||||||
login() {
|
const oidcPopup = AuthService.oidcLogin();
|
||||||
const authPopup = window.open('http://localhost:3000/auth/v1/login', 'authPopup', 'width=600,height=800');
|
if (!oidcPopup) {
|
||||||
window.addEventListener('message', (event) => {
|
error.value = "You have popups blocked on this website!";
|
||||||
if (event.data.type === 'authSuccess') {
|
|
||||||
console.log('Logged in successfully!');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
|
|
||||||
async oidcLogin() {
|
|
||||||
return "openIDConnect login";
|
|
||||||
},
|
|
||||||
|
|
||||||
async logout() {
|
|
||||||
return "logout";
|
|
||||||
},
|
|
||||||
|
|
||||||
setAuthToken(token: string) {
|
|
||||||
return "setting auth token";
|
|
||||||
},
|
|
||||||
|
|
||||||
setUser(user: Record<string, any>) {
|
|
||||||
return "setting user info";
|
|
||||||
},
|
|
||||||
|
|
||||||
isAuthorizedUser(): boolean {
|
|
||||||
return this.$state.user.role.toLowerCase() != 'guest';
|
|
||||||
},
|
|
||||||
|
|
||||||
async forgotPassword(email: string) {
|
|
||||||
return "resetting password";
|
|
||||||
}
|
}
|
||||||
},
|
};
|
||||||
|
|
||||||
|
const logout = () => {
|
||||||
|
return "logout";
|
||||||
|
};
|
||||||
|
|
||||||
|
const setUser = (currentUser: User, isBypass: boolean = false, bypassRole?: string) => {
|
||||||
|
if (isBypass) {
|
||||||
|
user.value = {
|
||||||
|
firstName: "Testing",
|
||||||
|
lastName: "Tester",
|
||||||
|
email: "testingT@targointernet.com",
|
||||||
|
role: bypassRole || "guest"} as User;
|
||||||
|
} else {
|
||||||
|
user.value = currentUser;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return { login, oidcLogin, logout, setUser };
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,9 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref, watch } from 'vue';
|
import { ref, watch } from 'vue';
|
||||||
import { useAuthApi } from '../composables/use-auth-api';
|
import { useAuthStore } from '../auth-store';
|
||||||
|
|
||||||
const { login } = useAuthApi();
|
|
||||||
|
const authStore = useAuthStore();
|
||||||
const email = ref('');
|
const email = ref('');
|
||||||
const isShowingEmployeeLoginButton = ref(false);
|
const isShowingEmployeeLoginButton = ref(false);
|
||||||
const isRemembered = ref(false);
|
const isRemembered = ref(false);
|
||||||
|
|
@ -13,55 +14,77 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<q-layout view="hHh lpR fFf" class="flex flex-center bg-dark">
|
<q-layout view="hHh lpR fFf">
|
||||||
<q-img src="src/assets/village.png" fit="cover" position="50% 100%" class="absolute-full" />
|
<q-page-container class="bg-dark">
|
||||||
<q-page-container>
|
<q-img src="src/assets/village.png" fit="cover" position="50% 100%" class="absolute-full" />
|
||||||
<transition appear enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
|
<q-page class="flex flex-center">
|
||||||
<q-card class="rounded-20">
|
<transition appear slow enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
|
||||||
<q-card-section class="text-center bg-primary q-pa-lg">
|
<q-card class="rounded-20">
|
||||||
<q-img src="/src/assets/logo-targo-white.svg" ratio="4.6" fit="contain" />
|
<q-card-section class="text-center bg-primary q-pa-lg">
|
||||||
</q-card-section>
|
<q-img src="/src/assets/logo-targo-white.svg" ratio="4.6" fit="contain" />
|
||||||
<div class="q-pt-sm q-px-xl q-pb-lg">
|
|
||||||
<q-card-section class="text-center">
|
|
||||||
<div class="text-h6 text-grey-9 text-weight-bold">
|
|
||||||
{{ $t('loginPage.title') }}
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
|
|
||||||
<q-form class="q-gutter-sm" @submit="login">
|
<div class="q-pt-sm q-px-xl q-pb-lg">
|
||||||
<q-input dense outlined label-color="primary" v-model="email" :label="$t('loginPage.email')" />
|
<q-card-section class="text-center">
|
||||||
|
<div class="text-h6 text-grey-9 text-weight-bold">
|
||||||
<q-card-section class="q-ma-none q-pa-none">
|
{{ $t('loginPage.title') }}
|
||||||
<q-toggle v-model="isRemembered" :label="$t('loginPage.rememberMe')" color="primary" />
|
</div>
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
|
|
||||||
<q-card-actions>
|
|
||||||
<q-btn disabled rounded push :label="$t('loginPage.submit')" type="submit" color="primary" class="full-width" />
|
|
||||||
</q-card-actions>
|
|
||||||
|
|
||||||
<!-- A implémenter plus tard sans doute, pour les clients. A revoir avec Authentik API pour création de users -->
|
|
||||||
<!-- <q-card-section class="text-center q-pa-none q-mt-none">
|
|
||||||
<RouterLink disabled class="text-primary" to="/signup">{{ $t('loginPage.signUp') }}</RouterLink>
|
|
||||||
</q-card-section> -->
|
|
||||||
</q-form>
|
|
||||||
|
|
||||||
<q-card-section class="row q-pt-sm">
|
<q-form class="q-gutter-sm" @submit="authStore.login">
|
||||||
<q-separator color="primary" class="col self-center"/>
|
<q-input dense outlined label-color="primary" v-model="email" :label="$t('loginPage.email')" />
|
||||||
<span class="col text-primary text-weight-bolder text-center vertical-align self-center">{{$t('loginPage.loginOrSeparator')}}</span>
|
|
||||||
<q-separator color="primary" class="col self-center"/>
|
<q-card-section class="q-ma-none q-pa-none">
|
||||||
</q-card-section>
|
<q-toggle v-model="isRemembered" :label="$t('loginPage.rememberMe')" color="primary" />
|
||||||
|
</q-card-section>
|
||||||
|
|
||||||
|
<q-card-actions>
|
||||||
|
<q-btn disabled rounded push :label="$t('loginPage.submit')" type="submit" color="primary" class="full-width" />
|
||||||
|
</q-card-actions>
|
||||||
|
|
||||||
|
<!-- A implémenter plus tard sans doute, pour les clients. A revoir avec Authentik API pour création de users -->
|
||||||
|
<!-- <q-card-section class="text-center q-pa-none q-mt-none">
|
||||||
|
<RouterLink disabled class="text-primary" to="/signup">{{ $t('loginPage.signUp') }}</RouterLink>
|
||||||
|
</q-card-section> -->
|
||||||
|
</q-form>
|
||||||
|
|
||||||
<q-card-section class="column q-px-sm q-pt-none">
|
<q-card-section class="row q-pt-sm">
|
||||||
<q-btn disabled rounded push :label="$t('loginPage.facebookLoginButton')" color="fb-blue" class="full-width row q-mb-sm" icon="img:src/assets/Facebook-f_Logo-White-Logo.wine.svg">
|
<q-separator color="primary" class="col self-center"/>
|
||||||
<q-tooltip anchor="top middle" class="bg-primary">{{$t('loginPage.tooltipComingSoon')}}</q-tooltip>
|
<span class="col text-primary text-weight-bolder text-center vertical-align self-center">{{$t('loginPage.loginOrSeparator')}}</span>
|
||||||
</q-btn>
|
<q-separator color="primary" class="col self-center"/>
|
||||||
<transition appear enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
|
</q-card-section>
|
||||||
<q-btn rounded push color="primary" v-if="isShowingEmployeeLoginButton" @click="login" :label="$t('loginPage.employeeLoginButton')" class="full-width row" icon="img:src/assets/logo-targo-simple.svg" />
|
|
||||||
</transition>
|
<q-card-section class="column q-px-sm q-pt-none">
|
||||||
</q-card-section>
|
<q-btn disabled rounded push :label="$t('loginPage.facebookLoginButton')" color="fb-blue" class="full-width row q-mb-sm" icon="img:src/assets/Facebook-f_Logo-White-Logo.wine.svg">
|
||||||
</div>
|
<q-tooltip anchor="top middle" class="bg-primary">{{$t('loginPage.tooltipComingSoon')}}</q-tooltip>
|
||||||
</q-card>
|
</q-btn>
|
||||||
</transition>
|
<q-slide-transition>
|
||||||
|
<div v-if="isShowingEmployeeLoginButton">
|
||||||
|
<transition slow enter-active-class="animated zoomIn" leave-active-class="animated zoomOut">
|
||||||
|
<q-btn rounded push color="primary" @click="authStore.oidcLogin" :label="$t('loginPage.employeeLoginButton')" class="full-width row" icon="img:src/assets/logo-targo-simple.svg" />
|
||||||
|
</transition>
|
||||||
|
</div>
|
||||||
|
</q-slide-transition>
|
||||||
|
</q-card-section>
|
||||||
|
</div>
|
||||||
|
</q-card>
|
||||||
|
</transition>
|
||||||
|
|
||||||
|
<!-- DEV TOOLS -->
|
||||||
|
<q-card class="absolute-bottom-right q-ma-sm">
|
||||||
|
<q-card-section class="q-pa-sm text-primary"> BYPASS LOGIN WITH: </q-card-section>
|
||||||
|
<q-separator color="primary" />
|
||||||
|
<q-card-section>
|
||||||
|
<q-btn-group push rounded>
|
||||||
|
<q-btn push color="primary" text-color="white" label="ACCOUNTING" icon="attach_money" />
|
||||||
|
<q-btn push color="primary" text-color="white" label="SUPERVISOR" icon="supervisor_account"/>
|
||||||
|
<q-btn push color="primary" text-color="white" label="HR" icon="diversity_3"/>
|
||||||
|
<q-btn push color="primary" text-color="white" label="EMPLOYEE" icon="support_agent"/>
|
||||||
|
</q-btn-group>
|
||||||
|
</q-card-section>
|
||||||
|
|
||||||
|
</q-card>
|
||||||
|
</q-page>
|
||||||
</q-page-container>
|
</q-page-container>
|
||||||
</q-layout>
|
</q-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -1,66 +0,0 @@
|
||||||
<script lang="ts" setup>
|
|
||||||
/* eslint-disable */
|
|
||||||
import { ref } from 'vue';
|
|
||||||
import { useRouter, useRoute } from 'vue-router';
|
|
||||||
import { useAuthStore } from 'src/modules/auth/auth-store';
|
|
||||||
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
const authStore = useAuthStore();
|
|
||||||
|
|
||||||
const userConnected = authStore.user;
|
|
||||||
const userRole: string = userConnected.role;
|
|
||||||
const leftDrawerOpen = ref(false);
|
|
||||||
|
|
||||||
function toggleLeftDrawer() {
|
|
||||||
leftDrawerOpen.value = !leftDrawerOpen.value;
|
|
||||||
}
|
|
||||||
|
|
||||||
const goToUsers = () => {
|
|
||||||
router.replace('/users');
|
|
||||||
};
|
|
||||||
|
|
||||||
const goToShiftsValidations = () => {
|
|
||||||
router.replace('/time_sheet_validations');
|
|
||||||
};
|
|
||||||
|
|
||||||
const goToHome = () => {
|
|
||||||
router.replace('/');
|
|
||||||
};
|
|
||||||
|
|
||||||
// const goToHelp = () => {
|
|
||||||
// router.replace('/help');
|
|
||||||
// };
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-footer bordered class="bg-white">
|
|
||||||
<q-tabs no-caps active-color="primary" indicator-color="transparent" class="text-grey-8">
|
|
||||||
<q-tab name="home" icon="home" @click="goToHome" />
|
|
||||||
<!-- <q-tab name="help" icon="help" @click="goToHelp" /> -->
|
|
||||||
<q-tab name="menu" icon="menu" @click="toggleLeftDrawer" />
|
|
||||||
<q-drawer v-model="leftDrawerOpen" side="right">
|
|
||||||
<q-scroll-area style="border-right: 1px solid #ddd;">
|
|
||||||
<q-list padding>
|
|
||||||
<q-item clickable v-ripple :active="route.path === '/users'" active-class="bg-primary text-white" @click="goToUsers" >
|
|
||||||
<q-item-section avatar>
|
|
||||||
<q-icon name="list" />
|
|
||||||
</q-item-section>
|
|
||||||
|
|
||||||
<q-item-section> {{ $t('navBar.navItem_1') }} </q-item-section>
|
|
||||||
</q-item>
|
|
||||||
<q-item clickable v-ripple :active="route.path === '/time_sheet_validations'" active-class="bg-primary text-white" @click="goToShiftsValidations" v-if="userRole === 'admin'">
|
|
||||||
<q-item-section avatar>
|
|
||||||
<q-icon name="supervisor_account" />
|
|
||||||
</q-item-section>
|
|
||||||
|
|
||||||
<q-item-section>{{ $t('navBar.navItem_2') }} </q-item-section>
|
|
||||||
</q-item>
|
|
||||||
</q-list>
|
|
||||||
</q-scroll-area>
|
|
||||||
|
|
||||||
<q-img class="absolute-top" src="https://cdn.quasar.dev/img/material.png" height="150px" />
|
|
||||||
</q-drawer>
|
|
||||||
</q-tabs>
|
|
||||||
</q-footer>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
<template>
|
|
||||||
<q-toolbar>
|
|
||||||
<div class="text-right ">© 2025 Targo Communications inc.</div>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,12 +0,0 @@
|
||||||
<script setup lang="ts">
|
|
||||||
// import FooterBarMobile from './footer-bar-mobile.vue';
|
|
||||||
import FooterBarWeb from './footer-bar-web.vue';
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-footer elevated class="bg-primary text-white">
|
|
||||||
<FooterBarWeb />
|
|
||||||
<!-- <FooterBarMobile class="lt-md" /> -->
|
|
||||||
</q-footer>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
|
|
@ -1,47 +0,0 @@
|
||||||
<script lang="ts" setup>
|
|
||||||
/* eslint-disable */
|
|
||||||
import { useRoute } from 'vue-router';
|
|
||||||
import { computed } from 'vue';
|
|
||||||
import { useAuthStore } from 'src/modules/auth/auth-store';
|
|
||||||
// import dialogs from 'src/components/dialogs';
|
|
||||||
|
|
||||||
// const authStore = useAuthStore();
|
|
||||||
// const user = authStore.user;
|
|
||||||
// const { NotificationsDialog, AccountDialog } = dialogs;
|
|
||||||
const route = useRoute();
|
|
||||||
const backRoutes = [
|
|
||||||
'newUser',
|
|
||||||
'userById',
|
|
||||||
'timeSheet',
|
|
||||||
'timeSheetValidationsId',
|
|
||||||
];
|
|
||||||
const isBackRoute = computed(
|
|
||||||
() => backRoutes.indexOf(route.name as string) !== -1,
|
|
||||||
);
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-toolbar v-if="!isBackRoute">
|
|
||||||
<q-toolbar-title>
|
|
||||||
<!-- {{ $t('navBar.mobileIndexTitle') }} {{ user.first_name }} -->
|
|
||||||
</q-toolbar-title>
|
|
||||||
<NotificationsDialog />
|
|
||||||
<AccountDialog />
|
|
||||||
</q-toolbar>
|
|
||||||
<q-toolbar v-else>
|
|
||||||
<q-toolbar-title>
|
|
||||||
<q-btn
|
|
||||||
icon="chevron_left"
|
|
||||||
flat
|
|
||||||
round
|
|
||||||
dense
|
|
||||||
color="white"
|
|
||||||
@click="$router.go(-1)"
|
|
||||||
/>
|
|
||||||
</q-toolbar-title>
|
|
||||||
<div class="text-h6 text-white">
|
|
||||||
{{ $t(`pagesTitles.${route.meta.title}`) }}
|
|
||||||
</div>
|
|
||||||
<q-space />
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,109 +0,0 @@
|
||||||
<script lang="ts" setup>
|
|
||||||
/* eslint-disable */
|
|
||||||
import { useRouter } from 'vue-router';
|
|
||||||
import { useQuasar } from 'quasar';
|
|
||||||
// import { getInitials } from 'src/helpers/object';
|
|
||||||
import { useAuthStore } from 'src/modules/auth/auth-store';
|
|
||||||
import LanguageSwitch from 'src/modules/shared/components/language-switch.vue';
|
|
||||||
// import dialogs from 'src/components/dialogs';
|
|
||||||
// import authenticationApi from 'src/composables/useAuthentication';
|
|
||||||
|
|
||||||
// const { logout } = authenticationApi.useAuthUser();
|
|
||||||
// const { NotificationsDialog } = dialogs;
|
|
||||||
const authStore = useAuthStore();
|
|
||||||
const router = useRouter();
|
|
||||||
const $q = useQuasar();
|
|
||||||
|
|
||||||
const userConnected = authStore.user;
|
|
||||||
const userRole = userConnected.role;
|
|
||||||
// const userType = userConnected.type;
|
|
||||||
|
|
||||||
const goToProfile = () => {
|
|
||||||
router.replace('/profile');
|
|
||||||
};
|
|
||||||
|
|
||||||
const goToHelp = () => {
|
|
||||||
router.replace('/help');
|
|
||||||
};
|
|
||||||
|
|
||||||
const goToCalender = () => {
|
|
||||||
const pdfUrl = '/calendrier_annuel.pdf';
|
|
||||||
window.open(pdfUrl, '_blank');
|
|
||||||
};
|
|
||||||
|
|
||||||
const goToTimeSheet = () => {
|
|
||||||
router.replace('/time_sheet');
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleLogout = async () => {
|
|
||||||
// const response = await logout();
|
|
||||||
// const { type, message } = response;
|
|
||||||
// $q.notify({ type, message });
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-toolbar>
|
|
||||||
<q-btn flat color="white" icon="img:src/assets/logo-targo-white.svg">
|
|
||||||
</q-btn>
|
|
||||||
<q-space />
|
|
||||||
<q-btn flat class="q-mr-xs" to="/users" color="white" :label="$t('navBar.navItem_1')" />
|
|
||||||
<q-btn flat class="q-mr-xs" to="/time_sheet_validations" color="white" :label="$t('navBar.navItem_2')" />
|
|
||||||
<LanguageSwitch class="q-mr-xs text-white"/>
|
|
||||||
<q-btn round color="white">
|
|
||||||
<q-avatar color="white" text-color="primary" />
|
|
||||||
<q-menu fit transition-show="flip-right" transition-hide="flip-left">
|
|
||||||
<q-list>
|
|
||||||
<q-item>
|
|
||||||
<div class="text-subtitle1 q-mb-xs text-no-wrap text-center">
|
|
||||||
ND
|
|
||||||
</div>
|
|
||||||
</q-item>
|
|
||||||
<q-separator />
|
|
||||||
<q-item v-ripple clickable @click="goToProfile">
|
|
||||||
<q-item-section avatar
|
|
||||||
><q-icon name="mdi-account" color="primary" size="2em"
|
|
||||||
/></q-item-section>
|
|
||||||
<q-item-section>{{ $t('navBar.menuItem_1') }}</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
<!-- <q-item
|
|
||||||
v-if="userType === 'employee'"
|
|
||||||
v-ripple
|
|
||||||
clickable
|
|
||||||
@click="goToTimeSheet"
|
|
||||||
>
|
|
||||||
<q-item-section avatar>
|
|
||||||
<q-icon name="work_history" color="primary" size="2em" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>{{ $t('navBar.menuItem_4') }}</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
<q-item
|
|
||||||
v-if="userType === 'employee'"
|
|
||||||
v-ripple
|
|
||||||
clickable
|
|
||||||
@click="goToCalender"
|
|
||||||
>
|
|
||||||
<q-item-section avatar>
|
|
||||||
<q-icon name="calendar_month" color="primary" size="2em" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>{{ $t('navBar.menuItem_5') }}</q-item-section>
|
|
||||||
</q-item> -->
|
|
||||||
<q-item v-ripple clickable @click="goToHelp">
|
|
||||||
<q-item-section avatar>
|
|
||||||
<q-icon name="help" color="primary" size="2em" />
|
|
||||||
</q-item-section>
|
|
||||||
<q-item-section>{{ $t('navBar.menuItem_2') }}</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
<q-separator />
|
|
||||||
<q-item v-ripple clickable @click="handleLogout">
|
|
||||||
<q-item-section avatar>
|
|
||||||
<q-icon name="logout" color="primary" size="2em" />
|
|
||||||
</q-item-section>
|
|
||||||
|
|
||||||
<q-item-section>{{ $t('navBar.menuItem_3') }}</q-item-section>
|
|
||||||
</q-item>
|
|
||||||
</q-list>
|
|
||||||
</q-menu>
|
|
||||||
</q-btn>
|
|
||||||
</q-toolbar>
|
|
||||||
</template>
|
|
||||||
|
|
@ -1,12 +0,0 @@
|
||||||
<script lang="ts" setup>
|
|
||||||
// import HeaderBarMobile from './header-bar-mobile.vue';
|
|
||||||
import HeaderBarWeb from './header-bar-web.vue';
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<template>
|
|
||||||
<q-header elevated>
|
|
||||||
<!-- <HeaderBarMobile /> -->
|
|
||||||
<HeaderBarWeb />
|
|
||||||
</q-header>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
Loading…
Reference in New Issue
Block a user