diff --git a/src/layouts/modules/global-menu/base-menu.vue b/src/layouts/modules/global-menu/base-menu.vue
deleted file mode 100644
index e3d17c40..00000000
--- a/src/layouts/modules/global-menu/base-menu.vue
+++ /dev/null
@@ -1,96 +0,0 @@
-
-
-
-
-
-
-
-
-
diff --git a/src/layouts/modules/global-menu/first-level-menu.vue b/src/layouts/modules/global-menu/components/first-level-menu.vue
similarity index 82%
rename from src/layouts/modules/global-menu/first-level-menu.vue
rename to src/layouts/modules/global-menu/components/first-level-menu.vue
index fc089f79..b9c895a9 100644
--- a/src/layouts/modules/global-menu/first-level-menu.vue
+++ b/src/layouts/modules/global-menu/components/first-level-menu.vue
@@ -3,31 +3,29 @@ import { computed } from 'vue';
import { createReusableTemplate } from '@vueuse/core';
import { SimpleScrollbar } from '@sa/materials';
import { transformColorWithOpacity } from '@sa/color';
-import { useAppStore } from '@/store/modules/app';
-import { useRouteStore } from '@/store/modules/route';
-import { useThemeStore } from '@/store/modules/theme';
defineOptions({
name: 'FirstLevelMenu'
});
interface Props {
+ menus: App.Global.Menu[];
activeMenuKey?: string;
inverted?: boolean;
+ siderCollapse?: boolean;
+ darkMode?: boolean;
+ themeColor: string;
}
-defineProps
();
+const props = defineProps();
interface Emits {
(e: 'select', menu: App.Global.Menu): boolean;
+ (e: 'toggleSiderCollapse'): void;
}
const emit = defineEmits();
-const appStore = useAppStore();
-const themeStore = useThemeStore();
-const routeStore = useRouteStore();
-
interface MixMenuItemProps {
/** Menu item label */
label: App.Global.Menu['label'];
@@ -36,12 +34,12 @@ interface MixMenuItemProps {
/** Active menu item */
active: boolean;
/** Mini size */
- isMini: boolean;
+ isMini?: boolean;
}
const [DefineMixMenuItem, MixMenuItem] = createReusableTemplate();
const selectedBgColor = computed(() => {
- const { darkMode, themeColor } = themeStore;
+ const { darkMode, themeColor } = props;
const light = transformColorWithOpacity(themeColor, 0.1, '#ffffff');
const dark = transformColorWithOpacity(themeColor, 0.3, '#000000');
@@ -52,6 +50,10 @@ const selectedBgColor = computed(() => {
function handleClickMixMenu(menu: App.Global.Menu) {
emit('select', menu);
}
+
+function toggleSiderCollapse() {
+ emit('toggleSiderCollapse');
+}
@@ -80,21 +82,21 @@ function handleClickMixMenu(menu: App.Global.Menu) {