ff-admin/src/templates/Main.vue

57 lines
1.5 KiB
Vue
Raw Normal View History

2024-08-23 14:42:32 +02:00
<template>
<div v-if="!defaultRoute && showBack" class="flex md:hidden flex-row items-baseline">
<p v-if="!defaultRoute && showBack" class="text-indigo-500" @click="setLink(null)">zur Übersicht</p>
</div>
<slot v-if="headerInsert" name="headerInsert"></slot>
<div
class="max-w-full w-full grow flex flex-col divide-y-2 divide-gray-300 bg-white rounded-lg justify-center overflow-hidden"
>
<slot name="topBar"></slot>
<div class="flex flex-col gap-2 grow py-5 overflow-hidden">
<slot name="diffMain"></slot>
<div v-if="!diffMain" class="flex flex-col gap-2 grow px-7 overflow-y-scroll">
<slot name="main"></slot>
</div>
</div>
</div>
</template>
<script setup lang="ts">
import { defineComponent } from "vue";
import { mapState, mapActions } from "pinia";
import { useNavigationStore } from "../stores/admin/navigation";
</script>
<script lang="ts">
export default defineComponent({
props: {
header: {
type: String,
default: null,
},
showBack: {
type: Boolean,
default: true,
},
},
computed: {
...mapState(useNavigationStore, ["activeLink"]),
defaultRoute() {
return this.activeLink == null;
},
diffMain() {
return this.$slots.diffMain;
},
headerInsert() {
return this.$slots.headerInsert;
},
mid() {
return window.matchMedia("(min-width: 800px)").matches;
},
},
methods: {
...mapActions(useNavigationStore, ["setLink"]),
},
});
</script>