@nocobase/client-v2 2.1.36 → 2.1.38

package/src/flow/models/blocks/form/value-runtime/rules.ts

@@ -8,7 +8,14 @@
  */
 
 import { isObservable, reaction, toJS } from '@formily/reactive';
-import { FlowContext, FlowModel, isRunJSValue, normalizeRunJSValue, runjsWithSafeGlobals } from '@nocobase/flow-engine';
+import {
+  FlowContext,
+  FlowModel,
+  isRunJSValue,
+  normalizeRunJSValue,
+  runjsWithSafeGlobals,
+  type ResolveJsonTemplateOptions,
+} from '@nocobase/flow-engine';
 import { getValuesByPath } from '@nocobase/shared';
 import _ from 'lodash';
 import { dayjs } from '@nocobase/utils/client';
@@ -49,6 +56,7 @@ type RuntimeRule = {
   getValue: () => any;
   getCondition?: () => any;
   getContext: () => any;
+  getContractModelUid?: () => string | undefined;
 };
 
 type ObservableBinding = {
@@ -83,8 +91,18 @@ type ToManyAggregateSourceInfo = {
   lastWrite?: FormValueWriteMeta;
 };
 
+type RuntimeItemChain = {
+  index?: number;
+  length?: number;
+  __is_new__?: boolean;
+  __is_stored__?: boolean;
+  value: unknown;
+  parentItem?: RuntimeItemChain;
+};
+
 export type RuleEngineOptions = {
   getBlockModelUid: () => string;
+  getAssignRulesModelUid: () => string | undefined;
   getActionName: () => string | undefined;
   getBlockContext: () => any;
   getEngine: () => any;
@@ -208,6 +226,7 @@ export class RuleEngine {
         getValue: () => template?.value,
         getCondition: () => template?.condition,
         getContext: () => this.options.getBlockContext(),
+        getContractModelUid: this.options.getAssignRulesModelUid,
       };
 
       this.rules.set(id, { rule, state: { deps: new Set(), depDisposers: [], runSeq: 0, scheduledAtWriteSeq: 0 } });
@@ -545,6 +564,7 @@ export class RuleEngine {
           getValue: () => template?.value,
           getCondition: () => template?.condition,
           getContext: () => this.options.getBlockContext(),
+          getContractModelUid: this.options.getAssignRulesModelUid,
         };
 
         this.rules.set(id, { rule, state: { deps: new Set(), depDisposers: [], runSeq: 0, scheduledAtWriteSeq: 0 } });
@@ -913,6 +933,7 @@ export class RuleEngine {
           getValue: () => template?.value,
           getCondition: () => template?.condition,
           getContext: () => model?.context,
+          getContractModelUid: this.options.getAssignRulesModelUid,
         };
 
         this.rules.set(id, { rule, state: { deps: new Set(), depDisposers: [], runSeq: 0, scheduledAtWriteSeq: 0 } });
@@ -1662,7 +1683,7 @@ export class RuleEngine {
       }
     }
 
-    const evalCtx = this.createRuleEvaluationContext(baseCtx, collector, targetNamePath);
+    const evalCtx = this.createRuleEvaluationContext(baseCtx, collector, targetNamePath, rule.getContractModelUid?.());
     return { collector, evalCtx, rawValue, isRunJS };
   }
 
@@ -2001,7 +2022,12 @@ export class RuleEngine {
     return canOverwrite;
   }
 
-  private createRuleEvaluationContext(baseCtx: any, collector: DepCollector, targetNamePath: NamePath | null) {
+  private createRuleEvaluationContext(
+    baseCtx: any,
+    collector: DepCollector,
+    targetNamePath: NamePath | null,
+    contractModelUid?: string,
+  ) {
     const trackingFormValues = this.options.createTrackingFormValues(collector);
     const ctx: any = new FlowContext();
     try {
@@ -2021,12 +2047,19 @@ export class RuleEngine {
     }
 
     const delegatedResolveJsonTemplate =
-      typeof ctx.resolveJsonTemplate === 'function' ? ctx.resolveJsonTemplate.bind(ctx) : undefined;
+      typeof ctx.resolveJsonTemplate === 'function'
+        ? (ctx.resolveJsonTemplate.bind(ctx) as (
+            template: unknown,
+            options?: ResolveJsonTemplateOptions,
+          ) => Promise<unknown>)
+        : undefined;
     ctx.defineMethod('resolveJsonTemplate', async (template: unknown) => {
       const tokenStore = this.createLocalTemplateTokenStore();
       const localResolved = this.resolveLocalFormValuesTemplates(baseCtx, template, collector, tokenStore);
       const nextTemplate = localResolved.matched ? localResolved.value : template;
-      const resolved = delegatedResolveJsonTemplate ? await delegatedResolveJsonTemplate(nextTemplate) : nextTemplate;
+      const resolved = delegatedResolveJsonTemplate
+        ? await delegatedResolveJsonTemplate(nextTemplate, contractModelUid ? { contractModelUid } : undefined)
+        : nextTemplate;
       return this.restoreLocalTemplateTokens(resolved, tokenStore);
     });
 
@@ -2038,7 +2071,7 @@ export class RuleEngine {
     // - parentItem：上级项（同结构，可链式 parentItem.parentItem...）
     // 计算顺序：
     // 1) 优先按 targetNamePath 从 formValues 构建“关联链 item”
-    // 2) 若无法构建（例如目标字段是顶层路径），回退到上游显式注入的 baseCtx.item
+    // 2) 若无法构建（例如目标字段是顶层非关联字段），回退到上游显式注入的 baseCtx.item
     //    （如 PopupSubTable 新增弹窗传入的 parentItem 链）
     let itemCached: any;
     let itemCachedReady = false;
@@ -2209,9 +2242,23 @@ export class RuleEngine {
         parentItem,
       };
     };
-    const defaultRoot = buildNode(trackingFormValues, undefined, undefined, undefined);
-    // item 仅用于“关系字段的子路径”场景；
-    // 顶层字段/非关联嵌套对象字段应使用 formValues。
+    const blockCtx = this.options.getBlockContext();
+    const formRootItem = (() => {
+      try {
+        const item = blockCtx?.item as RuntimeItemChain | undefined;
+        if (!item || typeof item !== 'object') return undefined;
+        return item.value === blockCtx?.formValues ? item : undefined;
+      } catch {
+        return undefined;
+      }
+    })();
+    const defaultRoot = {
+      ...buildNode(trackingFormValues, formRootItem?.index, formRootItem?.length, formRootItem?.parentItem),
+      __is_new__: formRootItem?.__is_new__ ?? trackingFormValues?.__is_new__,
+      __is_stored__: formRootItem?.__is_stored__ ?? trackingFormValues?.__is_stored__,
+    };
+    // item 用于“关系字段目标或其子路径”场景；
+    // 顶层非关联字段/非关联嵌套对象字段应使用 formValues。
     if (!targetNamePath || !Array.isArray(targetNamePath) || !targetNamePath.length) return undefined;
     if (!rootCollection?.getField) return undefined;
 
@@ -2219,7 +2266,9 @@ export class RuleEngine {
     const prefix: NamePath = [];
     let collection = rootCollection;
 
-    for (let i = 0; i < targetNamePath.length - 1; i++) {
+    // The target itself can be an association. Keep that final association in the item chain so
+    // ctx.item.parentItem continues to point at the containing row instead of skipping directly to the form root.
+    for (let i = 0; i < targetNamePath.length; i++) {
       const seg = targetNamePath[i];
       if (typeof seg !== 'string') break;
 
@@ -2231,9 +2280,12 @@ export class RuleEngine {
 
       if (toMany) {
         const next = targetNamePath[i + 1];
-        if (typeof next !== 'number') break;
-        prefix.push(next);
-        i += 1;
+        if (typeof next === 'number') {
+          prefix.push(next);
+          i += 1;
+        } else if (i !== targetNamePath.length - 1) {
+          break;
+        }
       }
 
       const targetCollection = field?.targetCollection;
@@ -2248,9 +2300,11 @@ export class RuleEngine {
       const assocEntry = assocEntries[idx];
       const value = _.get(trackingFormValues, assocEntry.path);
       const lastSeg = assocEntry.path[assocEntry.path.length - 1];
-      const index = assocEntry.toMany && typeof lastSeg === 'number' ? lastSeg : undefined;
+      const isIndexedToManyItem = assocEntry.toMany && typeof lastSeg === 'number';
+      const index = isIndexedToManyItem ? lastSeg : undefined;
       const length = (() => {
         if (!assocEntry.toMany) return undefined;
+        if (!isIndexedToManyItem) return Array.isArray(value) ? value.length : undefined;
         // assocEntry.path: [..., associationKey, rowIndex]
         const listPath = assocEntry.path.slice(0, -1);
         const list = _.get(trackingFormValues, listPath);

package/src/flow/models/blocks/form/value-runtime/runtime.ts

@@ -81,6 +81,10 @@ export class FormValueRuntime {
 
     this.ruleEngine = new RuleEngine({
       getBlockModelUid: () => String(this.model?.uid),
+      getAssignRulesModelUid: () => {
+        const grid = this.model?.subModels?.grid;
+        return !Array.isArray(grid) && grid?.uid ? String(grid.uid) : undefined;
+      },
       getActionName: () => this.model?.getAclActionName?.() ?? this.model?.context?.actionName,
       getBlockContext: () => this.model?.context,
       getEngine: () => this.model?.context?.engine,
@@ -142,13 +146,32 @@ export class FormValueRuntime {
     return this.getForm().getFieldsValue(true);
   }
 
-  private toMirrorSnapshot(value: any) {
-    const raw = isObservable(value) ? toJS(value) : value;
-    return _.cloneDeepWith(raw, (item) => {
-      if (!item || typeof item !== 'object') return undefined;
-      if (Array.isArray(item) || _.isPlainObject(item)) return undefined;
-      return item;
-    });
+  private toMirrorSnapshot<T>(value: T): T {
+    const cloneValue = (input: unknown): unknown =>
+      _.cloneDeepWith(input, (item: unknown) => {
+        if (isObservable(item)) {
+          const plainItem = toJS(item);
+          if (plainItem !== item) return cloneValue(plainItem);
+        }
+
+        // Tracking form-value array proxies hide `constructor`, while Lodash's array
+        // clone relies on it being callable.
+        if (Array.isArray(item) && typeof item.constructor !== 'function') {
+          const plainArray = new Array(item.length);
+          for (let index = 0; index < item.length; index++) {
+            if (Object.hasOwn(item, index)) {
+              plainArray[index] = cloneValue(item[index]);
+            }
+          }
+          return plainArray;
+        }
+
+        if (!item || typeof item !== 'object') return undefined;
+        if (Array.isArray(item) || _.isPlainObject(item)) return undefined;
+        return item;
+      });
+
+    return cloneValue(value) as T;
   }
 
   canApplyDefaultValuePatch(namePath: NamePath, resolved: any) {
@@ -892,11 +915,12 @@ export class FormValueRuntime {
       const changedPaths: NamePath[] = [];
 
       if (!Array.isArray(patch)) {
-        const patchEntries = Object.entries(patch || {}).filter(([pathKey, rawValue]) => {
-          if (shouldSkipByLinkageScope(pathKey)) return false;
-          const value = isObservable(rawValue) ? toJS(rawValue) : rawValue;
-          return !_.isEqual(this.getFormValueAtPath([pathKey]), value);
-        });
+        const patchEntries = Object.entries(patch || {})
+          .map(([pathKey, rawValue]) => [pathKey, this.toMirrorSnapshot(rawValue)] as const)
+          .filter(([pathKey, value]) => {
+            if (shouldSkipByLinkageScope(pathKey)) return false;
+            return !_.isEqual(this.getFormValueAtPath([pathKey]), value);
+          });
         const patchToApply = Object.fromEntries(patchEntries);
         const patchKeys = patchEntries.map(([pathKey]) => pathKey);
         if (!patchKeys.length) {
@@ -907,8 +931,7 @@ export class FormValueRuntime {
         }
         this.suppressFormCallbackDepth++;
         try {
-          for (const [pathKey, rawValue] of patchEntries) {
-            const value = isObservable(rawValue) ? toJS(rawValue) : rawValue;
+          for (const [pathKey, value] of patchEntries) {
             if (typeof form.setFieldValue === 'function') {
               form.setFieldValue(pathKey, value);
             } else if (typeof (form as any).setFields === 'function') {
@@ -969,7 +992,7 @@ export class FormValueRuntime {
         const namePath = this.resolveNamePath(callerCtx, item.path);
         const pathKey = namePathToPathKey(namePath);
         const rawValue = item.value;
-        const value = isObservable(rawValue) ? toJS(rawValue) : rawValue;
+        const value = this.toMirrorSnapshot(rawValue);
 
         if (shouldSkipByLinkageScope(pathKey)) continue;
 
@@ -1108,17 +1131,18 @@ export class FormValueRuntime {
     if (!form) return;
     if (source === 'override' && this.findUserEditedHit(pathKey)) return;
 
+    const value = this.toMirrorSnapshot(nextValue);
     const prevValue = _.get(this.valuesMirror, namePath);
-    if (_.isEqual(prevValue, nextValue)) return;
+    if (_.isEqual(prevValue, value)) return;
 
     this.writeSeq += 1;
     const writeSeq = this.writeSeq;
 
     this.suppressFormCallbackDepth++;
     try {
-      form.setFieldValue?.(namePath, nextValue);
-      _.set(this.valuesMirror, namePath, this.toMirrorSnapshot(nextValue));
-      this.syncMountedFieldModelValue(namePath, nextValue);
+      form.setFieldValue?.(namePath, value);
+      _.set(this.valuesMirror, namePath, this.toMirrorSnapshot(value));
+      this.syncMountedFieldModelValue(namePath, value);
       this.bumpChangeTick();
     } finally {
       this.suppressFormCallbackDepth--;

package/src/flow/models/fields/AssociationFieldModel/PopupSubTableFieldModel/PopupSubTableFieldModel.tsx

@@ -28,6 +28,7 @@ import { observer } from '@formily/reactive-react';
 import React, { useEffect, useMemo, useState, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { buildRecordPickerPopupContextInputArgs, RecordPickerContent } from '../RecordPickerFieldModel';
+import { buildOpenerUids } from '../recordSelectShared';
 import { AssociationFieldModel } from '../AssociationFieldModel';
 import { adjustColumnOrder } from '../../../blocks/table/utils';
 import { isSubTableColumnFieldComponentContext } from '../SubTableFieldModel/SubTableColumnModel';
@@ -653,6 +654,11 @@ PopupSubTableFieldModel.registerFlow({
         const parentItemOptions = ctx?.getPropertyOptions?.('item');
         const itemIndex = Array.isArray(ctx.model?.props?.value) ? ctx.model.props.value.length : 0;
         const itemLength = itemIndex + 1;
+        const associationName = ctx.collectionField?.resourceName;
+        const sourceId = parentItem?.value
+          ? ctx.collectionField?.collection?.getFilterByTK?.(parentItem.value)
+          : undefined;
+        const openerUids = buildOpenerUids(ctx, ctx.inputArgs);
         ctx.viewer.open({
           type: openMode,
           width: sizeToWidthMap[openMode][size],
@@ -663,12 +669,14 @@ PopupSubTableFieldModel.registerFlow({
             scene: 'subForm',
             dataSourceKey: ctx.collection.dataSourceKey,
             collectionName: ctx.collectionField?.target,
+            ...(associationName && sourceId != null ? { associationName, sourceId } : {}),
             collectionField: ctx.collectionField,
             parentItem,
             parentItemMeta: parentItemOptions?.meta,
             parentItemResolver: parentItemOptions?.resolveOnServer,
             itemIndex,
             itemLength,
+            openerUids,
           },
           content: () => <EditFormContent model={ctx.model} scene="create" />,
           styles: {

package/src/flow/models/fields/AssociationFieldModel/PopupSubTableFieldModel/__tests__/popupContext.test.ts

@@ -0,0 +1,120 @@
+/**
+ * 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 { PopupSubTableFieldModel } from '../PopupSubTableFieldModel';
+import { PopupSubTableEditActionModel } from '../actions/PopupSubTableEditActionModel';
+
+function getOpenViewHandler(modelClass: typeof PopupSubTableFieldModel | typeof PopupSubTableEditActionModel) {
+  const flow = modelClass.globalFlowRegistry.getFlow('popupSettings');
+  const step = flow?.getStep('openView');
+  const handler = step?.serialize().handler;
+
+  if (!handler) {
+    throw new Error('popupSettings.openView handler is not registered');
+  }
+
+  return handler;
+}
+
+function createContext(record?: Record<string, unknown>, parentRecord: Record<string, unknown> = { id: 1 }) {
+  const open = vi.fn();
+  const sourceCollection = {
+    getFilterByTK: vi.fn((sourceRecord: Record<string, unknown>) => sourceRecord.id),
+  };
+  const model = {
+    uid: 'popup-subtable-uid',
+    props: {
+      value: record ? [record] : [],
+    },
+    context: {
+      inputArgs: {},
+    },
+    flowEngine: {
+      context: {
+        themeToken: {
+          colorBgLayout: '#fff',
+        },
+      },
+    },
+  };
+
+  return {
+    open,
+    context: {
+      inputArgs: {},
+      item: {
+        value: parentRecord,
+      },
+      view: {
+        inputArgs: {
+          viewUid: 'parent-popup-uid',
+          openerUids: ['root-page-uid'],
+        },
+      },
+      viewer: { open },
+      layoutContentElement: {},
+      model,
+      associationModel: model,
+      collection: {
+        dataSourceKey: 'main',
+        filterTargetKey: 'id',
+      },
+      collectionField: {
+        target: 'roles',
+        resourceName: 'users.roles',
+        collection: sourceCollection,
+      },
+      record,
+      getFormValues: () => ({ id: 1 }),
+      getPropertyOptions: () => undefined,
+    },
+  };
+}
+
+describe('PopupSubTable popup context', () => {
+  it('passes popup and parent record context to the add-new popup', () => {
+    const { context, open } = createContext();
+    const handler = getOpenViewHandler(PopupSubTableFieldModel);
+
+    handler(context, { mode: 'drawer', size: 'medium' });
+
+    expect(open).toHaveBeenCalledOnce();
+    expect(open.mock.calls[0][0].inputArgs).toMatchObject({
+      openerUids: ['root-page-uid', 'parent-popup-uid'],
+      associationName: 'users.roles',
+      sourceId: 1,
+    });
+  });
+
+  it('passes popup and parent record context to the edit popup', () => {
+    const { context, open } = createContext({ id: 2, name: 'Member' });
+    const handler = getOpenViewHandler(PopupSubTableEditActionModel);
+
+    handler(context, { mode: 'dialog', size: 'medium' });
+
+    expect(open).toHaveBeenCalledOnce();
+    expect(open.mock.calls[0][0].inputArgs).toMatchObject({
+      openerUids: ['root-page-uid', 'parent-popup-uid'],
+      associationName: 'users.roles',
+      sourceId: 1,
+    });
+  });
+
+  it('does not expose a parent record reference before the parent record is persisted', () => {
+    const { context, open } = createContext(undefined, { nickname: 'Draft user' });
+    const handler = getOpenViewHandler(PopupSubTableFieldModel);
+
+    handler(context, { mode: 'drawer', size: 'medium' });
+
+    expect(open).toHaveBeenCalledOnce();
+    expect(open.mock.calls[0][0].inputArgs).not.toHaveProperty('associationName');
+    expect(open.mock.calls[0][0].inputArgs).not.toHaveProperty('sourceId');
+  });
+});

package/src/flow/models/fields/AssociationFieldModel/PopupSubTableFieldModel/actions/PopupSubTableEditActionModel.tsx

@@ -17,6 +17,7 @@ import { capitalize } from 'lodash';
 import '../../../../base/ActionModel';
 import { ActionModel, ActionWithoutPermission } from '../../../../base/ActionModelCore';
 import { SkeletonFallback } from '../../../../../components/SkeletonFallback';
+import { buildOpenerUids } from '../../recordSelectShared';
 import { bindPopupSubTableBeforeClose } from './popupSubTableBeforeClose';
 
 function FieldWithoutPermissionPlaceholder({ targetModel, children }) {
@@ -29,7 +30,7 @@ function FieldWithoutPermissionPlaceholder({ targetModel, children }) {
     const dataSourcePrefix = `${t(dataSource.displayName || dataSource.key)} > `;
     const collectionPrefix = collection ? `${t(collection.title) || collection.name || collection.tableName} > ` : '';
     return `${dataSourcePrefix}${collectionPrefix}${name}`;
-  }, []);
+  }, [collection, dataSource.displayName, dataSource.key, name, t]);
   const { actionName } = fieldModel.forbidden || {};
   const messageValue = useMemo(() => {
     return t(
@@ -39,7 +40,7 @@ function FieldWithoutPermissionPlaceholder({ targetModel, children }) {
         actionName: t(capitalize(actionName)),
       },
     ).replaceAll('>', '>');
-  }, [nameValue, t]);
+  }, [actionName, nameValue, t]);
   return <Tooltip title={messageValue}>{children}</Tooltip>;
 }
 
@@ -347,6 +348,11 @@ PopupSubTableEditActionModel.registerFlow({
             return undefined;
           }
         })();
+        const associationName = ctx.collectionField?.resourceName;
+        const sourceId = parentItem?.value
+          ? ctx.collectionField?.collection?.getFilterByTK?.(parentItem.value)
+          : undefined;
+        const openerUids = buildOpenerUids(ctx, ctx.inputArgs);
         ctx.viewer.open({
           type: openMode,
           width: sizeToWidthMap[openMode][size],
@@ -357,6 +363,7 @@ PopupSubTableEditActionModel.registerFlow({
             scene: 'subForm',
             dataSourceKey: ctx.collection.dataSourceKey,
             collectionName: ctx.collectionField?.target,
+            ...(associationName && sourceId != null ? { associationName, sourceId } : {}),
             collectionField: ctx.collectionField,
             record: ctx.record,
             parentItem,
@@ -364,6 +371,7 @@ PopupSubTableEditActionModel.registerFlow({
             parentItemResolver: parentItemOptions?.resolveOnServer,
             itemIndex,
             itemLength,
+            openerUids,
           },
           content: () => <EditFormContent model={ctx.model} />,
           styles: {

package/src/flow/models/fields/AssociationFieldModel/__tests__/RecordPickerFieldModel.itemContext.test.ts

@@ -243,6 +243,52 @@ describe('RecordPickerFieldModel item context', () => {
     expect(associationOpts.serverOnlyWhenContextParams).toBe(true);
   });
 
+  it('builds whole-association descriptors for current and recursive parent item values', async () => {
+    const people = {
+      name: 'people',
+      dataSourceKey: 'main',
+      filterTargetKey: 'id',
+      getFields: () => [],
+      getField: () => undefined,
+    } as any;
+    const owner = {
+      name: 'owner',
+      target: 'people',
+      targetCollection: people,
+      isAssociationField: () => true,
+    } as any;
+    const collection = {
+      name: 'tasks',
+      dataSourceKey: 'main',
+      getFields: () => [owner],
+      getField: (name: string) => (name === 'owner' ? owner : undefined),
+    } as any;
+    const options = createAssociationItemChainContextPropertyOptions({
+      t: (value) => value,
+      title: 'Current item',
+      collectionAccessor: () => collection,
+      propertiesAccessor: (ctx) => ctx.item.value,
+      resolverPropertiesAccessor: () => ({ owner: { id: 7 } }),
+      parentCollectionAccessor: () => collection,
+      parentAccessors: {
+        parentPropertiesAccessor: () => ({ owner: { id: 8 } }),
+        parentItemMetaAccessor: () => undefined,
+        parentItemResolverAccessor: () => undefined,
+      },
+    });
+    const meta = await options.meta();
+    const params = await meta.buildVariablesParams({
+      item: { value: { owner: { id: 7 } }, parentItem: { value: { owner: { id: 8 } } } },
+    });
+
+    expect(params).toEqual({
+      parentItem: { value: { owner: { collection: 'people', dataSourceKey: 'main', filterByTk: 8 } } },
+      value: { owner: { collection: 'people', dataSourceKey: 'main', filterByTk: 7 } },
+    });
+    expect(options.resolveOnServer('value.owner.name')).toBe(true);
+    expect(options.resolveOnServer('parentItem.value.owner.name')).toBe(true);
+  });
+
   it('disables current item attributes for select-record popup item context', async () => {
     const parentCtx = new FlowContext();
     const departmentsCollection = {

package/src/flow/models/fields/mobile-components/MobileLazySelect.tsx

@@ -291,6 +291,7 @@ export function MobileLazySelect(props: Readonly<LazySelectProps>) {
             value={searchText}
             onChange={handleSearchChange}
             onCancel={handleClose}
+            cancelText={t('Cancel')}
             showCancelButton
           />
         </div>

package/src/flow/models/fields/mobile-components/__tests__/MobileSelect.test.tsx

@@ -158,8 +158,15 @@ vi.mock('antd-mobile', () => {
       mockState.popupProps = props;
       return props.visible ? <div data-testid="popup">{props.children}</div> : null;
     },
-    SearchBar: ({ value, onChange }: any) => (
-      <input data-testid="search" value={value ?? ''} onChange={(e) => onChange?.(e.target.value)} />
+    SearchBar: ({ value, onChange, onCancel, cancelText, showCancelButton }: any) => (
+      <div>
+        <input data-testid="search" value={value ?? ''} onChange={(e) => onChange?.(e.target.value)} />
+        {showCancelButton && value ? (
+          <button type="button" onClick={onCancel}>
+            {cancelText ?? '取消'}
+          </button>
+        ) : null}
+      </div>
     ),
     CheckList: MockCheckList,
   };
@@ -289,6 +296,17 @@ describe('MobileLazySelect', () => {
     resetMockState();
   });
 
+  it('renders a translated cancel action after searching', () => {
+    renderMobileLazySelect();
+
+    openLazyPopup();
+    act(() => {
+      fireEvent.change(screen.getByTestId('search'), { target: { value: '11' } });
+    });
+
+    expect(screen.getByRole('button', { name: 'Cancel' })).toBeInTheDocument();
+  });
+
   it('keeps pending relation records selected until confirm', () => {
     const { onChange, rerender } = renderMobileLazySelect();