feat(projects): add page function_tab

src/store/modules/tab/index.ts

@@ -2,6 +2,7 @@ import { computed, ref } from 'vue';
 import { useRouter } from 'vue-router';
 import { defineStore } from 'pinia';
 import { useEventListener } from '@vueuse/core';
+import type { RouteKey } from '@elegant-router/types';
 import { SetupStoreId } from '@/enum';
 import { useRouterPush } from '@/hooks/common/router';
 import { localStg } from '@/utils/storage';
@@ -10,6 +11,7 @@ import {
   filterTabsByAllRoutes,
   filterTabsById,
   filterTabsByIds,
+  findTabByRouteName,
   getAllTabs,
   getDefaultHomeTab,
   getFixedTabIds,
@@ -112,6 +114,23 @@ export const useTabStore = defineStore(SetupStoreId.Tab, () => {
     }
   }
 
+  /** remove active tab */
+  async function removeActiveTab() {
+    await removeTab(activeTabId.value);
+  }
+
+  /**
+   * remove tab by route name
+   *
+   * @param routeName route name
+   */
+  async function removeTabByRouteName(routeName: RouteKey) {
+    const tab = findTabByRouteName(routeName, tabs.value);
+    if (!tab) return;
+
+    await removeTab(tab.id);
+  }
+
   /**
    * Clear tabs
    *
@@ -192,6 +211,7 @@ export const useTabStore = defineStore(SetupStoreId.Tab, () => {
     const tab = tabs.value.find(item => item.id === id);
     if (!tab) return;
 
+    tab.oldLabel = tab.label;
     tab.newLabel = label;
   }
 
@@ -252,6 +272,8 @@ export const useTabStore = defineStore(SetupStoreId.Tab, () => {
     initTabStore,
     addTab,
     removeTab,
+    removeActiveTab,
+    removeTabByRouteName,
     clearTabs,
     clearLeftTabs,
     clearRightTabs,

src/store/modules/tab/shared.ts

@@ -1,5 +1,5 @@
 import type { Router } from 'vue-router';
-import type { LastLevelRouteKey, RouteMap } from '@elegant-router/types';
+import type { LastLevelRouteKey, RouteKey, RouteMap } from '@elegant-router/types';
 import { $t } from '@/locales';
 import { getRoutePath } from '@/router/elegant/transform';
 
@@ -166,10 +166,12 @@ export function getFixedTabIds(tabs: App.Global.Tab[]) {
  * @param tabs
  */
 function updateTabsLabel(tabs: App.Global.Tab[]) {
-  return tabs.map(tab => ({
+  const updated = tabs.map(tab => ({
     ...tab,
-    label: tab.newLabel || tab.label
+    label: tab.newLabel || tab.oldLabel || tab.label
   }));
+
+  return updated;
 }
 
 /**
@@ -194,3 +196,18 @@ export function updateTabByI18nKey(tab: App.Global.Tab) {
 export function updateTabsByI18nKey(tabs: App.Global.Tab[]) {
   return tabs.map(tab => updateTabByI18nKey(tab));
 }
+
+/**
+ * find tab by route name
+ *
+ * @param name
+ * @param tabs
+ */
+export function findTabByRouteName(name: RouteKey, tabs: App.Global.Tab[]) {
+  const routePath = getRoutePath(name);
+
+  const tabId = routePath;
+  const multiTabId = `${routePath}?`;
+
+  return tabs.find(tab => tab.id === tabId || tab.id.startsWith(multiTabId));
+}