This commit is contained in:
setthawutttty 2024-11-14 11:31:24 +07:00
parent debcad9b4c
commit a4ef50a3a5
3 changed files with 49 additions and 6 deletions

View file

@ -3,8 +3,5 @@ export interface MenuItem {
activeIcon: string;
label: string;
path?: string;
children?: {
label: string;
path: string;
}[];
children?: MenuItem[];
}

View file

@ -313,7 +313,7 @@ function defaultOpen(index: number) {
<div v-for="(menuItem, index) in menuList" :key="index">
<!-- เมนอย -->
<q-expansion-item
v-if="menuItem.children && menuItem.children.length > 0"
v-if="menuItem.children && menuItem.children.length !== 0"
class="menuSub"
expand-icon="mdi-chevron-down"
expanded-icon="mdi-chevron-up"
@ -327,7 +327,51 @@ function defaultOpen(index: number) {
</template>
<!-- เมนอย 1 -->
<div v-if="menuItem.children && menuItem.children.length > 0">
<div v-for="(subMenu, i) in menuItem.children" :key="i">
<q-expansion-item
switch-toggle-side
dense-toggle
:label="subMenu.label"
v-if="subMenu.children && subMenu.children.length > 0"
class="expan2"
dense
>
<q-item
dense
class="menuSubHover"
active-class="text-primary active-item text-weight-bold menuSubAct"
clickable
v-for="subMenu2 in subMenu.children"
:key="subMenu2.path"
:to="subMenu2.path"
>
<q-item-section>
<q-item-label class="font-400 subLabel"
>{{ subMenu2.label }}
</q-item-label>
</q-item-section>
</q-item>
</q-expansion-item>
<q-item
v-else
dense
class="menuSubHover"
active-class="text-primary active-item text-weight-bold menuSubAct"
clickable
:key="subMenu.path"
:to="subMenu.path"
>
<q-item-section>
<q-item-label class="font-400">
{{ subMenu.label }}
</q-item-label>
</q-item-section>
</q-item>
</div>
</div>
<q-item
v-else
dense
class="menuSubHover"
active-class="text-primary active-item text-weight-bold menuSubAct"
@ -413,7 +457,7 @@ function defaultOpen(index: number) {
font-weight: 500;
}
.expan2 .q-item {
padding-left: 10%;
padding-left: 11%;
}
.subLabel {
white-space: nowrap;