Files
bordro-esleme/ui/src/layouts/panelLayout.vue
2024-04-16 22:01:23 +03:00

82 lines
2.2 KiB
Vue

<template>
<q-layout view="lHh Lpr lFf" style="background-color: #f8fafc;">
<q-drawer
v-model="ld.leftDrawerOpen"
show-if-above
bordered
content-class="bg-grey-1"
>
<q-scroll-area class="fit">
<q-list>
<q-item-label header>
<q-img src="notitek.png" width="120px" class="q-mb-lg"/>
<br/>
Bordro Eşleme
<br/>
{{ $VERSION.version }}
<span style="font-size:0.7rem;">
{{ $VERSION.build }}
</span>
</q-item-label>
<template v-for="m in ld.menu" :key="m.grantKey">
<q-item :to="m.to" v-if="!m.children" active-class="text-pcolor1">
<q-item-section avatar v-if="m.icon">
<q-icon :name="m.icon"/>
</q-item-section>
<q-item-section>
<q-item-label>{{ m.label }}</q-item-label>
</q-item-section>
</q-item>
<q-expansion-item
v-else
:icon="m.icon"
:label="m.label"
>
<q-item v-for="c in m.children" :key="c.grantKey" :to="c.to" exact :inset-level=".5" active-class="text-pcolor1">
<q-item-section avatar v-if="c.icon">
<q-icon :name="c.icon"/>
</q-item-section>
<q-item-section>
<q-item-label>{{ c.label }}</q-item-label>
</q-item-section>
</q-item>
</q-expansion-item>
</template>
</q-list>
</q-scroll-area>
</q-drawer>
<q-page-container>
<router-view/>
</q-page-container>
</q-layout>
</template>
<script setup>
import { $VERSION } from 'boot/version'
import { inject, reactive } from 'vue'
import { useLoginStore } from 'stores/login'
import { menu } from 'src/lib/menu'
const loginStore = useLoginStore()
const ld = reactive({
leftDrawerOpen: true,
menu: menu(),
})
const bus = inject('bus') // inside setup()
bus.on('toggleLeftDrawerOpen', () => {
ld.leftDrawerOpen = !ld.leftDrawerOpen
})
const logout = function () {
loginStore.logout()
}
</script>