flaschengeist-frontend/src/layouts/OutLayout.vue

45 lines
1.3 KiB
Vue

<template>
<q-layout view="hHh lpr lFf">
<q-header elevated>
<q-toolbar>
<q-toolbar-title>
<q-avatar rounded>
<img src="flaschengeist-logo-white.svg" />
</q-avatar>
<span class="gt-xs"> Flaschengeist </span>
</q-toolbar-title>
<shortcut-link
v-for="(shortcut, index) in shortcuts"
:key="'shortcut' + index"
:shortcut="shortcut"
/>
<shortcut-link v-if="$route.name != 'about_out'" :shortcut="about" />
<shortcut-link v-if="$route.name != 'login'" :shortcut="login" />
</q-toolbar>
</q-header>
<q-page-container>
<router-view />
</q-page-container>
</q-layout>
</template>
<script lang="ts">
import { defineComponent, inject } from 'vue';
import { FG_Plugin } from '@flaschengeist/types';
import ShortcutLink from 'components/navigation/ShortcutLink.vue';
export default defineComponent({
name: 'OutLayout',
components: { ShortcutLink },
setup() {
const flaschengeist = inject<FG_Plugin.Flaschengeist>('flaschengeist');
const shortcuts = flaschengeist?.outerShortcuts || [];
const about: FG_Plugin.Shortcut = { icon: 'mdi-information', link: 'about_out' };
const login: FG_Plugin.Shortcut = { icon: 'mdi-login-variant', link: 'login' };
return { about, login, shortcuts };
},
});
</script>