update behavior of left drawer

This commit is contained in:
Tim Gröger 2024-01-16 14:37:38 +01:00
parent 417689b725
commit fe9ec96ce1
1 changed files with 48 additions and 27 deletions

View File

@ -2,7 +2,7 @@
<q-layout view="hHh Lpr lff">
<q-header elevated class="bg-primary text-white">
<q-toolbar>
<q-btn dense flat round icon="mdi-menu" @click="openMenu" />
<q-btn dense flat round icon="mdi-menu" @click="openMenu(true)" />
<q-toolbar-title>
<router-link :to="{ name: 'dashboard' }" style="text-decoration: none; color: inherit">
@ -56,9 +56,10 @@
side="left"
bordered
:mini="leftDrawerMini"
@click.capture="openMenu"
@click.capture="openMenuMini"
>
<!-- Plugins -->
<q-scroll-area class="fit">
<essential-expansion-link
v-for="(entry, index) in mainLinks"
:key="'plugin' + index"
@ -83,6 +84,17 @@
</q-item-section>
</q-item>
</div>
</q-scroll-area>
<div class="q-mini-drawer-hide absolute" style="top: 15px; right: -17px">
<q-btn
dense
round
unelevated
color="accent"
icon="mdi-chevron-left"
@click="openMenuMini(true)"
/>
</div>
</q-drawer>
<q-page-container>
<router-view />
@ -125,7 +137,7 @@ export default defineComponent({
const mainStore = useMainStore();
const flaschengeist = inject<FG_Plugin.Flaschengeist>('flaschengeist');
const leftDrawer = ref(!Platform.is.mobile);
const leftDrawerMini = ref(false);
const leftDrawerMini = ref(true);
const mainLinks = flaschengeist?.menuLinks || [];
const notifications = computed(() => mainStore.notifications.slice().reverse());
const polling = ref(NaN);
@ -138,9 +150,11 @@ export default defineComponent({
void mainStore.getShortcuts();
});
onBeforeUnmount(() => window.clearInterval(polling.value));
/*
function openMenu(event: { target: HTMLInputElement }) {
if (event.target.nodeName === 'DIV') leftDrawerMini.value = false;
console.log(event.target.nodeName);
if (event.target.nodeName === 'DIV' || event.target.nodeName === 'I')
leftDrawerMini.value = false;
else {
if (!leftDrawer.value || leftDrawerMini.value) {
leftDrawer.value = true;
@ -151,7 +165,13 @@ export default defineComponent({
}
}
}
*/
function openMenu(value = !leftDrawer.value) {
leftDrawer.value = value;
}
function openMenuMini(value = !leftDrawerMini.value) {
leftDrawerMini.value = value;
}
function logout() {
void router.push({ name: 'login', params: { logout: 'logout' } });
void mainStore.logout();
@ -214,6 +234,7 @@ export default defineComponent({
notifications,
noPermission,
openMenu,
openMenuMini,
remove,
requestPermission,
useNative,