Files
bab-app/app/layouts/default.vue

46 lines
1.1 KiB
Vue

<script setup lang="ts">
import { ref } from 'vue';
import { useQuasar } from 'quasar';
import BottomNavComponent from '~/components/BottomNavComponent.vue';
import LeftDrawer from '~/components/LeftDrawer.vue';
import { APP_VERSION } from '~/utils/version';
const q = useQuasar();
const route = useRoute();
const leftDrawerOpen = ref(false);
function toggleLeftDrawer() {
leftDrawerOpen.value = !leftDrawerOpen.value;
}
q.addressbarColor?.set('#14539a');
</script>
<template>
<q-layout view="hHh Lpr fFf">
<q-header elevated>
<q-toolbar>
<q-btn
flat
dense
round
icon="menu"
aria-label="Menu"
@click="toggleLeftDrawer" />
<q-toolbar-title>{{ route?.meta?.title as string }}</q-toolbar-title>
<q-space />
<div>v{{ APP_VERSION }}</div>
</q-toolbar>
</q-header>
<LeftDrawer
:drawer="leftDrawerOpen"
@drawer-toggle="toggleLeftDrawer" />
<q-page-container>
<slot />
</q-page-container>
<q-footer>
<BottomNavComponent />
</q-footer>
</q-layout>
</template>