diff --git a/web/src/components/CustomSelect/index.tsx b/web/src/components/CustomSelect/index.tsx index e9ccce74..1887d635 100644 --- a/web/src/components/CustomSelect/index.tsx +++ b/web/src/components/CustomSelect/index.tsx @@ -1,10 +1,13 @@ import { useEffect, useState, type FC, type Key } from 'react'; -import { Select } from 'antd' -import type { SelectProps, DefaultOptionType } from 'antd/es/select' +import { Select } from 'antd'; +import type { SelectProps, DefaultOptionType } from 'antd/es/select'; import { useTranslation } from 'react-i18next'; import { request } from '@/utils/request'; -// 定义API响应类型 +interface OptionType { + [key: string]: Key | string | number; +} + interface ApiResponse { items?: T[]; } @@ -20,19 +23,16 @@ interface CustomSelectProps extends Omit { format?: (items: OptionType[]) => OptionType[]; showSearch?: boolean; optionFilterProp?: string; - // 其他SelectProps属性 - onChange?: SelectProps['onChange']; - value?: SelectProps['value']; - disabled?: boolean; - style?: React.CSSProperties; - className?: string; filterOption?: (inputValue: string, option?: DefaultOptionType) => boolean; } -interface OptionType { - [key: string]: Key | string | number; -} + +const defaultFilterOption = (inputValue: string, option?: DefaultOptionType): boolean => { + if (!option || !inputValue) return true; + const label = String(option.children || option.label || ''); + return label.toLowerCase().includes(inputValue.toLowerCase()); +}; + const CustomSelect: FC = ({ - onChange, url, params, valueKey = 'value', @@ -42,42 +42,37 @@ const CustomSelect: FC = ({ allTitle, format, showSearch = false, - optionFilterProp = 'label', filterOption, ...props }) => { const { t } = useTranslation(); - const [options, setOptions] = useState([]); - - // 默认模糊搜索函数 - const defaultFilterOption = (inputValue: string, option?: DefaultOptionType) => { - if (!option || !inputValue) return true; - const label = String(option.children || option.label || ''); - return label.toLowerCase().includes(inputValue.toLowerCase()); - }; - // 组件挂载时获取初始数据 + const [options, setOptions] = useState([]); + useEffect(() => { request.get>(url, params).then((res) => { - const data = res; - setOptions(Array.isArray(data) ? data || [] : Array.isArray(data?.items) ? data.items || [] : []); + const data = Array.isArray(res) ? res : res?.items || []; + setOptions(data); }); - }, []); + }, [url, params]); + + const displayOptions = format ? format(options) : options; + return ( - ); -} +}; + export default CustomSelect; \ No newline at end of file