@nocobase/flow-engine 2.1.0-alpha.40 → 2.1.0-alpha.45

package/src/views/ViewNavigation.ts

@@ -13,6 +13,16 @@ import { ViewParam as SharedViewParam } from '../utils';
 
 type ViewParams = Omit<SharedViewParam, 'viewUid'> & { viewUid?: string };
 
+export interface GeneratePathnameFromViewParamsOptions {
+  prefix?: string;
+  basePath?: string;
+}
+
+export interface ViewNavigationOptions {
+  basePath?: string;
+  layoutBasePath?: string;
+}
+
 function encodeFilterByTk(val: SharedViewParam['filterByTk']): string {
   if (val === undefined || val === null) return '';
   // 1.x 兼容：对象按 key1=v1&key2=v2 拼接后整体 encodeURIComponent
@@ -30,6 +40,11 @@ function hasUsableSourceId(sourceId: unknown): sourceId is string | number {
   return sourceId !== undefined && sourceId !== null && String(sourceId) !== '';
 }
 
+function normalizeBasePath(basePath?: string) {
+  const value = basePath || '/admin';
+  return `/${value.replace(/^\/+/, '').replace(/\/+$/, '')}`;
+}
+
 /**
  * 将 ViewParam 数组转换为 pathname
  *
@@ -43,12 +58,17 @@ function hasUsableSourceId(sourceId: unknown): sourceId is string | number {
  * generatePathnameFromViewParams([{ viewUid: 'xxx' }, { viewUid: 'yyy' }]) // '/admin/xxx/view/yyy'
  * ```
  */
-export function generatePathnameFromViewParams(viewParams: ViewParams[]): string {
+export function generatePathnameFromViewParams(
+  viewParams: ViewParams[],
+  options: GeneratePathnameFromViewParamsOptions = {},
+): string {
+  const basePath = normalizeBasePath(options.basePath || options.prefix);
+
   if (!viewParams || viewParams.length === 0) {
-    return '/admin';
+    return basePath;
   }
 
-  const segments = ['admin'];
+  const segments = basePath.replace(/^\/+/, '').split('/').filter(Boolean);
 
   viewParams.forEach((viewParam, index) => {
     // 如果不是第一个视图，添加 'view' 关键字
@@ -81,10 +101,12 @@ export class ViewNavigation {
   viewStack: ReadonlyArray<ViewParams>; // 只能通过 setViewStack 修改
   ctx: FlowEngineContext;
   viewParams: ViewParams;
+  private readonly basePath?: string;
 
-  constructor(ctx: FlowEngineContext, viewParams: ViewParams[]) {
+  constructor(ctx: FlowEngineContext, viewParams: ViewParams[], options: ViewNavigationOptions = {}) {
     this.setViewStack(viewParams);
     this.ctx = ctx;
+    this.basePath = options.basePath || options.layoutBasePath;
 
     define(this, {
       viewParams: observable,
@@ -106,7 +128,7 @@ export class ViewNavigation {
     });
 
     // 2. 根据 viewStack 生成新的 pathname
-    const newPathname = generatePathnameFromViewParams(newViewStack);
+    const newPathname = generatePathnameFromViewParams(newViewStack, { basePath: this.getLayoutBasePath() });
 
     // 3. 触发一次跳转。使用 replace 的方式
     this.ctx.router.navigate(newPathname, { replace: true });
@@ -115,7 +137,9 @@ export class ViewNavigation {
   navigateTo(viewParam: ViewParams, opts?: { replace?: boolean; state?: any }) {
     // 1. 基于当前 viewStack 生成一个 pathname
     // 2. 将当前传入的参数转为 path string
-    const newViewPathname = generatePathnameFromViewParams([...this.viewStack, viewParam]);
+    const newViewPathname = generatePathnameFromViewParams([...this.viewStack, viewParam], {
+      basePath: this.getLayoutBasePath(),
+    });
 
     // 3. 与 pathname 拼接成新的 pathname（这里直接使用新生成的 pathname）
     const newPathname = newViewPathname;
@@ -126,7 +150,16 @@ export class ViewNavigation {
 
   back() {
     const prevStack = this.viewStack.slice(0, -1);
-    const prevPath = generatePathnameFromViewParams(prevStack);
+    const prevPath = generatePathnameFromViewParams(prevStack, { basePath: this.getLayoutBasePath() });
     this.ctx.router.navigate(prevPath, { replace: true });
   }
+
+  private getLayoutBasePath() {
+    const routePath = (this.ctx as any).layout?.routePath;
+    return (
+      this.basePath ||
+      (this.ctx as any).layoutRoute?.basePathname ||
+      (routePath?.startsWith('/') ? routePath : '/admin')
+    );
+  }
 }

package/src/views/__tests__/ViewNavigation.test.ts

@@ -146,6 +146,47 @@ describe('ViewNavigation', () => {
 
       expect(mockCtx.router.navigate).toHaveBeenCalledWith('/admin', { replace: true });
     });
+
+    it('should use explicit basePath when navigating back', () => {
+      viewNavigation = new ViewNavigation(mockCtx, [{ viewUid: 'view1' }], { basePath: '/embed' });
+
+      viewNavigation.back();
+
+      expect(mockCtx.router.navigate).toHaveBeenCalledWith('/embed', { replace: true });
+    });
+
+    it('should use layout route basePathname when explicit basePath is absent', () => {
+      mockCtx.layoutRoute = {
+        basePathname: '/mobile',
+      };
+      viewNavigation = new ViewNavigation(mockCtx, [{ viewUid: 'view1' }]);
+
+      viewNavigation.back();
+
+      expect(mockCtx.router.navigate).toHaveBeenCalledWith('/mobile', { replace: true });
+    });
+
+    it('should fall back to layout routePath when explicit basePath is absent', () => {
+      mockCtx.layout = {
+        routePath: '/mobile',
+      };
+      viewNavigation = new ViewNavigation(mockCtx, [{ viewUid: 'view1' }]);
+
+      viewNavigation.back();
+
+      expect(mockCtx.router.navigate).toHaveBeenCalledWith('/mobile', { replace: true });
+    });
+
+    it('should ignore relative layout routePath when runtime basePathname is absent', () => {
+      mockCtx.layout = {
+        routePath: 'public-forms',
+      };
+      viewNavigation = new ViewNavigation(mockCtx, [{ viewUid: 'view1' }]);
+
+      viewNavigation.back();
+
+      expect(mockCtx.router.navigate).toHaveBeenCalledWith('/admin', { replace: true });
+    });
   });
 });
 
@@ -160,6 +201,17 @@ describe('generatePathnameFromViewParams', () => {
     expect(generatePathnameFromViewParams([{ viewUid: 'xxx' }])).toBe('/admin/xxx');
   });
 
+  it('should generate path with custom prefix', () => {
+    expect(generatePathnameFromViewParams([{ viewUid: 'xxx' }], { basePath: '/embed' })).toBe('/embed/xxx');
+    expect(generatePathnameFromViewParams([], { basePath: '/embed' })).toBe('/embed');
+  });
+
+  it('should generate path with nested basePath', () => {
+    expect(generatePathnameFromViewParams([{ viewUid: 'xxx' }], { basePath: '/admin/settings/public-forms' })).toBe(
+      '/admin/settings/public-forms/xxx',
+    );
+  });
+
   it('should generate view with tab', () => {
     expect(generatePathnameFromViewParams([{ viewUid: 'xxx', tabUid: 'yyy' }])).toBe('/admin/xxx/tab/yyy');
   });

package/src/views/__tests__/inheritLayoutContext.test.ts

@@ -0,0 +1,53 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { describe, expect, it } from 'vitest';
+import { FlowContext } from '../../flowContext';
+import { inheritLayoutContextForDetachedView } from '../inheritLayoutContext';
+
+describe('inheritLayoutContextForDetachedView', () => {
+  it('inherits layout context for detached view contexts', () => {
+    const sourceContext = new FlowContext();
+    const engineContext = new FlowContext();
+    const layoutContext = new FlowContext();
+    const viewContext = new FlowContext();
+
+    engineContext.defineProperty('skipAclCheck', { value: false });
+    layoutContext.defineProperty('skipAclCheck', { value: true });
+    sourceContext.defineProperty('engine', {
+      value: {
+        context: engineContext,
+      },
+    });
+    sourceContext.defineProperty('layoutContext', { value: layoutContext });
+
+    viewContext.addDelegate(engineContext);
+    inheritLayoutContextForDetachedView(viewContext, sourceContext);
+
+    expect(viewContext.skipAclCheck).toBe(true);
+  });
+
+  it('does nothing when source context has no layout context', () => {
+    const sourceContext = new FlowContext();
+    const engineContext = new FlowContext();
+    const viewContext = new FlowContext();
+
+    engineContext.defineProperty('skipAclCheck', { value: false });
+    sourceContext.defineProperty('engine', {
+      value: {
+        context: engineContext,
+      },
+    });
+
+    viewContext.addDelegate(engineContext);
+    inheritLayoutContextForDetachedView(viewContext, sourceContext);
+
+    expect(viewContext.skipAclCheck).toBe(false);
+  });
+});

package/src/views/createViewMeta.ts

@@ -15,6 +15,82 @@ import type { FlowView } from './FlowView';
 
 type PopupModelLike = { getStepParams?: (a: string, b: string) => any } | undefined;
 
+function isDefined(value: any) {
+  return value !== undefined && value !== null;
+}
+
+function isSameViewParamValue(left: any, right: any) {
+  if (left === right) return true;
+  if (!isDefined(left) || !isDefined(right)) return false;
+
+  try {
+    return JSON.stringify(left) === JSON.stringify(right);
+  } catch (_) {
+    return String(left) === String(right);
+  }
+}
+
+function getViewStack(view?: FlowView): any[] {
+  const stack = view?.navigation?.viewStack;
+  return Array.isArray(stack) ? stack : [];
+}
+
+function getAnchoredViewStackIndex(view?: FlowView, stack = getViewStack(view)): number {
+  if (!stack.length) return -1;
+
+  const args = view?.inputArgs || {};
+  const navParams = view?.navigation?.viewParams || {};
+  const viewUid = args.viewUid ?? navParams.viewUid;
+
+  if (!viewUid) {
+    return stack.length - 1;
+  }
+
+  const candidates = stack.map((item, index) => ({ item, index })).filter(({ item }) => item?.viewUid === viewUid);
+
+  if (!candidates.length) {
+    return stack.length - 1;
+  }
+
+  const keys = ['filterByTk', 'sourceId', 'tabUid'];
+  let bestIndex = candidates[candidates.length - 1].index;
+  let bestScore = -1;
+
+  for (const { item, index } of candidates) {
+    let score = 0;
+    let matched = true;
+
+    for (const key of keys) {
+      if (!isDefined(args[key])) continue;
+      if (!isSameViewParamValue(item?.[key], args[key])) {
+        matched = false;
+        break;
+      }
+      score += 1;
+    }
+
+    if (!matched) continue;
+    if (score >= bestScore) {
+      bestIndex = index;
+      bestScore = score;
+    }
+  }
+
+  return bestIndex;
+}
+
+function getPopupView(ctx: FlowContext, anchorView?: FlowView) {
+  return anchorView ?? ctx.view;
+}
+
+function isPopupView(view?: FlowView): boolean {
+  if (!view) return false;
+  const stack = getViewStack(view);
+  const openerUids = view?.inputArgs?.openerUids;
+  const hasOpener = Array.isArray(openerUids) && openerUids.length > 0;
+  return getAnchoredViewStackIndex(view, stack) >= 1 || hasOpener;
+}
+
 // 判断是否为普通对象（Plain Object），避免对类实例/代理等进行深度遍历
 function isPlainObject(val: any) {
   if (val === null || typeof val !== 'object') return false;
@@ -79,19 +155,11 @@ function makeMetaFromValue(value: any, title?: string, seen?: WeakSet<any>): any
 export function createPopupMeta(ctx: FlowContext, anchorView?: FlowView): PropertyMetaFactory {
   const t = (k: string) => ctx.t(k);
 
-  const isPopupView = (view?: FlowView): boolean => {
-    if (!view) return false;
-    const stack = Array.isArray(view.navigation?.viewStack) ? view.navigation.viewStack : [];
-    const openerUids = view?.inputArgs?.openerUids;
-    const hasOpener = Array.isArray(openerUids) && openerUids.length > 0;
-    return stack.length >= 2 || hasOpener;
-  };
-
-  const hasPopupNow = (): boolean => isPopupView(anchorView ?? ctx.view);
+  const hasPopupNow = (flowCtx: FlowContext = ctx): boolean => isPopupView(getPopupView(flowCtx, anchorView));
 
   // 统一解析锚定视图下的 RecordRef，避免在设置弹窗等二级视图中被误导
   const resolveRecordRef = async (flowCtx: FlowContext): Promise<RecordRef | undefined> => {
-    const view = anchorView ?? flowCtx.view;
+    const view = getPopupView(flowCtx, anchorView);
     if (!view || !isPopupView(view)) return undefined;
 
     const base = await buildPopupRuntime(flowCtx, view);
@@ -119,11 +187,12 @@ export function createPopupMeta(ctx: FlowContext, anchorView?: FlowView): Proper
   const getParentRecordRef = async (level: number, flowCtx?: FlowContext): Promise<RecordRef | undefined> => {
     try {
       const useCtx = flowCtx || ctx;
-      const nav = useCtx.view?.navigation;
-      const stack = Array.isArray(nav?.viewStack) ? nav.viewStack : [];
-      if (stack.length < 2 || level < 1) return undefined;
-      const idx = stack.length - 1 - level;
-      if (idx < 0) return undefined;
+      const view = getPopupView(useCtx, anchorView);
+      const stack = getViewStack(view);
+      const currentIndex = getAnchoredViewStackIndex(view, stack);
+      if (currentIndex < 1 || level < 1) return undefined;
+      const idx = currentIndex - level;
+      if (idx < 1) return undefined;
       const parent = stack[idx];
       if (!parent?.viewUid) return undefined;
 
@@ -156,9 +225,10 @@ export function createPopupMeta(ctx: FlowContext, anchorView?: FlowView): Proper
 
   const hasParentNow = (level: number): boolean => {
     try {
-      const nav = (anchorView ?? ctx.view)?.navigation;
-      const stack = Array.isArray(nav?.viewStack) ? nav.viewStack : [];
-      return stack.length >= level + 1; // level=1 需要至少2层
+      const view = getPopupView(ctx, anchorView);
+      const stack = getViewStack(view);
+      const currentIndex = getAnchoredViewStackIndex(view, stack);
+      return currentIndex - level >= 1; // level=1 需要至少一个上级弹窗
     } catch (_) {
       return false;
     }
@@ -231,9 +301,10 @@ export function createPopupMeta(ctx: FlowContext, anchorView?: FlowView): Proper
       disabled: () => !hasPopupNow(),
       hidden: () => !hasPopupNow(),
       buildVariablesParams: async (c) => {
-        if (!hasPopupNow()) return undefined;
+        if (!hasPopupNow(c)) return undefined;
         const ref = await resolveRecordRef(c);
-        const inputArgs = c.view?.inputArgs;
+        const view = getPopupView(c, anchorView);
+        const inputArgs = view?.inputArgs;
         type PopupVariableParams = {
           record?: RecordRef;
           sourceRecord?: RecordRef;
@@ -253,9 +324,9 @@ export function createPopupMeta(ctx: FlowContext, anchorView?: FlowView): Proper
 
         // 构建 parent 链（用于服务端解析 ctx.popup.parent[.parent...].record.*）
         try {
-          const nav = c.view?.navigation;
-          const stack = Array.isArray(nav?.viewStack) ? nav.viewStack : [];
-          if (stack.length >= 2) {
+          const stack = getViewStack(view);
+          const currentIndex = getAnchoredViewStackIndex(view, stack);
+          if (currentIndex >= 2) {
             let cur: Record<string, any> = params;
             let level = 1;
             let parentRef = await getParentRecordRef(level, c);
@@ -315,20 +386,21 @@ export function createPopupMeta(ctx: FlowContext, anchorView?: FlowView): Proper
         }
         // 当 view.inputArgs 带有 sourceId + associationName 时，提供“上级记录”变量（基于 sourceId 推断）
         try {
-          const inputArgs = ctx.view?.inputArgs;
+          const view = getPopupView(ctx, anchorView);
+          const inputArgs = view?.inputArgs;
           const srcId = inputArgs?.sourceId;
           let assoc: string | undefined = inputArgs?.associationName;
           let dsKey: string = inputArgs?.dataSourceKey || 'main';
 
           // 兜底：若 associationName 缺失或不含“.”，尝试从当前视图模型的 openView 参数推断
           if (!assoc || typeof assoc !== 'string' || !assoc.includes('.')) {
-            const nav = ctx.view?.navigation;
-            const stack = Array.isArray(nav?.viewStack) ? nav.viewStack : [];
-            const last = stack?.[stack.length - 1];
-            if (last?.viewUid) {
-              let model = ctx?.engine?.getModel(last.viewUid, true) as PopupModelLike;
+            const stack = getViewStack(view);
+            const currentIndex = getAnchoredViewStackIndex(view, stack);
+            const current = currentIndex >= 0 ? stack?.[currentIndex] : undefined;
+            if (current?.viewUid) {
+              let model = ctx?.engine?.getModel(current.viewUid, true) as PopupModelLike;
               if (!model) {
-                model = (await ctx.engine.loadModel({ uid: last.viewUid })) as PopupModelLike;
+                model = (await ctx.engine.loadModel({ uid: current.viewUid })) as PopupModelLike;
               }
               const p = model?.getStepParams?.('popupSettings', 'openView') || {};
               assoc = p?.associationName || assoc;
@@ -406,12 +478,12 @@ interface PopupNode {
 }
 
 export async function buildPopupRuntime(ctx: FlowContext, view: FlowView): Promise<PopupNode | undefined> {
-  const nav = view?.navigation;
-  const stack = Array.isArray(nav?.viewStack) ? nav.viewStack : [];
+  const stack = getViewStack(view);
+  const currentIndex = getAnchoredViewStackIndex(view, stack);
 
   const openerUids = view?.inputArgs?.openerUids;
   const hasOpener = Array.isArray(openerUids) && openerUids.length > 0;
-  const hasStackPopup = stack.length >= 2;
+  const hasStackPopup = currentIndex >= 1;
   const isPopup = hasStackPopup || hasOpener;
   if (!isPopup) return undefined;
 
@@ -457,7 +529,7 @@ export async function buildPopupRuntime(ctx: FlowContext, view: FlowView): Promi
     if (parentNode) node.parent = parentNode;
     return node;
   };
-  const currentNode = await buildNode((view?.navigation?.viewStack?.length || 1) - 1);
+  const currentNode = await buildNode(currentIndex);
   return currentNode;
 }
 

package/src/views/inheritLayoutContext.ts

@@ -0,0 +1,26 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { FlowContext } from '../flowContext';
+
+export function inheritLayoutContextForDetachedView(viewContext: FlowContext, sourceContext: FlowContext) {
+  const layoutContext = sourceContext?.layoutContext;
+  const engineContext = sourceContext?.engine?.context;
+
+  if (!(layoutContext instanceof FlowContext)) {
+    return;
+  }
+
+  if (layoutContext === sourceContext || layoutContext === engineContext) {
+    return;
+  }
+
+  // inheritContext=false 只隔离业务上下文，Layout 运行时上下文仍需要传给弹窗/嵌入视图。
+  viewContext.addDelegate(layoutContext);
+}

package/src/views/useDialog.tsx

@@ -20,6 +20,7 @@ import { FlowEngineProvider } from '../provider';
 import { createViewScopedEngine } from '../ViewScopedFlowEngine';
 import { createViewRecordResolveOnServer, getViewRecordFromParent } from '../utils/variablesParams';
 import { runViewBeforeClose } from './runViewBeforeClose';
+import { inheritLayoutContextForDetachedView } from './inheritLayoutContext';
 
 let uuid = 0;
 
@@ -88,6 +89,7 @@ export function useDialog() {
       ctx.addDelegate(flowContext);
     } else {
       ctx.addDelegate(flowContext.engine.context);
+      inheritLayoutContextForDetachedView(ctx, flowContext);
     }
 
     // 幂等保护：防止 FlowPage 路由清理时二次调用 destroy

package/src/views/useDrawer.tsx

@@ -20,6 +20,7 @@ import { FlowEngineProvider } from '../provider';
 import { createViewScopedEngine } from '../ViewScopedFlowEngine';
 import { createViewRecordResolveOnServer, getViewRecordFromParent } from '../utils/variablesParams';
 import { runViewBeforeClose } from './runViewBeforeClose';
+import { inheritLayoutContextForDetachedView } from './inheritLayoutContext';
 
 export function useDrawer() {
   const holderRef = React.useRef(null);
@@ -117,6 +118,7 @@ export function useDrawer() {
       ctx.addDelegate(flowContext);
     } else {
       ctx.addDelegate(flowContext.engine.context);
+      inheritLayoutContextForDetachedView(ctx, flowContext);
     }
 
     // 幂等保护：防止 FlowPage 路由清理时二次调用 destroy

package/src/views/usePage.tsx

@@ -20,6 +20,7 @@ import { FlowEngineProvider } from '../provider';
 import { createViewScopedEngine } from '../ViewScopedFlowEngine';
 import { createViewRecordResolveOnServer, getViewRecordFromParent } from '../utils/variablesParams';
 import { runViewBeforeClose } from './runViewBeforeClose';
+import { inheritLayoutContextForDetachedView } from './inheritLayoutContext';
 
 let uuid = 0;
 
@@ -223,6 +224,7 @@ export function usePage() {
         ctx.addDelegate(flowContext);
       } else {
         ctx.addDelegate(flowContext.engine.context);
+        inheritLayoutContextForDetachedView(ctx, flowContext);
       }
 
       // 构造 currentPage 实例