diff --git a/packages/plugins/@hera/plugin-core/package.json b/packages/plugins/@hera/plugin-core/package.json index c01d46650..e53750b03 100644 --- a/packages/plugins/@hera/plugin-core/package.json +++ b/packages/plugins/@hera/plugin-core/package.json @@ -1,6 +1,6 @@ { "name": "@hera/plugin-core", - "version": "1.6.0", + "version": "1.6.1", "displayName": "Hera platform", "displayName.zh-CN": "赫拉平台", "description": "Hera platform as nocobase plugin.", diff --git a/packages/plugins/@hera/plugin-core/src/client/schema-components/auto-complete/AutoComplete.tsx b/packages/plugins/@hera/plugin-core/src/client/schema-components/auto-complete/AutoComplete.tsx index de3fa1f19..65fbc413d 100644 --- a/packages/plugins/@hera/plugin-core/src/client/schema-components/auto-complete/AutoComplete.tsx +++ b/packages/plugins/@hera/plugin-core/src/client/schema-components/auto-complete/AutoComplete.tsx @@ -1,4 +1,4 @@ -import React, { useEffect, useState } from 'react'; +import React, { useState } from 'react'; import { AutoComplete as AntdAutoComplete } from 'antd'; import { connect, useFieldSchema } from '@formily/react'; import { useAPIClient } from '@nocobase/client'; @@ -8,42 +8,54 @@ import { fuzzysearch } from '../../utils'; export const AutoComplete = connect((props) => { const { fieldNames, params: fieldFilter } = props; const fieldSchema = useFieldSchema(); - const [defultValue, setDefultValue] = useState([]); + const targetKey = fieldNames.value; const api = useAPIClient(); + const [defultOptions, setDefultOptions] = useState([]); const [options, setOptions] = useState([]); + + const getNoDuplicateTextOptions = (rawOptions) => { + const targetOptions = rawOptions.filter((option, index, self) => { + return self.findIndex((item) => item[targetKey] === option[targetKey]) === index; + }); + return targetOptions; + }; + useAsyncEffect(async () => { - const defultOptions = await api.request({ + const { + data: { data: rawOptions }, + } = await api.request({ url: fieldSchema['collectionName'] + ':list', params: { pageSize: 99999, filter: fieldFilter ? { ...fieldFilter.filter } : {}, }, }); - changLable(defultOptions?.data?.data); + const targetOptions = getNoDuplicateTextOptions(rawOptions); + setDefultOptions(targetOptions); + setOptions(targetOptions); }, [fieldFilter?.filter, fieldSchema['collectionName']]); - useEffect(() => { - changLable(defultValue); - }, [fieldNames?.label]); - - const changLable = (defultOptions) => { - if (defultOptions) { - const items = []; - defultOptions.forEach((item) => { - if (!items.filter((option) => option[fieldNames.value] === item[fieldNames.value]).length) { - items.push(item); - } - }); - setDefultValue(items); - setOptions(items); + const onSearch = (value) => { + // 在筛选项开头跟踪用户的原始输入值 + if (value) { + setOptions([ + { + [targetKey]: value, + }, + ...defultOptions, + ]); + } else { + setOptions(defultOptions); } }; + return ( fuzzysearch(inputValue, option[fieldNames.value].toString())} + filterOption={(inputValue, option) => fuzzysearch(inputValue, option[targetKey].toString())} allowClear + onSearch={onSearch} /> ); });