feat: 添加自定义文本筛选 (#373)

<!-- Note -->
<!-- This is a template for submitting a new feature.
Use the bug fix template if you're submitting a bug fix pull request by adding `template=bug_fix.md` to your pull request URL. -->

# Description
<!-- Describe the new feature or modification to an existing feature clearly and consciously. -->

# Motivation
<!-- Explain the reason for adding or modifying this feature. -->

# Key changes
<!-- Provide a technically detailed description of the key changes made. -->
- Frontend
- Backend

# Test plan
## Suggestions
<!-- Provide any suggestions or recommendations for improvements in the testing plan. -->

## Underlying risk
<!-- Identify any potential risks or issues that may arise from the new feature or modification. -->

# Showcase
<!-- Including any screenshots of the new feature or modification. -->

Reviewed-on: daoyoucloud/tachycode#373
Reviewed-by: sealday <zhanglin@daoyoucloud.com>
Co-authored-by: wjh <wwwjh0710@163.com>
Co-committed-by: wjh <wwwjh0710@163.com>
This commit is contained in:
wjh 2024-03-14 22:25:22 +08:00 committed by sealday
parent 26b1aeacd8
commit 96d35bb829
4 changed files with 59 additions and 1 deletions

View File

@ -122,7 +122,6 @@ export const useFilterBlockActionProps = () => {
const param = block.service.params?.[0] || {}; const param = block.service.params?.[0] || {};
// 保留原有的 filter // 保留原有的 filter
const storedFilter = block.service.params?.[1]?.filters || {}; const storedFilter = block.service.params?.[1]?.filters || {};
storedFilter[uid] = removeNullCondition( storedFilter[uid] = removeNullCondition(
transformToFilter(form.values, fieldSchema, getCollectionJoinField, name), transformToFilter(form.values, fieldSchema, getCollectionJoinField, name),
fieldSchema, fieldSchema,

View File

@ -90,6 +90,7 @@ import { useGetCustomComponents } from './hooks/useGetCustomComponents';
import { SwiperBlock, SwiperBlockInitializer } from './schema-initializer/SwiperBlockInitializer'; import { SwiperBlock, SwiperBlockInitializer } from './schema-initializer/SwiperBlockInitializer';
import { NoticeBlock, NoticeBlockInitializer } from './schema-initializer/NoticeBlockInitializer'; import { NoticeBlock, NoticeBlockInitializer } from './schema-initializer/NoticeBlockInitializer';
import { TabSearchBlock, TabSearchBlockInitializer } from './schema-initializer/TabSearchBlockInitializer'; import { TabSearchBlock, TabSearchBlockInitializer } from './schema-initializer/TabSearchBlockInitializer';
import { AutoComplete } from './schema-components/AutoComplete/AutoComplete';
export enum CustomComponentType { export enum CustomComponentType {
CUSTOM_FORM_ITEM, CUSTOM_FORM_ITEM,
@ -197,6 +198,7 @@ export class PluginCoreClient extends Plugin {
EditTitleField, EditTitleField,
AfterSuccess, AfterSuccess,
GroupBlockConfigure, GroupBlockConfigure,
AutoComplete,
Menu: { Menu: {
...Menu, ...Menu,
// @ts-ignore // @ts-ignore

View File

@ -0,0 +1,55 @@
import React, { useEffect, useState } from 'react';
import { AutoComplete as AntdAutoComplete } from 'antd';
import { useFieldSchema, useForm } from '@formily/react';
import { useDesigner } from '@nocobase/client';
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 [value, setValue] = useState('');
const form = useForm();
if (!form.values['custom']) {
form.values['custom'] = {};
}
const onSearch = (data) => {
if (data) {
const searchValue = defultValue.filter((item) => item[fieldNames.label].includes(data));
if (searchValue.length) {
setOptions(searchValue);
} else {
setOptions([]);
}
const valueLabel = options.filter((item) => item.value === data)[0];
if (valueLabel) {
setValue(valueLabel.label);
form.values.custom[fieldSchema['collectionName']] = valueLabel;
} else {
setValue(data);
form.values.custom[fieldSchema['collectionName']] = {};
form.values.custom[fieldSchema['collectionName']][fieldNames.label] = data;
}
} else {
setValue(data);
setOptions(defultValue);
}
};
return (
<AntdAutoComplete
value={value}
options={options}
onSearch={(value) => {
onSearch(value);
}}
onChange={(data) => onSearch(data)}
allowClear
/>
);
};

View File

@ -40,6 +40,7 @@ export const useFieldComponents = () => {
const { t } = useTranslation(); const { t } = useTranslation();
const options = [ const options = [
{ label: t('Input'), value: 'Input' }, { label: t('Input'), value: 'Input' },
{ label: t('AutoComplete'), value: 'AutoComplete' },
{ label: t('Select'), value: 'Select' }, { label: t('Select'), value: 'Select' },
]; ];
return { return {
@ -147,6 +148,7 @@ export const FilterCustomItemInitializer: React.FC<{
}, },
}, },
'x-compoent-custom': true, 'x-compoent-custom': true,
collectionName: collection,
}), }),
); );