diff --git a/web/src/components/playground/SettingsPanel.js b/web/src/components/playground/SettingsPanel.js index fa65b363..4d8ba66b 100644 --- a/web/src/components/playground/SettingsPanel.js +++ b/web/src/components/playground/SettingsPanel.js @@ -33,7 +33,7 @@ import { Settings, } from 'lucide-react'; import { useTranslation } from 'react-i18next'; -import { renderGroupOption, modelSelectFilter } from '../../helpers'; +import { renderGroupOption, selectFilter } from '../../helpers'; import ParameterControl from './ParameterControl'; import ImageUrlInput from './ImageUrlInput'; import ConfigManager from './ConfigManager'; @@ -173,7 +173,7 @@ const SettingsPanel = ({ name='model' required selection - filter={modelSelectFilter} + filter={selectFilter} autoClearSearchValue={false} onChange={(value) => onInputChange('model', value)} value={inputs.model} diff --git a/web/src/components/table/channels/modals/EditChannelModal.jsx b/web/src/components/table/channels/modals/EditChannelModal.jsx index 248307c4..a62ec286 100644 --- a/web/src/components/table/channels/modals/EditChannelModal.jsx +++ b/web/src/components/table/channels/modals/EditChannelModal.jsx @@ -46,7 +46,7 @@ import { Col, Highlight, } from '@douyinfe/semi-ui'; -import { getChannelModels, copy, getChannelIcon, getModelCategories, modelSelectFilter } from '../../../../helpers'; +import { getChannelModels, copy, getChannelIcon, getModelCategories, selectFilter } from '../../../../helpers'; import { IconSave, IconClose, @@ -979,7 +979,7 @@ const EditChannelModal = (props) => { rules={[{ required: true, message: t('请选择渠道类型') }]} optionList={channelOptionList} style={{ width: '100%' }} - filter={modelSelectFilter} + filter={selectFilter} autoClearSearchValue={false} searchPosition='dropdown' onSearch={(value) => setChannelSearchValue(value)} @@ -1380,7 +1380,7 @@ const EditChannelModal = (props) => { placeholder={t('请选择该渠道所支持的模型')} rules={[{ required: true, message: t('请选择模型') }]} multiple - filter={modelSelectFilter} + filter={selectFilter} autoClearSearchValue={false} searchPosition='dropdown' optionList={modelOptions} diff --git a/web/src/components/table/channels/modals/EditTagModal.jsx b/web/src/components/table/channels/modals/EditTagModal.jsx index 5aadb95e..bbe99aff 100644 --- a/web/src/components/table/channels/modals/EditTagModal.jsx +++ b/web/src/components/table/channels/modals/EditTagModal.jsx @@ -25,7 +25,7 @@ import { showSuccess, showWarning, verifyJSON, - modelSelectFilter, + selectFilter, } from '../../../../helpers'; import { SideSheet, @@ -395,7 +395,7 @@ const EditTagModal = (props) => { label={t('模型')} placeholder={t('请选择该渠道所支持的模型,留空则不更改')} multiple - filter={modelSelectFilter} + filter={selectFilter} autoClearSearchValue={false} searchPosition='dropdown' optionList={modelOptions} diff --git a/web/src/components/table/tokens/modals/EditTokenModal.jsx b/web/src/components/table/tokens/modals/EditTokenModal.jsx index d26701f4..e9760edf 100644 --- a/web/src/components/table/tokens/modals/EditTokenModal.jsx +++ b/web/src/components/table/tokens/modals/EditTokenModal.jsx @@ -26,7 +26,7 @@ import { renderGroupOption, renderQuotaWithPrompt, getModelCategories, - modelSelectFilter, + selectFilter, } from '../../../../helpers'; import { useIsMobile } from '../../../../hooks/common/useIsMobile.js'; import { @@ -514,7 +514,7 @@ const EditTokenModal = (props) => { multiple optionList={models} extraText={t('非必要,不建议启用模型限制')} - filter={modelSelectFilter} + filter={selectFilter} autoClearSearchValue={false} searchPosition='dropdown' showClear diff --git a/web/src/helpers/utils.js b/web/src/helpers/utils.js index 5a8aa9cd..96a8edad 100644 --- a/web/src/helpers/utils.js +++ b/web/src/helpers/utils.js @@ -560,12 +560,16 @@ export function setTableCompactMode(compact, tableKey = 'global') { // ------------------------------- // Select 组件统一过滤逻辑 -// 解决 label 为 ReactNode(带图标等)时无法用内置 filter 搜索的问题。 -// 使用方式: +// 统一的 Select 搜索过滤逻辑 -- 支持同时匹配 option.value 与 option.label +export const selectFilter = (input, option) => { if (!input) return true; - const val = (option?.value || '').toString().toLowerCase(); - return val.includes(input.trim().toLowerCase()); + + const keyword = input.trim().toLowerCase(); + const valueText = (option?.value ?? '').toString().toLowerCase(); + const labelText = (option?.label ?? '').toString().toLowerCase(); + + return valueText.includes(keyword) || labelText.includes(keyword); }; // -------------------------------