You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
40 lines
866 B
Vue
40 lines
866 B
Vue
<script setup lang="ts">
|
|
import { ref, defineProps } from 'vue';
|
|
|
|
defineProps({
|
|
tabs: Array,
|
|
title: String,
|
|
});
|
|
const tab = ref(null);
|
|
|
|
const back = () => {
|
|
window.history.back();
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<v-app-bar
|
|
:collapse="false"
|
|
:collapse-on-scroll="true"
|
|
absolute
|
|
color="blue accent-4"
|
|
dark
|
|
scroll-target="#scrolling-techniques-6"
|
|
>
|
|
<v-btn icon @click="back()">
|
|
<v-icon>mdi-arrow-left</v-icon>
|
|
</v-btn>
|
|
<v-toolbar-title>{{ title }}</v-toolbar-title>
|
|
<template v-if="tabs?.length" v-slot:extension>
|
|
<v-tabs align-with-title v-model="tab">
|
|
<slot name="tabs">
|
|
<v-tab v-for="tab of tabs" :value="tab.name.toLowerCase().replaceAll(' ', '-')">{{ tab.name }}</v-tab>
|
|
</slot>
|
|
</v-tabs>
|
|
</template>
|
|
</v-app-bar>
|
|
<v-main>
|
|
<slot :tab="tab"/>
|
|
</v-main>
|
|
</template>
|