From c85f0a199507c0464c0d53036956aaba0789e971 Mon Sep 17 00:00:00 2001
From: 疯狂的狮子Li <15040126243@163.com>
Date: 星期五, 01 九月 2023 11:38:23 +0800
Subject: [PATCH] update 优化 控制台debuger位置错误问题 update 优化 TopNav 菜单样式 fix 修复 布局配置失效问题
---
src/components/TopNav/index.vue | 62 ++++++++++++++++++++-----------
1 files changed, 40 insertions(+), 22 deletions(-)
diff --git a/src/components/TopNav/index.vue b/src/components/TopNav/index.vue
index ea16377..227fccc 100644
--- a/src/components/TopNav/index.vue
+++ b/src/components/TopNav/index.vue
@@ -1,3 +1,25 @@
+<template>
+ <el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect" :ellipsis="false">
+ <template v-for="(item, index) in topMenus">
+ <el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber"
+ ><svg-icon
+ v-if="item.meta && item.meta.icon && item.meta.icon !== '#'"
+ :icon-class="item.meta ? item.meta.icon : '' " /> {{ item.meta?.title }}</el-menu-item
+ >
+ </template>
+
+ <!-- 椤堕儴鑿滃崟瓒呭嚭鏁伴噺鎶樺彔 -->
+ <el-sub-menu :style="{'--theme': theme}" index="more" v-if="topMenus.length > visibleNumber">
+ <template #title>鏇村鑿滃崟</template>
+ <template v-for="(item, index) in topMenus">
+ <el-menu-item :index="item.path" :key="index" v-if="index >= visibleNumber"
+ ><svg-icon :icon-class="item.meta ? item.meta.icon : '' " /> {{ item.meta?.title }}</el-menu-item
+ >
+ </template>
+ </el-sub-menu>
+ </el-menu>
+</template>
+
<script setup lang="ts">
import { constantRoutes } from '@/router';
import { isHttp } from '@/utils/validate';
@@ -84,7 +106,7 @@
visibleNumber.value = parseInt(String(width / 85));
}
-const handleSelect = (key: string, keyPath: string[]) => {
+const handleSelect = (key: string) => {
currentIndex.value = key;
const route = routers.value.find(item => item.path === key);
if (isHttp(key)) {
@@ -92,7 +114,13 @@
window.open(key, "_blank");
} else if (!route || !route.children) {
// 娌℃湁瀛愯矾鐢辫矾寰勫唴閮ㄦ墦寮�
- router.push({ path: key, fullPath: '' });
+ const routeMenu = childrenMenus.value.find(item => item.path === key);
+ if (routeMenu && routeMenu.query) {
+ let query = JSON.parse(routeMenu.query);
+ router.push({ path: key, query: query });
+ } else {
+ router.push({ path: key });
+ }
appStore.toggleSideBarHide(true);
} else {
// 鏄剧ず宸︿晶鑱斿姩鑿滃崟
@@ -130,26 +158,6 @@
})
</script>
-<template>
- <el-menu :default-active="activeMenu" mode="horizontal" @select="handleSelect" :ellipsis="false">
- <template v-for="(item, index) in topMenus">
- <el-menu-item :style="{'--theme': theme}" :index="item.path" :key="index" v-if="index < visibleNumber"
- ><svg-icon :icon-class="item.meta ? item.meta.icon : '' " /> {{ item.meta?.title }}</el-menu-item
- >
- </template>
-
- <!-- 椤堕儴鑿滃崟瓒呭嚭鏁伴噺鎶樺彔 -->
- <el-sub-menu :style="{'--theme': theme}" index="more" v-if="topMenus.length > visibleNumber">
- <template #title>鏇村鑿滃崟</template>
- <template v-for="(item, index) in topMenus">
- <el-menu-item :index="item.path" :key="index" v-if="index >= visibleNumber"
- ><svg-icon :icon-class="item.meta ? item.meta.icon : '' " /> {{ item.meta?.title }}</el-menu-item
- >
- </template>
- </el-sub-menu>
- </el-menu>
-</template>
-
<style lang="scss">
.topmenu-container.el-menu--horizontal > .el-menu-item {
float: left;
@@ -174,4 +182,14 @@
padding: 0 5px !important;
margin: 0 10px !important;
}
+
+/* 鑳屾櫙鑹查殣钘� */
+.topmenu-container.el-menu--horizontal>.el-menu-item:not(.is-disabled):focus, .topmenu-container.el-menu--horizontal>.el-menu-item:not(.is-disabled):hover, .topmenu-container.el-menu--horizontal>.el-submenu .el-submenu__title:hover {
+ background-color: #ffffff !important;
+}
+
+/* 鍥炬爣鍙抽棿璺� */
+.topmenu-container .svg-icon {
+ margin-right: 4px;
+}
</style>
--
Gitblit v1.9.3