diff --git a/src/hooks/useMneuMethod.ts b/src/hooks/useMneuMethod.ts
new file mode 100644
index 0000000..69f5861
--- /dev/null
+++ b/src/hooks/useMneuMethod.ts
@@ -0,0 +1,28 @@
+/**
+ * 菜单处理hooks,内置多种菜单处理场景
+ * @returns 菜单处理方法
+ */
+export const useMneuMethod = () => {
+ /**
+ * 多级菜单的显示隐藏
+ * @param {Menu.MenuOptions} item 菜单的item
+ * @returns 若多级菜单有children,并且不隐藏,返回true,否则返回false
+ */
+ const menuShow = (item: Menu.MenuOptions) => {
+ if (item.children && item.children?.length > 0 && !item.meta.hide) return true;
+ return false;
+ };
+ /**
+ * 单级菜单的显示隐藏
+ * @param {Menu.MenuOptions} item 菜单的item
+ * @returns 若单级菜单不隐藏,返回true,否则返回false
+ */
+ const aMenuShow = (item: Menu.MenuOptions) => {
+ if (!item.meta.hide) return true;
+ return false;
+ };
+ return {
+ menuShow,
+ aMenuShow
+ };
+};
diff --git a/src/layout/components/Menu/menu-item.vue b/src/layout/components/Menu/menu-item.vue
index 6b716cf..3d042c6 100644
--- a/src/layout/components/Menu/menu-item.vue
+++ b/src/layout/components/Menu/menu-item.vue
@@ -19,6 +19,7 @@
diff --git a/src/layout/components/Tabs/index.vue b/src/layout/components/Tabs/index.vue
index 7fb6944..dcc7848 100644
--- a/src/layout/components/Tabs/index.vue
+++ b/src/layout/components/Tabs/index.vue
@@ -90,10 +90,10 @@ const refresh = () => {
const themeStore = useThemeConfig();
themeStore.setRefreshPage(false);
currentRoute.value.meta.keepAlive && routerStore.removeRouteName(currentRoute.value.name);
- setTimeout(() => {
+ nextTick(() => {
themeStore.setRefreshPage(true);
currentRoute.value.meta.keepAlive && routerStore.setRouteNames(currentRoute.value.name);
- }, 0);
+ });
};
// 关闭当前
diff --git a/src/layout/layout-head/index.vue b/src/layout/layout-head/index.vue
index a2e9045..b2b9059 100644
--- a/src/layout/layout-head/index.vue
+++ b/src/layout/layout-head/index.vue
@@ -5,24 +5,32 @@
+
-
-
-
-
-
-
- {{ $t(`language.${item.meta.title}`) }}
-
-
-
-
-
-
- {{ $t(`language.${item.meta.title}`) }}
-
-
-
@@ -43,12 +51,21 @@ import { storeToRefs } from "pinia";
import { useRoutesListStore } from "@/store/modules/route-list";
import { useRoutingMethod } from "@/hooks/useRoutingMethod";
import { useThemeConfig } from "@/store/modules/theme-config";
+import { useMneuMethod } from "@/hooks/useMneuMethod";
defineOptions({ name: "LayoutHead" });
const router = useRouter();
const routerStore = useRoutesListStore();
const themeStore = useThemeConfig();
const { routeTree, currentRoute } = storeToRefs(routerStore);
-const { isFooter } = storeToRefs(themeStore);
+const { isFooter, language } = storeToRefs(themeStore);
+
+const { menuShow, aMenuShow } = useMneuMethod();
+
+const drawing = ref(true);
+watch(language, () => {
+ drawing.value = false;
+ nextTick(() => (drawing.value = true));
+});
/**
* @description 菜单点击事件
@@ -79,15 +96,20 @@ const onMenuItem = (key: string) => {
.header {
padding: 0 $padding;
height: 60px;
+ width: 100%;
box-sizing: border-box;
border-bottom: $border-1 solid $color-border-2;
display: flex;
- justify-content: space-between;
align-items: center;
overflow: hidden;
.header-logo {
max-width: 180px;
}
+ .layout-head-menu {
+ flex: 1;
+ display: flex;
+ overflow: hidden;
+ }
}
:deep(.arco-menu-pop) {
diff --git a/src/layout/layout-mixing/index.vue b/src/layout/layout-mixing/index.vue
index 13f05c2..a49d272 100644
--- a/src/layout/layout-mixing/index.vue
+++ b/src/layout/layout-mixing/index.vue
@@ -16,15 +16,24 @@
-
-
-
-
-
+
@@ -45,21 +54,27 @@ import { useRoutesListStore } from "@/store/modules/route-list";
import { useRoutingMethod } from "@/hooks/useRoutingMethod";
import { storeToRefs } from "pinia";
import { useThemeConfig } from "@/store/modules/theme-config";
+import { useMneuMethod } from "@/hooks/useMneuMethod";
defineOptions({ name: "LayoutMixing" });
const route = useRoute();
const router = useRouter();
const routerStore = useRoutesListStore();
const themeStore = useThemeConfig();
-const { isFooter, collapsed, asideDark } = storeToRefs(themeStore);
+const { isFooter, collapsed, asideDark, language } = storeToRefs(themeStore);
const { routeTree } = storeToRefs(routerStore);
+const { aMenuShow } = useMneuMethod();
+
+const drawing = ref(true);
+watch(language, () => {
+ drawing.value = false;
+ nextTick(() => (drawing.value = true));
+});
// 折叠
const onCollapsed = () => {
themeStore.setCollapsed(!collapsed.value);
};
-console.log("路由信息", route);
-
// 由于刷新后,路由信息丢失,所以需要重新获取
// 混合布局的横向菜单为顶层路由下的一级菜单
// 这里通过当前路由信息直接获取
@@ -181,6 +196,11 @@ const getAsideMenu = (key: string) => {
}
}
}
+ .layout-head-menu {
+ flex: 1;
+ display: flex;
+ overflow: hidden;
+ }
}
:deep(.arco-menu-pop) {
diff --git a/src/router/route.ts b/src/router/route.ts
index c90a345..4d35423 100644
--- a/src/router/route.ts
+++ b/src/router/route.ts
@@ -533,7 +533,7 @@ export const dynamicRoutes: RouteRecordRaw[] = [
{
path: "/system-management",
name: "system-management",
- redirect: "/system-management/account management",
+ redirect: "/system-management/account-management",
meta: {
title: "system-management",
hide: false,