feat: The accordion mode of the menu is configurable
This commit is contained in:
@@ -14,6 +14,7 @@ defineProps<{ disabled?: boolean; disabledNavigationSplit?: boolean }>();
|
||||
|
||||
const navigationStyle = defineModel<string>('navigationStyle');
|
||||
const navigationSplit = defineModel<boolean>('navigationSplit');
|
||||
const navigationAccordion = defineModel<boolean>('navigationAccordion');
|
||||
|
||||
const stylesItems: SelectListItem[] = [
|
||||
{ label: $t('preference.rounded'), value: 'rounded' },
|
||||
@@ -29,10 +30,16 @@ const stylesItems: SelectListItem[] = [
|
||||
>
|
||||
{{ $t('preference.navigation-style') }}
|
||||
</ToggleItem>
|
||||
<SwitchItem v-model="navigationSplit" :disabled="disabledNavigationSplit">
|
||||
<SwitchItem
|
||||
v-model="navigationSplit"
|
||||
:disabled="disabledNavigationSplit || disabled"
|
||||
>
|
||||
{{ $t('preference.navigation-split') }}
|
||||
<template #tip>
|
||||
{{ $t('preference.navigation-split-tip') }}
|
||||
</template>
|
||||
</SwitchItem>
|
||||
<SwitchItem v-model="navigationAccordion" :disabled="disabled">
|
||||
{{ $t('preference.navigation-accordion') }}
|
||||
</SwitchItem>
|
||||
</template>
|
||||
|
@@ -52,11 +52,15 @@ function updateLocale(value: string) {
|
||||
:page-progress="preference.pageProgress"
|
||||
:tabs-icon="preference.tabsIcon"
|
||||
:locale="preference.locale"
|
||||
:navigation-accordion="preference.navigationAccordion"
|
||||
:navigation-style="preference.navigationStyle"
|
||||
:navigation-split="preference.navigationSplit"
|
||||
:side-collapse-show-title="preference.sideCollapseShowTitle"
|
||||
:page-transition-enable="preference.pageTransitionEnable"
|
||||
@update:navigation-style="(value) => handleUpdate('navigationStyle', value)"
|
||||
@update:navigation-accordion="
|
||||
(value) => handleUpdate('navigationAccordion', value)
|
||||
"
|
||||
@update:navigation-split="(value) => handleUpdate('navigationSplit', value)"
|
||||
@update:dynamic-title="(value) => handleUpdate('dynamicTitle', value)"
|
||||
@update:tabs-icon="(value) => handleUpdate('tabsIcon', value)"
|
||||
|
@@ -54,6 +54,7 @@ const colorGrayMode = defineModel<boolean>('colorGrayMode');
|
||||
const colorPrimary = defineModel<string>('colorPrimary');
|
||||
const navigationStyle = defineModel<string>('navigationStyle');
|
||||
const navigationSplit = defineModel<boolean>('navigationSplit');
|
||||
const navigationAccordion = defineModel<boolean>('navigationAccordion');
|
||||
const pageProgress = defineModel<boolean>('pageProgress');
|
||||
const pageTransition = defineModel<string>('pageTransition');
|
||||
const pageTransitionEnable = defineModel<boolean>('pageTransitionEnable');
|
||||
@@ -197,6 +198,7 @@ function handleReset() {
|
||||
<Navigation
|
||||
v-model:navigation-style="navigationStyle"
|
||||
v-model:navigation-split="navigationSplit"
|
||||
v-model:navigation-accordion="navigationAccordion"
|
||||
:disabled="isFullContent"
|
||||
:disabled-navigation-split="!isMixedNav"
|
||||
/>
|
||||
|
Reference in New Issue
Block a user