@nocobase/client-v2 2.2.0-beta.9 → 2.2.0

package/src/flow/models/blocks/filter-form/FilterFormBlockModel.tsx

@@ -15,8 +15,10 @@ import {
   DndProvider,
   DragHandler,
   Droppable,
+  isCtxDateExpression,
   isRunJSValue,
   normalizeRunJSValue,
+  parseCtxDateExpression,
   tExpr,
   FlowModelRenderer,
   FlowSettingsButton,
@@ -44,6 +46,15 @@ import { normalizeFilterValueByOperator } from './valueNormalization';
 
 const RELATION_FIELD_TYPES = ['belongsTo', 'hasOne', 'hasMany', 'belongsToMany', 'belongsToArray'];
 const NUMERIC_FIELD_TYPES = ['integer', 'float', 'double', 'decimal'];
+const DATE_FILTER_OPERATORS = new Set([
+  '$dateOn',
+  '$dateNotOn',
+  '$dateBefore',
+  '$dateAfter',
+  '$dateNotBefore',
+  '$dateNotAfter',
+  '$dateBetween',
+]);
 
 function getFilterFormFieldMetaType(field: CollectionField) {
   if (RELATION_FIELD_TYPES.includes(field.type)) {
@@ -66,6 +77,14 @@ function getFilterFormFieldMetaType(field: CollectionField) {
   }
 }
 
+function parseDateFilterDefaultValue(operator: string | undefined, rawValue: unknown) {
+  if (!operator || !DATE_FILTER_OPERATORS.has(operator) || !isCtxDateExpression(rawValue)) {
+    return undefined;
+  }
+
+  return parseCtxDateExpression(rawValue);
+}
+
 function shouldShowFilterFormFieldMeta(field: CollectionField) {
   return Boolean(field?.interface);
 }
@@ -431,6 +450,7 @@ export class FilterFormBlockModel extends FilterBlockModel<{
 
   private canApplyFormDefaultValue(name: string, current: any, force?: boolean) {
     if (force) return true;
+    if (this.userEditedFieldNames.has(name)) return false;
     if (isEmptyValue(current)) return true;
     if (!this.lastDefaultValueByFieldName.has(name)) return false;
     return isEqual(current, this.lastDefaultValueByFieldName.get(name));
@@ -488,7 +508,7 @@ export class FilterFormBlockModel extends FilterBlockModel<{
     const rules = (params?.value || []) as any[];
     if (!Array.isArray(rules) || rules.length === 0) return appliedValues;
 
-    const resolveValue = async (raw: any) => {
+    const resolveValue = async (raw: any, operator?: string) => {
       // RunJS support
       if (isRunJSValue(raw)) {
         const { code, version } = normalizeRunJSValue(raw);
@@ -496,6 +516,11 @@ export class FilterFormBlockModel extends FilterBlockModel<{
         return ret?.success ? ret.value : undefined;
       }
 
+      const parsedDateFilterValue = parseDateFilterDefaultValue(operator, raw);
+      if (typeof parsedDateFilterValue !== 'undefined') {
+        return parsedDateFilterValue;
+      }
+
       return await (this.context as any).resolveJsonTemplate?.(raw);
     };
 
@@ -519,11 +544,11 @@ export class FilterFormBlockModel extends FilterBlockModel<{
 
       const current = (form as any).getFieldValue?.(name);
 
-      const resolved = await resolveValue(rule.value);
+      const operator = getDefaultOperator(itemModel as any);
+      const resolved = await resolveValue(rule.value, operator);
       if (options?.refreshSeq && options.refreshSeq !== this.defaultValuesRefreshSeq) return appliedValues;
       if (typeof resolved === 'undefined') continue;
 
-      const operator = getDefaultOperator(itemModel as any);
       const normalized = normalizeFilterValueByOperator(operator, resolved);
       const mode = this.normalizeFieldValueMode(rule.mode);
       if (mode === 'default' && !this.canApplyFormDefaultValue(String(name), current, force)) continue;

package/src/flow/models/blocks/filter-form/FilterFormGridModel.tsx

@@ -59,11 +59,42 @@ export class FilterFormGridModel extends GridModel {
 
   readonly loading = observable.ref(false);
 
-  private getAssociationFilterTargetKey(field: any) {
-    const filterTargetKey = field?.targetCollection?.filterTargetKey;
+  private isRecordSelectFilterField(subModel: FilterFormItemModel) {
+    const fieldModel = subModel.subModels?.field;
+    if (!fieldModel) {
+      return true;
+    }
+
+    const RecordSelectModel = this.flowEngine.getModelClass('FilterFormRecordSelectFieldModel');
+    if (!RecordSelectModel) {
+      return fieldModel.constructor?.name === 'FilterFormRecordSelectFieldModel';
+    }
+
+    return fieldModel instanceof RecordSelectModel;
+  }
+
+  private getAssociationFilterTargetKey(field: any, subModel: FilterFormItemModel) {
+    const normalizeKey = (key: any) => {
+      if (Array.isArray(key)) {
+        return key[0];
+      }
+      return key;
+    };
+
+    const fieldModelValueKey = normalizeKey(subModel.subModels?.field?.props?.fieldNames?.value);
+    if (fieldModelValueKey) {
+      return fieldModelValueKey;
+    }
+
+    const filterTargetKey = normalizeKey(field?.targetCollection?.filterTargetKey);
+    const fieldTargetKey = normalizeKey(field?.targetKey);
+
+    if (filterTargetKey && filterTargetKey !== 'id') {
+      return filterTargetKey;
+    }
 
-    if (Array.isArray(filterTargetKey)) {
-      return filterTargetKey[0] || 'id';
+    if (!this.isRecordSelectFilterField(subModel) && fieldTargetKey) {
+      return fieldTargetKey;
     }
 
     return filterTargetKey || 'id';
@@ -370,7 +401,7 @@ export class FilterFormGridModel extends GridModel {
           if (field?.target) {
             return {
               targetId: model.uid,
-              filterPaths: [`${fieldPath}.${this.getAssociationFilterTargetKey(field)}`],
+              filterPaths: [`${fieldPath}.${this.getAssociationFilterTargetKey(field, subModel)}`],
             };
           }
         }

package/src/flow/models/blocks/filter-form/FilterFormItemModel.tsx

@@ -31,6 +31,12 @@ import {
 import { FilterFormFieldModel } from './fields';
 import { normalizeFilterValueByOperator } from './valueNormalization';
 
+type CollectionWithManager = Collection & {
+  collectionManager?: {
+    getCollection?: (name: string) => Collection | undefined;
+  };
+};
+
 const getAssociationTargetCollection = (field: any, collection?: Collection, model?: CollectionBlockModel) => {
   if (field?.targetCollection) {
     return field.targetCollection;
@@ -42,6 +48,10 @@ const getAssociationTargetCollection = (field: any, collection?: Collection, mod
   if (collection?.dataSource?.getCollection) {
     return collection.dataSource.getCollection(targetName);
   }
+  const collectionManager = (collection as CollectionWithManager | undefined)?.collectionManager;
+  if (collectionManager?.getCollection) {
+    return collectionManager.getCollection(targetName);
+  }
   const dataSourceKey = collection?.dataSourceKey;
   if (dataSourceKey && model?.context?.dataSourceManager?.getCollection) {
     return model.context.dataSourceManager.getCollection(dataSourceKey, targetName);
@@ -62,9 +72,25 @@ function isRecord(value: unknown): value is Record<string, unknown> {
   return !!value && typeof value === 'object' && !Array.isArray(value);
 }
 
+interface CollectionFieldWithAssociationMarker {
+  isAssociationField?: () => boolean;
+  target?: unknown;
+}
+
+function hasAssociationMarker(value: unknown): value is CollectionFieldWithAssociationMarker {
+  return isRecord(value) && (typeof value.isAssociationField === 'function' || 'target' in value);
+}
+
+const isAssociationCollectionField = (collectionField: unknown) => {
+  if (!hasAssociationMarker(collectionField)) {
+    return false;
+  }
+  return collectionField.isAssociationField ? collectionField.isAssociationField() : Boolean(collectionField.target);
+};
+
 const normalizeAssociationDefaultFilterValue = (value: any, fieldModel: any) => {
   const collectionField = fieldModel?.context?.collectionField;
-  if (!collectionField?.isAssociationField?.()) {
+  if (!isAssociationCollectionField(collectionField)) {
     return value;
   }
 
@@ -152,6 +178,74 @@ const buildVirtualFilterCollectionField = (ctx: FlowModelContext, filterField: a
   return result;
 };
 
+const getFilterableChildren = (field: any) => {
+  const children = field?.filterable?.children;
+  return Array.isArray(children) ? children : [];
+};
+
+const hasAssociationChildren = (field: any, collection?: Collection, model?: CollectionBlockModel) => {
+  return (
+    isAssociationCollectionField(field) &&
+    (getFilterableChildren(field).length > 0 || !!getAssociationTargetCollection(field, collection, model))
+  );
+};
+
+const inferFilterableChildInterface = (child: any) => {
+  if (child?.interface) {
+    return child.interface;
+  }
+
+  const schema = child?.schema || child?.uiSchema;
+  const component = schema?.['x-component'];
+  if (component === 'Select') {
+    return 'select';
+  }
+  if (component === 'Checkbox.Group') {
+    return 'checkboxGroup';
+  }
+  if (component === 'Checkbox') {
+    return 'checkbox';
+  }
+
+  const type = child?.type || schema?.type;
+  if (type === 'number' || type === 'integer') {
+    return 'number';
+  }
+  return 'input';
+};
+
+const translateFilterableChildTitle = (title: unknown, t: (value: string) => string) => {
+  return typeof title === 'string' ? t(title) : title;
+};
+
+const buildFilterableChildField = (child: any, t: (value: string) => string) => {
+  const name = child?.name || child?.value;
+  if (!name) {
+    return;
+  }
+
+  const schema = child?.schema || child?.uiSchema || {};
+  const rawTitle = child?.title || child?.label || schema?.title || name;
+  const title = translateFilterableChildTitle(rawTitle, t);
+  const filterable = child?.filterable || (child?.operators ? { operators: child.operators } : undefined);
+
+  return {
+    ...child,
+    name,
+    title,
+    type: child?.type || schema?.type || 'string',
+    interface: inferFilterableChildInterface(child),
+    uiSchema: {
+      ...schema,
+      title: translateFilterableChildTitle(schema?.title || title, t),
+    },
+    filterable,
+    __filterFormVirtual: true,
+    isAssociationField: () => false,
+    getComponentProps: () => schema?.['x-component-props'] || {},
+  };
+};
+
 const buildFilterFormFieldItem = ({
   model,
   collection,
@@ -171,12 +265,7 @@ const buildFilterFormFieldItem = ({
   if (!binding) {
     return;
   }
-  const isAssociation =
-    typeof field?.isAssociationField === 'function' ? field.isAssociationField() : Boolean(field?.target);
-  const fieldModel =
-    isAssociation && ctxWithFlags.engine?.getModelClass?.('FilterFormRecordSelectFieldModel')
-      ? 'FilterFormRecordSelectFieldModel'
-      : binding.modelName;
+  const fieldModel = binding.modelName;
   const label = field.title || field.name;
   const displayLabel = labelPrefix ? `${labelPrefix} / ${label}` : label;
   return {
@@ -196,7 +285,10 @@ const buildFilterFormFieldItem = ({
         },
         filterFormItemSettings: {
           init: {
-            filterField: _.pick(field, ['name', 'title', 'interface', 'type']),
+            filterField: {
+              ..._.pick(field, ['name', 'title', 'interface', 'type', 'filterable', 'uiSchema', '__filterFormVirtual']),
+              title: displayLabel,
+            },
             defaultTargetUid: model.uid,
           },
         },
@@ -230,7 +322,8 @@ const buildAssociationFieldMenuItem = ({
   depth: number;
 }) => {
   const targetCollection = getAssociationTargetCollection(field, collection, model);
-  if (!targetCollection) {
+  const filterableChildren = getFilterableChildren(field);
+  if (!targetCollection && !filterableChildren.length) {
     return;
   }
   if (depth > MAX_ASSOCIATION_DEPTH) {
@@ -247,10 +340,35 @@ const buildAssociationFieldMenuItem = ({
       const targetFields = getTargetFilterableFields(field, collection, model);
       const fieldItems: any[] = [];
       const associationItems: any[] = [];
+      const addedFieldPaths = new Set<string>();
+
+      filterableChildren.forEach((child: any) => {
+        const virtualChildField = buildFilterableChildField(child, t);
+        if (!virtualChildField) {
+          return;
+        }
+
+        const childFieldPath = `${fieldPath}.${virtualChildField.name}`;
+        const childItem = buildFilterFormFieldItem({
+          model,
+          collection,
+          ctxWithFlags,
+          field: virtualChildField,
+          fieldPath: childFieldPath,
+          labelPrefix: label,
+        });
+        if (childItem) {
+          addedFieldPaths.add(childFieldPath);
+          fieldItems.push(childItem);
+        }
+      });
 
       targetFields.forEach((targetField: any) => {
         const targetFieldPath = `${fieldPath}.${targetField.name}`;
-        if (targetField?.targetCollection) {
+        if (addedFieldPaths.has(targetFieldPath)) {
+          return;
+        }
+        if (hasAssociationChildren(targetField, collection, model)) {
           const associationItem = buildAssociationFieldMenuItem({
             model,
             collection,
@@ -343,7 +461,7 @@ const getModelFieldGroups = async (model: CollectionBlockModel) => {
       baseItems.push(baseItem);
     }
 
-    if (field?.targetCollection) {
+    if (hasAssociationChildren(field, collection, model)) {
       const associationItem = buildAssociationFieldMenuItem({
         model,
         collection,
@@ -474,6 +592,14 @@ export class FilterFormItemModel extends FilterableItemModel<{
           title: initFilterField?.title || initFilterField?.name,
         },
       });
+      if (initFilterField?.__filterFormVirtual) {
+        const virtualField = buildVirtualFilterCollectionField(this.context, initFilterField);
+        if (virtualField) {
+          this.context.defineProperty('collectionField', {
+            value: virtualField,
+          });
+        }
+      }
     }
   }
 
@@ -507,10 +633,7 @@ export class FilterFormItemModel extends FilterableItemModel<{
     const formValue = this.context.form?.getFieldValue(this.props.name);
     const modelValue = fieldModel.getFilterValue ? fieldModel.getFilterValue() : formValue;
     const collectionField = (fieldModel as any)?.context?.collectionField;
-    const isAssociationField =
-      typeof collectionField?.isAssociationField === 'function'
-        ? collectionField.isAssociationField()
-        : !!collectionField?.target;
+    const isAssociationField = isAssociationCollectionField(collectionField);
     const shouldUseFormValue =
       isAssociationField &&
       !this.mounted &&
@@ -547,11 +670,7 @@ export class FilterFormItemModel extends FilterableItemModel<{
       return value;
     }
     const collectionField = (fieldModel as any)?.context?.collectionField;
-    const isAssociation =
-      typeof collectionField?.isAssociationField === 'function'
-        ? collectionField.isAssociationField()
-        : !!collectionField?.target;
-    if (!isAssociation) {
+    if (!isAssociationCollectionField(collectionField)) {
       return value;
     }
     const normalizedFieldNames = normalizeAssociationFieldNames(
@@ -684,7 +803,8 @@ FilterFormItemModel.registerFlow({
           // @ts-ignore
           (fieldSettingsInitParams?.dataSourceKey && fieldSettingsInitParams?.collectionName)
         );
-        if (!hasCollectionContext && !collectionField && normalizedFilterField) {
+        const shouldUseVirtualFilterField = !!normalizedFilterField?.__filterFormVirtual;
+        if ((shouldUseVirtualFilterField || (!hasCollectionContext && !collectionField)) && normalizedFilterField) {
           const virtualField = buildVirtualFilterCollectionField(ctx, normalizedFilterField);
           if (virtualField) {
             ctx.model.context.defineProperty('collectionField', {
@@ -779,10 +899,13 @@ FilterFormItemModel.registerFlow({
           type: 'select',
           key: 'use',
           props: {
-            options: classes.map((model) => ({
-              label: t(model.modelName),
-              value: model.modelName,
-            })),
+            options: classes.map((model) => {
+              const ModelClass = ctx.engine.getModelClass(model.modelName);
+              return {
+                label: t(ModelClass?.meta?.label || model.modelName),
+                value: model.modelName,
+              };
+            }),
           },
         };
       },
@@ -798,6 +921,13 @@ FilterFormItemModel.registerFlow({
     },
     defaultOperator: {
       use: 'defaultOperator',
+      hideInSettings(ctx) {
+        const collectionField =
+          ctx.collectionField ||
+          ctx.model?.context?.collectionField ||
+          ctx.model?.subModels?.field?.context?.collectionField;
+        return isAssociationCollectionField(collectionField);
+      },
     },
     operatorComponentProps: {
       use: 'operatorComponentProps',

package/src/flow/models/blocks/filter-form/FilterFormSubmitActionModel.tsx

@@ -8,23 +8,76 @@
  */
 
 import type { ButtonProps } from 'antd/es/button';
+import { reaction } from '@formily/reactive';
 import { tExpr } from '@nocobase/flow-engine';
 import { FilterFormActionModel } from './FilterFormActionModel';
 
+type FilterFormBlockState = {
+  autoTriggerFilter: boolean;
+};
+
+const mountedSubmitActions = new WeakSet<object>();
+const visibleSubmitActionsByBlock = new WeakMap<FilterFormBlockState, Set<object>>();
+const hiddenReactionDisposers = new WeakMap<object, () => void>();
+
+const syncAutoTriggerFilter = (blockModel: FilterFormBlockState, lifecycleAction: object & { hidden?: boolean }) => {
+  let visibleSubmitActions = visibleSubmitActionsByBlock.get(blockModel);
+
+  if (mountedSubmitActions.has(lifecycleAction) && !lifecycleAction.hidden) {
+    if (!visibleSubmitActions) {
+      visibleSubmitActions = new Set<object>();
+      visibleSubmitActionsByBlock.set(blockModel, visibleSubmitActions);
+    }
+    visibleSubmitActions.add(lifecycleAction);
+  } else {
+    visibleSubmitActions?.delete(lifecycleAction);
+  }
+
+  blockModel.autoTriggerFilter = Boolean(!visibleSubmitActions?.size);
+  if (!visibleSubmitActions?.size) {
+    visibleSubmitActionsByBlock.delete(blockModel);
+  }
+};
+
 export class FilterFormSubmitActionModel extends FilterFormActionModel {
   defaultProps: ButtonProps = {
     title: tExpr('Filter'),
     type: 'primary',
   };
 
-  onInit(options): void {
-    super.onInit(options);
-    this.context.blockModel.autoTriggerFilter = false;
+  private getLifecycleAction(): object & { hidden?: boolean } {
+    return this.context.model || this;
+  }
+
+  private syncAutoTriggerFilter(): void {
+    const blockModel = this.context.blockModel as FilterFormBlockState;
+    const lifecycleAction = this.getLifecycleAction();
+    syncAutoTriggerFilter(blockModel, lifecycleAction);
+  }
+
+  onMount(): void {
+    super.onMount();
+    const blockModel = this.context.blockModel as FilterFormBlockState;
+    const lifecycleAction = this.getLifecycleAction();
+    mountedSubmitActions.add(lifecycleAction);
+    hiddenReactionDisposers.get(lifecycleAction)?.();
+    hiddenReactionDisposers.set(
+      lifecycleAction,
+      reaction(
+        () => lifecycleAction.hidden,
+        () => syncAutoTriggerFilter(blockModel, lifecycleAction),
+      ),
+    );
+    this.syncAutoTriggerFilter();
   }
 
   onUnmount(): void {
     super.onUnmount();
-    this.context.blockModel.autoTriggerFilter = true;
+    const lifecycleAction = this.getLifecycleAction();
+    hiddenReactionDisposers.get(lifecycleAction)?.();
+    hiddenReactionDisposers.delete(lifecycleAction);
+    mountedSubmitActions.delete(lifecycleAction);
+    this.syncAutoTriggerFilter();
   }
 }