95 lines
2.6 KiB
Vue
95 lines
2.6 KiB
Vue
<template>
|
|
<q-layout view="hhh lpR lff">
|
|
<q-header reveal elevated class="bg-primary text-white">
|
|
<q-toolbar>
|
|
<q-btn
|
|
flat
|
|
dense
|
|
round
|
|
icon="menu"
|
|
aria-label="Menu"
|
|
@click="toggleLeftDrawer"
|
|
/>
|
|
|
|
<q-toolbar-title>
|
|
{{ pageTitle || "Polétání.cz" }}
|
|
</q-toolbar-title>
|
|
|
|
<TopMenuButton v-if="!isQueryRunning && user" :logged-user="user" @logout="logout"/>
|
|
|
|
</q-toolbar>
|
|
</q-header>
|
|
|
|
<q-drawer
|
|
v-model="leftDrawerOpen"
|
|
show-if-above
|
|
bordered
|
|
>
|
|
<q-img class="absolute-top" v-if="!isQueryRunning && user" :src="user.titleImageUrl" style="height: 150px"/>
|
|
<q-spinner v-else/>
|
|
|
|
<q-scroll-area style="height: calc(100% - 150px); margin-top: 150px; border-right: 1px solid #ddd">
|
|
<SidebarNavigation/>
|
|
</q-scroll-area>
|
|
</q-drawer>
|
|
|
|
<q-page-container>
|
|
<BreadcrumbsNavigation :items="breadcrumbs || []"/>
|
|
<div class="q-mx-md q-my-md" style="padding-bottom: 150px">
|
|
<router-view/>
|
|
</div>
|
|
</q-page-container>
|
|
</q-layout>
|
|
</template>
|
|
|
|
<script>
|
|
import {useLoggedUserStore} from "stores/LoggedUser";
|
|
|
|
export default {
|
|
preFetch({redirect, currentRoute}) {
|
|
// nelze udelat refresh tokenu, protoze refreshToken je ulozeny v HTTP-only cookie a neposila se!
|
|
return useLoggedUserStore().fetchLoggedUserDetail({refresh: false}).catch(() => {
|
|
redirect({name: "profileRefresh", query: {url: currentRoute.href}})
|
|
})
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<script setup>
|
|
import {ref, watch} from 'vue'
|
|
import {storeToRefs} from "pinia";
|
|
import BreadcrumbsNavigation from "components/navigation/BreadcrumbsNavigation.vue";
|
|
import {useAppStore} from "stores/App";
|
|
import {useMeta, useQuasar} from "quasar";
|
|
import {useRouter} from "vue-router";
|
|
import {successObject} from "src/composables/dialog";
|
|
import SidebarNavigation from "components/navigation/SidebarNavigation.vue";
|
|
import TopMenuButton from "components/navigation/TopMenuButton.vue";
|
|
import {metaData} from "src/composables/meta";
|
|
|
|
const $q = useQuasar();
|
|
const $router = useRouter();
|
|
|
|
const {pageTitle, breadcrumbs} = storeToRefs(useAppStore());
|
|
watch(() => pageTitle.value, () => {
|
|
useMeta(() => metaData({
|
|
title: pageTitle.value
|
|
}));
|
|
|
|
})
|
|
|
|
const leftDrawerOpen = ref(false)
|
|
const toggleLeftDrawer = () => {
|
|
leftDrawerOpen.value = !leftDrawerOpen.value
|
|
};
|
|
|
|
const {isQueryRunning, user} = storeToRefs(useLoggedUserStore());
|
|
|
|
const logout = () => {
|
|
useLoggedUserStore().logout().then(() => {
|
|
$q.notify(successObject("Odhlášení bylo úspěšné"));
|
|
$router.push({name: "homepage"});
|
|
})
|
|
}
|
|
</script>
|