@nocobase/flow-engine 2.1.0-beta.9 → 2.2.0-beta.1

package/lib/views/usePage.js

@@ -54,9 +54,107 @@ var import_viewEvents = require("./viewEvents");
 var import_provider = require("../provider");
 var import_ViewScopedFlowEngine = require("../ViewScopedFlowEngine");
 var import_variablesParams = require("../utils/variablesParams");
+var import_runViewBeforeClose = require("./runViewBeforeClose");
+var import_inheritLayoutContext = require("./inheritLayoutContext");
 let uuid = 0;
 const GLOBAL_EMBED_CONTAINER_ID = "nocobase-embed-container";
 const EMBED_REPLACING_DATA_KEY = "nocobaseEmbedReplacing";
+function isPromiseLike(value) {
+  return !!value && typeof value.then === "function";
+}
+__name(isPromiseLike, "isPromiseLike");
+function closeReplacingGlobalEmbed(target, activeView) {
+  target.dataset[EMBED_REPLACING_DATA_KEY] = "1";
+  try {
+    const closeResult = activeView.close();
+    if (isPromiseLike(closeResult)) {
+      return Promise.resolve(closeResult).finally(() => {
+        delete target.dataset[EMBED_REPLACING_DATA_KEY];
+      });
+    }
+    delete target.dataset[EMBED_REPLACING_DATA_KEY];
+    return closeResult;
+  } catch (error) {
+    delete target.dataset[EMBED_REPLACING_DATA_KEY];
+    throw error;
+  }
+}
+__name(closeReplacingGlobalEmbed, "closeReplacingGlobalEmbed");
+function createPendingGlobalEmbedView(openedPromise, inputArgs, preventClose) {
+  let openedPage;
+  const pendingActions = {};
+  const readyPromise = openedPromise.then(({ page }) => {
+    openedPage = page;
+    if (openedPage) {
+      if ("beforeClose" in pendingActions) {
+        openedPage.beforeClose = pendingActions.beforeClose;
+      }
+      if ("update" in pendingActions) {
+        openedPage.update(pendingActions.update);
+      }
+      if ("footer" in pendingActions) {
+        openedPage.setFooter(pendingActions.footer);
+      }
+      if ("header" in pendingActions) {
+        openedPage.setHeader(pendingActions.header);
+      }
+      if (pendingActions.destroyed) {
+        openedPage.destroy(pendingActions.destroyed.result);
+      }
+    }
+    return { page };
+  });
+  return Object.assign(
+    readyPromise.then(({ page }) => page ? page : false),
+    {
+      type: "embed",
+      inputArgs,
+      preventClose,
+      Header: null,
+      Footer: null,
+      get beforeClose() {
+        return (openedPage == null ? void 0 : openedPage.beforeClose) ?? pendingActions.beforeClose;
+      },
+      set beforeClose(value) {
+        if (openedPage) {
+          openedPage.beforeClose = value;
+        } else {
+          pendingActions.beforeClose = value;
+        }
+      },
+      close: /* @__PURE__ */ __name((result, force) => readyPromise.then(({ page }) => page ? page.close(result, force) : false), "close"),
+      destroy: /* @__PURE__ */ __name((result) => {
+        if (openedPage) {
+          openedPage.destroy(result);
+        } else {
+          pendingActions.destroyed = { result };
+        }
+      }, "destroy"),
+      update: /* @__PURE__ */ __name((newConfig) => {
+        if (openedPage) {
+          openedPage.update(newConfig);
+        } else {
+          pendingActions.update = { ...pendingActions.update, ...newConfig };
+        }
+      }, "update"),
+      setFooter: /* @__PURE__ */ __name((footer) => {
+        if (openedPage) {
+          openedPage.setFooter(footer);
+        } else {
+          pendingActions.footer = footer;
+        }
+      }, "setFooter"),
+      setHeader: /* @__PURE__ */ __name((header) => {
+        if (openedPage) {
+          openedPage.setHeader(header);
+        } else {
+          pendingActions.header = header;
+        }
+      }, "setHeader")
+    }
+  );
+}
+__name(createPendingGlobalEmbedView, "createPendingGlobalEmbedView");
 const PageElementsHolder = import_react.default.memo(
   import_react.default.forwardRef((props, ref) => {
     const [elements, patchElement] = (0, import_usePatchElement.default)();
@@ -67,168 +165,230 @@ const PageElementsHolder = import_react.default.memo(
 function usePage() {
   const holderRef = import_react.default.useRef(null);
   const globalEmbedActiveRef = import_react.default.useRef(null);
+  const globalEmbedReplacementTokenRef = import_react.default.useRef(0);
   const open = /* @__PURE__ */ __name((config, flowContext) => {
-    var _a, _b, _c;
-    const parentEngine = flowContext == null ? void 0 : flowContext.engine;
-    uuid += 1;
-    const pageRef = import_react.default.createRef();
-    let closeFunc;
-    let resolvePromise;
-    const promise = new Promise((resolve) => {
-      resolvePromise = resolve;
-    });
-    const FooterComponent = /* @__PURE__ */ __name(({ children }) => {
-      import_react.default.useEffect(() => {
-        var _a2;
-        (_a2 = pageRef.current) == null ? void 0 : _a2.setFooter(children);
-        return () => {
-          var _a3;
-          (_a3 = pageRef.current) == null ? void 0 : _a3.setFooter(null);
-        };
-      }, [children]);
-      return null;
-    }, "FooterComponent");
-    const HeaderComponent = /* @__PURE__ */ __name((props) => {
-      import_react.default.useEffect(() => {
-        var _a2;
-        (_a2 = pageRef.current) == null ? void 0 : _a2.setHeader(props);
-        return () => {
-          var _a3;
-          (_a3 = pageRef.current) == null ? void 0 : _a3.setHeader(null);
-        };
-      }, [props]);
-      return null;
-    }, "HeaderComponent");
     const {
       target,
       content,
       preventClose,
       inheritContext = true,
       inputArgs: viewInputArgs = {},
+      onOpenCancelled,
       ...restConfig
     } = config;
     const isGlobalEmbedContainer = target instanceof HTMLElement && target.id === GLOBAL_EMBED_CONTAINER_ID;
-    if (isGlobalEmbedContainer && globalEmbedActiveRef.current) {
-      try {
-        target.dataset[EMBED_REPLACING_DATA_KEY] = "1";
-        globalEmbedActiveRef.current.destroy();
-      } finally {
-        delete target.dataset[EMBED_REPLACING_DATA_KEY];
-        globalEmbedActiveRef.current = null;
+    const openCurrentPage = /* @__PURE__ */ __name(() => {
+      var _a, _b, _c;
+      const parentEngine = flowContext == null ? void 0 : flowContext.engine;
+      uuid += 1;
+      const pageRef = import_react.default.createRef();
+      let closeFunc;
+      let resolvePromise;
+      const promise = new Promise((resolve) => {
+        resolvePromise = resolve;
+      });
+      const FooterComponent = /* @__PURE__ */ __name(({ children }) => {
+        import_react.default.useEffect(() => {
+          var _a2;
+          (_a2 = pageRef.current) == null ? void 0 : _a2.setFooter(children);
+          return () => {
+            var _a3;
+            (_a3 = pageRef.current) == null ? void 0 : _a3.setFooter(null);
+          };
+        }, [children]);
+        return null;
+      }, "FooterComponent");
+      const HeaderComponent = /* @__PURE__ */ __name((props) => {
+        import_react.default.useEffect(() => {
+          var _a2;
+          (_a2 = pageRef.current) == null ? void 0 : _a2.setHeader(props);
+          return () => {
+            var _a3;
+            (_a3 = pageRef.current) == null ? void 0 : _a3.setHeader(null);
+          };
+        }, [props]);
+        return null;
+      }, "HeaderComponent");
+      const ctx = new import_flowContext.FlowContext();
+      const scopedEngine = (0, import_ViewScopedFlowEngine.createViewScopedEngine)(flowContext.engine);
+      const openerEngine = (0, import_viewEvents.resolveOpenerEngine)(parentEngine, scopedEngine);
+      ctx.defineProperty("engine", { value: scopedEngine });
+      ctx.addDelegate(scopedEngine.context);
+      if (inheritContext) {
+        ctx.addDelegate(flowContext);
+      } else {
+        ctx.addDelegate(flowContext.engine.context);
+        (0, import_inheritLayoutContext.inheritLayoutContextForDetachedView)(ctx, flowContext);
       }
-    }
-    const ctx = new import_flowContext.FlowContext();
-    const scopedEngine = (0, import_ViewScopedFlowEngine.createViewScopedEngine)(flowContext.engine);
-    const openerEngine = (0, import_viewEvents.resolveOpenerEngine)(parentEngine, scopedEngine);
-    ctx.defineProperty("engine", { value: scopedEngine });
-    ctx.addDelegate(scopedEngine.context);
-    if (inheritContext) {
-      ctx.addDelegate(flowContext);
-    } else {
-      ctx.addDelegate(flowContext.engine.context);
-    }
-    const currentPage = {
-      type: "embed",
-      inputArgs: viewInputArgs,
-      preventClose: !!config.preventClose,
-      destroy: /* @__PURE__ */ __name((result) => {
-        var _a2, _b2, _c2, _d, _e;
-        (_a2 = config.onClose) == null ? void 0 : _a2.call(config);
-        resolvePromise == null ? void 0 : resolvePromise(result);
-        (_b2 = pageRef.current) == null ? void 0 : _b2.destroy();
-        closeFunc == null ? void 0 : closeFunc();
-        if (isGlobalEmbedContainer) {
-          globalEmbedActiveRef.current = null;
-        }
-        const isReplacing = isGlobalEmbedContainer && target instanceof HTMLElement && ((_c2 = target.dataset) == null ? void 0 : _c2[EMBED_REPLACING_DATA_KEY]) === "1";
-        if (!isReplacing) {
-          const openerEmitter = openerEngine == null ? void 0 : openerEngine.emitter;
-          (0, import_viewEvents.bumpViewActivatedVersion)(openerEmitter);
-          (_e = openerEmitter == null ? void 0 : openerEmitter.emit) == null ? void 0 : _e.call(openerEmitter, import_viewEvents.VIEW_ACTIVATED_EVENT, { type: "embed", viewUid: (_d = currentPage == null ? void 0 : currentPage.inputArgs) == null ? void 0 : _d.viewUid });
-        }
-        scopedEngine.unlinkFromStack();
-      }, "destroy"),
-      update: /* @__PURE__ */ __name((newConfig) => {
-        var _a2;
-        return (_a2 = pageRef.current) == null ? void 0 : _a2.update(newConfig);
-      }, "update"),
-      close: /* @__PURE__ */ __name((result, force) => {
-        var _a2, _b2;
-        if (preventClose && !force) {
-          return;
+      let destroyed = false;
+      let closingPromise;
+      const currentPage = {
+        type: "embed",
+        inputArgs: viewInputArgs,
+        preventClose: !!config.preventClose,
+        beforeClose: void 0,
+        destroy: /* @__PURE__ */ __name((result) => {
+          var _a2, _b2, _c2, _d, _e;
+          if (destroyed) return;
+          destroyed = true;
+          (_a2 = config.onClose) == null ? void 0 : _a2.call(config);
+          resolvePromise == null ? void 0 : resolvePromise(result);
+          (_b2 = pageRef.current) == null ? void 0 : _b2.destroy();
+          closeFunc == null ? void 0 : closeFunc();
+          if (isGlobalEmbedContainer && globalEmbedActiveRef.current === currentPage) {
+            globalEmbedActiveRef.current = null;
+          }
+          const isReplacing = isGlobalEmbedContainer && target instanceof HTMLElement && ((_c2 = target.dataset) == null ? void 0 : _c2[EMBED_REPLACING_DATA_KEY]) === "1";
+          if (!isReplacing) {
+            const openerEmitter = openerEngine == null ? void 0 : openerEngine.emitter;
+            (0, import_viewEvents.bumpViewActivatedVersion)(openerEmitter);
+            (_e = openerEmitter == null ? void 0 : openerEmitter.emit) == null ? void 0 : _e.call(openerEmitter, import_viewEvents.VIEW_ACTIVATED_EVENT, { type: "embed", viewUid: (_d = currentPage == null ? void 0 : currentPage.inputArgs) == null ? void 0 : _d.viewUid });
+          }
+          scopedEngine.unlinkFromStack();
+        }, "destroy"),
+        update: /* @__PURE__ */ __name((newConfig) => {
+          var _a2;
+          return (_a2 = pageRef.current) == null ? void 0 : _a2.update(newConfig);
+        }, "update"),
+        close: /* @__PURE__ */ __name((result, force) => {
+          if (destroyed) {
+            return Promise.resolve(true);
+          }
+          if (closingPromise) {
+            return closingPromise;
+          }
+          closingPromise = (async () => {
+            var _a2, _b2;
+            try {
+              if (preventClose && !force) {
+                closingPromise = void 0;
+                return false;
+              }
+              const shouldClose = await (0, import_runViewBeforeClose.runViewBeforeClose)(currentPage, { result, force });
+              if (destroyed) {
+                return true;
+              }
+              if (!shouldClose) {
+                closingPromise = void 0;
+                return false;
+              }
+              if (config.triggerByRouter && ((_b2 = (_a2 = config.inputArgs) == null ? void 0 : _a2.navigation) == null ? void 0 : _b2.back)) {
+                config.inputArgs.navigation.back();
+                return true;
+              }
+              currentPage.destroy(result);
+              return true;
+            } catch (error) {
+              if (!destroyed) {
+                closingPromise = void 0;
+              }
+              throw error;
+            }
+          })();
+          return closingPromise;
+        }, "close"),
+        Header: HeaderComponent,
+        Footer: FooterComponent,
+        setFooter: /* @__PURE__ */ __name((footer) => {
+          var _a2;
+          (_a2 = pageRef.current) == null ? void 0 : _a2.setFooter(footer);
+        }, "setFooter"),
+        setHeader: /* @__PURE__ */ __name((header) => {
+          var _a2;
+          (_a2 = pageRef.current) == null ? void 0 : _a2.setHeader(header);
+        }, "setHeader"),
+        navigation: (_a = config.inputArgs) == null ? void 0 : _a.navigation,
+        get record() {
+          return (0, import_variablesParams.getViewRecordFromParent)(flowContext, ctx);
         }
-        if (config.triggerByRouter && ((_b2 = (_a2 = config.inputArgs) == null ? void 0 : _a2.navigation) == null ? void 0 : _b2.back)) {
-          config.inputArgs.navigation.back();
-          return;
+      };
+      ctx.defineProperty("view", {
+        get: /* @__PURE__ */ __name(() => currentPage, "get"),
+        // 仅当访问关联字段或前端无本地记录数据时，才交给服务端解析
+        resolveOnServer: (0, import_variablesParams.createViewRecordResolveOnServer)(ctx, () => (0, import_variablesParams.getViewRecordFromParent)(flowContext, ctx))
+      });
+      (0, import_createViewMeta.registerPopupVariable)(ctx, currentPage);
+      const PageWithContext = (0, import__.observer)(
+        () => {
+          var _a2, _b2, _c2, _d;
+          const mountedRef = import_react.default.useRef(false);
+          const pageContent = import_react.default.useMemo(
+            () => typeof content === "function" ? content(currentPage, ctx) : content,
+            []
+          );
+          void ctx.themeToken;
+          import_react.default.useEffect(() => {
+            var _a3;
+            (_a3 = config.onOpen) == null ? void 0 : _a3.call(config, currentPage, ctx);
+          }, []);
+          if (((_b2 = (_a2 = config.inputArgs) == null ? void 0 : _a2.hidden) == null ? void 0 : _b2.value) && !mountedRef.current) {
+            return null;
+          }
+          mountedRef.current = true;
+          return /* @__PURE__ */ import_react.default.createElement(
+            import_PageComponent.PageComponent,
+            {
+              ref: pageRef,
+              hidden: (_d = (_c2 = config.inputArgs) == null ? void 0 : _c2.hidden) == null ? void 0 : _d.value,
+              ...restConfig,
+              onClose: () => {
+                return currentPage.close(config.result);
+              }
+            },
+            pageContent
+          );
+        },
+        {
+          displayName: "PageWithContext"
         }
-        currentPage.destroy(result);
-      }, "close"),
-      Header: HeaderComponent,
-      Footer: FooterComponent,
-      setFooter: /* @__PURE__ */ __name((footer) => {
-        var _a2;
-        (_a2 = pageRef.current) == null ? void 0 : _a2.setFooter(footer);
-      }, "setFooter"),
-      setHeader: /* @__PURE__ */ __name((header) => {
-        var _a2;
-        (_a2 = pageRef.current) == null ? void 0 : _a2.setHeader(header);
-      }, "setHeader"),
-      navigation: (_a = config.inputArgs) == null ? void 0 : _a.navigation,
-      get record() {
-        return (0, import_variablesParams.getViewRecordFromParent)(flowContext, ctx);
+      );
+      const key = (viewInputArgs == null ? void 0 : viewInputArgs.viewUid) || `page-${uuid}`;
+      const page = /* @__PURE__ */ import_react.default.createElement(import_provider.FlowEngineProvider, { key, engine: scopedEngine }, /* @__PURE__ */ import_react.default.createElement(import_FlowContextProvider.FlowViewContextProvider, { context: ctx }, /* @__PURE__ */ import_react.default.createElement(PageWithContext, null)));
+      if (target && target instanceof HTMLElement) {
+        closeFunc = (_b = holderRef.current) == null ? void 0 : _b.patchElement(import_react_dom.default.createPortal(page, target, key));
+      } else {
+        closeFunc = (_c = holderRef.current) == null ? void 0 : _c.patchElement(page);
       }
-    };
-    ctx.defineProperty("view", {
-      get: /* @__PURE__ */ __name(() => currentPage, "get"),
-      // 仅当访问关联字段或前端无本地记录数据时，才交给服务端解析
-      resolveOnServer: (0, import_variablesParams.createViewRecordResolveOnServer)(ctx, () => (0, import_variablesParams.getViewRecordFromParent)(flowContext, ctx))
-    });
-    (0, import_createViewMeta.registerPopupVariable)(ctx, currentPage);
-    const PageWithContext = (0, import__.observer)(
-      () => {
-        var _a2, _b2, _c2, _d;
-        const mountedRef = import_react.default.useRef(false);
-        const pageContent = import_react.default.useMemo(
-          () => typeof content === "function" ? content(currentPage, ctx) : content,
-          []
-        );
-        void ctx.themeToken;
-        import_react.default.useEffect(() => {
-          var _a3;
-          (_a3 = config.onOpen) == null ? void 0 : _a3.call(config, currentPage, ctx);
-        }, []);
-        if (((_b2 = (_a2 = config.inputArgs) == null ? void 0 : _a2.hidden) == null ? void 0 : _b2.value) && !mountedRef.current) {
-          return null;
-        }
-        mountedRef.current = true;
-        return /* @__PURE__ */ import_react.default.createElement(
-          import_PageComponent.PageComponent,
-          {
-            ref: pageRef,
-            hidden: (_d = (_c2 = config.inputArgs) == null ? void 0 : _c2.hidden) == null ? void 0 : _d.value,
-            ...restConfig,
-            onClose: () => {
-              currentPage.close(config.result);
+      if (isGlobalEmbedContainer) {
+        globalEmbedActiveRef.current = currentPage;
+      }
+      return Object.assign(promise, currentPage);
+    }, "openCurrentPage");
+    if (isGlobalEmbedContainer && globalEmbedActiveRef.current) {
+      const replacementToken = globalEmbedReplacementTokenRef.current += 1;
+      const cancelOpen = /* @__PURE__ */ __name(() => onOpenCancelled == null ? void 0 : onOpenCancelled(), "cancelOpen");
+      let closeResult;
+      try {
+        closeResult = closeReplacingGlobalEmbed(target, globalEmbedActiveRef.current);
+      } catch (error) {
+        cancelOpen();
+        throw error;
+      }
+      if (isPromiseLike(closeResult)) {
+        return createPendingGlobalEmbedView(
+          Promise.resolve(closeResult).then(
+            (closed) => {
+              if (closed === false || replacementToken !== globalEmbedReplacementTokenRef.current) {
+                cancelOpen();
+                return { page: null };
+              }
+              return { page: openCurrentPage() };
+            },
+            (error) => {
+              cancelOpen();
+              throw error;
             }
-          },
-          pageContent
+          ),
+          viewInputArgs,
+          !!config.preventClose
         );
-      },
-      {
-        displayName: "PageWithContext"
       }
-    );
-    const key = (viewInputArgs == null ? void 0 : viewInputArgs.viewUid) || `page-${uuid}`;
-    const page = /* @__PURE__ */ import_react.default.createElement(import_provider.FlowEngineProvider, { key, engine: scopedEngine }, /* @__PURE__ */ import_react.default.createElement(import_FlowContextProvider.FlowViewContextProvider, { context: ctx }, /* @__PURE__ */ import_react.default.createElement(PageWithContext, null)));
-    if (target && target instanceof HTMLElement) {
-      closeFunc = (_b = holderRef.current) == null ? void 0 : _b.patchElement(import_react_dom.default.createPortal(page, target, key));
-    } else {
-      closeFunc = (_c = holderRef.current) == null ? void 0 : _c.patchElement(page);
-    }
-    if (isGlobalEmbedContainer) {
-      globalEmbedActiveRef.current = { destroy: currentPage.destroy };
+      if (closeResult === false) {
+        cancelOpen();
+        return createPendingGlobalEmbedView(Promise.resolve({ page: null }), viewInputArgs, !!config.preventClose);
+      }
     }
-    return Object.assign(promise, currentPage);
+    return openCurrentPage();
   }, "open");
   const api = import_react.default.useMemo(() => ({ open }), []);
   return [api, /* @__PURE__ */ import_react.default.createElement(PageElementsHolder, { key: "page-holder", ref: holderRef })];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/flow-engine",
-  "version": "2.1.0-beta.9",
+  "version": "2.2.0-beta.1",
   "private": false,
   "description": "A standalone flow engine for NocoBase, managing workflows, models, and actions.",
   "main": "lib/index.js",
@@ -8,9 +8,10 @@
   "dependencies": {
     "@formily/antd-v5": "1.x",
     "@formily/reactive": "2.x",
-    "@nocobase/sdk": "2.1.0-beta.9",
-    "@nocobase/shared": "2.1.0-beta.9",
+    "@nocobase/sdk": "2.2.0-beta.1",
+    "@nocobase/shared": "2.2.0-beta.1",
     "ahooks": "^3.7.2",
+    "axios": "^1.7.0",
     "dayjs": "^1.11.9",
     "dompurify": "^3.0.2",
     "lodash": "^4.x",
@@ -36,5 +37,5 @@
   ],
   "author": "NocoBase Team",
   "license": "Apache-2.0",
-  "gitHead": "c3a2875e4cbbb43b1f2361e6f9f5f84a7d3f3c3c"
+  "gitHead": "f82fa9d0c3aa8e00e53dd94e404a312483b4866b"
 }

package/src/FlowContextProvider.tsx

@@ -9,7 +9,7 @@
 
 import React, { createContext, useContext } from 'react';
 import { FlowContext, FlowEngineContext } from './flowContext';
-import { FlowView } from './views/FlowView';
+import { FlowView, FlowViewer } from './views/FlowView';
 
 export const FlowReactContext = createContext<FlowContext>(null);
 export const FlowViewContext = createContext<FlowContext>(null);
@@ -40,3 +40,11 @@ export function useFlowView() {
   const ctx = useFlowContext();
   return ctx.view as FlowView;
 }
+
+/**
+ * Access the `FlowViewer` that opens new drawers / modals / pages (`viewer.drawer({...})`, `viewer.modal({...})`, etc.). This is the counterpart to `useFlowView()`: `useFlowView()` returns the *current* mounted view (use it to close yourself, render Header/Footer slots, etc.), while `useFlowViewer()` returns the surface that lets you open a *new* view from inside any flow-context subtree.
+ */
+export function useFlowViewer() {
+  const ctx = useFlowContext();
+  return ctx.viewer as FlowViewer;
+}

package/src/__tests__/createViewMeta.popup.test.ts

@@ -11,7 +11,7 @@ import { describe, it, expect, vi } from 'vitest';
 import { FlowContext } from '../flowContext';
 import { FlowEngine } from '../flowEngine';
 import type { FlowView } from '../views/FlowView';
-import { createPopupMeta } from '../views/createViewMeta';
+import { buildPopupRuntime, createPopupMeta } from '../views/createViewMeta';
 
 describe('createPopupMeta - popup variables', () => {
   function makeCtx() {
@@ -23,6 +23,62 @@ describe('createPopupMeta - popup variables', () => {
     return { engine, ctx };
   }
 
+  function makeNestedPopupView(viewUid: string, filterByTk: number): FlowView {
+    return {
+      type: 'drawer',
+      inputArgs: {
+        viewUid,
+        filterByTk,
+        sourceId: 13,
+      },
+      Header: null,
+      Footer: null,
+      close: () => void 0,
+      update: () => void 0,
+      navigation: {
+        viewStack: [
+          { viewUid: 'base-page-uid' },
+          { viewUid: 'parent-popup-uid', filterByTk: 13, sourceId: 13 },
+          { viewUid: 'child-popup-uid', filterByTk: 24, sourceId: 13 },
+        ],
+      } as any,
+    } as any;
+  }
+
+  function mockNestedPopupModels(engine: FlowEngine) {
+    vi.spyOn(engine as any, 'getModel').mockImplementation((uid: string) => {
+      if (uid === 'parent-popup-uid') {
+        return {
+          getStepParams: vi.fn((_fk: string, sk: string) =>
+            sk === 'openView'
+              ? {
+                  collectionName: 'users',
+                  dataSourceKey: 'main',
+                  associationName: 'users.orgs',
+                }
+              : undefined,
+          ),
+        };
+      }
+      if (uid === 'child-popup-uid') {
+        return {
+          getStepParams: vi.fn((_fk: string, sk: string) =>
+            sk === 'openView'
+              ? {
+                  collectionName: 'orgs',
+                  dataSourceKey: 'main',
+                  associationName: 'users.orgs',
+                }
+              : undefined,
+          ),
+        };
+      }
+      return {
+        getStepParams: vi.fn(() => undefined),
+      };
+    });
+  }
+
   it('buildVariablesParams(record) uses anchor view instead of ctx.view', async () => {
     const { engine, ctx } = makeCtx();
 
@@ -108,6 +164,64 @@ describe('createPopupMeta - popup variables', () => {
     expect(vars.record.collection).not.toBe('comments');
   });
 
+  it('buildPopupRuntime anchors current popup even when the navigation stack already has a child popup', async () => {
+    const { engine, ctx } = makeCtx();
+    const parentView = makeNestedPopupView('parent-popup-uid', 13);
+    mockNestedPopupModels(engine);
+
+    const popup = await buildPopupRuntime(ctx, parentView);
+
+    expect(popup?.uid).toBe('parent-popup-uid');
+    expect(popup?.resource).toEqual({
+      dataSourceKey: 'main',
+      collectionName: 'users',
+      associationName: 'users.orgs',
+      filterByTk: 13,
+      sourceId: 13,
+    });
+  });
+
+  it('buildVariablesParams(record) keeps the parent view record when a child popup is open', async () => {
+    const { engine, ctx } = makeCtx();
+    const parentView = makeNestedPopupView('parent-popup-uid', 13);
+    mockNestedPopupModels(engine);
+
+    const meta = (await createPopupMeta(ctx, parentView)())!;
+    const vars = (await meta.buildVariablesParams!(ctx)) as any;
+
+    expect(vars.record).toEqual({
+      collection: 'users',
+      dataSourceKey: 'main',
+      filterByTk: 13,
+      associationName: 'users.orgs',
+      sourceId: 13,
+    });
+  });
+
+  it('buildVariablesParams(parent.record) is still relative to the child popup view', async () => {
+    const { engine, ctx } = makeCtx();
+    const childView = makeNestedPopupView('child-popup-uid', 24);
+    mockNestedPopupModels(engine);
+
+    const meta = (await createPopupMeta(ctx, childView)())!;
+    const vars = (await meta.buildVariablesParams!(ctx)) as any;
+
+    expect(vars.record).toEqual({
+      collection: 'orgs',
+      dataSourceKey: 'main',
+      filterByTk: 24,
+      associationName: 'users.orgs',
+      sourceId: 13,
+    });
+    expect(vars.parent.record).toEqual({
+      collection: 'users',
+      dataSourceKey: 'main',
+      filterByTk: 13,
+      sourceId: 13,
+      associationName: 'users.orgs',
+    });
+  });
+
   it('properties() provides a record factory node (lazy) with title', async () => {
     const { engine, ctx } = makeCtx();
     // 只要能通过 anchorView 推断到集合名和主键即可；集合详情在懒加载时再取