Compare commits
2 commits
ac49090615
...
bcace5cbd7
Author | SHA1 | Date | |
---|---|---|---|
bcace5cbd7 | |||
cf29c26abc |
1 changed files with 7 additions and 3 deletions
|
@ -1,6 +1,6 @@
|
|||
<script setup>
|
||||
import { useDisplay, useTheme } from "vuetify/lib/framework.mjs";
|
||||
import { ref } from "vue";
|
||||
import { ref, watch } from "vue";
|
||||
import { navigateTo, useRoute } from "#app";
|
||||
|
||||
const route = useRoute();
|
||||
|
@ -9,6 +9,10 @@ const { mobile } = useDisplay();
|
|||
const navOpen = ref(!mobile.value);
|
||||
const navSelected = ref([route.path]);
|
||||
|
||||
watch(route, (v) => {
|
||||
navSelected.value = [route.path];
|
||||
});
|
||||
|
||||
const theme = useTheme();
|
||||
function switchTheme() {
|
||||
theme.global.name.value = theme.global.current.value.dark ? 'light' : 'dark';
|
||||
|
@ -22,15 +26,15 @@ function switchTheme() {
|
|||
</VAppBar>
|
||||
<VNavigationDrawer v-model="navOpen" :temporary="mobile">
|
||||
<VList v-model:selected="navSelected" density="compact" nav>
|
||||
<VListItem prepend-icon="mdi-login" title="Login" value="/login" @click="navigateTo('/login')" />
|
||||
<VListItem prepend-icon="mdi-account" title="Clients" value="/clients" @click="navigateTo('/clients')" />
|
||||
<VListItem prepend-icon="mdi-receipt-text" title="Orders" value="/orders" @click="navigateTo('/orders')" />
|
||||
<VDivider />
|
||||
</VList>
|
||||
<template #append>
|
||||
<VList density="compact" nav>
|
||||
<VList v-model:selected="navSelected" density="compact" nav>
|
||||
<VDivider />
|
||||
<VListItem prepend-icon="mdi-theme-light-dark" title="Switch theme" class="mx-auto" @click="switchTheme()" />
|
||||
<VListItem prepend-icon="mdi-login" title="My account" value="/login" @click="navigateTo('/login')" />
|
||||
</VList>
|
||||
</template>
|
||||
</VNavigationDrawer>
|
||||
|
|
Loading…
Add table
Reference in a new issue