78 lines
1.8 KiB
Vue
78 lines
1.8 KiB
Vue
<template>
|
|
<v-app>
|
|
<v-navigation-drawer v-model="drawer" app>
|
|
<v-list>
|
|
<v-list-item title="Server Manager" subtitle="Media & Files"></v-list-item>
|
|
</v-list>
|
|
|
|
<v-divider></v-divider>
|
|
|
|
<v-list density="compact" nav>
|
|
<v-list-item
|
|
prepend-icon="mdi-folder-network"
|
|
title="Samba Explorer"
|
|
to="/samba"
|
|
value="samba"
|
|
></v-list-item>
|
|
<v-list-item
|
|
prepend-icon="mdi-book-open-page-variant"
|
|
title="Comics Manager"
|
|
to="/comics"
|
|
value="comics"
|
|
></v-list-item>
|
|
<v-list-item
|
|
prepend-icon="mdi-file-video-outline"
|
|
title="Video Duplicates"
|
|
to="/duplicates"
|
|
value="duplicates"
|
|
></v-list-item>
|
|
<v-list-item
|
|
prepend-icon="mdi-download"
|
|
title="Downloader"
|
|
to="/downloader"
|
|
value="downloader"
|
|
></v-list-item>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
|
|
<v-app-bar color="primary" density="compact">
|
|
<template v-slot:prepend>
|
|
<v-app-bar-nav-icon @click.stop="drawer = !drawer"></v-app-bar-nav-icon>
|
|
</template>
|
|
|
|
<v-app-bar-title>Server Manager Web App</v-app-bar-title>
|
|
|
|
<template v-slot:append>
|
|
<v-btn icon="mdi-dots-vertical"></v-btn>
|
|
</template>
|
|
</v-app-bar>
|
|
|
|
<v-main>
|
|
<v-container fluid>
|
|
<router-view v-slot="{ Component }">
|
|
<transition name="fade" mode="out-in">
|
|
<component :is="Component" />
|
|
</transition>
|
|
</router-view>
|
|
</v-container>
|
|
</v-main>
|
|
</v-app>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref } from 'vue';
|
|
|
|
const drawer = ref(true);
|
|
</script>
|
|
|
|
<style>
|
|
.fade-enter-active,
|
|
.fade-leave-active {
|
|
transition: opacity 0.2s ease;
|
|
}
|
|
|
|
.fade-enter-from,
|
|
.fade-leave-to {
|
|
opacity: 0;
|
|
}
|
|
</style> |