@zat-design/sisyphus-react 4.5.10-beta.2 → 4.6.0-beta.1

package/es/ProLayout/components/TabsManager/hooks/useTabsState.js

@@ -13,6 +13,7 @@ import {
   flattenMenuData,
   canOpenAsTab,
   getMenuRoute,
+  hasRelationKey,
   findExistingTab,
   normalizeTabUrl,
   isSafeExternalUrl,
@@ -28,6 +29,7 @@ const useTabsState = (options) => {
   const { initialState = {}, config, dataSource, cacheEnabled = true } = options;
   const finalConfig = { ...DEFAULT_TABS_CONFIG, ...config };
   const urlSyncEnabled = finalConfig.urlSync === true || typeof finalConfig.urlSync === "object" && finalConfig.urlSync !== null;
+  const urlSyncIdentity = typeof finalConfig.urlSync === "object" && finalConfig.urlSync !== null ? finalConfig.urlSync.identity || "url" : "url";
   const [state, setState] = useState(() => ({
     tabsList: [],
     activeKey: "",
@@ -62,22 +64,26 @@ const useTabsState = (options) => {
       }));
       restoredState.activeKey = restoredState.activeKey === void 0 || restoredState.activeKey === null ? "" : String(restoredState.activeKey);
       if (urlSyncEnabled) {
-        const retainedTabByUrl = /* @__PURE__ */ new Map();
+        const retainedTabByIdentity = /* @__PURE__ */ new Map();
         const retainedIdByOriginalId = /* @__PURE__ */ new Map();
         restoredState.tabsList.forEach((tab) => {
+          var _a2;
           const normalizedUrl = normalizeTabUrl(tab.url);
           if (!normalizedUrl)
             return;
-          const retainedTab = retainedTabByUrl.get(normalizedUrl);
+          const relationKey = tab.relationKey ?? ((_a2 = tab.menuItem) == null ? void 0 : _a2.relationKey);
+          const identity = urlSyncIdentity === "relationKey" && hasRelationKey(relationKey) ? `relationKey:${typeof relationKey}:${String(relationKey)}` : `url:${normalizedUrl}`;
+          const retainedTab = retainedTabByIdentity.get(identity);
           if (retainedTab) {
+            retainedTabByIdentity.set(identity, { ...retainedTab, url: normalizedUrl });
             retainedIdByOriginalId.set(tab.id, retainedTab.id);
             return;
           }
           const normalizedTab = { ...tab, url: normalizedUrl };
-          retainedTabByUrl.set(normalizedUrl, normalizedTab);
+          retainedTabByIdentity.set(identity, normalizedTab);
           retainedIdByOriginalId.set(tab.id, normalizedTab.id);
         });
-        restoredState.tabsList = Array.from(retainedTabByUrl.values());
+        restoredState.tabsList = Array.from(retainedTabByIdentity.values());
         restoredState.activeKey = retainedIdByOriginalId.get(restoredState.activeKey) || ((_a = restoredState.tabsList[0]) == null ? void 0 : _a.id) || "";
       }
       restoredState.activeTabInfo = restoredState.tabsList.find(
@@ -87,7 +93,7 @@ const useTabsState = (options) => {
       setState(restoredState);
     }
     setIsInitialized(true);
-  }, [restoreFromCache, urlSyncEnabled]);
+  }, [restoreFromCache, urlSyncEnabled, urlSyncIdentity]);
   const lastActiveKeyRef = useRef("");
   const shouldSkipSaveRef = useRef(false);
   const initialTabsAppliedRef = useRef(false);
@@ -125,7 +131,8 @@ const useTabsState = (options) => {
       }
       if (urlSyncEnabled || !forceNew) {
         const existingTab = findExistingTab(state.tabsList, menuItem, {
-          urlSync: urlSyncEnabled
+          urlSync: urlSyncEnabled,
+          identity: urlSyncIdentity
         });
         if (existingTab) {
           return true;
@@ -136,7 +143,7 @@ const useTabsState = (options) => {
       }
       return true;
     },
-    [state.tabsList, finalConfig, urlSyncEnabled]
+    [state.tabsList, finalConfig, urlSyncEnabled, urlSyncIdentity]
   );
   const addTab = useCallback(
     (menuItem, options2) => {
@@ -161,9 +168,18 @@ const useTabsState = (options) => {
           return prevState;
         }
         const resolvedMenuItem = normalizedUrl ? { ...menuItem, url: normalizedUrl, redirectUrl: void 0 } : menuItem;
-        const existingTab = urlSyncEnabled || !forceNew ? findExistingTab(prevState.tabsList, resolvedMenuItem, { urlSync: urlSyncEnabled }) : void 0;
+        const existingTab = urlSyncEnabled || !forceNew ? findExistingTab(prevState.tabsList, resolvedMenuItem, {
+          urlSync: urlSyncEnabled,
+          identity: urlSyncIdentity
+        }) : void 0;
         if (existingTab) {
-          const correctedTab = resolvedMenuItem.closable === false && existingTab.closable !== false ? { ...existingTab, closable: false } : existingTab;
+          const shouldFixClosable = resolvedMenuItem.closable === false && existingTab.closable !== false;
+          const shouldUpdateUrl = urlSyncIdentity === "relationKey" && normalizedUrl !== void 0 && existingTab.url !== normalizedUrl;
+          const correctedTab = shouldFixClosable || shouldUpdateUrl ? {
+            ...existingTab,
+            ...shouldFixClosable ? { closable: false } : {},
+            ...shouldUpdateUrl ? { url: normalizedUrl } : {}
+          } : existingTab;
           const updatedTabsList = correctedTab !== existingTab ? prevState.tabsList.map((t) => t.id === existingTab.id ? correctedTab : t) : prevState.tabsList;
           return {
             ...prevState,
@@ -200,7 +216,7 @@ const useTabsState = (options) => {
         };
       });
     },
-    [finalConfig, urlSyncEnabled]
+    [finalConfig, urlSyncEnabled, urlSyncIdentity]
   );
   useEffect(() => {
     const initialTabs = finalConfig.initialTabs;

package/es/ProLayout/components/TabsManager/index.js

@@ -13,7 +13,7 @@ import { createPortal } from "react-dom";
 import { useTabsState } from "./hooks/useTabsState";
 import { useTabsUrlSync } from "./hooks/useTabsUrlSync";
 import { useIframeRoute } from "./hooks/useIframeRoute";
-import { flattenMenuData, resolveTabMenuItem, derivePinned } from "./utils";
+import { flattenMenuData, resolveTabMenuItem, derivePinned, normalizeTabUrl } from "./utils";
 import { TabItemComponent } from "./components/TabItem";
 import { TabsHeader } from "./components/TabsHeader";
 import { TabsContext } from "./components/TabsContext";
@@ -234,6 +234,13 @@ const TabsManager = forwardRef(
           removeTab(tabId);
         },
         updateTab,
+        updateTabUrl: (tabId, url) => {
+          const normalizedUrl = normalizeTabUrl(url);
+          if (!normalizedUrl)
+            return;
+          markTabInteraction();
+          updateTabUrl(tabId, normalizedUrl);
+        },
         getTabInfo: () => ({
           tabsList: state.tabsList,
           activeTabInfo: state.tabsList.find((tab) => tab.id === state.activeKey),
@@ -248,6 +255,7 @@ const TabsManager = forwardRef(
         markTabInteraction,
         removeTab,
         updateTab,
+        updateTabUrl,
         state.tabsList,
         state.activeKey,
         state.activeComponent,

package/es/ProLayout/components/TabsManager/utils/index.d.ts

@@ -1,4 +1,4 @@
-import { AddTabParams, TabItem, MenusType } from '../../../propTypes';
+import { AddTabParams, TabItem, MenusType, TabsUrlSyncConfig } from '../../../propTypes';
 /**
  * 获取菜单实际用于路由/签页的路径
  * 约定优先使用 redirectUrl，其次回退 url
@@ -17,6 +17,7 @@ export declare const getCurrentTabUrl: () => string;
 export declare const getTabUrlPathname: (value?: string) => string | undefined;
 export interface FindExistingTabOptions {
     urlSync?: boolean;
+    identity?: TabsUrlSyncConfig['identity'];
 }
 export declare const findExistingTab: (tabsList: TabItem[], menuItem: MenusType, options?: FindExistingTabOptions) => TabItem | undefined;
 /**

package/es/ProLayout/components/TabsManager/utils/index.js

@@ -37,6 +37,14 @@ const getTabUrlPathname = (value) => {
 };
 const findExistingTab = (tabsList, menuItem, options = {}) => {
   if (options.urlSync) {
+    if (options.identity === "relationKey" && hasRelationKey(menuItem.relationKey)) {
+      return tabsList.find(
+        (tab) => {
+          var _a;
+          return tab.relationKey === menuItem.relationKey || ((_a = tab.menuItem) == null ? void 0 : _a.relationKey) === menuItem.relationKey;
+        }
+      );
+    }
     const targetUrl = normalizeTabUrl(getMenuRoute(menuItem));
     if (!targetUrl)
       return void 0;

package/es/ProLayout/propTypes.d.ts

@@ -368,6 +368,11 @@ export interface TabsUrlSyncConfig {
      * @default 'replace'
      */
     history?: 'replace' | 'push';
+    /**
+     * @description 页签复用身份。url 保持既有完整 URL 唯一语义；relationKey 在显式传入时优先按业务关联键复用
+     * @default 'url'
+     */
+    identity?: 'url' | 'relationKey';
 }
 /**
  * @description 添加标签页的业务参数
@@ -468,6 +473,10 @@ export interface ProLayoutTabsInstance {
      * @param updates 仅更新传入的字段，extra 为替换式覆盖
      */
     updateTab: (tabId: string, updates: UpdateTabParams) => void;
+    /**
+     * @description 就地更新页签完整 URL，保持 tab id 与已挂载组件不变
+     */
+    updateTabUrl: (tabId: string, url: string) => void;
     /**
      * @description 获取标签页信息
      */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zat-design/sisyphus-react",
-  "version": "4.5.10-beta.2",
+  "version": "4.6.0-beta.1",
   "license": "MIT",
   "publishConfig": {
     "access": "public",