@teamix/pro 1.3.14 → 1.3.17
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/dist/pro.css +1 -1
- package/dist/pro.js +22026 -9580
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/actions/index.scss +13 -0
- package/es/form/Filter/index.js +169 -53
- package/es/form/Filter/layout.scss +4 -0
- package/es/form/Filter/useBindUrl.d.ts +2 -0
- package/es/form/Filter/useBindUrl.js +118 -0
- package/es/form/ProForm/index.js +5 -3
- package/es/form/ProForm/useFieldSchema.js +53 -32
- package/es/form/SchemaForm/initializeDataSource.d.ts +1 -2
- package/es/form/SchemaForm/initializeDataSource.js +14 -19
- package/es/form/SchemaForm/initializeRequest.js +25 -26
- package/es/form/SchemaForm/initializeRules.d.ts +2 -2
- package/es/form/SchemaForm/initializeRules.js +30 -23
- package/es/form/SchemaForm/reactions.d.ts +4 -4
- package/es/form/SchemaForm/reactions.js +30 -23
- package/es/form/typing.d.ts +12 -5
- package/es/form/utils.d.ts +16 -1
- package/es/form/utils.js +21 -2
- package/es/global.scss +45 -0
- package/es/index.d.ts +2 -1
- package/es/index.js +3 -2
- package/es/page-header/index.d.ts +2 -0
- package/es/page-header/index.js +13 -3
- package/es/page-header/index.scss +8 -0
- package/es/table/components/Layout/index.scss +5 -5
- package/lib/actions/index.scss +13 -0
- package/lib/form/Filter/index.js +170 -53
- package/lib/form/Filter/layout.scss +4 -0
- package/lib/form/Filter/useBindUrl.d.ts +2 -0
- package/lib/form/Filter/useBindUrl.js +129 -0
- package/lib/form/ProForm/index.js +5 -3
- package/lib/form/ProForm/useFieldSchema.js +52 -31
- package/lib/form/SchemaForm/initializeDataSource.d.ts +1 -2
- package/lib/form/SchemaForm/initializeDataSource.js +14 -19
- package/lib/form/SchemaForm/initializeRequest.js +26 -26
- package/lib/form/SchemaForm/initializeRules.d.ts +2 -2
- package/lib/form/SchemaForm/initializeRules.js +30 -22
- package/lib/form/SchemaForm/reactions.d.ts +4 -4
- package/lib/form/SchemaForm/reactions.js +30 -23
- package/lib/form/typing.d.ts +12 -5
- package/lib/form/utils.d.ts +16 -1
- package/lib/form/utils.js +23 -2
- package/lib/global.scss +45 -0
- package/lib/index.d.ts +2 -1
- package/lib/index.js +3 -1
- package/lib/page-header/index.d.ts +2 -0
- package/lib/page-header/index.js +12 -2
- package/lib/page-header/index.scss +8 -0
- package/lib/table/components/Layout/index.scss +5 -5
- package/package.json +1 -1
package/es/page-header/index.js
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
var _excluded = ["text", "children"],
|
2
2
|
_excluded2 = ["color", "title", "num", "className"],
|
3
|
-
_excluded3 = ["title", "description", "icon", "iconColor", "iconBackgroundType", "iconBackgroundColor", "goback", "operation", "extra", "image", "loading", "breadcrumb", "tags", "data", "info", "children", "className", "style", "tabs"];
|
3
|
+
_excluded3 = ["title", "titleTooltip", "description", "icon", "iconColor", "iconBackgroundType", "iconBackgroundColor", "goback", "operation", "extra", "image", "loading", "breadcrumb", "tags", "data", "info", "children", "className", "style", "tabs"];
|
4
4
|
|
5
5
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
6
6
|
|
@@ -16,13 +16,14 @@ import React from 'react';
|
|
16
16
|
import { useHistory } from 'react-router-dom';
|
17
17
|
import classnames from 'classnames';
|
18
18
|
import TeamixIcon from '@teamix/icon';
|
19
|
-
import { Breadcrumb } from '@alicloudfe/components';
|
19
|
+
import { Breadcrumb, Balloon } from '@alicloudfe/components';
|
20
20
|
import { baseClass, goToLink, renderTags, isPresetColor, getColor, getColorClassName, getBackgroundColorClassName, CapsuleTab } from '@teamix/utils';
|
21
21
|
import { ProActionGroup } from '../actions';
|
22
22
|
import { ProSkeletonRaw } from '../skeleton';
|
23
23
|
import ProInfo from '../info';
|
24
24
|
import './index.scss';
|
25
25
|
var cls = baseClass('teamix-pro-page-header');
|
26
|
+
var Tooltip = Balloon.Tooltip;
|
26
27
|
|
27
28
|
var renderNav = function renderNav(breadcrumbs) {
|
28
29
|
if (breadcrumbs && breadcrumbs.length) {
|
@@ -133,6 +134,7 @@ var renderTabs = function renderTabs(tabs) {
|
|
133
134
|
|
134
135
|
var ProPageHeader = function ProPageHeader(props) {
|
135
136
|
var title = props.title,
|
137
|
+
titleTooltip = props.titleTooltip,
|
136
138
|
description = props.description,
|
137
139
|
icon = props.icon,
|
138
140
|
iconColor = props.iconColor,
|
@@ -200,7 +202,15 @@ var ProPageHeader = function ProPageHeader(props) {
|
|
200
202
|
size: "large"
|
201
203
|
}) : /*#__PURE__*/React.createElement(React.Fragment, null, icon)), /*#__PURE__*/React.createElement("span", {
|
202
204
|
className: cls('title-name')
|
203
|
-
}, title
|
205
|
+
}, title, titleTooltip && /*#__PURE__*/React.createElement(Tooltip, {
|
206
|
+
trigger: /*#__PURE__*/React.createElement("span", {
|
207
|
+
className: cls('title-tooltip-icon')
|
208
|
+
}, /*#__PURE__*/React.createElement(TeamixIcon, {
|
209
|
+
type: "info-circle-line",
|
210
|
+
size: "xs"
|
211
|
+
})),
|
212
|
+
align: "t"
|
213
|
+
}, titleTooltip)), renderTags(tags, 'large'), renderTabs(tabs !== null && tabs !== void 0 ? tabs : {}));
|
204
214
|
};
|
205
215
|
|
206
216
|
return /*#__PURE__*/React.createElement("header", _objectSpread({
|
@@ -43,6 +43,7 @@ $prefix: 'teamix-pro-page-header';
|
|
43
43
|
font-weight: 500;
|
44
44
|
align-items: center;
|
45
45
|
word-break: break-all;
|
46
|
+
color: var(--color-text1-4);
|
46
47
|
|
47
48
|
&-name {
|
48
49
|
white-space: nowrap;
|
@@ -50,6 +51,13 @@ $prefix: 'teamix-pro-page-header';
|
|
50
51
|
text-overflow: ellipsis;
|
51
52
|
}
|
52
53
|
|
54
|
+
&-tooltip-icon {
|
55
|
+
position: relative;
|
56
|
+
margin-left: 2px;
|
57
|
+
display: inline-flex;
|
58
|
+
top: -7px;
|
59
|
+
}
|
60
|
+
|
53
61
|
&-icon {
|
54
62
|
padding: var(--s-1, 4px);
|
55
63
|
}
|
@@ -32,11 +32,11 @@ $prefix: 'teamix-pro-table-layout';
|
|
32
32
|
&-filter-btn:not(:first-child) {
|
33
33
|
margin-left: 8px;
|
34
34
|
}
|
35
|
-
&-panel-filter {
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
}
|
35
|
+
// &-panel-filter {
|
36
|
+
// margin: 8px 0;
|
37
|
+
// padding: 16px;
|
38
|
+
// background: var(--panel-filter-bg, var(--color-fill1-2));
|
39
|
+
// }
|
40
40
|
&-main-action {
|
41
41
|
margin-bottom: 8px;
|
42
42
|
}
|
package/lib/actions/index.scss
CHANGED
@@ -121,3 +121,16 @@
|
|
121
121
|
}
|
122
122
|
}
|
123
123
|
}
|
124
|
+
|
125
|
+
// 针对弹层内的 table 在暗色模式下适配
|
126
|
+
.next-dialog-body {
|
127
|
+
.teamix-pro-table, .next-table-empty {
|
128
|
+
background: var(--dialog-bg);
|
129
|
+
}
|
130
|
+
}
|
131
|
+
|
132
|
+
.next-drawer-body {
|
133
|
+
.teamix-pro-table, .next-table-empty {
|
134
|
+
background: var(--drawer-bg);
|
135
|
+
}
|
136
|
+
}
|
package/lib/form/Filter/index.js
CHANGED
@@ -43,9 +43,11 @@ var _Layout = require("./Layout");
|
|
43
43
|
|
44
44
|
var _useSpecialProps2 = _interopRequireDefault(require("./useSpecialProps"));
|
45
45
|
|
46
|
+
var _useBindUrl2 = _interopRequireDefault(require("./useBindUrl"));
|
47
|
+
|
46
48
|
require("./index.scss");
|
47
49
|
|
48
|
-
var _excluded = ["addonAfter", "addonBefore", "mode", "purePanel", "expand", "formRef", "defaultFilterValue", "filterValues", "filterDebounce", "onFilter", "onInit", "onReset", "onExpand", "onChange"];
|
50
|
+
var _excluded = ["addonAfter", "addonBefore", "mode", "purePanel", "expand", "formRef", "defaultFilterValue", "filterValues", "filterDebounce", "bindUrl", "onFilter", "onInit", "onReset", "onExpand", "onChange"];
|
49
51
|
|
50
52
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
51
53
|
|
@@ -100,9 +102,10 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
100
102
|
defaultFilterValue = props.defaultFilterValue,
|
101
103
|
filterValues = props.filterValues,
|
102
104
|
filterDebounce = props.filterDebounce,
|
103
|
-
|
104
|
-
|
105
|
-
|
105
|
+
bindUrl = props.bindUrl,
|
106
|
+
outerFilter = props.onFilter,
|
107
|
+
outerInit = props.onInit,
|
108
|
+
outerReset = props.onReset,
|
106
109
|
onExpand = props.onExpand,
|
107
110
|
onChange = props.onChange,
|
108
111
|
otherProps = _objectWithoutProperties(props, _excluded);
|
@@ -121,15 +124,27 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
121
124
|
setTagDataSource = _useState4[1];
|
122
125
|
|
123
126
|
var filterItem = (0, _react.useRef)([]);
|
124
|
-
var
|
125
|
-
var
|
127
|
+
var defaultFormName = mode === 'panel' ? 'advanced' : 'simple';
|
128
|
+
var currentFormName = (0, _react.useRef)(defaultFormName);
|
129
|
+
var currentForm = (0, _react.useRef)();
|
126
130
|
var activeFilterValueRef = (0, _react.useRef)();
|
127
131
|
var prefixCls = (0, _utils.usePrefixCls)('', {
|
128
132
|
prefix: 'teamix-pro-form-query-filter'
|
129
133
|
});
|
130
134
|
var debounceFun = (0, _lodash.default)(function (fun, props) {
|
131
135
|
return fun(props);
|
132
|
-
}, filterDebounce); //
|
136
|
+
}, filterDebounce); // 绑定URL
|
137
|
+
|
138
|
+
var _useBindUrl = (0, _useBindUrl2.default)(bindUrl, {
|
139
|
+
onInit: outerInit,
|
140
|
+
onFilter: outerFilter,
|
141
|
+
onReset: outerReset
|
142
|
+
}, currentForm),
|
143
|
+
setValuesByUrlState = _useBindUrl.setValuesByUrlState,
|
144
|
+
onInit = _useBindUrl.onInit,
|
145
|
+
onFilter = _useBindUrl.onFilter,
|
146
|
+
onReset = _useBindUrl.onReset; // onInit
|
147
|
+
|
133
148
|
|
134
149
|
var initialRequestRef = (0, _react.useRef)(!!(props === null || props === void 0 ? void 0 : props.initialRequest));
|
135
150
|
var filterEnable = (0, _react.useRef)('waiting');
|
@@ -154,12 +169,11 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
154
169
|
break;
|
155
170
|
}
|
156
171
|
|
157
|
-
onFormInit =
|
158
|
-
|
172
|
+
onFormInit = undefined; // init后销毁 isFormInit 方法
|
159
173
|
|
160
|
-
|
174
|
+
setValuesByUrlState(form); // 配置URL参数到表单
|
161
175
|
|
162
|
-
if (!
|
176
|
+
if (!outerInit) {
|
163
177
|
_context.next = 10;
|
164
178
|
break;
|
165
179
|
}
|
@@ -168,7 +182,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
168
182
|
return form.validate();
|
169
183
|
|
170
184
|
case 8:
|
171
|
-
onInit
|
185
|
+
onInit((0, _reactive.toJS)(form.values)); // 设置Tag
|
172
186
|
|
173
187
|
if (mode === 'panel') {
|
174
188
|
configFilterItem(advancedForm);
|
@@ -190,17 +204,110 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
190
204
|
|
191
205
|
|
192
206
|
var setCurrentForm = function setCurrentForm(formName) {
|
193
|
-
|
207
|
+
currentFormName.current = formName;
|
208
|
+
currentForm.current = formMap[formName];
|
209
|
+
var form = currentForm.current;
|
194
210
|
|
195
211
|
if (formRef) {
|
196
|
-
|
197
|
-
formRef.current = form;
|
212
|
+
formRef.current = form; // 自定义updateTags方法
|
198
213
|
|
199
214
|
if (!formRef.current.updateTags) {
|
200
215
|
formRef.current.updateTags = function () {
|
201
|
-
|
202
|
-
configTag();
|
216
|
+
updateTags(form);
|
203
217
|
};
|
218
|
+
} // 自定义setAsyncValues方法
|
219
|
+
|
220
|
+
|
221
|
+
if (!formRef.current.setAsyncValues) {
|
222
|
+
formRef.current.setAsyncValues = /*#__PURE__*/function () {
|
223
|
+
var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(values) {
|
224
|
+
return regeneratorRuntime.wrap(function _callee2$(_context2) {
|
225
|
+
while (1) {
|
226
|
+
switch (_context2.prev = _context2.next) {
|
227
|
+
case 0:
|
228
|
+
form.setValues(values);
|
229
|
+
|
230
|
+
if (!(filterEnable.current === 'filter' && formName === 'advanced')) {
|
231
|
+
_context2.next = 6;
|
232
|
+
break;
|
233
|
+
}
|
234
|
+
|
235
|
+
_context2.next = 4;
|
236
|
+
return form.validate();
|
237
|
+
|
238
|
+
case 4:
|
239
|
+
onFilter((0, _reactive.toJS)(form.values));
|
240
|
+
updateTags(form);
|
241
|
+
|
242
|
+
case 6:
|
243
|
+
case "end":
|
244
|
+
return _context2.stop();
|
245
|
+
}
|
246
|
+
}
|
247
|
+
}, _callee2);
|
248
|
+
}));
|
249
|
+
|
250
|
+
return function (_x2) {
|
251
|
+
return _ref2.apply(this, arguments);
|
252
|
+
};
|
253
|
+
}();
|
254
|
+
} // 自定义triggerFilter方法
|
255
|
+
|
256
|
+
|
257
|
+
if (!formRef.current.triggerFilter) {
|
258
|
+
formRef.current.triggerFilter = /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3() {
|
259
|
+
return regeneratorRuntime.wrap(function _callee3$(_context3) {
|
260
|
+
while (1) {
|
261
|
+
switch (_context3.prev = _context3.next) {
|
262
|
+
case 0:
|
263
|
+
_context3.next = 2;
|
264
|
+
return form.validate();
|
265
|
+
|
266
|
+
case 2:
|
267
|
+
onFilter((0, _reactive.toJS)(form.values));
|
268
|
+
|
269
|
+
if (formName === 'advanced') {
|
270
|
+
updateTags(form);
|
271
|
+
}
|
272
|
+
|
273
|
+
case 4:
|
274
|
+
case "end":
|
275
|
+
return _context3.stop();
|
276
|
+
}
|
277
|
+
}
|
278
|
+
}, _callee3);
|
279
|
+
}));
|
280
|
+
} // 自定义triggerReset方法
|
281
|
+
|
282
|
+
|
283
|
+
if (!formRef.current.triggerReset) {
|
284
|
+
formRef.current.triggerReset = /*#__PURE__*/function () {
|
285
|
+
var _ref4 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4(config) {
|
286
|
+
return regeneratorRuntime.wrap(function _callee4$(_context4) {
|
287
|
+
while (1) {
|
288
|
+
switch (_context4.prev = _context4.next) {
|
289
|
+
case 0:
|
290
|
+
simpleForm.reset('*', config);
|
291
|
+
lightForm.reset('*', config);
|
292
|
+
advancedForm.reset('*', config);
|
293
|
+
|
294
|
+
if (formName === 'advanced') {
|
295
|
+
onReset((0, _reactive.toJS)(advancedForm.values));
|
296
|
+
updateTags(form);
|
297
|
+
}
|
298
|
+
|
299
|
+
case 4:
|
300
|
+
case "end":
|
301
|
+
return _context4.stop();
|
302
|
+
}
|
303
|
+
}
|
304
|
+
}, _callee4);
|
305
|
+
}));
|
306
|
+
|
307
|
+
return function (_x3) {
|
308
|
+
return _ref4.apply(this, arguments);
|
309
|
+
};
|
310
|
+
}();
|
204
311
|
}
|
205
312
|
}
|
206
313
|
}; // 创建简单筛选表单实例
|
@@ -212,7 +319,11 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
212
319
|
effects: function effects() {
|
213
320
|
(0, _core.onFormReact)(function (form) {
|
214
321
|
if (mode === 'inline') {
|
215
|
-
|
322
|
+
var _onFormInit;
|
323
|
+
|
324
|
+
(_onFormInit = onFormInit) === null || _onFormInit === void 0 ? void 0 : _onFormInit(form).finally(function () {
|
325
|
+
return filterEnable.current = 'filter';
|
326
|
+
});
|
216
327
|
}
|
217
328
|
});
|
218
329
|
}
|
@@ -236,7 +347,11 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
236
347
|
effects: function effects() {
|
237
348
|
(0, _core.onFormReact)(function (form) {
|
238
349
|
if (mode === 'panel') {
|
239
|
-
|
350
|
+
var _onFormInit2;
|
351
|
+
|
352
|
+
(_onFormInit2 = onFormInit) === null || _onFormInit2 === void 0 ? void 0 : _onFormInit2(form).finally(function () {
|
353
|
+
return filterEnable.current = 'filter';
|
354
|
+
});
|
240
355
|
}
|
241
356
|
});
|
242
357
|
(0, _core.onFormInputChange)(function (form) {
|
@@ -255,12 +370,12 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
255
370
|
var displayValues = (0, _useFormDisplayValues.getFormDisplayValues)(form);
|
256
371
|
var originalData = Object.entries(displayValues);
|
257
372
|
var filterData = [];
|
258
|
-
originalData.forEach(function (
|
373
|
+
originalData.forEach(function (_ref5) {
|
259
374
|
var _data$displayValue;
|
260
375
|
|
261
|
-
var
|
262
|
-
key =
|
263
|
-
data =
|
376
|
+
var _ref6 = _slicedToArray(_ref5, 2),
|
377
|
+
key = _ref6[0],
|
378
|
+
data = _ref6[1];
|
264
379
|
|
265
380
|
var value = (_data$displayValue = data.displayValue) !== null && _data$displayValue !== void 0 ? _data$displayValue : data.value;
|
266
381
|
var component = data.component;
|
@@ -295,6 +410,11 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
295
410
|
|
296
411
|
var configTag = (0, _react.useCallback)(function () {
|
297
412
|
setTagDataSource(filterItem.current);
|
413
|
+
}, []); // 更新标签数据
|
414
|
+
|
415
|
+
var updateTags = (0, _react.useCallback)(function (form) {
|
416
|
+
configFilterItem(form);
|
417
|
+
configTag();
|
298
418
|
}, []); // 展开收起高级筛选
|
299
419
|
|
300
420
|
var toggleAdvancedFilter = (0, _react.useCallback)(function () {
|
@@ -302,7 +422,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
302
422
|
|
303
423
|
if (result) {
|
304
424
|
// 展开高级筛选,Light回填Advanced
|
305
|
-
if (
|
425
|
+
if (currentFormName.current === 'light') {
|
306
426
|
var key = activeFilterValueRef.current;
|
307
427
|
var value = lightForm.values[key];
|
308
428
|
advancedForm.setValuesIn(key, value);
|
@@ -317,32 +437,32 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
317
437
|
}, [panelVisible, configTag]); // 简单搜索Filter
|
318
438
|
|
319
439
|
var onSimpleFilter = (0, _react.useCallback)( /*#__PURE__*/function () {
|
320
|
-
var
|
321
|
-
return regeneratorRuntime.wrap(function
|
440
|
+
var _ref7 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5(values) {
|
441
|
+
return regeneratorRuntime.wrap(function _callee5$(_context5) {
|
322
442
|
while (1) {
|
323
|
-
switch (
|
443
|
+
switch (_context5.prev = _context5.next) {
|
324
444
|
case 0:
|
325
|
-
|
445
|
+
_context5.next = 2;
|
326
446
|
return simpleForm.validate();
|
327
447
|
|
328
448
|
case 2:
|
329
|
-
onFilter
|
449
|
+
onFilter(values);
|
330
450
|
|
331
451
|
case 3:
|
332
452
|
case "end":
|
333
|
-
return
|
453
|
+
return _context5.stop();
|
334
454
|
}
|
335
455
|
}
|
336
|
-
},
|
456
|
+
}, _callee5);
|
337
457
|
}));
|
338
458
|
|
339
|
-
return function (
|
340
|
-
return
|
459
|
+
return function (_x4) {
|
460
|
+
return _ref7.apply(this, arguments);
|
341
461
|
};
|
342
462
|
}(), [onFilter]); // 简单搜索Change
|
343
463
|
|
344
464
|
var onSimpleChange = (0, _react.useCallback)(function (values, fieldValue, fieldName) {
|
345
|
-
if (
|
465
|
+
if (currentFormName.current === 'simple') {
|
346
466
|
onChange === null || onChange === void 0 ? void 0 : onChange(values, fieldValue, fieldName);
|
347
467
|
|
348
468
|
if (filterEnable.current === 'filter') {
|
@@ -354,20 +474,18 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
354
474
|
var onLightFilter = (0, _react.useCallback)(function (values) {
|
355
475
|
var _Object$keys;
|
356
476
|
|
357
|
-
onFilter
|
477
|
+
onFilter(values); // 清空advancedForm的值
|
358
478
|
|
359
479
|
var clearKeys = {};
|
360
480
|
(_Object$keys = Object.keys(advancedForm.values)) === null || _Object$keys === void 0 ? void 0 : _Object$keys.forEach(function (key) {
|
361
481
|
clearKeys[key] = undefined;
|
362
482
|
});
|
363
|
-
advancedForm.setValues(clearKeys);
|
364
|
-
|
365
|
-
configFilterItem(advancedForm);
|
366
|
-
configTag();
|
483
|
+
advancedForm.setValues(clearKeys);
|
484
|
+
updateTags(advancedForm);
|
367
485
|
}, [onFilter]); // 轻量搜索Change
|
368
486
|
|
369
487
|
var onLightChange = (0, _react.useCallback)(function (values, fieldValue, fieldName) {
|
370
|
-
if (
|
488
|
+
if (currentFormName.current === 'light') {
|
371
489
|
onChange === null || onChange === void 0 ? void 0 : onChange(values, fieldValue, fieldName);
|
372
490
|
|
373
491
|
if (filterEnable.current === 'filter') {
|
@@ -378,7 +496,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
378
496
|
|
379
497
|
var onAdvancedFilter = (0, _react.useCallback)(function (values) {
|
380
498
|
setCurrentForm('advanced');
|
381
|
-
onFilter
|
499
|
+
onFilter(values);
|
382
500
|
configFilterItem(advancedForm); // 清空lightForm的值
|
383
501
|
|
384
502
|
lightForm.reset('*', {
|
@@ -388,7 +506,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
388
506
|
|
389
507
|
var onAdvancedReset = (0, _react.useCallback)(function () {
|
390
508
|
setCurrentForm('advanced');
|
391
|
-
onReset
|
509
|
+
onReset((0, _reactive.toJS)(advancedForm.values));
|
392
510
|
configFilterItem(advancedForm); // 清空lightForm的值
|
393
511
|
|
394
512
|
lightForm.reset('*', {
|
@@ -397,7 +515,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
397
515
|
}, [onReset]); // 高级搜索Change
|
398
516
|
|
399
517
|
var onAdvancedChange = (0, _react.useCallback)(function (values, fieldValue, fieldName) {
|
400
|
-
if (
|
518
|
+
if (currentFormName.current === 'advanced') {
|
401
519
|
onChange === null || onChange === void 0 ? void 0 : onChange(values, fieldValue, fieldName);
|
402
520
|
}
|
403
521
|
}, [onChange]); // 关闭标签清空表单字段值
|
@@ -411,9 +529,8 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
411
529
|
}
|
412
530
|
|
413
531
|
advancedForm.setValuesIn(key, newValue);
|
414
|
-
|
415
|
-
|
416
|
-
onFilter === null || onFilter === void 0 ? void 0 : onFilter((0, _reactive.toJS)(advancedForm.values));
|
532
|
+
updateTags(advancedForm);
|
533
|
+
onFilter((0, _reactive.toJS)(advancedForm.values));
|
417
534
|
}, [onFilter]); // initialRequest 的回调
|
418
535
|
|
419
536
|
var onInitialComplete = (0, _react.useCallback)(function (form) {
|
@@ -424,7 +541,7 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
424
541
|
}, []); // 组件挂载
|
425
542
|
|
426
543
|
(0, _react.useEffect)(function () {
|
427
|
-
setCurrentForm(
|
544
|
+
setCurrentForm(currentFormName.current);
|
428
545
|
}, []);
|
429
546
|
return /*#__PURE__*/_react.default.createElement(_Layout.QueryFilterLayout, {
|
430
547
|
className: (0, _classnames.default)(prefixCls, props.className),
|
@@ -456,12 +573,12 @@ var QueryFilter = /*#__PURE__*/(0, _react.memo)(function (props) {
|
|
456
573
|
onReset: onAdvancedReset,
|
457
574
|
onInitialComplete: onInitialComplete
|
458
575
|
})) : null
|
459
|
-
}, mode === 'panel' && !panelVisible ? /*#__PURE__*/_react.default.createElement(_components.Tag.Group, null, tagDataSource.map(function (
|
460
|
-
var key =
|
461
|
-
label =
|
462
|
-
value =
|
463
|
-
type =
|
464
|
-
index =
|
576
|
+
}, mode === 'panel' && !panelVisible ? /*#__PURE__*/_react.default.createElement(_components.Tag.Group, null, tagDataSource.map(function (_ref8) {
|
577
|
+
var key = _ref8.key,
|
578
|
+
label = _ref8.label,
|
579
|
+
value = _ref8.value,
|
580
|
+
type = _ref8.type,
|
581
|
+
index = _ref8.index;
|
465
582
|
return /*#__PURE__*/_react.default.createElement(_components.Tag.Closeable, {
|
466
583
|
key: (0, _utils.isNum)(index) ? key + label : key,
|
467
584
|
afterClose: function afterClose() {
|
@@ -0,0 +1,129 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.default = void 0;
|
7
|
+
|
8
|
+
var _hooks = require("@teamix/hooks");
|
9
|
+
|
10
|
+
var _utils = require("@teamix/utils");
|
11
|
+
|
12
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
13
|
+
|
14
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
15
|
+
|
16
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
17
|
+
|
18
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
19
|
+
|
20
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
21
|
+
|
22
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
23
|
+
|
24
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
25
|
+
|
26
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
27
|
+
|
28
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
29
|
+
|
30
|
+
var _default = function _default(bindUrl, functions, formRef) {
|
31
|
+
// 预处理 bindUrl 参数(主要兼容 SelectGroup 组件)
|
32
|
+
var initializeBindUrl = function initializeBindUrl(options) {
|
33
|
+
return options ? _objectSpread(_objectSpread({}, options), {}, {
|
34
|
+
beforeStringify: function beforeStringify(values) {
|
35
|
+
var _Object$entries;
|
36
|
+
|
37
|
+
var beforeStringify = options.beforeStringify;
|
38
|
+
|
39
|
+
var newValues = _objectSpread({}, values);
|
40
|
+
|
41
|
+
(_Object$entries = Object.entries(values)) === null || _Object$entries === void 0 ? void 0 : _Object$entries.forEach(function (_ref) {
|
42
|
+
var _form$query;
|
43
|
+
|
44
|
+
var _ref2 = _slicedToArray(_ref, 2),
|
45
|
+
key = _ref2[0],
|
46
|
+
value = _ref2[1];
|
47
|
+
|
48
|
+
var form = formRef.current;
|
49
|
+
var field = (_form$query = form.query(key)) === null || _form$query === void 0 ? void 0 : _form$query.take();
|
50
|
+
|
51
|
+
if ((field === null || field === void 0 ? void 0 : field.component[0]) === 'SelectGroup') {
|
52
|
+
newValues[key] = value.map(function (_ref3) {
|
53
|
+
var key = _ref3.key,
|
54
|
+
value = _ref3.value;
|
55
|
+
return key && value ? "".concat(key, "||").concat(value === null || value === void 0 ? void 0 : value.join('|')) : '';
|
56
|
+
});
|
57
|
+
}
|
58
|
+
});
|
59
|
+
return beforeStringify ? beforeStringify(newValues) : newValues;
|
60
|
+
}
|
61
|
+
}) : options;
|
62
|
+
}; // 通过 useUrlState 获取 url 上的参数和 url 配置方法
|
63
|
+
|
64
|
+
|
65
|
+
var _ref4 = bindUrl ? (0, _hooks.useUrlState)(undefined, initializeBindUrl((0, _utils.isPlainObj)(bindUrl) ? bindUrl : {})) : [],
|
66
|
+
_ref5 = _slicedToArray(_ref4, 2),
|
67
|
+
urlState = _ref5[0],
|
68
|
+
setUrlState = _ref5[1]; // 输出配置url参数的函数
|
69
|
+
|
70
|
+
|
71
|
+
var initializedFunctions = Object.entries(functions).reduce(function (prev, _ref6) {
|
72
|
+
var _ref7 = _slicedToArray(_ref6, 2),
|
73
|
+
key = _ref7[0],
|
74
|
+
fun = _ref7[1];
|
75
|
+
|
76
|
+
prev[key] = function (values) {
|
77
|
+
fun === null || fun === void 0 ? void 0 : fun(values);
|
78
|
+
setUrlState === null || setUrlState === void 0 ? void 0 : setUrlState(values);
|
79
|
+
};
|
80
|
+
|
81
|
+
return prev;
|
82
|
+
}, {}); // 使用 url 参数配置 QueryFilter 默认值(移除非表单值,兼容数组数据,兼容 SelectGroup 组件)
|
83
|
+
|
84
|
+
var setValuesByUrlState = function setValuesByUrlState(form) {
|
85
|
+
if (urlState) {
|
86
|
+
var _Object$entries2;
|
87
|
+
|
88
|
+
(_Object$entries2 = Object.entries(urlState)) === null || _Object$entries2 === void 0 ? void 0 : _Object$entries2.forEach(function (_ref8) {
|
89
|
+
var _form$query2;
|
90
|
+
|
91
|
+
var _ref9 = _slicedToArray(_ref8, 2),
|
92
|
+
key = _ref9[0],
|
93
|
+
value = _ref9[1];
|
94
|
+
|
95
|
+
var field = (_form$query2 = form.query(key)) === null || _form$query2 === void 0 ? void 0 : _form$query2.take();
|
96
|
+
|
97
|
+
if (field) {
|
98
|
+
var newValue = value;
|
99
|
+
|
100
|
+
if (field.displayName === 'ArrayField') {
|
101
|
+
newValue = [].concat((0, _utils.isUsable)(newValue) ? newValue : []);
|
102
|
+
}
|
103
|
+
|
104
|
+
if (field.component[0] === 'SelectGroup') {
|
105
|
+
newValue = newValue.map(function (item) {
|
106
|
+
var _item$split = item === null || item === void 0 ? void 0 : item.split('||'),
|
107
|
+
_item$split2 = _slicedToArray(_item$split, 2),
|
108
|
+
key = _item$split2[0],
|
109
|
+
value = _item$split2[1];
|
110
|
+
|
111
|
+
return {
|
112
|
+
key: key,
|
113
|
+
value: value === null || value === void 0 ? void 0 : value.split('|')
|
114
|
+
};
|
115
|
+
});
|
116
|
+
}
|
117
|
+
|
118
|
+
form.setValuesIn(key, newValue);
|
119
|
+
}
|
120
|
+
});
|
121
|
+
}
|
122
|
+
};
|
123
|
+
|
124
|
+
return _objectSpread({
|
125
|
+
setValuesByUrlState: setValuesByUrlState
|
126
|
+
}, initializedFunctions);
|
127
|
+
};
|
128
|
+
|
129
|
+
exports.default = _default;
|