This commit is contained in:
Bahadır Sofuoğlu
2022-11-07 16:03:17 +03:00
parent 6fd2c572bd
commit c8f92b0102
3 changed files with 13 additions and 14 deletions

View File

@@ -10,7 +10,6 @@ const { changeThemeSettings, setScale, layoutConfig } = useLayoutService();
const onConfigButtonClick = () => { const onConfigButtonClick = () => {
visible.value = !visible.value; visible.value = !visible.value;
}; };
const onChangeTheme = (theme, mode) => { const onChangeTheme = (theme, mode) => {
const elementId = 'theme-css'; const elementId = 'theme-css';
const linkElement = document.getElementById(elementId); const linkElement = document.getElementById(elementId);
@@ -26,12 +25,10 @@ const onChangeTheme = (theme, mode) => {
changeThemeSettings(theme, mode === 'dark'); changeThemeSettings(theme, mode === 'dark');
}; };
const decrementScale = () => { const decrementScale = () => {
setScale(layoutConfig.scale.value - 1); setScale(layoutConfig.scale.value - 1);
applyScale(); applyScale();
}; };
const incrementScale = () => { const incrementScale = () => {
setScale(layoutConfig.scale.value + 1); setScale(layoutConfig.scale.value + 1);
applyScale(); applyScale();

View File

@@ -157,17 +157,12 @@ const model = ref([
] ]
} }
]); ]);
function test(e) {
console.log('test');
console.log(e);
}
</script> </script>
<template> <template>
<ul class="layout-menu"> <ul class="layout-menu">
<template v-for="(item, i) in model" :key="item"> <template v-for="(item, i) in model" :key="item">
<app-menu-item @submenu:opened="test" v-if="!item.separator" :item="item" :index="i"></app-menu-item> <app-menu-item v-if="!item.separator" :item="item" :index="i"></app-menu-item>
<li v-if="item.separator" class="menu-separator"></li> <li v-if="item.separator" class="menu-separator"></li>
</template> </template>
<li> <li>

View File

@@ -28,11 +28,15 @@ const props = defineProps({
const isActiveMenu = ref(false); const isActiveMenu = ref(false);
const itemKey = ref(null); const itemKey = ref(null);
onBeforeMount(() => { onBeforeMount(() => {
itemKey.value = props.parentItemKey ? props.parentItemKey + '-' + props.index : String(props.index); itemKey.value = props.parentItemKey ? props.parentItemKey + '-' + props.index : String(props.index);
isActiveMenu.value = layoutConfig.activeMenuItem.value === itemKey.value || layoutConfig.activeMenuItem?.value?.startsWith(itemKey.value + '-'); const activeItem = layoutState.activeMenuItem;
isActiveMenu.value = activeItem === itemKey.value || activeItem ? activeItem.startsWith(itemKey.value + '-') : false;
}); });
watch( watch(
() => layoutConfig.activeMenuItem.value, () => layoutConfig.activeMenuItem.value,
(newVal) => { (newVal) => {
@@ -45,16 +49,19 @@ const itemClick = (event, item) => {
return; return;
} }
if ((item.to || item.url) && (layoutState.staticMenuMobileActive.value || layoutState.overlayMenuActive.value)) { const { overlayMenuActive, staticMenuMobileActive } = layoutState;
if ((item.to || item.url) && (staticMenuMobileActive.value || overlayMenuActive.value)) {
onMenuToggle(); onMenuToggle();
} }
//execute command
if (item.command) { if (item.command) {
item.command({ originalEvent: event, item: item }); item.command({ originalEvent: event, item: item });
} }
if (item.items) setActiveMenuItem(isActiveMenu.value ? props.parentItemKey : itemKey); const foundItemKey = item.items ? (isActiveMenu.value ? props.parentItemKey : itemKey) : itemKey.value;
else setActiveMenuItem(itemKey.value);
setActiveMenuItem(foundItemKey);
}; };
const checkActiveRoute = (item) => { const checkActiveRoute = (item) => {