tntd 3.0.0-beta.10 → 3.0.0-beta.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/form/form.less +1 -1
- package/es/form/style/index.less +3 -3
- package/es/modal/style/confirm.less +6 -6
- package/es/query-form/Field/Checkbox.js +1 -1
- package/es/query-form/Field/Checkbox.js.map +1 -1
- package/es/query-form/Field/Composition/FieldPopover.js +59 -39
- package/es/query-form/Field/Composition/FieldPopover.js.map +1 -1
- package/es/query-form/Field/Composition/Select.js +17 -14
- package/es/query-form/Field/Composition/Select.js.map +1 -1
- package/es/query-form/Field/Composition/index.js +16 -105
- package/es/query-form/Field/Composition/index.js.map +1 -1
- package/es/query-form/Field/Composition/index.less +1 -1
- package/es/query-form/Field/Composition/utils.js +107 -0
- package/es/query-form/Field/Composition/utils.js.map +1 -1
- package/es/query-form/index.js +146 -319
- package/es/query-form/index.js.map +1 -1
- package/es/query-form/index.less +12 -58
- package/es/query-form2/Field/Checkbox.js +23 -0
- package/es/query-form2/Field/Checkbox.js.map +1 -0
- package/es/query-form2/Field/Composition/FieldPopover.js +308 -0
- package/es/query-form2/Field/Composition/FieldPopover.js.map +1 -0
- package/es/query-form2/Field/Composition/FieldPopover.less +35 -0
- package/es/query-form2/Field/Composition/Select.js +104 -0
- package/es/query-form2/Field/Composition/Select.js.map +1 -0
- package/es/query-form2/Field/Composition/index.js +299 -0
- package/es/query-form2/Field/Composition/index.js.map +1 -0
- package/es/query-form2/Field/Composition/index.less +114 -0
- package/es/query-form2/Field/Composition/utils.js +19 -0
- package/es/query-form2/Field/Composition/utils.js.map +1 -0
- package/es/query-form2/Field/Select.js +59 -0
- package/es/query-form2/Field/Select.js.map +1 -0
- package/es/query-form2/Field/SelectInput.js +87 -0
- package/es/query-form2/Field/SelectInput.js.map +1 -0
- package/es/query-form2/Field/fieldsMap.js +28 -0
- package/es/query-form2/Field/fieldsMap.js.map +1 -0
- package/es/query-form2/Field/index.js +117 -0
- package/es/query-form2/Field/index.js.map +1 -0
- package/es/query-form2/createActions.js +47 -0
- package/es/query-form2/createActions.js.map +1 -0
- package/es/query-form2/index.js +345 -0
- package/es/query-form2/index.js.map +1 -0
- package/es/query-form2/index.less +136 -0
- package/es/query-form2/useForm.js +6 -0
- package/es/query-form2/useForm.js.map +1 -0
- package/es/query-list-scene/QueryForm.js +1 -3
- package/es/query-list-scene/QueryForm.js.map +1 -1
- package/es/select/select.less +1 -0
- package/es/tag/color.less +28 -18
- package/es/tag/tag.less +42 -6
- package/lib/form/form.less +1 -1
- package/lib/form/style/index.less +3 -3
- package/lib/modal/style/confirm.less +6 -6
- package/lib/query-form/Field/Checkbox.js +1 -1
- package/lib/query-form/Field/Checkbox.js.map +1 -1
- package/lib/query-form/Field/Composition/FieldPopover.js +91 -70
- package/lib/query-form/Field/Composition/FieldPopover.js.map +1 -1
- package/lib/query-form/Field/Composition/Select.d.ts.map +1 -1
- package/lib/query-form/Field/Composition/Select.js +18 -15
- package/lib/query-form/Field/Composition/Select.js.map +1 -1
- package/lib/query-form/Field/Composition/index.d.ts +0 -4
- package/lib/query-form/Field/Composition/index.js +29 -121
- package/lib/query-form/Field/Composition/index.js.map +1 -1
- package/lib/query-form/Field/Composition/index.less +1 -1
- package/lib/query-form/Field/Composition/utils.d.ts +16 -0
- package/lib/query-form/Field/Composition/utils.d.ts.map +1 -1
- package/lib/query-form/Field/Composition/utils.js +114 -0
- package/lib/query-form/Field/Composition/utils.js.map +1 -1
- package/lib/query-form/index.d.ts +15 -24
- package/lib/query-form/index.d.ts.map +1 -1
- package/lib/query-form/index.js +165 -344
- package/lib/query-form/index.js.map +1 -1
- package/lib/query-form/index.less +12 -58
- package/lib/query-form2/Field/Checkbox.d.ts +8 -0
- package/lib/query-form2/Field/Checkbox.d.ts.map +1 -0
- package/lib/query-form2/Field/Checkbox.js +28 -0
- package/lib/query-form2/Field/Checkbox.js.map +1 -0
- package/lib/query-form2/Field/Composition/FieldPopover.d.ts +19 -0
- package/lib/query-form2/Field/Composition/FieldPopover.d.ts.map +1 -0
- package/lib/query-form2/Field/Composition/FieldPopover.js +347 -0
- package/lib/query-form2/Field/Composition/FieldPopover.js.map +1 -0
- package/lib/query-form2/Field/Composition/FieldPopover.less +35 -0
- package/lib/query-form2/Field/Composition/Select.d.ts +4 -0
- package/lib/query-form2/Field/Composition/Select.d.ts.map +1 -0
- package/lib/query-form2/Field/Composition/Select.js +128 -0
- package/lib/query-form2/Field/Composition/Select.js.map +1 -0
- package/lib/query-form2/Field/Composition/index.d.ts +14 -0
- package/lib/query-form2/Field/Composition/index.d.ts.map +1 -0
- package/lib/query-form2/Field/Composition/index.js +349 -0
- package/lib/query-form2/Field/Composition/index.js.map +1 -0
- package/lib/query-form2/Field/Composition/index.less +114 -0
- package/lib/query-form2/Field/Composition/utils.d.ts +6 -0
- package/lib/query-form2/Field/Composition/utils.d.ts.map +1 -0
- package/lib/query-form2/Field/Composition/utils.js +27 -0
- package/lib/query-form2/Field/Composition/utils.js.map +1 -0
- package/lib/query-form2/Field/Select.d.ts +4 -0
- package/lib/query-form2/Field/Select.d.ts.map +1 -0
- package/lib/query-form2/Field/Select.js +80 -0
- package/lib/query-form2/Field/Select.js.map +1 -0
- package/lib/query-form2/Field/SelectInput.d.ts +4 -0
- package/lib/query-form2/Field/SelectInput.d.ts.map +1 -0
- package/lib/query-form2/Field/SelectInput.js +100 -0
- package/lib/query-form2/Field/SelectInput.js.map +1 -0
- package/lib/query-form2/Field/fieldsMap.d.ts +27 -0
- package/lib/query-form2/Field/fieldsMap.d.ts.map +1 -0
- package/lib/query-form2/Field/fieldsMap.js +35 -0
- package/lib/query-form2/Field/fieldsMap.js.map +1 -0
- package/lib/query-form2/Field/index.d.ts +14 -0
- package/lib/query-form2/Field/index.d.ts.map +1 -0
- package/lib/query-form2/Field/index.js +147 -0
- package/lib/query-form2/Field/index.js.map +1 -0
- package/lib/query-form2/createActions.d.ts +14 -0
- package/lib/query-form2/createActions.d.ts.map +1 -0
- package/lib/query-form2/createActions.js +54 -0
- package/lib/query-form2/createActions.js.map +1 -0
- package/lib/query-form2/index.d.ts +36 -0
- package/lib/query-form2/index.d.ts.map +1 -0
- package/lib/query-form2/index.js +385 -0
- package/lib/query-form2/index.js.map +1 -0
- package/lib/query-form2/index.less +136 -0
- package/lib/query-form2/useForm.d.ts +13 -0
- package/lib/query-form2/useForm.d.ts.map +1 -0
- package/lib/query-form2/useForm.js +13 -0
- package/lib/query-form2/useForm.js.map +1 -0
- package/lib/query-list-scene/QueryForm.js +2 -3
- package/lib/query-list-scene/QueryForm.js.map +1 -1
- package/lib/select/select.less +1 -0
- package/lib/tag/color.less +28 -18
- package/lib/tag/tag.less +42 -6
- package/package.json +1 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"fieldsMap.js","sourceRoot":"","sources":["../../../src/query-form2/Field/fieldsMap.js"],"names":[],"mappings":"AAAA,OAAO,aAAa,MAAM,YAAY,CAAA;AACtC,OAAO,WAAW,MAAM,UAAU,CAAA;AAClC,OAAO,WAAW,MAAM,eAAe,CAAA;AACvC,OAAO,UAAU,MAAM,mBAAmB,CAAA;AAC1C,OAAO,KAAK,MAAM,aAAa,CAAA;AAC/B,OAAO,WAAW,MAAM,oBAAoB,CAAA;AAE5C,MAAM,CAAC,MAAM,iBAAiB,GAAG,OAAO,CAAA;AAExC,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,EAAE;IACpC,IAAI,IAAI,KAAK,WAAW,EAAE;QACxB,OAAO,OAAO,CAAA;KACf;IAED,OAAO,CACL;QACE,SAAS,EAAE,OAAO;QAClB,WAAW,EAAE,OAAO;KACrB,CAAC,IAAI,CAAC,IAAI,iBAAiB,CAC7B,CAAA;AACH,CAAC,CAAA;AAED,eAAe;IACb,MAAM,EAAE,KAAK,CAAC,MAAM;IACpB,KAAK,EAAE,KAAK,CAAC,MAAM;IACnB,MAAM,EAAE,KAAK,CAAC,MAAM;IACpB,WAAW,EAAE,WAAW;IACxB,MAAM,EAAE,WAAW;IACnB,MAAM,EAAE,WAAW;IACnB,QAAQ,EAAE,aAAa;IACvB,IAAI,EAAE,UAAU;IAChB,SAAS,EAAE,UAAU,CAAC,WAAW;IACjC,WAAW,EAAE,WAAW;CACzB,CAAA","sourcesContent":["import CheckboxField from './Checkbox'\nimport SelectField from './Select'\nimport SelectInput from './SelectInput'\nimport DatePicker from '../../date-picker'\nimport Input from '../../input'\nimport InputNumber from '../../input-number'\n\nexport const defaultFieldWidth = '200px'\n\nexport const getFieldWidth = (type) => {\n if (type === 'dateRange') {\n return '340px'\n }\n\n return (\n {\n dateRange: '340px',\n selectInput: '320px',\n }[type] || defaultFieldWidth\n )\n}\n\nexport default {\n string: Input.Search,\n input: Input.Search,\n search: Input.Search,\n inputNumber: InputNumber,\n number: InputNumber,\n select: SelectField,\n checkbox: CheckboxField,\n date: DatePicker,\n dateRange: DatePicker.RangePicker,\n selectInput: SelectInput,\n}\n"]}
|
|
@@ -0,0 +1,117 @@
|
|
|
1
|
+
import _get from "lodash/get";
|
|
2
|
+
import React, { PureComponent } from 'react';
|
|
3
|
+
import fieldsMap, { getFieldWidth } from './fieldsMap';
|
|
4
|
+
import Form from '../../form';
|
|
5
|
+
const FormItem = Form.Item;
|
|
6
|
+
const isInput = type => ['input', 'string', 'search', 'aloneSearch'].includes(type);
|
|
7
|
+
export default class Field extends PureComponent {
|
|
8
|
+
constructor(props) {
|
|
9
|
+
super(props);
|
|
10
|
+
Object.defineProperty(this, "updateValue", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
configurable: true,
|
|
13
|
+
writable: true,
|
|
14
|
+
value: (name, value) => {
|
|
15
|
+
if (name === this.props.name) {
|
|
16
|
+
this.setState({
|
|
17
|
+
value
|
|
18
|
+
});
|
|
19
|
+
this.props.onChange(name, value);
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
Object.defineProperty(this, "onChange", {
|
|
24
|
+
enumerable: true,
|
|
25
|
+
configurable: true,
|
|
26
|
+
writable: true,
|
|
27
|
+
value: (...args) => {
|
|
28
|
+
const {
|
|
29
|
+
name,
|
|
30
|
+
type = 'input',
|
|
31
|
+
component,
|
|
32
|
+
props: fieldProps
|
|
33
|
+
} = this.props;
|
|
34
|
+
const {
|
|
35
|
+
onChange
|
|
36
|
+
} = fieldProps || {};
|
|
37
|
+
onChange && onChange(...args);
|
|
38
|
+
// Input onChange第一个参数为Event对象,取值特殊处理
|
|
39
|
+
if (!component && isInput(type)) {
|
|
40
|
+
args[0] = _get(args[0], 'target.value');
|
|
41
|
+
}
|
|
42
|
+
this.setState({
|
|
43
|
+
value: args[0]
|
|
44
|
+
});
|
|
45
|
+
this.props.onChange(name, args[0]);
|
|
46
|
+
}
|
|
47
|
+
});
|
|
48
|
+
Object.defineProperty(this, "onFormChange", {
|
|
49
|
+
enumerable: true,
|
|
50
|
+
configurable: true,
|
|
51
|
+
writable: true,
|
|
52
|
+
value: formData => {
|
|
53
|
+
this.setState({
|
|
54
|
+
value: _get(formData, this.props.name)
|
|
55
|
+
});
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
this.state = {
|
|
59
|
+
value: props.initialValue
|
|
60
|
+
};
|
|
61
|
+
}
|
|
62
|
+
render() {
|
|
63
|
+
var _a;
|
|
64
|
+
const {
|
|
65
|
+
type = 'input',
|
|
66
|
+
title,
|
|
67
|
+
name,
|
|
68
|
+
isFieldInDrawer = false,
|
|
69
|
+
className = '',
|
|
70
|
+
component,
|
|
71
|
+
form,
|
|
72
|
+
props: fieldProps
|
|
73
|
+
} = this.props;
|
|
74
|
+
const {
|
|
75
|
+
value
|
|
76
|
+
} = this.state;
|
|
77
|
+
const Field = component || fieldsMap[type];
|
|
78
|
+
return React.createElement(FormItem, {
|
|
79
|
+
label: title,
|
|
80
|
+
className: className
|
|
81
|
+
}, React.createElement(Field, Object.assign({
|
|
82
|
+
form: form,
|
|
83
|
+
value: value
|
|
84
|
+
}, isInput(type) ? {
|
|
85
|
+
onPressEnter: evt => {
|
|
86
|
+
var _a;
|
|
87
|
+
return form.emit('search', {
|
|
88
|
+
[name]: (_a = evt === null || evt === void 0 ? void 0 : evt.target) === null || _a === void 0 ? void 0 : _a.value,
|
|
89
|
+
current: 1
|
|
90
|
+
});
|
|
91
|
+
},
|
|
92
|
+
onSearch: value => form.emit('search', {
|
|
93
|
+
[name]: value,
|
|
94
|
+
current: 1
|
|
95
|
+
})
|
|
96
|
+
} : {}, fieldProps, {
|
|
97
|
+
style: Object.assign(Object.assign({}, fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.style), {
|
|
98
|
+
width: isFieldInDrawer ? '100%' : ((_a = fieldProps === null || fieldProps === void 0 ? void 0 : fieldProps.style) === null || _a === void 0 ? void 0 : _a.width) || getFieldWidth(type)
|
|
99
|
+
}),
|
|
100
|
+
onChange: this.onChange
|
|
101
|
+
})));
|
|
102
|
+
}
|
|
103
|
+
componentDidMount() {
|
|
104
|
+
const {
|
|
105
|
+
form
|
|
106
|
+
} = this.props;
|
|
107
|
+
form.on('setValue', this.updateValue);
|
|
108
|
+
form.on('setValues', this.onFormChange);
|
|
109
|
+
}
|
|
110
|
+
componentWillUnmount() {
|
|
111
|
+
const {
|
|
112
|
+
form
|
|
113
|
+
} = this.props;
|
|
114
|
+
form.off('setValue', this.updateValue);
|
|
115
|
+
form.off('setValues', this.onFormChange);
|
|
116
|
+
}
|
|
117
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/query-form2/Field/index.js"],"names":[],"mappings":"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","sourcesContent":["import React, { PureComponent } from 'react'\nimport { get } from 'lodash'\nimport fieldsMap, { getFieldWidth } from './fieldsMap'\n\nimport Form from '../../form'\n\nconst FormItem = Form.Item\n\nconst isInput = (type) => ['input', 'string', 'search', 'aloneSearch'].includes(type)\n\nexport default class Field extends PureComponent {\n constructor(props) {\n super(props)\n\n this.state = {\n value: props.initialValue,\n }\n }\n\n render () {\n const {\n type = 'input',\n title,\n name,\n isFieldInDrawer = false,\n className = '',\n component,\n form,\n props: fieldProps,\n } = this.props\n const { value } = this.state\n const Field = component || fieldsMap[type]\n\n return (\n <FormItem label={title} className={className}>\n <Field\n form={form}\n value={value}\n {...(isInput(type)\n ? {\n onPressEnter: (evt) =>\n form.emit('search', { [name]: evt?.target?.value, current: 1 }),\n onSearch: (value) => form.emit('search', { [name]: value, current: 1 })\n }\n : {})}\n {...fieldProps}\n style={{\n ...fieldProps?.style,\n width: isFieldInDrawer ? '100%' : fieldProps?.style?.width || getFieldWidth(type),\n }}\n onChange={this.onChange}\n />\n </FormItem>\n )\n }\n\n updateValue = (name, value) => {\n if (name === this.props.name) {\n this.setState({ value })\n this.props.onChange(name, value)\n }\n }\n\n onChange = (...args) => {\n const { name, type = 'input', component, props: fieldProps } = this.props\n const { onChange } = fieldProps || {}\n\n onChange && onChange(...args)\n\n // Input onChange第一个参数为Event对象,取值特殊处理\n if (!component && isInput(type)) {\n args[0] = get(args[0], 'target.value')\n }\n\n this.setState({ value: args[0] })\n this.props.onChange(name, args[0])\n }\n\n onFormChange = (formData) => {\n this.setState({\n value: get(formData, this.props.name),\n })\n }\n\n componentDidMount () {\n const { form } = this.props\n\n form.on('setValue', this.updateValue)\n form.on('setValues', this.onFormChange)\n }\n\n componentWillUnmount () {\n const { form } = this.props\n\n form.off('setValue', this.updateValue)\n form.off('setValues', this.onFormChange)\n }\n}\n"]}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import _set from "lodash/set";
|
|
2
|
+
import _get from "lodash/get";
|
|
3
|
+
import EventEmitter from 'eventemitter3';
|
|
4
|
+
export default (() => {
|
|
5
|
+
const eventEmitter = new EventEmitter();
|
|
6
|
+
const data = {
|
|
7
|
+
initialValues: {},
|
|
8
|
+
values: {}
|
|
9
|
+
};
|
|
10
|
+
return {
|
|
11
|
+
setData(key, value) {
|
|
12
|
+
_set(data, key, value);
|
|
13
|
+
},
|
|
14
|
+
getData(key) {
|
|
15
|
+
_get(data, key);
|
|
16
|
+
},
|
|
17
|
+
setValues(values) {
|
|
18
|
+
data.values = values;
|
|
19
|
+
eventEmitter.emit('setValues', values);
|
|
20
|
+
},
|
|
21
|
+
getValues() {
|
|
22
|
+
return data.values;
|
|
23
|
+
},
|
|
24
|
+
resetValues() {
|
|
25
|
+
data.values = Object.assign({}, data.initialValues);
|
|
26
|
+
eventEmitter.emit('setValues', data.values);
|
|
27
|
+
},
|
|
28
|
+
setValue(name, value) {
|
|
29
|
+
data.values = data.values || {};
|
|
30
|
+
data.values[name] = value;
|
|
31
|
+
eventEmitter.emit('setValue', name, value);
|
|
32
|
+
},
|
|
33
|
+
getValue(name) {
|
|
34
|
+
var _a;
|
|
35
|
+
return (_a = data.values) === null || _a === void 0 ? void 0 : _a[name];
|
|
36
|
+
},
|
|
37
|
+
on: (eventName, callback) => {
|
|
38
|
+
eventEmitter.on(eventName, callback);
|
|
39
|
+
},
|
|
40
|
+
emit: (...args) => {
|
|
41
|
+
eventEmitter.emit(...args);
|
|
42
|
+
},
|
|
43
|
+
off: (...args) => {
|
|
44
|
+
eventEmitter.removeListener(...args);
|
|
45
|
+
}
|
|
46
|
+
};
|
|
47
|
+
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"createActions.js","sourceRoot":"","sources":["../../src/query-form2/createActions.js"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,QAAQ,CAAA;AAEjC,eAAe,GAAG,EAAE;IAClB,MAAM,YAAY,GAAG,IAAI,YAAY,EAAE,CAAA;IACvC,MAAM,IAAI,GAAG;QACX,aAAa,EAAE,EAAE;QACjB,MAAM,EAAE,EAAE;KACX,CAAA;IAED,OAAO;QACL,OAAO,CAAC,GAAG,EAAE,KAAK;YAChB,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,CAAC,CAAA;QACvB,CAAC;QACD,OAAO,CAAC,GAAG;YACT,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;QAChB,CAAC;QAED,SAAS,CAAC,MAAM;YACd,IAAI,CAAC,MAAM,GAAG,MAAM,CAAA;YACpB,YAAY,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,CAAA;QACxC,CAAC;QACD,SAAS;YACP,OAAO,IAAI,CAAC,MAAM,CAAA;QACpB,CAAC;QACD,WAAW;YACT,IAAI,CAAC,MAAM,qBAAQ,IAAI,CAAC,aAAa,CAAE,CAAA;YACvC,YAAY,CAAC,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC,MAAM,CAAC,CAAA;QAC7C,CAAC;QACD,QAAQ,CAAC,IAAI,EAAE,KAAK;YAClB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC,MAAM,IAAI,EAAE,CAAA;YAC/B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,KAAK,CAAA;YACzB,YAAY,CAAC,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE,KAAK,CAAC,CAAA;QAC5C,CAAC;QACD,QAAQ,CAAC,IAAI;;YACX,OAAO,MAAA,IAAI,CAAC,MAAM,0CAAG,IAAI,CAAC,CAAA;QAC5B,CAAC;QAED,EAAE,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,EAAE;YAC1B,YAAY,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAA;QACtC,CAAC;QAED,IAAI,EAAE,CAAC,GAAG,IAAI,EAAE,EAAE;YAChB,YAAY,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAA;QAC5B,CAAC;QAED,GAAG,EAAE,CAAC,GAAG,IAAI,EAAE,EAAE;YACf,YAAY,CAAC,cAAc,CAAC,GAAG,IAAI,CAAC,CAAA;QACtC,CAAC;KACF,CAAA;AACH,CAAC,CAAA","sourcesContent":["import EventEmitter from 'eventemitter3'\nimport { get, set } from 'lodash'\n\nexport default () => {\n const eventEmitter = new EventEmitter()\n const data = {\n initialValues: {},\n values: {},\n }\n\n return {\n setData(key, value) {\n set(data, key, value)\n },\n getData(key) {\n get(data, key)\n },\n\n setValues(values) {\n data.values = values\n eventEmitter.emit('setValues', values)\n },\n getValues() {\n return data.values\n },\n resetValues() {\n data.values = { ...data.initialValues }\n eventEmitter.emit('setValues', data.values)\n },\n setValue(name, value) {\n data.values = data.values || {}\n data.values[name] = value\n eventEmitter.emit('setValue', name, value)\n },\n getValue(name) {\n return data.values?.[name]\n },\n\n on: (eventName, callback) => {\n eventEmitter.on(eventName, callback)\n },\n\n emit: (...args) => {\n eventEmitter.emit(...args)\n },\n\n off: (...args) => {\n eventEmitter.removeListener(...args)\n },\n }\n}\n"]}
|
|
@@ -0,0 +1,345 @@
|
|
|
1
|
+
import _debounce from "lodash/debounce";
|
|
2
|
+
import classnames from 'classnames';
|
|
3
|
+
import React, { createRef } from 'react';
|
|
4
|
+
import createActions from './createActions';
|
|
5
|
+
import Field from './Field';
|
|
6
|
+
import Composition from './Field/Composition';
|
|
7
|
+
import useForm from './useForm';
|
|
8
|
+
import Button from '../button';
|
|
9
|
+
import Form from '../form';
|
|
10
|
+
import { getLanguage, getText } from '../prev-locale';
|
|
11
|
+
import './index.less';
|
|
12
|
+
const clsPrefix = 'tnt-queryform';
|
|
13
|
+
class QueryForm extends React.PureComponent {
|
|
14
|
+
constructor(props) {
|
|
15
|
+
super(props);
|
|
16
|
+
Object.defineProperty(this, "onWindowResize", {
|
|
17
|
+
enumerable: true,
|
|
18
|
+
configurable: true,
|
|
19
|
+
writable: true,
|
|
20
|
+
value: _debounce(() => {
|
|
21
|
+
// const { current } = this.fieldsRef
|
|
22
|
+
// if (current) {
|
|
23
|
+
// setTimeout(() => {
|
|
24
|
+
// this.setState({
|
|
25
|
+
// showMore: this.isFieldsWidthOverflow(),
|
|
26
|
+
// })
|
|
27
|
+
// }, 25)
|
|
28
|
+
// }
|
|
29
|
+
}, 50)
|
|
30
|
+
});
|
|
31
|
+
Object.defineProperty(this, "search", {
|
|
32
|
+
enumerable: true,
|
|
33
|
+
configurable: true,
|
|
34
|
+
writable: true,
|
|
35
|
+
value: params => {
|
|
36
|
+
this.props.onSearch(Object.assign(Object.assign({}, this.form.getValues()), params));
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
Object.defineProperty(this, "onSearch", {
|
|
40
|
+
enumerable: true,
|
|
41
|
+
configurable: true,
|
|
42
|
+
writable: true,
|
|
43
|
+
value: () => {
|
|
44
|
+
var _a, _b;
|
|
45
|
+
console.log('search============');
|
|
46
|
+
(_b = (_a = this.props).onSearch) === null || _b === void 0 ? void 0 : _b.call(_a, this.form.getValues());
|
|
47
|
+
}
|
|
48
|
+
});
|
|
49
|
+
Object.defineProperty(this, "onReset", {
|
|
50
|
+
enumerable: true,
|
|
51
|
+
configurable: true,
|
|
52
|
+
writable: true,
|
|
53
|
+
value: () => {
|
|
54
|
+
const {
|
|
55
|
+
initialValues,
|
|
56
|
+
onReset
|
|
57
|
+
} = this.props;
|
|
58
|
+
this.form.setValues(Object.assign({}, initialValues));
|
|
59
|
+
onReset === null || onReset === void 0 ? void 0 : onReset(initialValues);
|
|
60
|
+
}
|
|
61
|
+
});
|
|
62
|
+
Object.defineProperty(this, "onFieldChange", {
|
|
63
|
+
enumerable: true,
|
|
64
|
+
configurable: true,
|
|
65
|
+
writable: true,
|
|
66
|
+
value: (name, value, ...rest) => {
|
|
67
|
+
const values = this.form.getValues();
|
|
68
|
+
const newValues = Object.assign(Object.assign({}, values), {
|
|
69
|
+
[name]: value
|
|
70
|
+
});
|
|
71
|
+
const changedInfo = {
|
|
72
|
+
name,
|
|
73
|
+
value,
|
|
74
|
+
preValue: values === null || values === void 0 ? void 0 : values[name]
|
|
75
|
+
};
|
|
76
|
+
const {
|
|
77
|
+
onChange
|
|
78
|
+
} = this.props;
|
|
79
|
+
this.form.setData('values', newValues);
|
|
80
|
+
onChange && onChange(newValues, changedInfo, ...rest);
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
Object.defineProperty(this, "onCompositionFieldChange", {
|
|
84
|
+
enumerable: true,
|
|
85
|
+
configurable: true,
|
|
86
|
+
writable: true,
|
|
87
|
+
value: (value, deleteKeys, ...rest) => {
|
|
88
|
+
var _a;
|
|
89
|
+
const values = this.form.getValues();
|
|
90
|
+
const newValues = Object.assign(Object.assign({}, values), value);
|
|
91
|
+
if (deleteKeys === null || deleteKeys === void 0 ? void 0 : deleteKeys.length) {
|
|
92
|
+
deleteKeys === null || deleteKeys === void 0 ? void 0 : deleteKeys.forEach(key => {
|
|
93
|
+
if (values === null || values === void 0 ? void 0 : values[key]) {
|
|
94
|
+
delete newValues[key];
|
|
95
|
+
}
|
|
96
|
+
});
|
|
97
|
+
}
|
|
98
|
+
this.form.setData('values', newValues);
|
|
99
|
+
const {
|
|
100
|
+
onChange
|
|
101
|
+
} = this.props;
|
|
102
|
+
if (onChange) {
|
|
103
|
+
(_a = Object.keys(values)) === null || _a === void 0 ? void 0 : _a.forEach(key => {
|
|
104
|
+
if (JSON.stringify(value[key]) !== JSON.stringify(values[key] || '')) {
|
|
105
|
+
const changedInfo = {
|
|
106
|
+
name: key,
|
|
107
|
+
value: value[key],
|
|
108
|
+
preValue: values === null || values === void 0 ? void 0 : values[key]
|
|
109
|
+
};
|
|
110
|
+
onChange(newValues, changedInfo, ...rest);
|
|
111
|
+
}
|
|
112
|
+
});
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
});
|
|
116
|
+
Object.defineProperty(this, "addResizeListener", {
|
|
117
|
+
enumerable: true,
|
|
118
|
+
configurable: true,
|
|
119
|
+
writable: true,
|
|
120
|
+
value: () => {
|
|
121
|
+
if ('ResizeObserver' in window) {
|
|
122
|
+
const {
|
|
123
|
+
current
|
|
124
|
+
} = this.fieldsRef;
|
|
125
|
+
if (current) {
|
|
126
|
+
const observer = new ResizeObserver(this.onWindowResize);
|
|
127
|
+
observer.observe(current);
|
|
128
|
+
return () => observer.disconnect();
|
|
129
|
+
}
|
|
130
|
+
} else {
|
|
131
|
+
window.addEventListener('resize', this.onWindowResize);
|
|
132
|
+
return () => window.removeEventListener('resize', this.onWindowResize);
|
|
133
|
+
}
|
|
134
|
+
}
|
|
135
|
+
});
|
|
136
|
+
const {
|
|
137
|
+
form,
|
|
138
|
+
initialValues,
|
|
139
|
+
showExpand = true,
|
|
140
|
+
renderActions
|
|
141
|
+
} = props;
|
|
142
|
+
this.state = {
|
|
143
|
+
actionWidth: 0
|
|
144
|
+
};
|
|
145
|
+
this.fieldsRef = createRef();
|
|
146
|
+
this.formBoxRef = createRef();
|
|
147
|
+
this.actionRef = createRef();
|
|
148
|
+
this.form = form || createActions();
|
|
149
|
+
this.form.setData('initialValues', initialValues);
|
|
150
|
+
this.form.setData('values', Object.assign({}, initialValues));
|
|
151
|
+
}
|
|
152
|
+
render() {
|
|
153
|
+
const {
|
|
154
|
+
children,
|
|
155
|
+
className = '',
|
|
156
|
+
initialValues = {},
|
|
157
|
+
renderActions,
|
|
158
|
+
showSearch = false,
|
|
159
|
+
showReset = false,
|
|
160
|
+
showFieldCount = 3,
|
|
161
|
+
drawerProps = {},
|
|
162
|
+
size
|
|
163
|
+
} = this.props;
|
|
164
|
+
const extraActions = this.props.extraActions;
|
|
165
|
+
const {
|
|
166
|
+
actionWidth
|
|
167
|
+
} = this.state;
|
|
168
|
+
const renderFormActions = renderActions || (() => React.createElement(React.Fragment, null, showSearch && React.createElement(Button, {
|
|
169
|
+
type: "primary",
|
|
170
|
+
onClick: this.onSearch
|
|
171
|
+
}, this.getText('search')), showReset && React.createElement(Button, {
|
|
172
|
+
onClick: this.onReset
|
|
173
|
+
}, this.getText('reset')), React.Children.map(children, child => {
|
|
174
|
+
var _a;
|
|
175
|
+
return child && ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.align) === 'right' && React.cloneElement(child);
|
|
176
|
+
})));
|
|
177
|
+
return React.createElement("div", {
|
|
178
|
+
ref: this.formBoxRef,
|
|
179
|
+
className: classnames(clsPrefix, {
|
|
180
|
+
[className]: className
|
|
181
|
+
})
|
|
182
|
+
}, React.createElement(Form, {
|
|
183
|
+
layout: "inline",
|
|
184
|
+
className: classnames({
|
|
185
|
+
expanded: true
|
|
186
|
+
})
|
|
187
|
+
}, React.createElement("div", {
|
|
188
|
+
ref: this.fieldsRef,
|
|
189
|
+
style: {
|
|
190
|
+
width: '100%'
|
|
191
|
+
}
|
|
192
|
+
}, this.renderFields(children, initialValues, showFieldCount, actionWidth)), React.createElement("div", {
|
|
193
|
+
ref: this.actionRef,
|
|
194
|
+
className: `${clsPrefix}-actions`
|
|
195
|
+
}, renderFormActions(), extraActions && React.createElement("div", {
|
|
196
|
+
className: `${clsPrefix}-extra`
|
|
197
|
+
}, extraActions))));
|
|
198
|
+
}
|
|
199
|
+
getText(key) {
|
|
200
|
+
return getText(key, this.props.language || getLanguage());
|
|
201
|
+
}
|
|
202
|
+
isFieldsWidthOverflow() {
|
|
203
|
+
const {
|
|
204
|
+
current
|
|
205
|
+
} = this.fieldsRef;
|
|
206
|
+
if (current) {
|
|
207
|
+
return parseFloat(window.getComputedStyle(current).width, 10) < [].reduce.call(current.children, (acc, cur) => {
|
|
208
|
+
const {
|
|
209
|
+
margin,
|
|
210
|
+
width
|
|
211
|
+
} = window.getComputedStyle(cur);
|
|
212
|
+
const marginArray = margin.split(' ').map(str => parseFloat(str, 10));
|
|
213
|
+
acc += parseFloat(width, 10) + marginArray[1];
|
|
214
|
+
return acc;
|
|
215
|
+
}, 0);
|
|
216
|
+
}
|
|
217
|
+
return false;
|
|
218
|
+
}
|
|
219
|
+
updateFieldHeight() {
|
|
220
|
+
var _a, _b, _c;
|
|
221
|
+
const {
|
|
222
|
+
formBoxRef,
|
|
223
|
+
fieldsRef
|
|
224
|
+
} = this;
|
|
225
|
+
const getFieldHeight = () => {
|
|
226
|
+
var _a;
|
|
227
|
+
const {
|
|
228
|
+
current
|
|
229
|
+
} = fieldsRef;
|
|
230
|
+
let height = '32px';
|
|
231
|
+
if (current && ((_a = current.children) === null || _a === void 0 ? void 0 : _a[0])) {
|
|
232
|
+
height = window.getComputedStyle(current.children[0]).height;
|
|
233
|
+
}
|
|
234
|
+
return height;
|
|
235
|
+
};
|
|
236
|
+
const queryFormActionsDom = (_a = formBoxRef === null || formBoxRef === void 0 ? void 0 : formBoxRef.current) === null || _a === void 0 ? void 0 : _a.querySelector(`.${clsPrefix}-actions`);
|
|
237
|
+
const queryFormExtraDom = (_b = formBoxRef === null || formBoxRef === void 0 ? void 0 : formBoxRef.current) === null || _b === void 0 ? void 0 : _b.querySelector(`.${clsPrefix}-extra`);
|
|
238
|
+
const formItemsDomList = (_c = fieldsRef === null || fieldsRef === void 0 ? void 0 : fieldsRef.current) === null || _c === void 0 ? void 0 : _c.querySelectorAll('.ant-form-item-control');
|
|
239
|
+
const fieldHeight = getFieldHeight();
|
|
240
|
+
fieldsRef.current.style.height = fieldHeight;
|
|
241
|
+
[queryFormActionsDom, queryFormExtraDom].forEach(item => {
|
|
242
|
+
item && Object.assign(item.style, {
|
|
243
|
+
height: fieldHeight,
|
|
244
|
+
lineHeight: fieldHeight
|
|
245
|
+
});
|
|
246
|
+
});
|
|
247
|
+
[].forEach.call(formItemsDomList, item => {
|
|
248
|
+
item.style.lineHeight = fieldHeight;
|
|
249
|
+
});
|
|
250
|
+
}
|
|
251
|
+
componentDidMount() {
|
|
252
|
+
const {
|
|
253
|
+
current
|
|
254
|
+
} = this.fieldsRef;
|
|
255
|
+
const {
|
|
256
|
+
showFieldCount,
|
|
257
|
+
showExpand = true
|
|
258
|
+
} = this.props;
|
|
259
|
+
// 获取节点宽度
|
|
260
|
+
const width = this.actionRef.current.offsetWidth;
|
|
261
|
+
// 更新state
|
|
262
|
+
this.setState({
|
|
263
|
+
actionWidth: width
|
|
264
|
+
});
|
|
265
|
+
this.updateFieldHeight();
|
|
266
|
+
this.form.on('search', this.search);
|
|
267
|
+
// 未设置第一行显示数量且禁止了展开操作 或 自定义了操作区域,则不需要处理展开计算逻辑
|
|
268
|
+
// || renderActions
|
|
269
|
+
if (!showFieldCount && !showExpand) {
|
|
270
|
+
return;
|
|
271
|
+
}
|
|
272
|
+
if (!showFieldCount) {
|
|
273
|
+
this.removeResizeListener = this.addResizeListener();
|
|
274
|
+
}
|
|
275
|
+
}
|
|
276
|
+
componentWillUnmount() {
|
|
277
|
+
var _a;
|
|
278
|
+
(_a = this.removeResizeListener) === null || _a === void 0 ? void 0 : _a.call(this);
|
|
279
|
+
// this.form.off('setValues', this.updateDrawerFieldsValueCount)
|
|
280
|
+
// this.form.off('setValue', this.updateDrawerFieldsValueCount)
|
|
281
|
+
this.form.off('search', this.search);
|
|
282
|
+
}
|
|
283
|
+
renderFields(children, initialValues, showFieldCount, actionWidth) {
|
|
284
|
+
const rest = [];
|
|
285
|
+
// const size = React.Children.count(children)
|
|
286
|
+
let size = 0;
|
|
287
|
+
React.Children.map(children, child => {
|
|
288
|
+
if (child && child.isGroup !== false) {
|
|
289
|
+
size++;
|
|
290
|
+
}
|
|
291
|
+
});
|
|
292
|
+
let fields = null;
|
|
293
|
+
if (size <= showFieldCount) {
|
|
294
|
+
// 过滤器不超过3个
|
|
295
|
+
fields = React.Children.map(children, (child, index) => {
|
|
296
|
+
var _a, _b;
|
|
297
|
+
if (child && ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.align) !== 'right') {
|
|
298
|
+
return React.cloneElement(child, {
|
|
299
|
+
form: this.form,
|
|
300
|
+
initialValue: initialValues === null || initialValues === void 0 ? void 0 : initialValues[(_b = child.props) === null || _b === void 0 ? void 0 : _b.name],
|
|
301
|
+
onChange: this.onFieldChange
|
|
302
|
+
});
|
|
303
|
+
}
|
|
304
|
+
return;
|
|
305
|
+
});
|
|
306
|
+
} else {
|
|
307
|
+
fields = React.Children.map(children, (child, index) => {
|
|
308
|
+
var _a, _b;
|
|
309
|
+
if (child && ((_a = child === null || child === void 0 ? void 0 : child.props) === null || _a === void 0 ? void 0 : _a.align) !== 'right') {
|
|
310
|
+
const {
|
|
311
|
+
isGroup = true
|
|
312
|
+
} = child === null || child === void 0 ? void 0 : child.props;
|
|
313
|
+
if (!isGroup) {
|
|
314
|
+
return React.cloneElement(child, {
|
|
315
|
+
form: this.form,
|
|
316
|
+
initialValue: initialValues === null || initialValues === void 0 ? void 0 : initialValues[(_b = child.props) === null || _b === void 0 ? void 0 : _b.name],
|
|
317
|
+
onChange: this.onFieldChange
|
|
318
|
+
});
|
|
319
|
+
} else {
|
|
320
|
+
rest.push(child);
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
return;
|
|
324
|
+
});
|
|
325
|
+
}
|
|
326
|
+
return React.createElement("div", {
|
|
327
|
+
style: {
|
|
328
|
+
marginRight: actionWidth
|
|
329
|
+
}
|
|
330
|
+
}, fields, !!(rest === null || rest === void 0 ? void 0 : rest.length) && React.createElement(Composition, {
|
|
331
|
+
clsPrefix: clsPrefix,
|
|
332
|
+
fieldItems: rest,
|
|
333
|
+
initialValues: initialValues,
|
|
334
|
+
onChange: this.onCompositionFieldChange,
|
|
335
|
+
form: this.form,
|
|
336
|
+
style: {
|
|
337
|
+
marginRight: (fields === null || fields === void 0 ? void 0 : fields.length) > 0 ? 10 - actionWidth : 10
|
|
338
|
+
}
|
|
339
|
+
}));
|
|
340
|
+
}
|
|
341
|
+
}
|
|
342
|
+
QueryForm.Field = Field;
|
|
343
|
+
QueryForm.useForm = useForm;
|
|
344
|
+
QueryForm.createForm = createActions;
|
|
345
|
+
export default QueryForm;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/query-form2/index.js"],"names":[],"mappings":"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","sourcesContent":["import classnames from 'classnames'\nimport { debounce } from 'lodash'\nimport React, { createRef } from 'react'\nimport createActions from './createActions'\nimport Field from './Field'\nimport Composition from './Field/Composition'\nimport useForm from './useForm'\n\nimport Button from '../button'\nimport Form from '../form'\nimport { getLanguage, getText } from '../prev-locale'\n\nimport './index.less'\n\nconst clsPrefix = 'tnt-queryform'\n\nclass QueryForm extends React.PureComponent {\n constructor(props) {\n super(props)\n const { form, initialValues, showExpand = true, renderActions } = props\n this.state = {\n actionWidth: 0,\n }\n this.fieldsRef = createRef()\n this.formBoxRef = createRef()\n this.actionRef = createRef()\n\n this.form = form || createActions()\n this.form.setData('initialValues', initialValues)\n this.form.setData('values', { ...initialValues })\n }\n\n render() {\n const {\n children,\n className = '',\n initialValues = {},\n renderActions,\n showSearch = false,\n showReset = false,\n showFieldCount = 3,\n drawerProps = {},\n size,\n } = this.props\n const extraActions = this.props.extraActions\n const { actionWidth } = this.state\n const renderFormActions =\n renderActions ||\n (() => (\n <>\n {showSearch && (\n <Button type=\"primary\" onClick={this.onSearch}>\n {this.getText('search')}\n </Button>\n )}\n {showReset && <Button onClick={this.onReset}>{this.getText('reset')}</Button>}\n\n {React.Children.map(\n children,\n (child) => child && child?.props?.align === 'right' && React.cloneElement(child)\n )}\n </>\n ))\n\n return (\n <div ref={this.formBoxRef} className={classnames(clsPrefix, { [className]: className })}>\n <Form layout=\"inline\" className={classnames({ expanded: true })}>\n <div ref={this.fieldsRef} style={{ width: '100%' }}>\n {this.renderFields(children, initialValues, showFieldCount, actionWidth)}\n </div>\n <div ref={this.actionRef} className={`${clsPrefix}-actions`}>\n {renderFormActions()}\n {extraActions && <div className={`${clsPrefix}-extra`}>{extraActions}</div>}\n </div>\n </Form>\n </div>\n )\n }\n\n getText(key) {\n return getText(key, this.props.language || getLanguage())\n }\n\n isFieldsWidthOverflow() {\n const { current } = this.fieldsRef\n\n if (current) {\n return (\n parseFloat(window.getComputedStyle(current).width, 10) <\n [].reduce.call(\n current.children,\n (acc, cur) => {\n const { margin, width } = window.getComputedStyle(cur)\n const marginArray = margin.split(' ').map((str) => parseFloat(str, 10))\n acc += parseFloat(width, 10) + marginArray[1]\n return acc\n },\n 0\n )\n )\n }\n\n return false\n }\n\n updateFieldHeight() {\n const { formBoxRef, fieldsRef } = this\n const getFieldHeight = () => {\n const { current } = fieldsRef\n let height = '32px'\n\n if (current && current.children?.[0]) {\n height = window.getComputedStyle(current.children[0]).height\n }\n\n return height\n }\n const queryFormActionsDom = formBoxRef?.current?.querySelector(`.${clsPrefix}-actions`)\n const queryFormExtraDom = formBoxRef?.current?.querySelector(`.${clsPrefix}-extra`)\n const formItemsDomList = fieldsRef?.current?.querySelectorAll('.ant-form-item-control')\n const fieldHeight = getFieldHeight()\n\n fieldsRef.current.style.height = fieldHeight\n ;[queryFormActionsDom, queryFormExtraDom].forEach((item) => {\n item &&\n Object.assign(item.style, {\n height: fieldHeight,\n lineHeight: fieldHeight,\n })\n })\n ;[].forEach.call(formItemsDomList, (item) => {\n item.style.lineHeight = fieldHeight\n })\n }\n\n onWindowResize = debounce(() => {\n // const { current } = this.fieldsRef\n // if (current) {\n // setTimeout(() => {\n // this.setState({\n // showMore: this.isFieldsWidthOverflow(),\n // })\n // }, 25)\n // }\n }, 50)\n\n search = (params) => {\n this.props.onSearch({\n ...this.form.getValues(),\n ...params,\n })\n }\n\n onSearch = () => {\n console.log('search============')\n this.props.onSearch?.(this.form.getValues())\n }\n\n onReset = () => {\n const { initialValues, onReset } = this.props\n\n this.form.setValues({ ...initialValues })\n onReset?.(initialValues)\n }\n\n onFieldChange = (name, value, ...rest) => {\n const values = this.form.getValues()\n const newValues = {\n ...values,\n [name]: value,\n }\n const changedInfo = { name, value, preValue: values?.[name] }\n const { onChange } = this.props\n\n this.form.setData('values', newValues)\n\n onChange && onChange(newValues, changedInfo, ...rest)\n }\n onCompositionFieldChange = (value, deleteKeys, ...rest) => {\n const values = this.form.getValues()\n const newValues = {\n ...values,\n ...value,\n }\n if (deleteKeys?.length) {\n deleteKeys?.forEach((key) => {\n if (values?.[key]) {\n delete newValues[key]\n }\n })\n }\n this.form.setData('values', newValues)\n const { onChange } = this.props\n if (onChange) {\n Object.keys(values)?.forEach((key) => {\n if (JSON.stringify(value[key]) !== JSON.stringify(values[key] || '')) {\n const changedInfo = { name: key, value: value[key], preValue: values?.[key] }\n onChange(newValues, changedInfo, ...rest)\n }\n })\n }\n }\n\n addResizeListener = () => {\n if ('ResizeObserver' in window) {\n const { current } = this.fieldsRef\n if (current) {\n const observer = new ResizeObserver(this.onWindowResize)\n\n observer.observe(current)\n\n return () => observer.disconnect()\n }\n } else {\n window.addEventListener('resize', this.onWindowResize)\n return () => window.removeEventListener('resize', this.onWindowResize)\n }\n }\n\n componentDidMount() {\n const { current } = this.fieldsRef\n const { showFieldCount, showExpand = true } = this.props\n // 获取节点宽度\n const width = this.actionRef.current.offsetWidth\n // 更新state\n this.setState({ actionWidth: width })\n this.updateFieldHeight()\n\n this.form.on('search', this.search)\n\n // 未设置第一行显示数量且禁止了展开操作 或 自定义了操作区域,则不需要处理展开计算逻辑\n // || renderActions\n if (!showFieldCount && !showExpand) {\n return\n }\n\n if (!showFieldCount) {\n this.removeResizeListener = this.addResizeListener()\n }\n }\n\n componentWillUnmount() {\n this.removeResizeListener?.()\n // this.form.off('setValues', this.updateDrawerFieldsValueCount)\n // this.form.off('setValue', this.updateDrawerFieldsValueCount)\n this.form.off('search', this.search)\n }\n\n renderFields(children, initialValues, showFieldCount, actionWidth) {\n const rest = []\n // const size = React.Children.count(children)\n let size = 0\n React.Children.map(children, (child) => {\n if (child && child.isGroup !== false) {\n size++\n }\n })\n let fields = null\n if (size <= showFieldCount) {\n // 过滤器不超过3个\n fields = React.Children.map(children, (child, index) => {\n if (child && child?.props?.align !== 'right') {\n return React.cloneElement(child, {\n form: this.form,\n initialValue: initialValues?.[child.props?.name],\n onChange: this.onFieldChange,\n })\n }\n return\n })\n } else {\n fields = React.Children.map(children, (child, index) => {\n if (child && child?.props?.align !== 'right') {\n const { isGroup = true } = child?.props\n if (!isGroup) {\n return React.cloneElement(child, {\n form: this.form,\n initialValue: initialValues?.[child.props?.name],\n onChange: this.onFieldChange,\n })\n } else {\n rest.push(child)\n }\n }\n return\n })\n }\n\n return (\n <div style={{ marginRight: actionWidth }}>\n {fields}\n {!!rest?.length && (\n <Composition\n clsPrefix={clsPrefix}\n fieldItems={rest}\n initialValues={initialValues}\n onChange={this.onCompositionFieldChange}\n form={this.form}\n style={{ marginRight: fields?.length > 0 ? 10 - actionWidth : 10 }}\n />\n )}\n </div>\n )\n }\n}\n\nQueryForm.Field = Field\nQueryForm.useForm = useForm\nQueryForm.createForm = createActions\n\nexport default QueryForm\n"]}
|