From ddc0eeea81b1e1333e3150bb7d3e874add6373c1 Mon Sep 17 00:00:00 2001 From: xiaoxian521 <1923740402@qq.com> Date: Mon, 1 Apr 2024 13:18:09 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E8=B7=AF=E7=94=B1=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=8F=AF=E9=85=8D=E7=BD=AE=E7=9A=84`fixedTag`=E5=B1=9E?= =?UTF-8?q?=E6=80=A7=EF=BC=8C=E4=BD=9C=E7=94=A8=E4=B8=BA=E5=BD=93=E5=89=8D?= =?UTF-8?q?=E8=8F=9C=E5=8D=95=E6=98=AF=E5=90=A6=E5=9B=BA=E5=AE=9A=E6=98=BE?= =?UTF-8?q?=E7=A4=BA=E5=9C=A8=E6=A0=87=E7=AD=BE=E9=A1=B5=E4=B8=94=E4=B8=8D?= =?UTF-8?q?=E5=8F=AF=E5=85=B3=E9=97=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- mock/asyncRoutes.ts | 9 ++++++--- src/layout/components/tag/index.scss | 4 ++++ src/layout/components/tag/index.vue | 14 ++++++++++---- src/router/modules/able.ts | 6 ++++-- src/router/modules/list.ts | 3 ++- src/router/modules/nested.ts | 3 ++- src/router/modules/ppt.ts | 3 ++- src/router/modules/table.ts | 3 ++- src/store/modules/multiTags.ts | 6 +++++- src/store/modules/permission.ts | 9 ++++++++- src/views/system/menu/index.vue | 2 +- types/router.d.ts | 4 +++- 12 files changed, 49 insertions(+), 17 deletions(-) diff --git a/mock/asyncRoutes.ts b/mock/asyncRoutes.ts index a1bad2c10..2a161d04b 100644 --- a/mock/asyncRoutes.ts +++ b/mock/asyncRoutes.ts @@ -40,7 +40,8 @@ const systemManagementRouter = { meta: { icon: "ep:menu", title: "menus.pureSystemMenu", - roles: ["admin"] + roles: ["admin"], + fixedTag: true } }, { @@ -119,7 +120,8 @@ const permissionRouter = { name: "PermissionPage", meta: { title: "menus.purePermissionPage", - roles: ["admin", "common"] + roles: ["admin", "common"], + fixedTag: true } }, { @@ -243,7 +245,8 @@ const frameRouter = { title: "menus.purePiniaDoc", frameSrc: "https://pinia.vuejs.org/zh/index.html", keepAlive: true, - roles: ["admin", "common"] + roles: ["admin", "common"], + fixedTag: true } }, { diff --git a/src/layout/components/tag/index.scss b/src/layout/components/tag/index.scss index 1c0d9ab99..cc122dd2e 100644 --- a/src/layout/components/tag/index.scss +++ b/src/layout/components/tag/index.scss @@ -90,6 +90,10 @@ padding: 0 12px; } } + + .fixed-tag { + padding: 0 12px; + } } } diff --git a/src/layout/components/tag/index.vue b/src/layout/components/tag/index.vue index e9a76a6ba..c6b462385 100644 --- a/src/layout/components/tag/index.vue +++ b/src/layout/components/tag/index.vue @@ -425,7 +425,7 @@ function showMenuModel( function openMenu(tag, e) { closeMenu(); - if (tag.path === topPath) { + if (tag.path === topPath || tag?.meta?.fixedTag) { // 右键菜单为顶级菜单，只显示刷新 showMenus(false); tagsViews[0].show = true; @@ -549,7 +549,11 @@ onBeforeUnmount(() => { v-for="(item, index) in multiTags" :ref="'dynamic' + index" :key="index" - :class="['scroll-item is-closable', linkIsActive(item)]" + :class="[ + 'scroll-item is-closable', + linkIsActive(item), + !isAllEmpty(item?.meta?.fixedTag) && 'fixed-tag' + ]" @contextmenu.prevent="openMenu(item, $event)" @mouseenter.prevent="onMouseenter(index)" @mouseleave.prevent="onMouseleave(index)" @@ -562,8 +566,10 @@ onBeforeUnmount(() => { import("@/views/able/watermark.vue"), meta: { - title: $t("menus.pureWatermark") + title: $t("menus.pureWatermark"), + fixedTag: true } }, { @@ -72,7 +73,8 @@ export default { name: "Debounce", component: () => import("@/views/able/debounce.vue"), meta: { - title: $t("menus.pureDebounce") + title: $t("menus.pureDebounce"), + fixedTag: true } }, { diff --git a/src/router/modules/list.ts b/src/router/modules/list.ts index e63733942..ac2428699 100644 --- a/src/router/modules/list.ts +++ b/src/router/modules/list.ts @@ -17,7 +17,8 @@ export default { meta: { icon: "ri:bank-card-line", title: $t("menus.pureListCard"), - showParent: true + showParent: true, + fixedTag: true } } ] diff --git a/src/router/modules/nested.ts b/src/router/modules/nested.ts index bc42f4623..5950cd1b1 100644 --- a/src/router/modules/nested.ts +++ b/src/router/modules/nested.ts @@ -42,7 +42,8 @@ export default { name: "Menu1-2-1", meta: { title: $t("menus.pureMenu1-2-1"), - keepAlive: true + keepAlive: true, + fixedTag: true } }, { diff --git a/src/router/modules/ppt.ts b/src/router/modules/ppt.ts index fcf292dd3..8d76b1045 100644 --- a/src/router/modules/ppt.ts +++ b/src/router/modules/ppt.ts @@ -18,7 +18,8 @@ export default { title: "PPT", keepAlive: true, frameSrc: "https://pipipi-pikachu.github.io/PPTist/", - frameLoading: false + frameLoading: false, + fixedTag: true } } ] diff --git a/src/router/modules/table.ts b/src/router/modules/table.ts index 56b279f00..6a3b3d4c4 100644 --- a/src/router/modules/table.ts +++ b/src/router/modules/table.ts @@ -23,7 +23,8 @@ export default { name: "PureTableHigh", component: () => import("@/views/table/high.vue"), meta: { - title: $t("menus.pureTableHigh") + title: $t("menus.pureTableHigh"), + fixedTag: true } }, { diff --git a/src/store/modules/multiTags.ts b/src/store/modules/multiTags.ts index cad8b3184..7feaafe01 100644 --- a/src/store/modules/multiTags.ts +++ b/src/store/modules/multiTags.ts @@ -1,5 +1,6 @@ import { defineStore } from "pinia"; import { store } from "@/store"; +import { usePermissionStoreHook } from "./permission"; import { routerArrays } from "@/layout/types"; import { responsiveStorageNameSpace } from "@/config"; import type { multiType, positionType } from "./types"; @@ -15,7 +16,10 @@ export const useMultiTagsStore = defineStore({ ? storageLocal().getItem( `${responsiveStorageNameSpace()}tags` ) - : [...routerArrays], + : [ + ...routerArrays, + ...usePermissionStoreHook().tagLists.filter(v => v?.meta?.fixedTag) + ], multiTagsCache: storageLocal().getItem( `${responsiveStorageNameSpace()}configure` )?.multiTagsCache diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts index a285f68df..4ed8d6e9c 100644 --- a/src/store/modules/permission.ts +++ b/src/store/modules/permission.ts @@ -4,7 +4,12 @@ import type { cacheType } from "./types"; import { constantMenus } from "@/router"; import { useMultiTagsStoreHook } from "./multiTags"; import { debounce, getKeyList } from "@pureadmin/utils"; -import { ascending, filterTree, filterNoPermissionTree } from "@/router/utils"; +import { + ascending, + filterTree, + filterNoPermissionTree, + formatFlatteningRoutes +} from "@/router/utils"; export const usePermissionStore = defineStore({ id: "pure-permission", @@ -13,6 +18,7 @@ export const usePermissionStore = defineStore({ constantMenus, // 整体路由生成的菜单（静态、动态） wholeMenus: [], + tagLists: [], // 缓存页面keepAlive cachePageList: [] }), @@ -22,6 +28,7 @@ export const usePermissionStore = defineStore({ this.wholeMenus = filterNoPermissionTree( filterTree(ascending(this.constantMenus.concat(routes))) ); + this.tagLists = formatFlatteningRoutes(this.constantMenus.concat(routes)); }, cacheOperate({ mode, name }: cacheType) { const delIndex = this.cachePageList.findIndex(v => v === name); diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue index ebd0d1c40..c27e3a819 100644 --- a/src/views/system/menu/index.vue +++ b/src/views/system/menu/index.vue @@ -61,7 +61,7 @@ const {