feat: improve the operators of all fields
This commit is contained in:
parent
b9b41139c9
commit
2f880c6cd0
@ -21,8 +21,4 @@ export const attachment: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
};
|
||||
|
@ -23,7 +23,7 @@ export const checkbox: ISchema = {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{ label: '是', value: '$isTruly', selected: true, noValue: true },
|
||||
{ label: '否', value: '$isFalsy', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -1,4 +1,5 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { multipleSelect } from './multipleSelect';
|
||||
import { defaultProps, dataSource } from './properties';
|
||||
|
||||
export const checkboxGroup: ISchema = {
|
||||
@ -23,8 +24,5 @@ export const checkboxGroup: ISchema = {
|
||||
...defaultProps,
|
||||
'uiSchema.enum': dataSource,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: multipleSelect.operations,
|
||||
};
|
||||
|
@ -25,7 +25,6 @@ export const chinaRegion: ISchema = {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{ label: '等于', value: 'code.in' },
|
||||
],
|
||||
};
|
||||
|
@ -1,4 +1,5 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { datetime } from './datetime';
|
||||
import { dateTimeProps, defaultProps } from './properties';
|
||||
|
||||
export const createdAt: ISchema = {
|
||||
@ -26,8 +27,5 @@ export const createdAt: ISchema = {
|
||||
...defaultProps,
|
||||
...dateTimeProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: datetime.operations,
|
||||
};
|
||||
|
@ -25,8 +25,4 @@ export const createdBy: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
};
|
||||
|
@ -27,7 +27,13 @@ export const datetime: ISchema = {
|
||||
...dateTimeProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{ label: '等于', value: '$dateOn', selected: true },
|
||||
{ label: '不等于', value: '$dateNotOn' },
|
||||
{ label: '早于', value: '$dateBefore' },
|
||||
{ label: '晚于', value: '$dateAfter' },
|
||||
{ label: '不早于', value: '$dateNotBefore' },
|
||||
{ label: '不晚于', value: '$dateNotAfter' },
|
||||
{ label: '非空', value: '$notNull', noValue: true },
|
||||
{ label: '为空', value: '$null', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -1,5 +1,6 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { defaultProps } from './properties';
|
||||
import { string } from './string';
|
||||
|
||||
export const email: ISchema = {
|
||||
name: 'email',
|
||||
@ -23,8 +24,5 @@ export const email: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: string.operations,
|
||||
};
|
||||
|
@ -20,8 +20,4 @@ export const markdown: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
};
|
||||
|
@ -27,7 +27,20 @@ export const multipleSelect: ISchema = {
|
||||
'uiSchema.enum': dataSource,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{
|
||||
label: '等于',
|
||||
value: '$match',
|
||||
selected: true,
|
||||
schema: { 'x-component': 'Select' },
|
||||
},
|
||||
{
|
||||
label: '不等于',
|
||||
value: '$notMatch',
|
||||
schema: { 'x-component': 'Select' },
|
||||
},
|
||||
{ label: '包含', value: '$anyOf', schema: { 'x-component': 'Select' } },
|
||||
{ label: '不包含', value: '$noneOf', schema: { 'x-component': 'Select' } },
|
||||
{ label: '非空', value: '$notNull', noValue: true },
|
||||
{ label: '为空', value: '$null', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -42,7 +42,14 @@ export const number: ISchema = {
|
||||
},
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '等于', value: 'eq', selected: true },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{ label: '大于', value: 'gt' },
|
||||
{ label: '大于等于', value: 'gte' },
|
||||
{ label: '小于', value: 'lt' },
|
||||
{ label: '小于等于', value: 'lte' },
|
||||
// {label: '介于', value: 'between'},
|
||||
{ label: '非空', value: '$notNull', noValue: true },
|
||||
{ label: '为空', value: '$null', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -21,8 +21,4 @@ export const password: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
};
|
||||
|
@ -1,4 +1,5 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { number } from './number';
|
||||
import { defaultProps } from './properties';
|
||||
|
||||
export const percent: ISchema = {
|
||||
@ -42,8 +43,5 @@ export const percent: ISchema = {
|
||||
]
|
||||
},
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: number.operations,
|
||||
};
|
||||
|
@ -1,5 +1,6 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { defaultProps } from './properties';
|
||||
import { string } from './string';
|
||||
|
||||
export const phone: ISchema = {
|
||||
name: 'phone',
|
||||
@ -23,8 +24,5 @@ export const phone: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: string.operations,
|
||||
};
|
||||
|
@ -1,5 +1,6 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { defaultProps, dataSource } from './properties';
|
||||
import { select } from './select';
|
||||
|
||||
export const radioGroup: ISchema = {
|
||||
name: 'radioGroup',
|
||||
@ -22,8 +23,5 @@ export const radioGroup: ISchema = {
|
||||
...defaultProps,
|
||||
'uiSchema.enum': dataSource,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: select.operations,
|
||||
};
|
||||
|
@ -24,7 +24,26 @@ export const select: ISchema = {
|
||||
'uiSchema.enum': dataSource,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{
|
||||
label: '等于',
|
||||
value: 'eq',
|
||||
selected: true,
|
||||
schema: { 'x-component': 'Select' },
|
||||
},
|
||||
{ label: '不等于', value: 'ne', schema: { 'x-component': 'Select' } },
|
||||
{
|
||||
label: '包含',
|
||||
value: 'in',
|
||||
schema: { 'x-component': 'Select', 'x-component-props': { mode: 'tags' } },
|
||||
},
|
||||
{
|
||||
label: '不包含',
|
||||
value: 'notIn',
|
||||
schema: {
|
||||
'x-component': 'Select', 'x-component-props': { mode: 'tags' },
|
||||
},
|
||||
},
|
||||
{ label: '非空', value: '$notNull', noValue: true },
|
||||
{ label: '为空', value: '$null', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -24,7 +24,11 @@ export const string: ISchema = {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '包含', value: '$includes', selected: true },
|
||||
{ label: '不包含', value: '$notIncludes' },
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{ label: '非空', value: '$notNull', noValue: true },
|
||||
{ label: '为空', value: '$null', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -21,8 +21,4 @@ export const textarea: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
};
|
||||
|
@ -40,7 +40,13 @@ export const time: ISchema = {
|
||||
},
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
{ label: '等于', value: 'eq', selected: true },
|
||||
{ label: '不等于', value: 'neq' },
|
||||
{ label: '大于', value: 'gt' },
|
||||
{ label: '大于等于', value: 'gte' },
|
||||
{ label: '小于', value: 'lt' },
|
||||
{ label: '小于等于', value: 'lte' },
|
||||
{ label: '非空', value: '$notNull', noValue: true },
|
||||
{ label: '为空', value: '$null', noValue: true },
|
||||
],
|
||||
};
|
||||
|
@ -1,4 +1,5 @@
|
||||
import { ISchema } from '@formily/react';
|
||||
import { datetime } from './datetime';
|
||||
import { dateTimeProps, defaultProps } from './properties';
|
||||
|
||||
export const updatedAt: ISchema = {
|
||||
@ -26,8 +27,5 @@ export const updatedAt: ISchema = {
|
||||
...defaultProps,
|
||||
...dateTimeProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
operations: datetime.operations,
|
||||
};
|
||||
|
@ -25,8 +25,4 @@ export const updatedBy: ISchema = {
|
||||
properties: {
|
||||
...defaultProps,
|
||||
},
|
||||
operations: [
|
||||
{ label: '等于', value: 'eq' },
|
||||
{ label: '不等于', value: 'ne' },
|
||||
],
|
||||
};
|
||||
|
@ -1,7 +1,21 @@
|
||||
import React, { useContext, useMemo, useState } from 'react';
|
||||
import { SchemaField } from '..';
|
||||
import { createForm, onFieldChange, onFieldReact, onFormValuesChange } from '@formily/core';
|
||||
import { FormProvider, FormConsumer, useFieldSchema, Schema, SchemaOptionsContext, ISchema, SchemaKey } from '@formily/react';
|
||||
import {
|
||||
createForm,
|
||||
onFieldChange,
|
||||
onFieldReact,
|
||||
onFormValuesChange,
|
||||
} from '@formily/core';
|
||||
import {
|
||||
FormProvider,
|
||||
FormConsumer,
|
||||
useFieldSchema,
|
||||
Schema,
|
||||
SchemaOptionsContext,
|
||||
ISchema,
|
||||
SchemaKey,
|
||||
RecursionField,
|
||||
} from '@formily/react';
|
||||
import { Field } from '@formily/core/esm/models/Field';
|
||||
import { Form } from '@formily/core/esm/models/Form';
|
||||
import {
|
||||
@ -15,6 +29,7 @@ import {
|
||||
import { CloseCircleOutlined } from '@ant-design/icons';
|
||||
import { get } from 'lodash';
|
||||
import { isValid } from '@formily/shared';
|
||||
import { useEffect } from 'react';
|
||||
|
||||
function useFilterColumns(): Map<SchemaKey, Schema> {
|
||||
const schema = useFieldSchema();
|
||||
@ -33,7 +48,6 @@ export const FilterItem = (props) => {
|
||||
const { value, initialValues = {}, onRemove, onChange } = props;
|
||||
const options = useContext(SchemaOptionsContext);
|
||||
const columns = useFilterColumns();
|
||||
console.log('FilterItem', value)
|
||||
|
||||
const toValues = (value) => {
|
||||
if (!value) {
|
||||
@ -45,42 +59,49 @@ export const FilterItem = (props) => {
|
||||
const fieldName = Object.keys(value).shift();
|
||||
const nested = value[fieldName];
|
||||
const column = columns.get(fieldName).toJSON();
|
||||
const operations = column?.['x-component-props']?.['operations'] || [];
|
||||
if (!nested) {
|
||||
return {
|
||||
column,
|
||||
}
|
||||
operations,
|
||||
};
|
||||
}
|
||||
if (Object.keys(nested).length === 0) {
|
||||
return {
|
||||
column,
|
||||
}
|
||||
operations,
|
||||
};
|
||||
}
|
||||
const operationValue = Object.keys(nested).shift();
|
||||
console.log('toValues', {operationValue});
|
||||
const operations = column?.['x-component-props']?.['operations']||[];
|
||||
const operation = operations.find(operation => operation.value === operationValue);
|
||||
console.log('toValues', {operation});
|
||||
console.log('toValues', { operationValue });
|
||||
const operation = operations.find(
|
||||
(operation) => operation.value === operationValue,
|
||||
);
|
||||
console.log('toValues', { operation });
|
||||
if (!operation) {
|
||||
return {
|
||||
operations,
|
||||
column,
|
||||
}
|
||||
};
|
||||
}
|
||||
if (operation.noValue) {
|
||||
return {
|
||||
column,
|
||||
operations,
|
||||
operation,
|
||||
}
|
||||
};
|
||||
}
|
||||
return {
|
||||
column,
|
||||
operation,
|
||||
operations,
|
||||
value: nested[operationValue],
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
const values = toValues(value);
|
||||
|
||||
// console.log('toValues', values, value);
|
||||
console.log('toValues', values, value);
|
||||
|
||||
const Remove = (props) => {
|
||||
return (
|
||||
@ -92,11 +113,6 @@ export const FilterItem = (props) => {
|
||||
);
|
||||
};
|
||||
|
||||
const getComponent = (column: ISchema) => {
|
||||
const field = Object.values(column.properties).shift();
|
||||
return field ? get(options.components, field['x-component']) : null;
|
||||
}
|
||||
|
||||
const form = useMemo(
|
||||
() =>
|
||||
createForm({
|
||||
@ -104,16 +120,15 @@ export const FilterItem = (props) => {
|
||||
effects: (form) => {
|
||||
onFieldChange('column', (field: Field, form: Form) => {
|
||||
const column = (field.value || {}) as ISchema;
|
||||
const operations = column?.['x-component-props']?.['operations']||[];
|
||||
const operations =
|
||||
column?.['x-component-props']?.['operations'] || [];
|
||||
field.query('operation').take((f: Field) => {
|
||||
f.setDataSource(operations);
|
||||
f.initialValue = get(operations, [0]);
|
||||
f.value = get(operations, [0]);
|
||||
});
|
||||
field.query('value').take((f: Field) => {
|
||||
f.value = null;
|
||||
const component = getComponent(column);
|
||||
console.log({ component });
|
||||
f.setComponent(component, {});
|
||||
f.value = undefined;
|
||||
f.componentProps.schema = column;
|
||||
});
|
||||
});
|
||||
onFieldReact('operation', (field: Field) => {
|
||||
@ -121,6 +136,10 @@ export const FilterItem = (props) => {
|
||||
const operation = field.value || {};
|
||||
field.query('value').take((f: Field) => {
|
||||
f.visible = !operation.noValue;
|
||||
if (operation.noValue) {
|
||||
f.value = undefined;
|
||||
}
|
||||
f.componentProps.operation = operation;
|
||||
});
|
||||
});
|
||||
onFormValuesChange((form) => {
|
||||
@ -130,16 +149,24 @@ export const FilterItem = (props) => {
|
||||
}
|
||||
const fieldName = Object.keys(column.properties).shift();
|
||||
if (operation?.noValue) {
|
||||
onChange({[fieldName]: {
|
||||
[operation.value]: true,
|
||||
}});
|
||||
} else if (isValid(value)) {
|
||||
onChange({[fieldName]: {
|
||||
[operation.value]: value,
|
||||
}});
|
||||
onChange({
|
||||
[fieldName]: {
|
||||
[operation.value]: true,
|
||||
},
|
||||
});
|
||||
} else {
|
||||
onChange(
|
||||
isValid(value)
|
||||
? {
|
||||
[fieldName]: {
|
||||
[operation.value]: value,
|
||||
},
|
||||
}
|
||||
: {},
|
||||
);
|
||||
}
|
||||
console.log('form.values', form.values);
|
||||
})
|
||||
});
|
||||
},
|
||||
}),
|
||||
[],
|
||||
@ -166,7 +193,7 @@ export const FilterItem = (props) => {
|
||||
fieldNames: {
|
||||
label: 'title',
|
||||
value: 'name',
|
||||
}
|
||||
},
|
||||
}}
|
||||
enum={[...columns.values()].map((column) => column.toJSON())}
|
||||
/>
|
||||
@ -183,16 +210,20 @@ export const FilterItem = (props) => {
|
||||
width: 100,
|
||||
},
|
||||
}}
|
||||
enum={[]}
|
||||
enum={values.operations}
|
||||
/>
|
||||
<SchemaField.String
|
||||
<SchemaField.Object
|
||||
name="value"
|
||||
x-decorator="FormilyFormItem"
|
||||
x-decorator-props={{
|
||||
asterisk: true,
|
||||
feedbackLayout: 'none',
|
||||
}}
|
||||
x-component="Input"
|
||||
x-component="Filter.DynamicValue"
|
||||
x-component-props={{
|
||||
schema: values.column,
|
||||
operation: values.operation,
|
||||
}}
|
||||
/>
|
||||
<SchemaField.Void x-component="Remove" />
|
||||
</SchemaField.Void>
|
||||
|
@ -1,12 +1,29 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import { connect, mapProps, mapReadPretty } from '@formily/react';
|
||||
import {
|
||||
connect,
|
||||
mapProps,
|
||||
mapReadPretty,
|
||||
observer,
|
||||
RecursionField,
|
||||
ISchema,
|
||||
Schema,
|
||||
ArrayField,
|
||||
useField,
|
||||
FormProvider,
|
||||
} from '@formily/react';
|
||||
import { LoadingOutlined } from '@ant-design/icons';
|
||||
import { useDynamicList } from 'ahooks';
|
||||
import { useDynamicList, useMap } from 'ahooks';
|
||||
import { Select } from 'antd';
|
||||
import { CloseCircleOutlined } from '@ant-design/icons';
|
||||
import { FilterItem } from './FilterItem';
|
||||
import cls from 'classnames';
|
||||
import './style.less';
|
||||
import { cloneDeep } from 'lodash';
|
||||
import { uid, isValid } from '@formily/shared';
|
||||
import { SchemaField, SchemaRenderer } from '../../components/schema-renderer';
|
||||
import { useMemo } from 'react';
|
||||
import { createForm, onFormValuesChange } from '@formily/core';
|
||||
import deepmerge from 'deepmerge';
|
||||
|
||||
const toValue = (value) => {
|
||||
if (!value) {
|
||||
@ -36,6 +53,7 @@ const toValue = (value) => {
|
||||
export function FilterGroup(props) {
|
||||
const { bordered = true, onRemove, onChange } = props;
|
||||
const value = toValue(props.value);
|
||||
console.log('list', value);
|
||||
return (
|
||||
<div className={cls('nb-filter-group', { bordered })}>
|
||||
{onRemove && (
|
||||
@ -63,9 +81,12 @@ export function FilterGroup(props) {
|
||||
<FilterList
|
||||
initialValue={value.list}
|
||||
onChange={(list: any[]) => {
|
||||
console.log('list9999', list);
|
||||
onChange &&
|
||||
onChange({
|
||||
[value.logical]: list.filter((item) => Object.keys(item).length),
|
||||
[value.logical]: list.filter(
|
||||
(item) => isValid(item) && Object.keys(item).length,
|
||||
),
|
||||
});
|
||||
}}
|
||||
/>
|
||||
@ -74,23 +95,28 @@ export function FilterGroup(props) {
|
||||
}
|
||||
|
||||
export function FilterList(props) {
|
||||
const { initialValue } = props;
|
||||
const { list, push, remove, replace } = useDynamicList<any>(
|
||||
initialValue || [],
|
||||
const { initialValue = [] } = props;
|
||||
|
||||
const [map, { set, setAll, remove, reset, get }] = useMap<string, any>(
|
||||
initialValue.map((item, index) => {
|
||||
return [`index-${index}`, item];
|
||||
}),
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
props.onChange && props.onChange(list);
|
||||
}, [list]);
|
||||
props.onChange && props.onChange([...map.values()]);
|
||||
}, [map]);
|
||||
|
||||
return (
|
||||
<div className={'nb-filter-list'}>
|
||||
<div>
|
||||
{list.map((item, index) => {
|
||||
{[...map.entries()].map(([index, item]) => {
|
||||
if (item.and || item.or) {
|
||||
return (
|
||||
<FilterGroup
|
||||
key={index}
|
||||
value={item}
|
||||
onChange={(value: any) => replace(index, value)}
|
||||
onChange={(value: any) => set(index, value)}
|
||||
onRemove={() => remove(index)}
|
||||
/>
|
||||
);
|
||||
@ -99,7 +125,7 @@ export function FilterList(props) {
|
||||
<FilterItem
|
||||
key={index}
|
||||
value={item}
|
||||
onChange={(value: any) => replace(index, value)}
|
||||
onChange={(value: any) => set(index, value)}
|
||||
onRemove={() => remove(index)}
|
||||
/>
|
||||
);
|
||||
@ -107,14 +133,14 @@ export function FilterList(props) {
|
||||
</div>
|
||||
<a
|
||||
onClick={() => {
|
||||
push({});
|
||||
set(uid(), {});
|
||||
}}
|
||||
>
|
||||
添加条件
|
||||
</a>{' '}
|
||||
<a
|
||||
onClick={() => {
|
||||
push({
|
||||
set(uid(), {
|
||||
and: [{}],
|
||||
});
|
||||
}}
|
||||
@ -125,7 +151,7 @@ export function FilterList(props) {
|
||||
);
|
||||
}
|
||||
|
||||
export const Filter = connect(
|
||||
export const Filter: any = connect(
|
||||
(props) => {
|
||||
// console.log('Filter.props', { props });
|
||||
return (
|
||||
@ -153,4 +179,64 @@ export const Filter = connect(
|
||||
}),
|
||||
);
|
||||
|
||||
interface DynamicValuePorps {
|
||||
value?: any;
|
||||
onChange?: any;
|
||||
schema?: Schema;
|
||||
operation?: any;
|
||||
}
|
||||
|
||||
Filter.DynamicValue = connect((props: DynamicValuePorps) => {
|
||||
const { onChange, value, operation } = props;
|
||||
const fieldName = Object.keys(props?.schema?.properties || {}).shift();
|
||||
const fieldSchema = Object.values(props?.schema?.properties || {}).shift();
|
||||
console.log('Filter.DynamicValue', fieldSchema, { operation });
|
||||
const form = useMemo(
|
||||
() =>
|
||||
createForm({
|
||||
initialValues: {
|
||||
[fieldName || 'value']: value,
|
||||
},
|
||||
// effects() {
|
||||
// onFormValuesChange((form) => {
|
||||
// onChange(form.values[fieldName]);
|
||||
// });
|
||||
// },
|
||||
}),
|
||||
[value],
|
||||
);
|
||||
const extra: ISchema = deepmerge(
|
||||
{
|
||||
required: false,
|
||||
'x-read-pretty': false,
|
||||
'x-decorator': 'FormilyFormItem',
|
||||
'x-decorator-props': {
|
||||
asterisk: true,
|
||||
feedbackLayout: 'none',
|
||||
},
|
||||
'x-component-props': {
|
||||
onChange,
|
||||
style: {
|
||||
minWidth: '150px',
|
||||
},
|
||||
},
|
||||
},
|
||||
operation?.schema || {},
|
||||
);
|
||||
return (
|
||||
<FormProvider form={form}>
|
||||
<SchemaField
|
||||
schema={{
|
||||
type: 'object',
|
||||
properties: {
|
||||
[fieldName]: deepmerge(fieldSchema, extra, {
|
||||
arrayMerge: (target, source) => source,
|
||||
}),
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</FormProvider>
|
||||
);
|
||||
});
|
||||
|
||||
export default Filter;
|
||||
|
@ -40,15 +40,12 @@ import { useResource as useGeneralResource } from '../../hooks/useResource';
|
||||
import { Resource } from '../../resource';
|
||||
import { BaseResult } from '@ahooksjs/use-request/lib/types';
|
||||
|
||||
export interface FormReadPrettyContextProps {
|
||||
export interface DescriptionsContextProps {
|
||||
resource?: Resource;
|
||||
service?: BaseResult<any, any>;
|
||||
}
|
||||
|
||||
export const FormContext = createContext<FormReadPrettyContextProps>({});
|
||||
export const FormReadPrettyContext = createContext<FormReadPrettyContextProps>(
|
||||
{},
|
||||
);
|
||||
export const DescriptionsContext = createContext<DescriptionsContextProps>({});
|
||||
|
||||
const FormMain = (props: any) => {
|
||||
const {
|
||||
@ -135,9 +132,9 @@ const FormMain = (props: any) => {
|
||||
);
|
||||
|
||||
return schema['x-read-pretty'] ? (
|
||||
<FormReadPrettyContext.Provider value={{ resource, service }}>
|
||||
<DescriptionsContext.Provider value={{ resource, service }}>
|
||||
{content}
|
||||
</FormReadPrettyContext.Provider>
|
||||
</DescriptionsContext.Provider>
|
||||
) : (
|
||||
<>{content}</>
|
||||
);
|
||||
|
@ -70,7 +70,7 @@ import { isValid } from '@formily/shared';
|
||||
import { FormButtonGroup, FormDialog, FormLayout, Submit } from '@formily/antd';
|
||||
import flatten from 'flat';
|
||||
import IconPicker from '../../components/icon-picker';
|
||||
import { FormReadPrettyContext } from '../form';
|
||||
import { DescriptionsContext } from '../form';
|
||||
import { VisibleContext } from '../../context';
|
||||
|
||||
export interface ITableContext {
|
||||
@ -155,7 +155,7 @@ const useTableUpdateAction = () => {
|
||||
} = useTable();
|
||||
const ctx = useContext(TableRowContext);
|
||||
const form = useForm();
|
||||
const { service: formService } = useContext(FormReadPrettyContext);
|
||||
const { service: formService } = useContext(DescriptionsContext);
|
||||
|
||||
return {
|
||||
async run() {
|
||||
|
Loading…
Reference in New Issue
Block a user