From 4190e8411a59e84b132c3fdcb952333bbb42b0a7 Mon Sep 17 00:00:00 2001
From: hb0730 <1278032416@qq.com>
Date: Wed, 27 Mar 2024 11:06:45 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E6=97=A0=E5=8F=82=E6=95=B0=E6=89=93?=
 =?UTF-8?q?=E5=BC=80=E9=A1=B5=E7=AD=BE`is-active`=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 mock/asyncRoutes.ts                    | 10 ++++++++++
 src/layout/hooks/useTag.ts             |  4 +++-
 src/views/tabs/hooks.ts                | 21 ++++++++++++++++++++-
 src/views/tabs/index.vue               |  9 +++++++--
 src/views/tabs/no-parameter-detail.vue | 11 +++++++++++
 5 files changed, 51 insertions(+), 4 deletions(-)
 create mode 100644 src/views/tabs/no-parameter-detail.vue

diff --git a/mock/asyncRoutes.ts b/mock/asyncRoutes.ts
index a1bad2c10..dbe99a938 100644
--- a/mock/asyncRoutes.ts
+++ b/mock/asyncRoutes.ts
@@ -277,6 +277,16 @@ const tabsRouter = {
         roles: ["admin", "common"]
       }
     },
+    {
+      path: "/tabs/no-parameter-detail",
+      name: "TabNoParameterDetail",
+      meta: {
+        // 不在menu菜单中显示
+        showLink: false,
+        activePath: "/tabs/index",
+        roles: ["admin", "common"]
+      }
+    },
     // query 传参模式
     {
       path: "/tabs/query-detail",
diff --git a/src/layout/hooks/useTag.ts b/src/layout/hooks/useTag.ts
index e82e36ff6..cd3f68096 100644
--- a/src/layout/hooks/useTag.ts
+++ b/src/layout/hooks/useTag.ts
@@ -117,8 +117,10 @@ export function useTags() {
     if (isBoolean(route?.meta?.showLink) && route?.meta?.showLink === false) {
       if (Object.keys(route.query).length > 0) {
         return isEqual(route.query, item.query) ? previous : next;
-      } else {
+      } else if (Object.keys(route.params).length > 0) {
         return isEqual(route.params, item.params) ? previous : next;
+      } else {
+        return route.path === item.path ? previous : next;
       }
     } else {
       return route.path === item.path ? previous : next;
diff --git a/src/views/tabs/hooks.ts b/src/views/tabs/hooks.ts
index 08f26c362..63b33cffe 100644
--- a/src/views/tabs/hooks.ts
+++ b/src/views/tabs/hooks.ts
@@ -59,11 +59,30 @@ export function useDetail() {
       router.push({ name: "TabParamsDetail", params: parameter });
     }
   }
+  function toDetailNoParameter() {
+    // 保存信息到标签页
+    useMultiTagsStoreHook().handleTags("push", {
+      path: `/tabs/no-parameter-detail`,
+      name: "TabNoParameterDetail",
+      meta: {
+        title: {
+          zh: `无参数 - 详情信息`,
+          en: `no parameter - DetailInfo`
+        },
+        // 如果使用的是非国际化精简版title可以像下面这么写
+        // title: `No.${index} - 详情信息`,
+        // 最大打开标签数
+        dynamicLevel: 3
+      }
+    });
+    // 路由跳转
+    router.push({ name: "TabNoParameterDetail" });
+  }
 
   // 用于页面刷新，重新获取浏览器地址栏参数并保存到标签页
   const initToDetail = (model: "query" | "params") => {
     if (getParameter) toDetail(getParameter, model);
   };
 
-  return { toDetail, initToDetail, getParameter, router };
+  return { toDetail, toDetailNoParameter, initToDetail, getParameter, router };
 }
diff --git a/src/views/tabs/index.vue b/src/views/tabs/index.vue
index cc32ddf28..f034d528b 100644
--- a/src/views/tabs/index.vue
+++ b/src/views/tabs/index.vue
@@ -15,7 +15,7 @@ defineOptions({
   name: "Tabs"
 });
 
-const { toDetail, router } = useDetail();
+const { toDetail, toDetailNoParameter, router } = useDetail();
 const menusTree = clone(usePermissionStoreHook().wholeMenus, true);
 
 const treeData = computed(() => {
@@ -58,6 +58,12 @@ function onCloseTags() {
       </el-link>
     </template>
     <div class="flex flex-wrap items-center">
+      <p>无参数：</p>
+      <el-button class="m-2" @click="toDetailNoParameter()">
+        无参模式
+      </el-button>
+      <el-divider />
+
       <p>query传参模式：</p>
       <el-button
         v-for="index in 6"
@@ -155,7 +161,6 @@ function onCloseTags() {
     >
       点击查看更多跳转方式
     </el-link>
-
     <el-divider />
     <el-button @click="router.push({ name: 'Empty' })">
       跳转无Layout的空白页面
diff --git a/src/views/tabs/no-parameter-detail.vue b/src/views/tabs/no-parameter-detail.vue
new file mode 100644
index 000000000..28a360f9b
--- /dev/null
+++ b/src/views/tabs/no-parameter-detail.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+defineOptions({
+  name: "TabNoParameterDetail"
+});
+</script>
+
+<template>
+  <div>
+    <p>无参数页面</p>
+  </div>
+</template>