chamomind/jws-frontend
chamomind/jws-frontend
7
0
Fork 0
Code Issues Projects Releases Packages 1 Wiki Activity Actions

fix: active route on drawer

Browse source
This commit is contained in:
puriphatt 2024-07-02 10:15:29 +00:00
parent 198c4b9ecd
commit 2c80dfdd3a
1 changed files with 7 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

11
src/components/DrawerComponent.vue
View file

@ -1,19 +1,22 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'; import { computed, onMounted, ref } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { Icon } from '@iconify/vue'; import { Icon } from '@iconify/vue';
const router = useRouter(); const router = useRouter();
const currentRoute = ref<string>(''); const currentRoute = ref<string>('');
const currentPath = computed(() => {
return router.currentRoute.value.path;
});
const labelMenu = ref< const labelMenu = ref<
{ label: string; icon: string; route: string; disabled?: boolean }[] { label: string; icon: string; route: string; disabled?: boolean }[]
>([ >([
{ {
label: 'drawerDashboard', label: 'drawerDashboard',
icon: 'img:/file-account-outline.png', icon: 'mage:dashboard',
route: '', route: '/',
}, },
{ {
label: 'drawerBranchManagement', label: 'drawerBranchManagement',
@ -114,7 +117,7 @@ function navigateTo(label: string, destination: string) {
:disable="!!v.disabled" :disable="!!v.disabled"
@click="navigateTo(v.label, v.route)" @click="navigateTo(v.label, v.route)"
class="no-padding" class="no-padding"
:class="{ active: currentRoute === v.label, dark: $q.dark.isActive }" :class="{ active: currentPath === v.route, dark: $q.dark.isActive }"
> >
<q-item-section id="btn-drawer-back "> <q-item-section id="btn-drawer-back ">
<q-item-label class="q-pl-lg row items-center"> <q-item-label class="q-pl-lg row items-center">