fix: 修改自定义筛选框数据范围问题

packages/plugins/@hera/plugin-core/src/client/schema-components/AutoComplete/AutoComplete.tsx

@@ -1,23 +1,48 @@
 import React, { useEffect, useState } from 'react';
 import { AutoComplete as AntdAutoComplete } from 'antd';
 import { useFieldSchema, useForm } from '@formily/react';
-import { useDesigner } from '@nocobase/client';
+import { useAPIClient, useDesigner, useRequest } from '@nocobase/client';
+import { useAsyncEffect } from 'ahooks';
 
 export const AutoComplete = (props) => {
   const fieldSchema = useFieldSchema();
-  const { fieldNames, options: defultOptions } = fieldSchema['x-component-props'];
-  const defultValue = defultOptions.map((item) => {
-    item['label'] = item[fieldNames.label];
-    item['value'] = item[fieldNames.value];
-    return item;
-  });
-  const [options, setOptions] = useState([...defultValue]);
+  const { fieldNames } = fieldSchema['x-component-props'];
+  const fieldFilter = fieldSchema['x-component-props']['params'];
+  const filter = fieldFilter ? JSON.stringify(fieldFilter.filter) : {};
+  const [defultValue, setDefultValue] = useState([]);
+  const api = useAPIClient();
+  const [options, setOptions] = useState([]);
   const [value, setValue] = useState('');
   const form = useForm();
+
+  useAsyncEffect(async () => {
+    const defultOptions = await api.request({
+      url: fieldSchema['collectionName'] + ':list',
+      params: {
+        pageSize: 99999,
+        filter: fieldFilter ? { ...fieldFilter.filter } : {},
+      },
+    });
+    changLable(defultOptions?.data?.data);
+  }, [filter]);
+
+  useEffect(() => {
+    changLable(defultValue);
+  }, [fieldNames.label]);
+  const changLable = (defultOptions) => {
+    if (defultOptions) {
+      const item = defultOptions.map((item) => {
+        item['label'] = item[fieldNames.label];
+        item['value'] = item[fieldNames.value];
+        return item;
+      });
+      setDefultValue(item);
+      setOptions(item);
+    }
+  };
   if (!form.values['custom']) {
     form.values['custom'] = {};
   }
-
   const onSearch = (data) => {
     if (data) {
       const searchValue = defultValue.filter((item) => item[fieldNames.label].includes(data));
@@ -40,16 +65,5 @@ export const AutoComplete = (props) => {
       setOptions(defultValue);
     }
   };
-
-  return (
-    <AntdAutoComplete
-      value={value}
-      options={options}
-      onSearch={(value) => {
-        onSearch(value);
-      }}
-      onChange={(data) => onSearch(data)}
-      allowClear
-    />
-  );
+  return <AntdAutoComplete value={value} options={options} onSearch={onSearch} onChange={onSearch} allowClear />;
 };

packages/plugins/@hera/plugin-core/src/client/schema-components/select/Select.tsx

@@ -7,7 +7,8 @@ import { Select as AntdSelect, Empty, Spin, Tag } from 'antd';
 import React, { useEffect, useMemo, useState } from 'react';
 import { ReadPretty } from './ReadPretty';
 import { FieldNames, defaultFieldNames, getCurrentOptions } from './utils';
-import { useCollection_deprecated, useRequest } from '@nocobase/client';
+import { useAPIClient, useCollection_deprecated, useRequest } from '@nocobase/client';
+import { useAsyncEffect } from 'ahooks';
 
 type Props = SelectProps<any, any> & {
   objectValue?: boolean;
@@ -20,7 +21,38 @@ type Props = SelectProps<any, any> & {
 const isEmptyObject = (val: any) => !isValid(val) || (typeof val === 'object' && Object.keys(val).length === 0);
 
 const ObjectSelect = (props: Props) => {
-  const { value, options, onChange, fieldNames, mode, loading, rawOptions, defaultValue, ...others } = props;
+  const {
+    value,
+    options: defultValue,
+    onChange,
+    fieldNames,
+    mode,
+    loading,
+    rawOptions,
+    defaultValue,
+    ...others
+  } = props;
+  const [options, setOptions] = useState([]);
+  const [defult, setDefult] = useState(false);
+  const fieldSchema = useFieldSchema();
+  const collectionName = fieldSchema['collectionName'];
+  const filterField = fieldSchema['x-component-props']['params'];
+  const filter = filterField ? JSON.stringify(filterField.filter) : {};
+  const api = useAPIClient();
+
+  useAsyncEffect(async () => {
+    if (collectionName) {
+      const defValue = await api.request({
+        url: collectionName + ':list',
+        params: {
+          pageSize: 99999,
+          filter: filterField ? { ...filterField.filter } : {},
+        },
+      });
+      setOptions(defValue?.data?.data);
+    }
+  }, [filter]);
+
   const toValue = (v: any) => {
     if (isEmptyObject(v)) {
       return;

packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx

@@ -119,15 +119,6 @@ export const FilterCustomItemInitializer: React.FC<{
     });
     const { name, title, component, collection } = values;
     const defaultSchema = getInterface(component)?.default?.uiSchema || {};
-    const res = await api.request({
-      url: collection + ':list',
-      params: {
-        pageSize: 99999,
-      },
-    });
-    const option = res.data.data.map((value) => {
-      return value;
-    });
     insert(
       gridRowColWrap({
         'x-component': component,
@@ -141,7 +132,6 @@ export const FilterCustomItemInitializer: React.FC<{
         'x-decorator-props': collection,
         'x-component-props': {
           ...(defaultSchema['x-component-props'] || {}),
-          options: option,
           fieldNames: {
             label: 'name',
             value: 'id',
@@ -166,7 +156,7 @@ export const FilterItemCustomDesigner: React.FC = () => {
   const { t } = useTranslation();
   const fieldSchema = useFieldSchema();
   const fieldName = fieldSchema['name'] as string;
-  const name = fieldName.includes('custom') ? fieldSchema['x-decorator-props'] : fieldName;
+  const name = fieldName.includes('custom') ? fieldSchema['collectionName'] : fieldName;
   const { form } = useFormBlockContext();
   const field = useField();
   const { dn } = useDesignable();
@@ -177,16 +167,18 @@ export const FilterItemCustomDesigner: React.FC = () => {
       <EditDefaultValue />
       <SchemaSettingsDataScope
         collectionName={name}
-        defaultFilter={fieldSchema?.['x-decorator-props']?.params?.filter || {}}
+        defaultFilter={fieldSchema?.['x-component-props']?.params?.filter || {}}
         form={form}
         onSubmit={({ filter }) => {
-          filter = removeNullCondition(filter);
-          _.set(fieldSchema, 'x-decorator-props.params.filter', filter);
-          field.decoratorProps.params = { ...fieldSchema['x-decorator-props'].params };
+          _.set(field.componentProps, 'params', {
+            ...field.componentProps?.params,
+            filter,
+          });
+          fieldSchema['x-component-props']['params'] = field.componentProps.params;
           dn.emit('patch', {
             schema: {
               ['x-uid']: fieldSchema['x-uid'],
-              'x-decorator-props': fieldSchema['x-decorator-props'],
+              'x-component-props': fieldSchema['x-component-props'],
             },
           });
         }}