From 8cf8c8acd059969b9e79ad1c2f9f1921cc42d69c Mon Sep 17 00:00:00 2001 From: RuoYi <yzz_ivy@163.com> Date: 星期二, 07 十一月 2023 11:38:19 +0800 Subject: [PATCH] 修复外链带端口出现的异常(I86J4B) --- ruoyi-ui/src/components/TopNav/index.vue | 96 ++++++++++++++++++++++++++++++----------------- 1 files changed, 61 insertions(+), 35 deletions(-) diff --git a/ruoyi-ui/src/components/TopNav/index.vue b/ruoyi-ui/src/components/TopNav/index.vue index c5e0e01..daee1b8 100644 --- a/ruoyi-ui/src/components/TopNav/index.vue +++ b/ruoyi-ui/src/components/TopNav/index.vue @@ -5,14 +5,17 @@ @select="handleSelect" > <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.icon" /> + <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.icon" + /> {{ item.meta.title }}</el-menu-item > </template> <!-- 顶部菜单超出数量折叠 --> - <el-submenu index="more" v-if="topMenus.length > visibleNumber"> + <el-submenu :style="{'--theme': theme}" index="more" v-if="topMenus.length > visibleNumber"> <template slot="title">更多菜单</template> <template v-for="(item, index) in topMenus"> <el-menu-item @@ -30,18 +33,22 @@ <script> import { constantRoutes } from "@/router"; +// 隐藏侧边栏路由 +const hideList = ['/index', '/user/profile']; + export default { data() { return { // 顶部栏初始数 visibleNumber: 5, - // 是否为首次加载 - isFrist: false, // 当前激活菜单的 index currentIndex: undefined }; }, computed: { + theme() { + return this.$store.state.settings.theme; + }, // 顶部显示菜单 topMenus() { let topMenus = []; @@ -68,9 +75,11 @@ for (var item in router.children) { if (router.children[item].parentPath === undefined) { if(router.path === "/") { - router.children[item].path = "/redirect/" + router.children[item].path; + router.children[item].path = "/" + router.children[item].path; } else { - router.children[item].path = router.path + "/" + router.children[item].path; + if(!this.ishttp(router.children[item].path)) { + router.children[item].path = router.path + "/" + router.children[item].path; + } } router.children[item].parentPath = router.path; } @@ -82,22 +91,18 @@ // 默认激活的菜单 activeMenu() { const path = this.$route.path; - let activePath = this.routers[0].path; - if (path.lastIndexOf("/") > 0) { + let activePath = path; + if (path !== undefined && path.lastIndexOf("/") > 0 && hideList.indexOf(path) === -1) { const tmpPath = path.substring(1, path.length); activePath = "/" + tmpPath.substring(0, tmpPath.indexOf("/")); - } else if ("/index" == path || "" == path) { - if (!this.isFrist) { - this.isFrist = true; - } else { - activePath = "index"; + if (!this.$route.meta.link) { + this.$store.dispatch('app/toggleSideBarHide', false); } + } else if(!this.$route.children) { + activePath = path; + this.$store.dispatch('app/toggleSideBarHide', true); } - var routes = this.activeRoutes(activePath); - if (routes.length === 0) { - activePath = this.currentIndex || this.routers[0].path - this.activeRoutes(activePath); - } + this.activeRoutes(activePath); return activePath; }, }, @@ -119,15 +124,24 @@ // 菜单选择事件 handleSelect(key, keyPath) { this.currentIndex = key; - if (key.indexOf("http://") !== -1 || key.indexOf("https://") !== -1) { + const route = this.routers.find(item => item.path === key); + if (this.ishttp(key)) { // http(s):// 路径新窗口打开 window.open(key, "_blank"); - } else if (key.indexOf("/redirect") !== -1) { - // /redirect 路径内部打开 - this.$router.push({ path: key.replace("/redirect", "") }); + } else if (!route || !route.children) { + // 没有子路由路径内部打开 + const routeMenu = this.childrenMenus.find(item => item.path === key); + if (routeMenu && routeMenu.query) { + let query = JSON.parse(routeMenu.query); + this.$router.push({ path: key, query: query }); + } else { + this.$router.push({ path: key }); + } + this.$store.dispatch('app/toggleSideBarHide', true); } else { // 显示左侧联动菜单 this.activeRoutes(key); + this.$store.dispatch('app/toggleSideBarHide', false); } }, // 当前激活的路由 @@ -142,27 +156,39 @@ } if(routes.length > 0) { this.$store.commit("SET_SIDEBAR_ROUTERS", routes); + } else { + this.$store.dispatch('app/toggleSideBarHide', true); } - return routes; + }, + ishttp(url) { + return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1 } }, }; </script> -<style lang="scss" scoped> -.el-menu--horizontal > .el-menu-item { +<style lang="scss"> +.topmenu-container.el-menu--horizontal > .el-menu-item { float: left; - height: 50px; - line-height: 50px; - margin: 0; - border-bottom: 3px solid transparent; - color: #999093; - padding: 0 5px; - margin: 0 10px; + height: 50px !important; + line-height: 50px !important; + color: #999093 !important; + padding: 0 5px !important; + margin: 0 10px !important; } -.el-menu--horizontal > .el-menu-item.is-active { - border-bottom: 3px solid #409eff; +.topmenu-container.el-menu--horizontal > .el-menu-item.is-active, .el-menu--horizontal > .el-submenu.is-active .el-submenu__title { + border-bottom: 2px solid #{'var(--theme)'} !important; color: #303133; } + +/* submenu item */ +.topmenu-container.el-menu--horizontal > .el-submenu .el-submenu__title { + float: left; + height: 50px !important; + line-height: 50px !important; + color: #999093 !important; + padding: 0 5px !important; + margin: 0 10px !important; +} </style> -- Gitblit v1.9.2