ruiling/tachybase_todo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(Select): should compile title and label (#1332)

Browse Source
This commit is contained in:
Dunqing 2023-01-07 09:30:19 +08:00 committed by GitHub
parent 550db03615
commit 6246d152b0
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/core/client/src/schema-component/antd/remote-select/RemoteSelect.tsx
View File

@ -2,8 +2,9 @@ import { LoadingOutlined } from '@ant-design/icons';
import { connect, mapProps, mapReadPretty } from '@formily/react'; import { connect, mapProps, mapReadPretty } from '@formily/react';
import { SelectProps } from 'antd'; import { SelectProps } from 'antd';
import _ from 'lodash'; import _ from 'lodash';
import React from 'react'; import React, { useMemo } from 'react';
import { ResourceActionOptions, useRequest } from '../../../api-client'; import { ResourceActionOptions, useRequest } from '../../../api-client';
import { useCompile } from '../../hooks';
import { defaultFieldNames, Select } from '../select'; import { defaultFieldNames, Select } from '../select';
import { ReadPretty } from './ReadPretty'; import { ReadPretty } from './ReadPretty';
@ -18,6 +19,7 @@ export type RemoteSelectProps<P = any> = SelectProps<P, any> & {
const InternalRemoteSelect = connect( const InternalRemoteSelect = connect(
(props: RemoteSelectProps) => { (props: RemoteSelectProps) => {
const { fieldNames = {}, service = {}, wait = 300, ...others } = props; const { fieldNames = {}, service = {}, wait = 300, ...others } = props;
const compile = useCompile();
const { data, run } = useRequest( const { data, run } = useRequest(
{ {
@ -54,6 +56,15 @@ const InternalRemoteSelect = connect(
}); });
}; };
const options = useMemo(() => {
return (
data?.data?.map((item) => ({
...item,
[fieldNames.label]: compile(item[fieldNames.label]),
})) || []
);
}, [data, fieldNames.label]);
return ( return (
<Select <Select
autoClearSearchValue autoClearSearchValue
@ -62,7 +73,7 @@ const InternalRemoteSelect = connect(
fieldNames={fieldNames} fieldNames={fieldNames}
onSearch={onSearch} onSearch={onSearch}
{...others} {...others}
options={data?.data || []} options={options}
/> />
); );
}, },

4
packages/core/client/src/schema-component/hooks/useFieldTitle.ts
View File

@ -1,6 +1,7 @@
import { Field } from "@formily/core"; import { Field } from "@formily/core";
import { useField, useFieldSchema } from "@formily/react"; import { useField, useFieldSchema } from "@formily/react";
import { useEffect } from "react"; import { useEffect } from "react";
import { useCompile } from "./useCompile";
import { useCollection, useCollectionManager } from "../../collection-manager"; import { useCollection, useCollectionManager } from "../../collection-manager";
export const useFieldTitle = () => { export const useFieldTitle = () => {
@ -9,9 +10,10 @@ export const useFieldTitle = () => {
const { getField, } = useCollection(); const { getField, } = useCollection();
const { getCollectionJoinField } = useCollectionManager(); const { getCollectionJoinField } = useCollectionManager();
const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']); const collectionField = getField(fieldSchema['name']) || getCollectionJoinField(fieldSchema['x-collection-field']);
const compile = useCompile()
useEffect(() => { useEffect(() => {
if (!field?.title) { if (!field?.title) {
field.title = collectionField?.uiSchema?.title; field.title = compile(collectionField?.uiSchema?.title);
} }
}, [collectionField?.uiSchema?.title]); }, [collectionField?.uiSchema?.title]);
} }