@para-ui/core 3.0.95 → 3.0.96-rc.1
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/AutoBox/index.js +5 -9
- package/AutoTips/index.js +4 -11
- package/Breadcrumbs/index.js +7 -11
- package/Button/index.js +8 -12
- package/ButtonGroup/index.js +8 -12
- package/Carousel/index.js +4 -8
- package/Cascader/index.js +7 -11
- package/Checkbox/index.js +4 -8
- package/CheckboxGroup/index.js +4 -8
- package/Collapse/index.js +1 -5
- package/CollapseBox/index.js +4 -8
- package/CollapseLayout/index.js +6 -10
- package/ColorPicker/index.js +0 -2
- package/ComboSelect/index.js +14 -18
- package/Container/index.js +1 -5
- package/DatePicker/index.js +10 -14
- package/Desktop/index.js +10 -14
- package/DragVerify/index.js +6 -10
- package/Drawer/index.js +8 -12
- package/Dropdown/index.js +3 -4
- package/DynamicMultiBox/index.js +15 -19
- package/Empty/index.js +3 -7
- package/Form/index.js +15 -16
- package/FormItem/index.js +15 -16
- package/FunctionModal/index.js +14 -15
- package/GlobalContext/index.js +3 -3
- package/Help/index.js +4 -8
- package/HelperText/index.js +1 -5
- package/InputLang/index.js +11 -15
- package/InputNumber/index.js +4 -8
- package/Label/index.js +4 -8
- package/Loading/index.js +1 -5
- package/Menu/index.js +5 -9
- package/Message/index.js +4 -8
- package/Modal/index.js +10 -17
- package/MultiBox/index.js +10 -14
- package/Notification/index.js +3 -7
- package/OperateBtn/index.js +9 -13
- package/PageHeader/index.js +9 -13
- package/Pagination/index.js +11 -15
- package/ParauiProvider/index.d.ts +1 -0
- package/ParauiProvider/index.js +3 -7
- package/PasswordRules/index.js +3 -7
- package/PopConfirm/index.js +8 -12
- package/Popover/index.js +5 -9
- package/Progress/index.js +2 -6
- package/Querying/index.js +3 -7
- package/README.md +19 -0
- package/Radio/index.js +4 -8
- package/RadioGroup/index.js +4 -8
- package/Search/index.js +9 -13
- package/Select/index.js +11 -15
- package/SelectInput/index.js +11 -12
- package/Selector/index.js +11 -24
- package/SelectorPicker/index.js +12 -16
- package/SingleBox/index.js +10 -14
- package/Slider/index.js +6 -10
- package/Split/index.js +4 -8
- package/Status/index.js +1 -5
- package/Stepper/index.js +3 -7
- package/Styles/theme/theme-api.scss +76 -0
- package/Styles/theme/theme-default.scss +74 -0
- package/Styles/theme.scss +1 -69
- package/Switch/index.js +6 -10
- package/Table/index.js +12 -37
- package/Tabs/index.js +9 -13
- package/Tag/index.js +7 -11
- package/TextEditor/index.js +5 -12
- package/TextField/index.js +8 -12
- package/TimePicker/index.js +10 -11
- package/Timeline/index.js +4 -8
- package/Title/index.js +1 -5
- package/ToggleButton/index.js +9 -13
- package/Tooltip/index.js +4 -8
- package/Transfer/index.js +13 -17
- package/Tree/index.js +12 -13
- package/Upload/index.js +12 -28
- package/_verture/{index-be25b2bc.js → closestPolyfill-57c394ac.js} +8 -15
- package/_verture/closestPolyfill-9c8b6ff7.js +1354 -0
- package/_verture/constant-b1618985.js +10 -0
- package/_verture/{defineProperty-62acccfc.js → defineProperty-0addcf57.js} +1 -1
- package/_verture/defineProperty-f26cc14c.js +34 -0
- package/_verture/{index-417e619f.js → index-0b936b3e.js} +4 -11
- package/_verture/{index-77f9e0fb.js → index-431057df.js} +2 -6
- package/_verture/index-84131e92.js +340 -0
- package/_verture/index-8ca6c05d.js +18 -0
- package/_verture/index-9653d78b.js +757 -0
- package/_verture/index-eec527d0.js +232 -0
- package/_verture/{intl-4a9f1b44.js → intl-7231e638.js} +1 -1
- package/_verture/intl-a3ee5ab8.js +81 -0
- package/_verture/{modalContext-630bdb73.js → modalContext-22f97a52.js} +4 -8
- package/_verture/modalContext-8df95eb3.js +197 -0
- package/_verture/{slicedToArray-76060636.js → slicedToArray-2d4d3467.js} +1 -1
- package/_verture/slicedToArray-8deb3578.js +43 -0
- package/_verture/sortable.esm-94c760b1.js +3791 -0
- package/_verture/{toConsumableArray-81040c9e.js → toConsumableArray-5bdfbae3.js} +1 -1
- package/_verture/toConsumableArray-afb9b9b3.js +19 -0
- package/_verture/tslib.es6-f574384f.js +38 -0
- package/_verture/typeof-c65d5e05.js +11 -0
- package/_verture/unsupportedIterableToArray-c0b8859b.js +16 -0
- package/_verture/useFormatMessage-9bed27d9.js +20 -0
- package/_verture/useGlobalProps-df485a49.js +11 -0
- package/_verture/usePopupContainer-84b903f8.js +68 -0
- package/_verture/util-fe22e95b.js +18 -0
- package/_verture/{utils-c9b9a157.js → utils-9c397877.js} +1 -1
- package/_verture/utils-e2cbc5cc.js +77 -0
- package/index.js +20 -22
- package/package.json +4 -1
- package/theme/theme-api.css +14173 -0
- package/theme/theme.css +14569 -0
- package/umd/ParauiProvider.js +1 -1
- package/_verture/index-a369ca3f.js +0 -4
- package/_verture/style-inject.es-300983ab.js +0 -28
- /package/_verture/{constant-66aa48a1.js → constant-275ff428.js} +0 -0
- /package/_verture/{index-beef914f.js → index-2735d05f.js} +0 -0
- /package/_verture/{index-65bbd1e4.js → index-87cc000e.js} +0 -0
- /package/_verture/{sortable.esm-49896035.js → sortable.esm-88470b45.js} +0 -0
- /package/_verture/{tslib.es6-55ed4bd2.js → tslib.es6-e2e910ac.js} +0 -0
- /package/_verture/{typeof-498dd2b1.js → typeof-9729bed8.js} +0 -0
- /package/_verture/{unsupportedIterableToArray-cb478f24.js → unsupportedIterableToArray-a8ee4e21.js} +0 -0
- /package/_verture/{useFormatMessage-703f8b20.js → useFormatMessage-312532ce.js} +0 -0
- /package/_verture/{useGlobalProps-1b846a65.js → useGlobalProps-b358c445.js} +0 -0
- /package/_verture/{usePopupContainer-87febeb9.js → usePopupContainer-047e02bc.js} +0 -0
- /package/_verture/{util-7e1fb1e2.js → util-bd3b788c.js} +0 -0
|
@@ -0,0 +1,757 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import React__default from 'react';
|
|
3
|
+
import { _ as _slicedToArray } from './slicedToArray-8deb3578.js';
|
|
4
|
+
import { TextField } from '../TextField/index.js';
|
|
5
|
+
import { RadioGroup } from '../RadioGroup/index.js';
|
|
6
|
+
import Select from '../Select/index.js';
|
|
7
|
+
import { CheckboxGroup } from '../CheckboxGroup/index.js';
|
|
8
|
+
import { _ as _typeof } from './typeof-9729bed8.js';
|
|
9
|
+
import { Switch } from '../Switch/index.js';
|
|
10
|
+
import Delete from '@para-ui/icons/Delete';
|
|
11
|
+
import ParaLinkGroup from '@para-ui/icons/LinkGroup';
|
|
12
|
+
import AutoTips from '../AutoTips/index.js';
|
|
13
|
+
import { Button } from '../Button/index.js';
|
|
14
|
+
import { u as useFormatMessage } from './useFormatMessage-312532ce.js';
|
|
15
|
+
import { InputNumber } from '../InputNumber/index.js';
|
|
16
|
+
import { ComboSelect } from '../ComboSelect/index.js';
|
|
17
|
+
import HelperText from '../HelperText/index.js';
|
|
18
|
+
import clsx from 'clsx';
|
|
19
|
+
import Label from '../Label/index.js';
|
|
20
|
+
import { $ as $prefixCls } from './constant-275ff428.js';
|
|
21
|
+
|
|
22
|
+
var FormRadioGroup = function FormRadioGroup(props) {
|
|
23
|
+
var defaultValue = props.defaultValue,
|
|
24
|
+
change = props.change;
|
|
25
|
+
/**
|
|
26
|
+
* 选中的值
|
|
27
|
+
*/
|
|
28
|
+
var _React$useState = React__default.useState(defaultValue === undefined ? "" : defaultValue),
|
|
29
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
30
|
+
selectValue = _React$useState2[0],
|
|
31
|
+
setSelectValue = _React$useState2[1];
|
|
32
|
+
/**
|
|
33
|
+
* 选中值改变
|
|
34
|
+
*/
|
|
35
|
+
var changeValue = function changeValue(value) {
|
|
36
|
+
setSelectValue(value);
|
|
37
|
+
change && change(value);
|
|
38
|
+
};
|
|
39
|
+
return jsx(RadioGroup, Object.assign({
|
|
40
|
+
value: selectValue,
|
|
41
|
+
onChange: changeValue,
|
|
42
|
+
hideErrorDom: null
|
|
43
|
+
}, props));
|
|
44
|
+
};
|
|
45
|
+
|
|
46
|
+
var FormSelect = function FormSelect(props) {
|
|
47
|
+
var _props$defaultValue = props.defaultValue,
|
|
48
|
+
defaultValue = _props$defaultValue === void 0 ? '' : _props$defaultValue,
|
|
49
|
+
change = props.change,
|
|
50
|
+
value = props.value;
|
|
51
|
+
/**
|
|
52
|
+
* 选中的值
|
|
53
|
+
*/
|
|
54
|
+
var _React$useState = React__default.useState(value !== undefined ? value : defaultValue),
|
|
55
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
56
|
+
selectValue = _React$useState2[0],
|
|
57
|
+
setSelectValue = _React$useState2[1];
|
|
58
|
+
/**
|
|
59
|
+
* 选中值改变
|
|
60
|
+
*/
|
|
61
|
+
var changeValue = function changeValue(value) {
|
|
62
|
+
setSelectValue(value);
|
|
63
|
+
change && change(value);
|
|
64
|
+
};
|
|
65
|
+
React__default.useEffect(function () {
|
|
66
|
+
setSelectValue(value);
|
|
67
|
+
}, [value]);
|
|
68
|
+
return jsx(Select, Object.assign({
|
|
69
|
+
labelMode: "inside",
|
|
70
|
+
onChange: changeValue,
|
|
71
|
+
hideErrorDom: null
|
|
72
|
+
}, props, {
|
|
73
|
+
value: selectValue
|
|
74
|
+
}));
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
var FormCheckboxGroup = function FormCheckboxGroup(props) {
|
|
78
|
+
var defaultValue = props.defaultValue,
|
|
79
|
+
change = props.change;
|
|
80
|
+
/**
|
|
81
|
+
* 选中的值
|
|
82
|
+
*/
|
|
83
|
+
var _React$useState = React__default.useState(defaultValue || []),
|
|
84
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
85
|
+
selectValue = _React$useState2[0],
|
|
86
|
+
setSelectValue = _React$useState2[1];
|
|
87
|
+
/**
|
|
88
|
+
* 选中值改变
|
|
89
|
+
*/
|
|
90
|
+
var changeValue = function changeValue(value) {
|
|
91
|
+
setSelectValue(value);
|
|
92
|
+
change && change(value);
|
|
93
|
+
};
|
|
94
|
+
return jsx(CheckboxGroup, Object.assign({
|
|
95
|
+
value: selectValue,
|
|
96
|
+
onChange: changeValue,
|
|
97
|
+
hideErrorDom: null
|
|
98
|
+
}, props));
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* 表单默认的校验方法
|
|
103
|
+
* @type {{[name: string]: validateFunctionType}}
|
|
104
|
+
*/
|
|
105
|
+
var fixedValidateFunction = {
|
|
106
|
+
'required': function required(item, val, intl) {
|
|
107
|
+
var _a, _b, _c, _d;
|
|
108
|
+
var vtype = _typeof(val);
|
|
109
|
+
var error = ((_b = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.message) === null || _b === void 0 ? void 0 : _b.required) || intl({
|
|
110
|
+
id: 'unEmpty'
|
|
111
|
+
}, {
|
|
112
|
+
label: item.label
|
|
113
|
+
});
|
|
114
|
+
var jude = false;
|
|
115
|
+
switch (vtype) {
|
|
116
|
+
case 'string':
|
|
117
|
+
var disOnlySpace = item.disOnlySpace !== undefined ? item.disOnlySpace : (_d = (_c = item.rules) === null || _c === void 0 ? void 0 : _c.validate) === null || _d === void 0 ? void 0 : _d.disOnlySpace;
|
|
118
|
+
if (!disOnlySpace) {
|
|
119
|
+
jude = !!val;
|
|
120
|
+
} else {
|
|
121
|
+
var space = /^[\s]+$/;
|
|
122
|
+
jude = !!val && !space.test(val);
|
|
123
|
+
}
|
|
124
|
+
break;
|
|
125
|
+
case 'number':
|
|
126
|
+
jude = val + 1 > val;
|
|
127
|
+
break;
|
|
128
|
+
case 'object':
|
|
129
|
+
var str = JSON.stringify(val);
|
|
130
|
+
jude = str !== 'null' && str !== '[]' && str !== '{}';
|
|
131
|
+
break;
|
|
132
|
+
case 'boolean':
|
|
133
|
+
jude = val !== undefined;
|
|
134
|
+
break;
|
|
135
|
+
default:
|
|
136
|
+
jude = !!val;
|
|
137
|
+
break;
|
|
138
|
+
}
|
|
139
|
+
return jude || error;
|
|
140
|
+
},
|
|
141
|
+
'maxlength': function maxlength(item, val, intl) {
|
|
142
|
+
var _a, _b, _c, _d, _e, _f;
|
|
143
|
+
var vtype = _typeof(val);
|
|
144
|
+
var error = ((_b = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.message) === null || _b === void 0 ? void 0 : _b.maxlength) || intl({
|
|
145
|
+
id: 'maxLength'
|
|
146
|
+
}, {
|
|
147
|
+
len: (_d = (_c = item.rules) === null || _c === void 0 ? void 0 : _c.validate) === null || _d === void 0 ? void 0 : _d.maxlength
|
|
148
|
+
});
|
|
149
|
+
var jude = false;
|
|
150
|
+
if (vtype === 'string' || vtype === 'number' && val + 1 > val) {
|
|
151
|
+
jude = !("".concat(val).length > (((_f = (_e = item.rules) === null || _e === void 0 ? void 0 : _e.validate) === null || _f === void 0 ? void 0 : _f.maxlength) || NaN));
|
|
152
|
+
} else {
|
|
153
|
+
jude = !val;
|
|
154
|
+
}
|
|
155
|
+
return jude || error;
|
|
156
|
+
},
|
|
157
|
+
'minLength': function minLength(item, val, intl) {
|
|
158
|
+
var _a, _b, _c, _d, _e, _f;
|
|
159
|
+
var vtype = _typeof(val);
|
|
160
|
+
var error = ((_b = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.message) === null || _b === void 0 ? void 0 : _b.minLength) || intl({
|
|
161
|
+
id: 'minLength'
|
|
162
|
+
}, {
|
|
163
|
+
len: (_d = (_c = item.rules) === null || _c === void 0 ? void 0 : _c.validate) === null || _d === void 0 ? void 0 : _d.minLength
|
|
164
|
+
});
|
|
165
|
+
var jude = false;
|
|
166
|
+
if (vtype === 'string' || vtype === 'number' && val + 1 > val) {
|
|
167
|
+
jude = "".concat(val).length >= (((_f = (_e = item.rules) === null || _e === void 0 ? void 0 : _e.validate) === null || _f === void 0 ? void 0 : _f.minLength) || -1);
|
|
168
|
+
} else {
|
|
169
|
+
jude = !val;
|
|
170
|
+
}
|
|
171
|
+
return jude || error;
|
|
172
|
+
},
|
|
173
|
+
'pattern': function pattern(item, val, intl) {
|
|
174
|
+
var _a, _b, _c, _d;
|
|
175
|
+
var testReg = (_b = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.validate) === null || _b === void 0 ? void 0 : _b.pattern;
|
|
176
|
+
var error = ((_d = (_c = item.rules) === null || _c === void 0 ? void 0 : _c.message) === null || _d === void 0 ? void 0 : _d.pattern) || intl({
|
|
177
|
+
id: 'unRule'
|
|
178
|
+
}, {
|
|
179
|
+
rule: '' + testReg
|
|
180
|
+
});
|
|
181
|
+
var jude = !val;
|
|
182
|
+
if (testReg && val && typeof testReg !== 'function') {
|
|
183
|
+
jude = testReg.test(val);
|
|
184
|
+
}
|
|
185
|
+
return jude || error;
|
|
186
|
+
},
|
|
187
|
+
'min': function min(item, val, intl) {
|
|
188
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
189
|
+
var vtype = _typeof(val);
|
|
190
|
+
var error = ((_b = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.message) === null || _b === void 0 ? void 0 : _b.min) || intl({
|
|
191
|
+
id: 'minValue'
|
|
192
|
+
}, {
|
|
193
|
+
val: (_d = (_c = item.rules) === null || _c === void 0 ? void 0 : _c.validate) === null || _d === void 0 ? void 0 : _d.min
|
|
194
|
+
});
|
|
195
|
+
var jude = !val;
|
|
196
|
+
if (vtype === 'string' || vtype === 'number') {
|
|
197
|
+
jude = val >= (((_f = (_e = item.rules) === null || _e === void 0 ? void 0 : _e.validate) === null || _f === void 0 ? void 0 : _f.min) === undefined ? -Infinity : (_h = (_g = item.rules) === null || _g === void 0 ? void 0 : _g.validate) === null || _h === void 0 ? void 0 : _h.min);
|
|
198
|
+
}
|
|
199
|
+
return jude || error;
|
|
200
|
+
},
|
|
201
|
+
'max': function max(item, val, intl) {
|
|
202
|
+
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
203
|
+
var vtype = _typeof(val);
|
|
204
|
+
var error = ((_b = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.message) === null || _b === void 0 ? void 0 : _b.max) || intl({
|
|
205
|
+
id: 'maxValue'
|
|
206
|
+
}, {
|
|
207
|
+
val: (_d = (_c = item.rules) === null || _c === void 0 ? void 0 : _c.validate) === null || _d === void 0 ? void 0 : _d.max
|
|
208
|
+
});
|
|
209
|
+
var jude = !val;
|
|
210
|
+
if (vtype === 'string' || vtype === 'number') {
|
|
211
|
+
jude = val <= (((_f = (_e = item.rules) === null || _e === void 0 ? void 0 : _e.validate) === null || _f === void 0 ? void 0 : _f.max) === undefined ? Infinity : (_h = (_g = item.rules) === null || _g === void 0 ? void 0 : _g.validate) === null || _h === void 0 ? void 0 : _h.max);
|
|
212
|
+
}
|
|
213
|
+
return jude || error;
|
|
214
|
+
}
|
|
215
|
+
};
|
|
216
|
+
/**
|
|
217
|
+
* 表单rules校验方法
|
|
218
|
+
* @type {validateFunctionType}
|
|
219
|
+
*/
|
|
220
|
+
var validate = function validate(item, val, intl) {
|
|
221
|
+
var _a, _b;
|
|
222
|
+
var validateObj = (_a = item.rules) === null || _a === void 0 ? void 0 : _a.validate;
|
|
223
|
+
if (validateObj) {
|
|
224
|
+
var messageObj = (_b = item.rules) === null || _b === void 0 ? void 0 : _b.message;
|
|
225
|
+
for (var key in validateObj) {
|
|
226
|
+
var tempFuc = validateObj[key];
|
|
227
|
+
var tmsg = '';
|
|
228
|
+
if (typeof tempFuc === 'function') {
|
|
229
|
+
tmsg = tempFuc(item, val, intl);
|
|
230
|
+
if (tmsg === false && messageObj) tmsg = messageObj[key];
|
|
231
|
+
} else if (!!tempFuc && fixedValidateFunction[key]) {
|
|
232
|
+
tmsg = fixedValidateFunction[key](item, val, intl);
|
|
233
|
+
} else if (!tempFuc) {
|
|
234
|
+
tmsg = true;
|
|
235
|
+
} else {
|
|
236
|
+
// console.log(`项目: ${item.label}, 自定义校验规则: ${key}, 方法未定义`);
|
|
237
|
+
tmsg = true;
|
|
238
|
+
}
|
|
239
|
+
if (tmsg !== true) return tmsg || '';
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
return false;
|
|
243
|
+
};
|
|
244
|
+
|
|
245
|
+
var en = {
|
|
246
|
+
choseFile: 'Chose File',
|
|
247
|
+
unEmpty: '{label} Cannot be empty',
|
|
248
|
+
maxLength: 'The maximum length cannot be exceeded {len}',
|
|
249
|
+
minLength: 'The minimum length cannot be exceeded {len}',
|
|
250
|
+
unRule: 'The parameter does not comply with the validation rule {rule}',
|
|
251
|
+
minValue: 'The minimum value is {val}',
|
|
252
|
+
maxValue: 'The maximum value is {val}'
|
|
253
|
+
};
|
|
254
|
+
|
|
255
|
+
var zh = {
|
|
256
|
+
choseFile: '选择文件',
|
|
257
|
+
unEmpty: '{label}不能为空',
|
|
258
|
+
maxLength: '最大长度不能超过{len}位',
|
|
259
|
+
minLength: '最小长度为{len}位',
|
|
260
|
+
unRule: '参数不符合校验规则{rule}',
|
|
261
|
+
minValue: '最小值为{val}',
|
|
262
|
+
maxValue: '最大值为{val}'
|
|
263
|
+
};
|
|
264
|
+
|
|
265
|
+
var localeJson = {
|
|
266
|
+
zh: zh,
|
|
267
|
+
en: en
|
|
268
|
+
};
|
|
269
|
+
|
|
270
|
+
/**
|
|
271
|
+
* 文件组件
|
|
272
|
+
*/
|
|
273
|
+
var FormFile = function FormFile(props) {
|
|
274
|
+
var _props$fileType = props.fileType,
|
|
275
|
+
fileType = _props$fileType === void 0 ? '' : _props$fileType,
|
|
276
|
+
defaultValue = props.defaultValue,
|
|
277
|
+
onChange = props.onChange,
|
|
278
|
+
disabled = props.disabled,
|
|
279
|
+
buttonLabel = props.buttonLabel,
|
|
280
|
+
inputProps = props.inputProps,
|
|
281
|
+
buttonProps = props.buttonProps;
|
|
282
|
+
var intl = useFormatMessage('FormItem', localeJson);
|
|
283
|
+
/**
|
|
284
|
+
* 存储文件输入框真实dom
|
|
285
|
+
* @type {HTMLInputElement}
|
|
286
|
+
*/
|
|
287
|
+
var inputFileEl = React__default.useRef(null);
|
|
288
|
+
/**
|
|
289
|
+
* 模拟点击选择文件
|
|
290
|
+
*/
|
|
291
|
+
var inputFileClick = function inputFileClick() {
|
|
292
|
+
var _a;
|
|
293
|
+
(_a = inputFileEl.current) === null || _a === void 0 ? void 0 : _a.click();
|
|
294
|
+
};
|
|
295
|
+
/**
|
|
296
|
+
* 文件改变
|
|
297
|
+
*/
|
|
298
|
+
var fileChange = function fileChange(value) {
|
|
299
|
+
var val = value !== undefined ? value : inputFileEl.current.files;
|
|
300
|
+
setSelectedFile(val);
|
|
301
|
+
onChange && onChange(val);
|
|
302
|
+
if (value === null) inputFileEl.current.value = null;
|
|
303
|
+
};
|
|
304
|
+
/**
|
|
305
|
+
* @type {string}
|
|
306
|
+
* 已选择的文件
|
|
307
|
+
*/
|
|
308
|
+
var _React$useState = React__default.useState(),
|
|
309
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
310
|
+
selectedFile = _React$useState2[0],
|
|
311
|
+
setSelectedFile = _React$useState2[1];
|
|
312
|
+
/**
|
|
313
|
+
* 初始化操作
|
|
314
|
+
*/
|
|
315
|
+
React__default.useEffect(function () {
|
|
316
|
+
if (defaultValue) {
|
|
317
|
+
if (typeof defaultValue === 'string') {
|
|
318
|
+
setSelectedFile(defaultValue);
|
|
319
|
+
} else {
|
|
320
|
+
setSelectedFile(defaultValue);
|
|
321
|
+
}
|
|
322
|
+
}
|
|
323
|
+
}, [defaultValue]);
|
|
324
|
+
return jsxs("div", Object.assign({
|
|
325
|
+
className: 'form-file'
|
|
326
|
+
}, {
|
|
327
|
+
children: [!disabled && jsx(Button, Object.assign({
|
|
328
|
+
variant: "outlined"
|
|
329
|
+
}, buttonProps, {
|
|
330
|
+
onClick: inputFileClick
|
|
331
|
+
}, {
|
|
332
|
+
children: buttonLabel || intl({
|
|
333
|
+
id: 'choseFile'
|
|
334
|
+
})
|
|
335
|
+
})), jsx("input", Object.assign({}, inputProps, {
|
|
336
|
+
ref: inputFileEl,
|
|
337
|
+
type: "file",
|
|
338
|
+
onInput: function onInput() {
|
|
339
|
+
return fileChange();
|
|
340
|
+
},
|
|
341
|
+
hidden: true,
|
|
342
|
+
accept: typeof fileType === 'string' ? fileType : fileType.join(',')
|
|
343
|
+
})), selectedFile && selectedFile[0] && jsx("div", Object.assign({
|
|
344
|
+
className: "file-tips ".concat(disabled && 'file-tips-disabled' || '')
|
|
345
|
+
}, {
|
|
346
|
+
children: jsxs("div", Object.assign({
|
|
347
|
+
className: "file-tips-item"
|
|
348
|
+
}, {
|
|
349
|
+
children: [jsx(ParaLinkGroup, {}), jsx("span", Object.assign({
|
|
350
|
+
className: "file-tips-context"
|
|
351
|
+
}, {
|
|
352
|
+
children: jsx(AutoTips, {
|
|
353
|
+
children: typeof selectedFile === 'string' ? selectedFile : selectedFile[0].name
|
|
354
|
+
})
|
|
355
|
+
})), !disabled && jsx(Delete, {
|
|
356
|
+
onClick: function onClick() {
|
|
357
|
+
return fileChange(null);
|
|
358
|
+
}
|
|
359
|
+
})]
|
|
360
|
+
}))
|
|
361
|
+
}))]
|
|
362
|
+
}));
|
|
363
|
+
};
|
|
364
|
+
|
|
365
|
+
/**
|
|
366
|
+
* @module src\FormItem\compoments\defaultCompoments\index.tsx
|
|
367
|
+
* @author zhanzl
|
|
368
|
+
* @date 2022/06/02
|
|
369
|
+
*/
|
|
370
|
+
var DefaultCompoments = function DefaultCompoments(props) {
|
|
371
|
+
var error = props.error,
|
|
372
|
+
placeholder = props.placeholder,
|
|
373
|
+
defaultValue = props.defaultValue,
|
|
374
|
+
disabled = props.disabled,
|
|
375
|
+
_onChange = props.onChange,
|
|
376
|
+
inputProps = props.inputProps,
|
|
377
|
+
moudle = props.moudle;
|
|
378
|
+
var _React$useState = React__default.useState(defaultValue),
|
|
379
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
380
|
+
dValue = _React$useState2[0],
|
|
381
|
+
setDvalue = _React$useState2[1];
|
|
382
|
+
// 监听defaultValue改变
|
|
383
|
+
React__default.useEffect(function () {
|
|
384
|
+
setDvalue(defaultValue);
|
|
385
|
+
}, [defaultValue]);
|
|
386
|
+
return moudle(Object.assign(Object.assign({
|
|
387
|
+
error: error,
|
|
388
|
+
placeholder: placeholder,
|
|
389
|
+
value: dValue,
|
|
390
|
+
disabled: disabled,
|
|
391
|
+
hideErrorDom: null
|
|
392
|
+
}, inputProps), {
|
|
393
|
+
onChange: function onChange(e) {
|
|
394
|
+
var _a;
|
|
395
|
+
var tVal = ((_a = e === null || e === void 0 ? void 0 : e.target) === null || _a === void 0 ? void 0 : _a.value) || e;
|
|
396
|
+
setDvalue(tVal);
|
|
397
|
+
_onChange(tVal);
|
|
398
|
+
}
|
|
399
|
+
}));
|
|
400
|
+
};
|
|
401
|
+
|
|
402
|
+
/**
|
|
403
|
+
* form 表单操作项 类型
|
|
404
|
+
*/
|
|
405
|
+
var ItemType = function ItemType(props) {
|
|
406
|
+
var itemType = props.itemType,
|
|
407
|
+
error = props.error,
|
|
408
|
+
placeholder = props.placeholder,
|
|
409
|
+
label = props.label,
|
|
410
|
+
inputProps = props.inputProps,
|
|
411
|
+
name = props.name,
|
|
412
|
+
rules = props.rules,
|
|
413
|
+
setValue = props.setValue,
|
|
414
|
+
setError = props.setError,
|
|
415
|
+
backData = props.backData,
|
|
416
|
+
disabled = props.disabled,
|
|
417
|
+
change = props.change,
|
|
418
|
+
isComponent = props.isComponent;
|
|
419
|
+
var intl = useFormatMessage('FormItem', localeJson);
|
|
420
|
+
var tipsStr = placeholder || "".concat(label);
|
|
421
|
+
/**
|
|
422
|
+
* 报错信息
|
|
423
|
+
* @type {boolean}
|
|
424
|
+
*/
|
|
425
|
+
var _React$useState = React__default.useState(!!error),
|
|
426
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
427
|
+
errorStatus = _React$useState2[0],
|
|
428
|
+
setErrorStatus = _React$useState2[1];
|
|
429
|
+
/**
|
|
430
|
+
* 校验方法
|
|
431
|
+
*/
|
|
432
|
+
var validateFunction = function validateFunction(val) {
|
|
433
|
+
setValue && setValue(name, 'value', val);
|
|
434
|
+
change && change(val);
|
|
435
|
+
// 没有校验规则直接退出
|
|
436
|
+
if (!rules) return;
|
|
437
|
+
var item = Object.assign(Object.assign({}, props), {
|
|
438
|
+
setErrorMsg: setErrorMsg,
|
|
439
|
+
setAndValidateValue: setAndValidateValue
|
|
440
|
+
});
|
|
441
|
+
var errorMessage = validate(item, val, intl) || '';
|
|
442
|
+
setErrorMsg(errorMessage);
|
|
443
|
+
};
|
|
444
|
+
/**
|
|
445
|
+
* 存储和校验数据
|
|
446
|
+
*/
|
|
447
|
+
var setAndValidateValue = validateFunction;
|
|
448
|
+
/**
|
|
449
|
+
* 合并设置Error状态方法
|
|
450
|
+
*/
|
|
451
|
+
var setErrorMsg = React__default.useCallback(function (msg) {
|
|
452
|
+
setError && setError(msg);
|
|
453
|
+
setErrorStatus(!!msg);
|
|
454
|
+
setValue && setValue(name, 'message', msg);
|
|
455
|
+
}, [name, setError, setValue]);
|
|
456
|
+
/**
|
|
457
|
+
* 传出最后的 item 对象
|
|
458
|
+
*/
|
|
459
|
+
React__default.useEffect(function () {
|
|
460
|
+
var item = Object.assign(Object.assign({}, props), {
|
|
461
|
+
setErrorMsg: setErrorMsg,
|
|
462
|
+
setAndValidateValue: setAndValidateValue
|
|
463
|
+
});
|
|
464
|
+
setValue && setValue(name, 'item', item);
|
|
465
|
+
}, [name, props, setErrorMsg, setValue]);
|
|
466
|
+
/**
|
|
467
|
+
* 判断显示那个
|
|
468
|
+
*/
|
|
469
|
+
var selectType = function selectType() {
|
|
470
|
+
if (!isComponent && itemType && typeof itemType !== 'string' && (!itemType.name || itemType.name === 'InputType')) {
|
|
471
|
+
var item = Object.assign(Object.assign({}, props), {
|
|
472
|
+
setErrorMsg: setErrorMsg,
|
|
473
|
+
setAndValidateValue: setAndValidateValue
|
|
474
|
+
});
|
|
475
|
+
return itemType(item);
|
|
476
|
+
}
|
|
477
|
+
switch (itemType) {
|
|
478
|
+
case 'file':
|
|
479
|
+
return jsx(FormFile, Object.assign({}, props, {
|
|
480
|
+
defaultValue: backData[name],
|
|
481
|
+
disabled: disabled,
|
|
482
|
+
onChange: function onChange(value) {
|
|
483
|
+
validateFunction(value);
|
|
484
|
+
}
|
|
485
|
+
}));
|
|
486
|
+
case 'switch':
|
|
487
|
+
if (backData[name] === undefined) setValue && setValue(name, 'initValue', !!backData[name]);
|
|
488
|
+
return jsx(Switch, Object.assign({
|
|
489
|
+
compact: true,
|
|
490
|
+
defaultChecked: !!backData[name],
|
|
491
|
+
onChange: function onChange(checked) {
|
|
492
|
+
validateFunction(checked);
|
|
493
|
+
}
|
|
494
|
+
}, Object.assign(Object.assign({}, inputProps), {
|
|
495
|
+
disabled: disabled
|
|
496
|
+
})));
|
|
497
|
+
case 'checkGroup':
|
|
498
|
+
return jsx(FormCheckboxGroup, Object.assign({
|
|
499
|
+
error: errorStatus,
|
|
500
|
+
defaultValue: backData[name],
|
|
501
|
+
change: function change(value) {
|
|
502
|
+
validateFunction(value);
|
|
503
|
+
},
|
|
504
|
+
list: props.list
|
|
505
|
+
}, Object.assign(Object.assign({}, inputProps), {
|
|
506
|
+
disabled: disabled
|
|
507
|
+
})));
|
|
508
|
+
case 'select':
|
|
509
|
+
return jsx(FormSelect, Object.assign({
|
|
510
|
+
placeholder: tipsStr,
|
|
511
|
+
defaultValue: backData[name],
|
|
512
|
+
error: errorStatus,
|
|
513
|
+
change: function change(value) {
|
|
514
|
+
validateFunction(value);
|
|
515
|
+
},
|
|
516
|
+
list: props.list
|
|
517
|
+
}, Object.assign({
|
|
518
|
+
disabled: disabled
|
|
519
|
+
}, inputProps)));
|
|
520
|
+
case 'radioGroup':
|
|
521
|
+
return jsx(FormRadioGroup, Object.assign({
|
|
522
|
+
error: errorStatus,
|
|
523
|
+
defaultValue: backData[name],
|
|
524
|
+
change: function change(value) {
|
|
525
|
+
validateFunction(value);
|
|
526
|
+
},
|
|
527
|
+
list: props.list
|
|
528
|
+
}, Object.assign({
|
|
529
|
+
disabled: disabled
|
|
530
|
+
}, inputProps)));
|
|
531
|
+
case 'textarea':
|
|
532
|
+
return jsx(TextField, Object.assign({
|
|
533
|
+
error: errorStatus,
|
|
534
|
+
placeholder: tipsStr,
|
|
535
|
+
defaultValue: backData[name] || '',
|
|
536
|
+
disabled: disabled,
|
|
537
|
+
multiline: true,
|
|
538
|
+
rows: 3,
|
|
539
|
+
name: name,
|
|
540
|
+
hideErrorDom: null,
|
|
541
|
+
onChange: function onChange(e) {
|
|
542
|
+
validateFunction(e.target.value);
|
|
543
|
+
}
|
|
544
|
+
}, inputProps));
|
|
545
|
+
case 'number':
|
|
546
|
+
return jsx(InputNumber, Object.assign({
|
|
547
|
+
error: errorStatus,
|
|
548
|
+
placeholder: tipsStr,
|
|
549
|
+
defaultValue: backData[name],
|
|
550
|
+
disabled: disabled,
|
|
551
|
+
name: name,
|
|
552
|
+
hideErrorDom: null,
|
|
553
|
+
onChange: function onChange(val) {
|
|
554
|
+
validateFunction(val);
|
|
555
|
+
}
|
|
556
|
+
}, inputProps));
|
|
557
|
+
case 'comboSelect':
|
|
558
|
+
return jsx(ComboSelect, Object.assign({
|
|
559
|
+
error: errorStatus,
|
|
560
|
+
placeholder: tipsStr,
|
|
561
|
+
defaultValue: backData[name],
|
|
562
|
+
disabled: disabled,
|
|
563
|
+
onChange: function onChange(options) {
|
|
564
|
+
validateFunction(options);
|
|
565
|
+
}
|
|
566
|
+
}, inputProps));
|
|
567
|
+
default:
|
|
568
|
+
if (itemType && typeof itemType !== 'string') {
|
|
569
|
+
return jsx(DefaultCompoments, {
|
|
570
|
+
moudle: itemType,
|
|
571
|
+
error: errorStatus,
|
|
572
|
+
placeholder: tipsStr,
|
|
573
|
+
defaultValue: backData[name],
|
|
574
|
+
disabled: disabled,
|
|
575
|
+
onChange: function onChange(val) {
|
|
576
|
+
validateFunction(val);
|
|
577
|
+
},
|
|
578
|
+
inputProps: inputProps
|
|
579
|
+
});
|
|
580
|
+
}
|
|
581
|
+
return jsx(TextField, Object.assign({
|
|
582
|
+
defaultValue: backData[name] || '',
|
|
583
|
+
error: errorStatus,
|
|
584
|
+
placeholder: tipsStr,
|
|
585
|
+
onChange: function onChange(e) {
|
|
586
|
+
validateFunction(e.target.value);
|
|
587
|
+
},
|
|
588
|
+
name: name,
|
|
589
|
+
hideErrorDom: null,
|
|
590
|
+
disabled: disabled
|
|
591
|
+
}, inputProps));
|
|
592
|
+
}
|
|
593
|
+
};
|
|
594
|
+
return selectType();
|
|
595
|
+
};
|
|
596
|
+
|
|
597
|
+
/**
|
|
598
|
+
* 报错信息组件
|
|
599
|
+
* @description 为了解决,在主组件设置state,导致输入框中内容刷新,且失去焦点
|
|
600
|
+
*/
|
|
601
|
+
var ErrorTips = function ErrorTips(props) {
|
|
602
|
+
var getSetError = props.getSetError,
|
|
603
|
+
errorMessage = props.errorMessage,
|
|
604
|
+
helperTextProps = props.helperTextProps;
|
|
605
|
+
/**
|
|
606
|
+
* 报错信息
|
|
607
|
+
* @type {string}
|
|
608
|
+
*/
|
|
609
|
+
var _React$useState = React__default.useState(errorMessage || ''),
|
|
610
|
+
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
611
|
+
errorTips = _React$useState2[0],
|
|
612
|
+
setErrorTips = _React$useState2[1];
|
|
613
|
+
/**
|
|
614
|
+
* 初始化传出, 设置错误信息方法
|
|
615
|
+
*/
|
|
616
|
+
React__default.useEffect(function () {
|
|
617
|
+
setErrorTips(errorMessage || '');
|
|
618
|
+
}, [errorMessage]);
|
|
619
|
+
React__default.useEffect(function () {
|
|
620
|
+
getSetError && getSetError(setErrorTips);
|
|
621
|
+
}, [getSetError]);
|
|
622
|
+
return jsx(HelperText, Object.assign({
|
|
623
|
+
className: "error-tips",
|
|
624
|
+
error: true,
|
|
625
|
+
helperText: errorTips
|
|
626
|
+
}, helperTextProps));
|
|
627
|
+
};
|
|
628
|
+
|
|
629
|
+
var formInputTypeJson = {
|
|
630
|
+
checkGroup: true,
|
|
631
|
+
select: true,
|
|
632
|
+
radioGroup: true,
|
|
633
|
+
textarea: true,
|
|
634
|
+
default: true,
|
|
635
|
+
switch: true,
|
|
636
|
+
number: true,
|
|
637
|
+
file: true,
|
|
638
|
+
comboSelect: true
|
|
639
|
+
};
|
|
640
|
+
/**
|
|
641
|
+
* form 表单单行组件
|
|
642
|
+
* @author zhanzl
|
|
643
|
+
* @description 用于根据配置自动生成表单
|
|
644
|
+
*/
|
|
645
|
+
var FormItem = function FormItem(props) {
|
|
646
|
+
var _a, _b;
|
|
647
|
+
var _props$type = props.type,
|
|
648
|
+
type = _props$type === void 0 ? 'horizontal' : _props$type,
|
|
649
|
+
labelWidth = props.labelWidth,
|
|
650
|
+
tips = props.tips,
|
|
651
|
+
label = props.label,
|
|
652
|
+
itemType = props.itemType,
|
|
653
|
+
_props$InputType = props.InputType,
|
|
654
|
+
InputType = _props$InputType === void 0 ? itemType : _props$InputType,
|
|
655
|
+
setValue = props.setValue,
|
|
656
|
+
errorMessage = props.errorMessage,
|
|
657
|
+
hideLabel = props.hideLabel,
|
|
658
|
+
_props$backData = props.backData,
|
|
659
|
+
backData = _props$backData === void 0 ? {} : _props$backData,
|
|
660
|
+
defaultValue = props.defaultValue,
|
|
661
|
+
name = props.name,
|
|
662
|
+
_props$hideError = props.hideError,
|
|
663
|
+
hideError = _props$hideError === void 0 ? false : _props$hideError,
|
|
664
|
+
_props$className = props.className,
|
|
665
|
+
className = _props$className === void 0 ? '' : _props$className,
|
|
666
|
+
labelProps = props.labelProps,
|
|
667
|
+
helperTextProps = props.helperTextProps,
|
|
668
|
+
requiredElement = props.requiredElement,
|
|
669
|
+
_props$disRequiredEle = props.disRequiredElement,
|
|
670
|
+
disRequiredElement = _props$disRequiredEle === void 0 ? false : _props$disRequiredEle;
|
|
671
|
+
if (backData[name] === undefined) {
|
|
672
|
+
backData[name] = defaultValue;
|
|
673
|
+
}
|
|
674
|
+
/**
|
|
675
|
+
* 接受设置报错信息方法
|
|
676
|
+
* @type {Function}
|
|
677
|
+
*/
|
|
678
|
+
var setErrorTips = React__default.useRef();
|
|
679
|
+
/**
|
|
680
|
+
* 设置错误信息
|
|
681
|
+
*/
|
|
682
|
+
var setError = function setError(error) {
|
|
683
|
+
setErrorTips.current && setErrorTips.current(error);
|
|
684
|
+
};
|
|
685
|
+
/**
|
|
686
|
+
* 用于判断是否是 vertical 模式如果是则添加相应的外层
|
|
687
|
+
*/
|
|
688
|
+
var TypeLayout = function TypeLayout(props) {
|
|
689
|
+
return type === 'vertical' ? jsx("div", Object.assign({
|
|
690
|
+
className: "form-content-vertical form-content-vertical-".concat(name),
|
|
691
|
+
style: {
|
|
692
|
+
width: "calc(100% - ".concat(labelWidth, "px)")
|
|
693
|
+
}
|
|
694
|
+
}, {
|
|
695
|
+
children: props.children
|
|
696
|
+
})) : props.children;
|
|
697
|
+
};
|
|
698
|
+
/**
|
|
699
|
+
* 展示label
|
|
700
|
+
*/
|
|
701
|
+
var showLabel = React__default.useCallback(function () {
|
|
702
|
+
if (!label) return '';
|
|
703
|
+
return typeof label === 'string' ? label : label(props);
|
|
704
|
+
}, [label]);
|
|
705
|
+
/** 处理className */
|
|
706
|
+
var handClass = function handClass() {
|
|
707
|
+
var str = "".concat($prefixCls, "-form-item ").concat($prefixCls, "-form-item-").concat(name);
|
|
708
|
+
if (className) str += ' ' + className;
|
|
709
|
+
if (typeof InputType === 'string' && formInputTypeJson[InputType]) {
|
|
710
|
+
str += " ".concat($prefixCls, "-form-item-").concat(InputType);
|
|
711
|
+
}
|
|
712
|
+
return str;
|
|
713
|
+
};
|
|
714
|
+
return jsxs("div", Object.assign({
|
|
715
|
+
className: handClass()
|
|
716
|
+
}, {
|
|
717
|
+
children: [!hideLabel && jsx("div", Object.assign({
|
|
718
|
+
className: clsx("form-label form-label-".concat(name), type === 'vertical' && 'form-label-vertical'),
|
|
719
|
+
style: {
|
|
720
|
+
width: type === 'vertical' ? "".concat(labelWidth, "px") : ''
|
|
721
|
+
}
|
|
722
|
+
}, {
|
|
723
|
+
children: jsx(Label, Object.assign({
|
|
724
|
+
className: clsx('form-labe-text', tips && 'form-labe-text-hastips'),
|
|
725
|
+
label: showLabel(),
|
|
726
|
+
required: !!((_b = (_a = props === null || props === void 0 ? void 0 : props.rules) === null || _a === void 0 ? void 0 : _a.validate) === null || _b === void 0 ? void 0 : _b.required),
|
|
727
|
+
tooltip: tips,
|
|
728
|
+
tooltipIcon: disRequiredElement ? '' : requiredElement
|
|
729
|
+
}, labelProps))
|
|
730
|
+
})), jsxs(TypeLayout, {
|
|
731
|
+
children: [jsx("div", Object.assign({
|
|
732
|
+
className: "form-edit form-edit-".concat(name)
|
|
733
|
+
}, {
|
|
734
|
+
children: !props.children ? jsx(ItemType, Object.assign({
|
|
735
|
+
setError: setError,
|
|
736
|
+
error: !!errorMessage,
|
|
737
|
+
itemType: InputType,
|
|
738
|
+
backData: backData
|
|
739
|
+
}, props, {
|
|
740
|
+
setValue: setValue
|
|
741
|
+
})) : props.children
|
|
742
|
+
})), !hideError && jsx("div", Object.assign({
|
|
743
|
+
className: "form-error form-error-".concat(name)
|
|
744
|
+
}, {
|
|
745
|
+
children: jsx(ErrorTips, {
|
|
746
|
+
getSetError: function getSetError(fuc) {
|
|
747
|
+
return setErrorTips.current = fuc;
|
|
748
|
+
},
|
|
749
|
+
helperTextProps: helperTextProps,
|
|
750
|
+
errorMessage: errorMessage
|
|
751
|
+
})
|
|
752
|
+
}))]
|
|
753
|
+
})]
|
|
754
|
+
}));
|
|
755
|
+
};
|
|
756
|
+
|
|
757
|
+
export { FormItem as F, localeJson as l, validate as v };
|