diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/AutoComplete/AutoComplete.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/AutoComplete/AutoComplete.tsx index 9b33f77bd..d3cab0e46 100644 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/AutoComplete/AutoComplete.tsx +++ b/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 ( - { - onSearch(value); - }} - onChange={(data) => onSearch(data)} - allowClear - /> - ); + return ; }; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/select/Select.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/select/Select.tsx index a519742a6..0addb29bd 100644 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/select/Select.tsx +++ b/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 & { objectValue?: boolean; @@ -20,7 +21,38 @@ type Props = SelectProps & { 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; diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx index 3e01599b4..0c4af31d5 100644 --- a/packages/plugins/@hera/plugin-core/src/client/schema-initializer/FilterFormItemCustomInitializer/FilterFormItemCustom.tsx +++ b/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 = () => { { - 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'], }, }); }}