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

package/src/views/FlowView.tsx

@@ -11,13 +11,23 @@ import { PopoverProps as AntdPopoverProps } from 'antd';
 import { FlowContext } from '../flowContext';
 import { ViewNavigation } from './ViewNavigation';
 
+export type FlowViewBeforeClosePayload = {
+  result?: any;
+  force?: boolean;
+};
+
+export type FlowViewBeforeCloseHandler = (
+  payload: FlowViewBeforeClosePayload,
+) => Promise<boolean | void> | boolean | void;
+
 export type FlowView = {
   type: 'drawer' | 'popover' | 'dialog' | 'embed';
   inputArgs: any;
   Header: React.FC<{ title?: React.ReactNode; extra?: React.ReactNode }> | null;
   Footer: React.FC<{ children?: React.ReactNode }> | null;
-  close: (result?: any, force?: boolean) => void;
+  close: (result?: any, force?: boolean) => Promise<boolean | void> | boolean | void;
   update: (newConfig: any) => void;
+  beforeClose?: FlowViewBeforeCloseHandler;
   navigation?: ViewNavigation;
   /** 页面的销毁方法 */
   destroy?: () => void;
@@ -74,11 +84,21 @@ export class FlowViewer {
     if (this.types[type]) {
       zIndex += 1;
       const onClose = others.onClose;
+      let zIndexReleased = false;
+      const releaseZIndex = () => {
+        if (!zIndexReleased) {
+          zIndexReleased = true;
+          zIndex -= 1;
+        }
+      };
       const _zIndex = others.zIndex;
       others.onClose = (...args) => {
         onClose?.(...args);
-        zIndex -= 1;
+        releaseZIndex();
       };
+      if (type === 'embed') {
+        others.onOpenCancelled = releaseZIndex;
+      }
       // embed 不能设置过高的 zIndex，会遮挡菜单的折叠按钮图表
       if (type !== 'embed') {
         others.zIndex = _zIndex ?? this.getNextZIndex();

package/src/views/PageComponent.tsx

@@ -24,6 +24,7 @@ export const PageComponent = forwardRef((props: any, ref) => {
     title: _title,
     styles = {},
     zIndex = 4, // 这个默认值是为了防止表格的阴影显示到子页面上面
+    onClose,
   } = mergedProps;
   const closedRef = useRef(false);
   const flowEngine = useFlowEngine();
@@ -86,10 +87,12 @@ export const PageComponent = forwardRef((props: any, ref) => {
             type="text"
             size="small"
             icon={<CloseOutlined />}
-            onClick={() => {
+            onClick={async () => {
               if (!closedRef.current) {
-                closedRef.current = true;
-                props.onClose?.();
+                const closed = await onClose?.();
+                if (closed !== false) {
+                  closedRef.current = true;
+                }
               }
             }}
             style={{
@@ -111,7 +114,7 @@ export const PageComponent = forwardRef((props: any, ref) => {
         {extra && <div>{extra}</div>}
       </div>
     );
-  }, [header, _title, flowEngine.context.themeToken, styles.header, props.onClose]);
+  }, [header, _title, flowEngine.context.themeToken, styles.header, onClose]);
 
   // Footer 组件
   const FooterComponent = useMemo(() => {

package/src/views/ViewNavigation.ts

@@ -26,6 +26,10 @@ function encodeFilterByTk(val: SharedViewParam['filterByTk']): string {
   return encodeURIComponent(String(val));
 }
 
+function hasUsableSourceId(sourceId: unknown): sourceId is string | number {
+  return sourceId !== undefined && sourceId !== null && String(sourceId) !== '';
+}
+
 /**
  * 将 ViewParam 数组转换为 pathname
  *
@@ -65,8 +69,8 @@ export function generatePathnameFromViewParams(viewParams: ViewParams[]): string
         segments.push('filterbytk', encoded);
       }
     }
-    if (viewParam.sourceId) {
-      segments.push('sourceid', viewParam.sourceId);
+    if (hasUsableSourceId(viewParam.sourceId)) {
+      segments.push('sourceid', String(viewParam.sourceId));
     }
   });
 

package/src/views/__tests__/FlowView.usePage.test.tsx

@@ -8,7 +8,7 @@
  */
 
 import React from 'react';
-import { describe, expect, it, beforeEach } from 'vitest';
+import { describe, expect, it, beforeEach, vi } from 'vitest';
 import { render, act, waitFor, screen } from '@testing-library/react';
 import { FlowEngine } from '../../flowEngine';
 import { FlowEngineProvider } from '../../provider';
@@ -167,15 +167,16 @@ describe('FlowViewer zIndex with usePage', () => {
     );
 
     await waitFor(() => expect(api).toBeDefined());
+    const pageApi = api as NonNullable<typeof api>;
 
     await act(async () => {
-      api!.open({ target, content: <div data-testid="page1">Page 1</div> }, engine.context);
+      pageApi.open({ target, content: <div data-testid="page1">Page 1</div> }, engine.context);
     });
     await waitFor(() => expect(screen.getByTestId('page1')).toBeInTheDocument());
 
     // Opening page2 into the global embed container should destroy page1 (replace behavior).
     await act(async () => {
-      api!.open({ target, content: <div data-testid="page2">Page 2</div> }, engine.context);
+      pageApi.open({ target, content: <div data-testid="page2">Page 2</div> }, engine.context);
     });
     await waitFor(() => expect(screen.getByTestId('page2')).toBeInTheDocument());
     expect(screen.queryByTestId('page1')).not.toBeInTheDocument();
@@ -183,4 +184,243 @@ describe('FlowViewer zIndex with usePage', () => {
     unmount();
     document.body.removeChild(target);
   });
+
+  it('keeps active global embed view when replacement beforeClose blocks closing', async () => {
+    let getViewer: () => FlowViewer;
+    const beforeClose = vi.fn().mockResolvedValue(false);
+
+    const target = document.createElement('div');
+    target.id = GLOBAL_EMBED_CONTAINER_ID;
+    document.body.appendChild(target);
+
+    const { unmount } = render(
+      <Wrapper
+        onReady={(fn) => {
+          getViewer = fn;
+        }}
+      />,
+    );
+
+    await waitFor(() => expect(getViewer).toBeDefined());
+    const initialZIndex = getViewer().getNextZIndex();
+
+    let page1: any;
+    await act(async () => {
+      page1 = getViewer().embed({
+        target,
+        content: (currentPage) => {
+          currentPage.beforeClose = beforeClose;
+          return <div data-testid="page1">Page 1</div>;
+        },
+      });
+    });
+
+    await waitFor(() => expect(screen.getByTestId('page1')).toBeInTheDocument());
+    expect(getViewer().getNextZIndex()).toBe(initialZIndex + 1);
+
+    await act(async () => {
+      const page2 = getViewer().embed({ target, content: <div data-testid="page2">Page 2</div> });
+      await page2;
+    });
+
+    expect(beforeClose).toHaveBeenCalledTimes(1);
+    expect(screen.getByTestId('page1')).toBeInTheDocument();
+    expect(screen.queryByTestId('page2')).not.toBeInTheDocument();
+    expect(getViewer().getNextZIndex()).toBe(initialZIndex + 1);
+
+    await act(async () => {
+      page1.destroy();
+    });
+
+    unmount();
+    document.body.removeChild(target);
+  });
+
+  it('opens the replacement view after async beforeClose allows global embed replacement', async () => {
+    let getViewer: () => FlowViewer;
+    const beforeClose = vi.fn().mockResolvedValue(true);
+
+    const target = document.createElement('div');
+    target.id = GLOBAL_EMBED_CONTAINER_ID;
+    document.body.appendChild(target);
+
+    const { unmount } = render(
+      <Wrapper
+        onReady={(fn) => {
+          getViewer = fn;
+        }}
+      />,
+    );
+
+    await waitFor(() => expect(getViewer).toBeDefined());
+
+    await act(async () => {
+      getViewer().embed({
+        target,
+        content: (currentPage) => {
+          currentPage.beforeClose = beforeClose;
+          return <div data-testid="page1">Page 1</div>;
+        },
+      });
+    });
+
+    await waitFor(() => expect(screen.getByTestId('page1')).toBeInTheDocument());
+
+    await act(async () => {
+      getViewer().embed({ target, content: <div data-testid="page2">Page 2</div> });
+    });
+
+    await waitFor(() => expect(screen.getByTestId('page2')).toBeInTheDocument());
+    expect(beforeClose).toHaveBeenCalledTimes(1);
+    expect(screen.queryByTestId('page1')).not.toBeInTheDocument();
+
+    unmount();
+    document.body.removeChild(target);
+  });
+
+  it('runs a pending close only once and allows retry when beforeClose rejects', async () => {
+    let getViewer: () => FlowViewer;
+    let resolveFirstClose: (value: boolean) => void;
+    const beforeClose = vi
+      .fn()
+      .mockImplementationOnce(() => new Promise<boolean>((resolve) => (resolveFirstClose = resolve)))
+      .mockResolvedValueOnce(true);
+
+    const { unmount } = render(
+      <Wrapper
+        onReady={(fn) => {
+          getViewer = fn;
+        }}
+      />,
+    );
+
+    await waitFor(() => expect(getViewer).toBeDefined());
+
+    let page: any;
+    await act(async () => {
+      page = getViewer().embed({
+        content: (currentPage) => {
+          currentPage.beforeClose = beforeClose;
+          return <div data-testid="draft-editor">Draft editor</div>;
+        },
+      });
+    });
+
+    await waitFor(() => expect(screen.getByTestId('draft-editor')).toBeInTheDocument());
+
+    const firstClose = page.close();
+    const secondClose = page.close();
+    expect(firstClose).toBe(secondClose);
+    expect(beforeClose).toHaveBeenCalledTimes(1);
+
+    await act(async () => {
+      resolveFirstClose(false);
+      await firstClose;
+    });
+
+    expect(screen.getByTestId('draft-editor')).toBeInTheDocument();
+
+    await act(async () => {
+      await page.close();
+    });
+
+    expect(beforeClose).toHaveBeenCalledTimes(2);
+    await waitFor(() => expect(screen.queryByTestId('draft-editor')).not.toBeInTheDocument());
+
+    unmount();
+  });
+
+  it('keeps only the latest pending global embed replacement', async () => {
+    let getViewer: () => FlowViewer;
+    let resolveBeforeClose: (value: boolean) => void;
+    const beforeClose = vi.fn(() => new Promise<boolean>((resolve) => (resolveBeforeClose = resolve)));
+
+    const target = document.createElement('div');
+    target.id = GLOBAL_EMBED_CONTAINER_ID;
+    document.body.appendChild(target);
+
+    const { unmount } = render(
+      <Wrapper
+        onReady={(fn) => {
+          getViewer = fn;
+        }}
+      />,
+    );
+
+    await waitFor(() => expect(getViewer).toBeDefined());
+    const initialZIndex = getViewer().getNextZIndex();
+
+    await act(async () => {
+      getViewer().embed({
+        target,
+        content: (currentPage) => {
+          currentPage.beforeClose = beforeClose;
+          return <div data-testid="page1">Page 1</div>;
+        },
+      });
+    });
+
+    await waitFor(() => expect(screen.getByTestId('page1')).toBeInTheDocument());
+
+    const page2 = getViewer().embed({ target, content: <div data-testid="page2">Page 2</div> });
+    const page3 = getViewer().embed({ target, content: <div data-testid="page3">Page 3</div> });
+
+    await act(async () => {
+      resolveBeforeClose(true);
+      await page2;
+    });
+
+    expect(beforeClose).toHaveBeenCalledTimes(1);
+    expect(screen.queryByTestId('page1')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('page2')).not.toBeInTheDocument();
+    await waitFor(() => expect(screen.getByTestId('page3')).toBeInTheDocument());
+    expect(getViewer().getNextZIndex()).toBe(initialZIndex + 1);
+
+    unmount();
+    document.body.removeChild(target);
+  });
+
+  it('keeps the embed close button usable after beforeClose blocks closing', async () => {
+    let getViewer: () => FlowViewer;
+    const beforeClose = vi.fn().mockResolvedValueOnce(false).mockResolvedValueOnce(true);
+
+    const { unmount } = render(
+      <Wrapper
+        onReady={(fn) => {
+          getViewer = fn;
+        }}
+      />,
+    );
+
+    await waitFor(() => expect(getViewer).toBeDefined());
+
+    await act(async () => {
+      getViewer().embed({
+        title: 'Draft editor',
+        content: (currentPage) => {
+          currentPage.beforeClose = beforeClose;
+          return <div data-testid="draft-editor">Draft editor</div>;
+        },
+      });
+    });
+
+    await waitFor(() => expect(screen.getByTestId('draft-editor')).toBeInTheDocument());
+    const closeButton = screen.getByRole('button');
+
+    await act(async () => {
+      closeButton.click();
+    });
+
+    expect(beforeClose).toHaveBeenCalledTimes(1);
+    expect(screen.getByTestId('draft-editor')).toBeInTheDocument();
+
+    await act(async () => {
+      closeButton.click();
+    });
+
+    expect(beforeClose).toHaveBeenCalledTimes(2);
+    await waitFor(() => expect(screen.queryByTestId('draft-editor')).not.toBeInTheDocument());
+
+    unmount();
+  });
 });

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

@@ -0,0 +1,30 @@
+/**
+ * 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, vi } from 'vitest';
+import { runViewBeforeClose } from '../runViewBeforeClose';
+
+describe('runViewBeforeClose', () => {
+  it('returns true when no beforeClose handler is configured', async () => {
+    await expect(runViewBeforeClose({} as any, { force: false })).resolves.toBe(true);
+  });
+
+  it('skips beforeClose handler for force close', async () => {
+    const beforeClose = vi.fn();
+
+    await expect(runViewBeforeClose({ beforeClose } as any, { force: true })).resolves.toBe(true);
+    expect(beforeClose).not.toHaveBeenCalled();
+  });
+
+  it('returns false when beforeClose handler blocks the close', async () => {
+    const beforeClose = vi.fn().mockResolvedValue(false);
+
+    await expect(runViewBeforeClose({ beforeClose } as any, { force: false })).resolves.toBe(false);
+  });
+});

package/src/views/__tests__/useDialog.closeDestroy.test.tsx

@@ -26,6 +26,7 @@ vi.mock('../../ViewScopedFlowEngine', () => ({
   createViewScopedEngine: (engine) => ({
     context: new FlowContext(),
     unlinkFromStack: vi.fn(),
+    setDestroyView: vi.fn(),
     // mimic real view stack linkage: previousEngine points to the last engine in chain
     previousEngine: (engine as any)?.nextEngine || engine,
   }),
@@ -75,40 +76,40 @@ describe('useDialog - close/destroy logic', () => {
     return api;
   };
 
-  it('should call destroy (and thus closeFunc) when close is called without preventClose', () => {
+  it('should call destroy (and thus closeFunc) when close is called without preventClose', async () => {
     const api = renderUseDialog();
     const flowContext = createMockFlowContext();
 
     const dialog = api.open({}, flowContext);
 
-    dialog.close();
+    await dialog.close();
 
     expect(mockCloseFunc).toHaveBeenCalled();
   });
 
-  it('should not call destroy (and thus closeFunc) when close is called with preventClose=true', () => {
+  it('should not call destroy (and thus closeFunc) when close is called with preventClose=true', async () => {
     const api = renderUseDialog();
     const flowContext = createMockFlowContext();
 
     const dialog = api.open({ preventClose: true }, flowContext);
 
-    dialog.close();
+    await dialog.close();
 
     expect(mockCloseFunc).not.toHaveBeenCalled();
   });
 
-  it('should call destroy (and thus closeFunc) when close is called with preventClose=true but force=true', () => {
+  it('should call destroy (and thus closeFunc) when close is called with preventClose=true but force=true', async () => {
     const api = renderUseDialog();
     const flowContext = createMockFlowContext();
 
     const dialog = api.open({ preventClose: true }, flowContext);
 
-    dialog.close(undefined, true);
+    await dialog.close(undefined, true);
 
     expect(mockCloseFunc).toHaveBeenCalled();
   });
 
-  it('should delegate to navigation.back when triggerByRouter is true', () => {
+  it('should delegate to navigation.back when triggerByRouter is true', async () => {
     const api = renderUseDialog();
     const flowContext = createMockFlowContext();
     const backMock = vi.fn();
@@ -125,25 +126,25 @@ describe('useDialog - close/destroy logic', () => {
       flowContext,
     );
 
-    dialog.close();
+    await dialog.close();
 
     expect(backMock).toHaveBeenCalled();
     // Should not call destroy directly, let router handle it
     expect(mockCloseFunc).not.toHaveBeenCalled();
   });
 
-  it('should emit view activated event on opener engine', () => {
+  it('should emit view activated event on opener engine', async () => {
     const api = renderUseDialog();
     const flowContext = createMockFlowContext();
     const emitSpy = flowContext.engine.emitter.emit;
 
     const dialog = api.open({ inputArgs: { viewUid: 'child-view' } }, flowContext);
 
-    dialog.close();
+    await dialog.close();
     expect(emitSpy).toHaveBeenCalledWith('view:activated', expect.anything());
   });
 
-  it('should emit view events on immediate opener engine (previousEngine) when present', () => {
+  it('should emit view events on immediate opener engine (previousEngine) when present', async () => {
     const api = renderUseDialog();
     const flowContext = createMockFlowContext();
     const rootEmitSpy = flowContext.engine.emitter.emit;
@@ -152,7 +153,7 @@ describe('useDialog - close/destroy logic', () => {
 
     const dialog = api.open({ inputArgs: { viewUid: 'child-view' } }, flowContext);
 
-    dialog.close();
+    await dialog.close();
     expect(openerEmitSpy).toHaveBeenCalledWith('view:activated', expect.anything());
     expect(rootEmitSpy).not.toHaveBeenCalledWith('view:activated', expect.anything());
   });

package/src/views/runViewBeforeClose.ts

@@ -0,0 +1,19 @@
+/**
+ * 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 type { FlowView, FlowViewBeforeClosePayload } from './FlowView';
+
+export async function runViewBeforeClose(view: FlowView, payload: FlowViewBeforeClosePayload): Promise<boolean> {
+  if (payload.force) {
+    return true;
+  }
+
+  const result = await view.beforeClose?.(payload);
+  return result !== false;
+}

package/src/views/useDialog.tsx

@@ -19,6 +19,7 @@ import { VIEW_ACTIVATED_EVENT, bumpViewActivatedVersion, resolveOpenerEngine } f
 import { FlowEngineProvider } from '../provider';
 import { createViewScopedEngine } from '../ViewScopedFlowEngine';
 import { createViewRecordResolveOnServer, getViewRecordFromParent } from '../utils/variablesParams';
+import { runViewBeforeClose } from './runViewBeforeClose';
 
 let uuid = 0;
 
@@ -89,12 +90,18 @@ export function useDialog() {
       ctx.addDelegate(flowContext.engine.context);
     }
 
+    // 幂等保护：防止 FlowPage 路由清理时二次调用 destroy
+    let destroyed = false;
+
     // 构造 currentDialog 实例
     const currentDialog = {
       type: 'dialog' as const,
       inputArgs: config.inputArgs || {},
       preventClose: !!config.preventClose,
+      beforeClose: undefined,
       destroy: (result?: any) => {
+        if (destroyed) return;
+        destroyed = true;
         config.onClose?.();
         dialogRef.current?.destroy();
         closeFunc?.();
@@ -107,18 +114,24 @@ export function useDialog() {
         scopedEngine.unlinkFromStack();
       },
       update: (newConfig) => dialogRef.current?.update(newConfig),
-      close: (result?: any, force?: boolean) => {
+      close: async (result?: any, force?: boolean) => {
         if (config.preventClose && !force) {
-          return;
+          return false;
+        }
+
+        const shouldClose = await runViewBeforeClose(currentDialog, { result, force });
+        if (!shouldClose) {
+          return false;
         }
 
         if (config.triggerByRouter && config.inputArgs?.navigation?.back) {
           // 交由路由系统来销毁当前视图
           config.inputArgs.navigation.back();
-          return;
+          return true;
         }
 
         currentDialog.destroy(result);
+        return true;
       },
       Footer: FooterComponent,
       Header: HeaderComponent,
@@ -140,6 +153,15 @@ export function useDialog() {
       get: () => currentDialog,
       resolveOnServer: createViewRecordResolveOnServer(ctx, () => getViewRecordFromParent(flowContext, ctx)),
     });
+    // 注册视图销毁回调，供外部（如 afterSuccess）通过引擎栈遍历来关闭多层弹窗。
+    // 对路由触发的弹窗：先 navigation.back() 清理 URL（replace 方式），再 destroy() 立即移除元素；
+    // 对非路由弹窗：直接 destroy()。destroy() 已做幂等保护，FlowPage 后续清理不会重复执行。
+    scopedEngine.setDestroyView(() => {
+      if (config.triggerByRouter && config.inputArgs?.navigation?.back) {
+        config.inputArgs.navigation.back();
+      }
+      currentDialog.destroy();
+    });
     // 顶层 popup 变量：弹窗记录/数据源/上级弹窗链（去重封装）
     registerPopupVariable(ctx, currentDialog);
     // 内部组件，在 Provider 内部计算 content

package/src/views/useDrawer.tsx

@@ -19,6 +19,7 @@ import { VIEW_ACTIVATED_EVENT, bumpViewActivatedVersion, resolveOpenerEngine } f
 import { FlowEngineProvider } from '../provider';
 import { createViewScopedEngine } from '../ViewScopedFlowEngine';
 import { createViewRecordResolveOnServer, getViewRecordFromParent } from '../utils/variablesParams';
+import { runViewBeforeClose } from './runViewBeforeClose';
 
 export function useDrawer() {
   const holderRef = React.useRef(null);
@@ -118,12 +119,18 @@ export function useDrawer() {
       ctx.addDelegate(flowContext.engine.context);
     }
 
+    // 幂等保护：防止 FlowPage 路由清理时二次调用 destroy
+    let destroyed = false;
+
     // 构造 currentDrawer 实例
     const currentDrawer = {
       type: 'drawer' as const,
       inputArgs: config.inputArgs || {},
       preventClose: !!config.preventClose,
+      beforeClose: undefined,
       destroy: (result?: any) => {
+        if (destroyed) return;
+        destroyed = true;
         config.onClose?.();
         drawerRef.current?.destroy();
         closeFunc?.();
@@ -136,18 +143,24 @@ export function useDrawer() {
         scopedEngine.unlinkFromStack();
       },
       update: (newConfig) => drawerRef.current?.update(newConfig),
-      close: (result?: any, force?: boolean) => {
+      close: async (result?: any, force?: boolean) => {
         if (config.preventClose && !force) {
-          return;
+          return false;
+        }
+
+        const shouldClose = await runViewBeforeClose(currentDrawer, { result, force });
+        if (!shouldClose) {
+          return false;
         }
 
         if (config.triggerByRouter && config.inputArgs?.navigation?.back) {
           // 交由路由系统来销毁当前视图
           config.inputArgs.navigation.back();
-          return;
+          return true;
         }
 
         currentDrawer.destroy(result);
+        return true;
       },
       Footer: FooterComponent,
       Header: HeaderComponent,
@@ -169,6 +182,15 @@ export function useDrawer() {
       get: () => currentDrawer,
       resolveOnServer: createViewRecordResolveOnServer(ctx, () => getViewRecordFromParent(flowContext, ctx)),
     });
+    // 注册视图销毁回调，供外部（如 afterSuccess）通过引擎栈遍历来关闭多层弹窗。
+    // 对路由触发的弹窗：先 navigation.back() 清理 URL（replace 方式），再 destroy() 立即移除元素；
+    // 对非路由弹窗：直接 destroy()。destroy() 已做幂等保护，FlowPage 后续清理不会重复执行。
+    scopedEngine.setDestroyView(() => {
+      if (config.triggerByRouter && config.inputArgs?.navigation?.back) {
+        config.inputArgs.navigation.back();
+      }
+      currentDrawer.destroy();
+    });
     // 顶层 popup 变量：弹窗记录/数据源/上级弹窗链（去重封装）
     registerPopupVariable(ctx, currentDrawer);