@teamix/pro 1.2.21 → 1.2.26
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 +4849 -2339
- package/dist/pro.min.css +1 -1
- package/dist/pro.min.js +1 -1
- package/es/actions/dialog.js +14 -24
- package/es/actions/index.d.ts +22 -8
- package/es/actions/index.js +69 -29
- package/es/actions/index.scss +12 -1
- package/es/form/Components/SelectTable/index.d.ts +24 -0
- package/es/form/Components/SelectTable/index.js +135 -0
- package/es/form/Components/SelectTable/index.scss +28 -0
- package/es/form/Components/SelectTable/table.d.ts +6 -0
- package/es/form/Components/SelectTable/table.js +64 -0
- package/es/form/Filter/AdvancedFilter.js +1 -0
- package/es/form/ProForm/index.scss +37 -6
- package/es/form/SchemaForm/index.js +8 -6
- package/es/form/SchemaForm/initializeDataSource.d.ts +1 -1
- package/es/form/SchemaForm/initializeDataSource.js +2 -2
- package/es/form/SchemaForm/initializeRequest.d.ts +1 -1
- package/es/form/SchemaForm/initializeRequest.js +2 -2
- package/es/form/SchemaForm/initializeRules.d.ts +1 -1
- package/es/form/SchemaForm/initializeRules.js +3 -3
- package/es/form/global.scss +1 -0
- package/es/form/utils.d.ts +2 -2
- package/es/form/utils.js +2 -2
- package/es/index.d.ts +5 -2
- package/es/index.js +6 -3
- package/es/step/ProStepItem/components/HozStepItem/index.d.ts +5 -0
- package/es/step/ProStepItem/components/HozStepItem/index.js +235 -0
- package/es/step/ProStepItem/components/HozStepItem/index.scss +279 -0
- package/es/step/ProStepItem/components/VerStepItem/index.d.ts +5 -0
- package/es/step/ProStepItem/components/VerStepItem/index.js +295 -0
- package/es/step/ProStepItem/components/VerStepItem/index.scss +287 -0
- package/es/step/ProStepItem/index.d.ts +4 -0
- package/es/step/ProStepItem/index.js +57 -0
- package/es/step/index.d.ts +9 -0
- package/es/step/index.js +101 -0
- package/es/step/typing.d.ts +96 -0
- package/es/step/typing.js +1 -0
- package/es/table/components/Filter/index.js +2 -17
- package/es/table/components/Layout/index.js +22 -12
- package/es/table/components/Pagination/index.d.ts +5 -1
- package/es/table/components/Pagination/index.js +179 -17
- package/es/table/components/Pagination/index.scss +55 -0
- package/es/table/components/ToolBar/FilterColumnIcon.js +24 -3
- package/es/table/components/ToolBar/index.scss +9 -4
- package/es/table/index.js +84 -27
- package/es/table/index.scss +5 -5
- package/es/table/typing.d.ts +11 -2
- package/es/table/utils/columnRender.js +2 -1
- package/es/table/utils/index.d.ts +14 -0
- package/es/table/utils/index.js +74 -4
- package/es/utils/index.d.ts +1 -0
- package/es/utils/index.js +1 -0
- package/lib/actions/dialog.js +13 -23
- package/lib/actions/index.d.ts +22 -8
- package/lib/actions/index.js +69 -29
- package/lib/actions/index.scss +12 -1
- package/lib/form/Components/SelectTable/index.d.ts +24 -0
- package/lib/form/Components/SelectTable/index.js +157 -0
- package/lib/form/Components/SelectTable/index.scss +28 -0
- package/lib/form/Components/SelectTable/table.d.ts +6 -0
- package/lib/form/Components/SelectTable/table.js +76 -0
- package/lib/form/Filter/AdvancedFilter.js +1 -0
- package/lib/form/ProForm/index.scss +37 -6
- package/lib/form/SchemaForm/index.js +8 -6
- package/lib/form/SchemaForm/initializeDataSource.d.ts +1 -1
- package/lib/form/SchemaForm/initializeDataSource.js +2 -2
- package/lib/form/SchemaForm/initializeRequest.d.ts +1 -1
- package/lib/form/SchemaForm/initializeRequest.js +2 -2
- package/lib/form/SchemaForm/initializeRules.d.ts +1 -1
- package/lib/form/SchemaForm/initializeRules.js +3 -3
- package/lib/form/global.scss +1 -0
- package/lib/form/utils.d.ts +2 -2
- package/lib/form/utils.js +2 -2
- package/lib/index.d.ts +5 -2
- package/lib/index.js +35 -3
- package/lib/step/ProStepItem/components/HozStepItem/index.d.ts +5 -0
- package/lib/step/ProStepItem/components/HozStepItem/index.js +258 -0
- package/lib/step/ProStepItem/components/HozStepItem/index.scss +279 -0
- package/lib/step/ProStepItem/components/VerStepItem/index.d.ts +5 -0
- package/lib/step/ProStepItem/components/VerStepItem/index.js +315 -0
- package/lib/step/ProStepItem/components/VerStepItem/index.scss +287 -0
- package/lib/step/ProStepItem/index.d.ts +4 -0
- package/lib/step/ProStepItem/index.js +69 -0
- package/lib/step/index.d.ts +9 -0
- package/lib/step/index.js +124 -0
- package/lib/step/typing.d.ts +96 -0
- package/lib/step/typing.js +5 -0
- package/lib/table/components/Filter/index.js +2 -17
- package/lib/table/components/Layout/index.js +21 -11
- package/lib/table/components/Pagination/index.d.ts +5 -1
- package/lib/table/components/Pagination/index.js +186 -17
- package/lib/table/components/Pagination/index.scss +55 -0
- package/lib/table/components/ToolBar/FilterColumnIcon.js +23 -2
- package/lib/table/components/ToolBar/index.scss +9 -4
- package/lib/table/index.js +84 -25
- package/lib/table/index.scss +5 -5
- package/lib/table/typing.d.ts +11 -2
- package/lib/table/utils/columnRender.js +2 -1
- package/lib/table/utils/index.d.ts +14 -0
- package/lib/table/utils/index.js +84 -4
- package/lib/utils/index.d.ts +1 -0
- package/lib/utils/index.js +13 -0
- package/package.json +1 -1
package/es/actions/dialog.js
CHANGED
@@ -1,4 +1,4 @@
|
|
1
|
-
var _excluded = ["url", "method", "params", "data", "extendParams", "successMsg", "errorMsg", "formatParams", "formatResult", "onSuccess", "onError"],
|
1
|
+
var _excluded = ["trigger", "url", "method", "params", "data", "extendParams", "successMsg", "errorMsg", "formatParams", "formatResult", "onSuccess", "onError"],
|
2
2
|
_excluded2 = ["title", "content", "component", "schema", "onFinish", "dialogType", "dialogQuickShowType", "messageType", "popType", "beforeRequest", "onTrigger", "link", "beforeContent", "afterContent", "message", "footerDescription", "footerAlign", "className"];
|
3
3
|
|
4
4
|
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; }
|
@@ -32,7 +32,7 @@ import classnames from 'classnames';
|
|
32
32
|
import { useHistory } from 'react-router-dom';
|
33
33
|
import { Dialog, Drawer } from '@alicloudfe/components';
|
34
34
|
import PopConfirm from '@teamix/pop-confirm';
|
35
|
-
import { getTargetValue, uuid,
|
35
|
+
import { getTargetValue, uuid, getMessage } from '@teamix/utils';
|
36
36
|
import ProForm, { createForm } from '../form';
|
37
37
|
import { renderProMessage } from '../utils/message';
|
38
38
|
import { eventHandler } from './base';
|
@@ -81,7 +81,8 @@ export function useDialogAction(action, actionContext) {
|
|
81
81
|
var onActionStart = function onActionStart(context, e) {
|
82
82
|
var _objectSpread2;
|
83
83
|
|
84
|
-
var
|
84
|
+
var trigger = action.trigger,
|
85
|
+
url = action.url,
|
85
86
|
method = action.method,
|
86
87
|
params = action.params,
|
87
88
|
data = action.data,
|
@@ -161,45 +162,34 @@ export function useDialogAction(action, actionContext) {
|
|
161
162
|
while (1) {
|
162
163
|
switch (_context.prev = _context.next) {
|
163
164
|
case 0:
|
164
|
-
if (!link) {
|
165
|
-
_context.next = 5;
|
166
|
-
break;
|
167
|
-
}
|
168
|
-
|
169
|
-
goToLink(link, history);
|
170
|
-
onFinish && onFinish();
|
171
|
-
resolve(true);
|
172
|
-
return _context.abrupt("return");
|
173
|
-
|
174
|
-
case 5:
|
175
165
|
setLoading(true);
|
176
166
|
footerDescriptionValues = Object.assign({}, footerDescriptionRef === null || footerDescriptionRef === void 0 ? void 0 : (_footerDescriptionRef = footerDescriptionRef.current) === null || _footerDescriptionRef === void 0 ? void 0 : _footerDescriptionRef.values);
|
177
|
-
_context.prev =
|
167
|
+
_context.prev = 2;
|
178
168
|
requestContext = Object.assign({
|
179
169
|
footer: footerDescriptionValues
|
180
170
|
}, context);
|
181
|
-
_context.next =
|
171
|
+
_context.next = 6;
|
182
172
|
return doRequest(action, requestContext, history, footerDescriptionValues);
|
183
173
|
|
184
|
-
case
|
174
|
+
case 6:
|
185
175
|
onFinish && onFinish();
|
186
176
|
resolve(true);
|
187
|
-
_context.next =
|
177
|
+
_context.next = 15;
|
188
178
|
break;
|
189
179
|
|
190
|
-
case
|
191
|
-
_context.prev =
|
192
|
-
_context.t0 = _context["catch"](
|
180
|
+
case 10:
|
181
|
+
_context.prev = 10;
|
182
|
+
_context.t0 = _context["catch"](2);
|
193
183
|
setLoading(false);
|
194
184
|
resolve(false);
|
195
185
|
return _context.abrupt("return");
|
196
186
|
|
197
|
-
case
|
187
|
+
case 15:
|
198
188
|
case "end":
|
199
189
|
return _context.stop();
|
200
190
|
}
|
201
191
|
}
|
202
|
-
}, _callee, null, [[
|
192
|
+
}, _callee, null, [[2, 10]]);
|
203
193
|
}));
|
204
194
|
|
205
195
|
return function (_x) {
|
@@ -239,7 +229,7 @@ export function useDialogAction(action, actionContext) {
|
|
239
229
|
})), _objectSpread2), containerProps), containerOtherProps);
|
240
230
|
|
241
231
|
var ret = container.show(quickShowProps);
|
242
|
-
store.hide = ret.hide;
|
232
|
+
store.hide = ret ? ret.hide || ret.close : function () {};
|
243
233
|
};
|
244
234
|
|
245
235
|
return _objectSpread({}, eventHandler(action, actionContext, onActionStart));
|
package/es/actions/index.d.ts
CHANGED
@@ -26,31 +26,45 @@ export declare type ProActionConfig = ({
|
|
26
26
|
} & LinkAction);
|
27
27
|
export declare function registerActionHandler(id: string, extendActionId: string, defaultConfig: any): void;
|
28
28
|
export declare function useAction(config?: ProActionConfig, context?: any): any;
|
29
|
-
export interface ProActionButtonProps extends ButtonProps {
|
30
|
-
key?: string | number;
|
29
|
+
export interface ProActionButtonProps extends ProActionCommonProps, ButtonProps {
|
31
30
|
config?: ProActionConfig;
|
32
|
-
visible?: any;
|
33
31
|
disabled?: any;
|
34
32
|
icon?: string;
|
35
|
-
context?: any;
|
36
33
|
onClick?: (event: React.MouseEvent<Element, MouseEvent>, context?: any) => void;
|
37
34
|
}
|
38
35
|
export declare const ProActionButton: (props: ProActionButtonProps) => JSX.Element;
|
39
|
-
export interface
|
36
|
+
export interface ProActionCommonProps {
|
40
37
|
key?: string | number;
|
41
|
-
actions: ProActionProps[];
|
42
38
|
visible?: any;
|
43
|
-
icon?: string;
|
44
39
|
context?: any;
|
45
40
|
}
|
41
|
+
export interface ProActionMenuButtonProps extends ProActionCommonProps, Omit<MenuButtonProps, 'visible'> {
|
42
|
+
actions: ProActionProps[];
|
43
|
+
icon?: string;
|
44
|
+
}
|
46
45
|
export declare const ProActionMenuButton: (props: ProActionMenuButtonProps) => JSX.Element;
|
47
|
-
export
|
46
|
+
export interface ProActionDividerProps extends ProActionCommonProps {
|
47
|
+
type: 'divider';
|
48
|
+
}
|
49
|
+
export declare type ProActionProps = ProActionButtonProps | ProActionMenuButtonProps | ProActionDividerProps;
|
48
50
|
export declare type ProActionGroupProps = {
|
51
|
+
/** 操作组类型:按钮、文字按钮 */
|
49
52
|
type?: 'button' | 'text';
|
53
|
+
/** 上下文 */
|
50
54
|
context?: any;
|
55
|
+
/** 操作项配置 */
|
51
56
|
actions: ProActionProps[];
|
57
|
+
/** 操作按钮最长数量,超出后折叠,默认为4 */
|
52
58
|
max?: number;
|
59
|
+
/**
|
60
|
+
* @deprecated 建议使用 more 代替
|
61
|
+
*/
|
53
62
|
moreText?: string;
|
63
|
+
/** 更多按钮的配置,只有在actions数量超过max时才有效 */
|
64
|
+
more?: string | (ProActionButtonProps & {
|
65
|
+
noArrow?: boolean;
|
66
|
+
});
|
67
|
+
/** 是否有分割线,只有type="text"时生效,默认有分割线 */
|
54
68
|
divider?: boolean;
|
55
69
|
} & React.HTMLAttributes<HTMLElement>;
|
56
70
|
export declare function ProActionGroup(props: ProActionGroupProps): JSX.Element;
|
package/es/actions/index.js
CHANGED
@@ -3,9 +3,10 @@ var _excluded = ["type"],
|
|
3
3
|
_excluded3 = ["loading"],
|
4
4
|
_excluded4 = ["icon", "iconSize", "label", "actions", "children", "context", "type"],
|
5
5
|
_excluded5 = ["context", "text"],
|
6
|
-
_excluded6 = ["
|
7
|
-
_excluded7 = ["key", "
|
8
|
-
_excluded8 = ["
|
6
|
+
_excluded6 = ["noArrow", "className"],
|
7
|
+
_excluded7 = ["key", "actions"],
|
8
|
+
_excluded8 = ["key", "config"],
|
9
|
+
_excluded9 = ["type", "divider", "max", "moreText", "more", "context", "actions", "className"];
|
9
10
|
|
10
11
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
11
12
|
|
@@ -209,6 +210,12 @@ var ProActionMenuButtonItem = function ProActionMenuButtonItem(props) {
|
|
209
210
|
};
|
210
211
|
|
211
212
|
function renderCommonActionButtonMenuItem(action, key, context) {
|
213
|
+
if (action.type === 'divider') {
|
214
|
+
return /*#__PURE__*/React.createElement(Menu.Divider, {
|
215
|
+
key: key
|
216
|
+
});
|
217
|
+
}
|
218
|
+
|
212
219
|
var menuBtn = action;
|
213
220
|
|
214
221
|
if (menuBtn.actions && menuBtn.actions.length && menuBtn.disabled !== true) {
|
@@ -253,24 +260,45 @@ export var ProActionMenuButton = function ProActionMenuButton(props) {
|
|
253
260
|
}, others), actions.map(function (action, i) {
|
254
261
|
return renderCommonActionButtonMenuItem(action, action.key || i, context);
|
255
262
|
}));
|
256
|
-
}; //
|
257
|
-
|
258
|
-
function formatGroupActions(actions, max, moreConfig) {
|
259
|
-
var MAX = max < 1 ? MAX_ACTTIONS : max;
|
263
|
+
}; // 超出 max,则折叠起来
|
260
264
|
|
261
|
-
|
265
|
+
function foldExtraActions(actions, max, moreConfig) {
|
266
|
+
if (actions.length <= max) {
|
262
267
|
return actions;
|
263
268
|
}
|
264
269
|
|
265
|
-
return [].concat(_toConsumableArray(actions.slice(0,
|
270
|
+
return [].concat(_toConsumableArray(actions.slice(0, max - 1)), [_objectSpread(_objectSpread({
|
266
271
|
key: '__teamix_pro_action_group_more_btn'
|
267
272
|
}, moreConfig), {}, {
|
268
|
-
actions: actions.slice(
|
273
|
+
actions: actions.slice(max - 1)
|
269
274
|
})]);
|
275
|
+
} // 如果 actions 数量超过了 max,则把第 max 个和剩余超出部分折叠起来成为一个 menu
|
276
|
+
// divider 不计数
|
277
|
+
|
278
|
+
|
279
|
+
function formatGroupActions(actions, max, moreConfig) {
|
280
|
+
var MAX = max < 1 ? MAX_ACTTIONS : max;
|
281
|
+
var count = 0;
|
282
|
+
var index = 0;
|
283
|
+
|
284
|
+
for (; index < actions.length && count < MAX; index++) {
|
285
|
+
if (actions[index].type !== 'divider') {
|
286
|
+
count += 1;
|
287
|
+
}
|
288
|
+
}
|
289
|
+
|
290
|
+
return foldExtraActions(actions, Math.max(index, MAX), moreConfig);
|
270
291
|
} // 渲染一个 button 或者 menu button
|
271
292
|
|
272
293
|
|
273
294
|
function renderCommonActionButton(button, context, isTypeText) {
|
295
|
+
if (button.type === 'divider') {
|
296
|
+
return /*#__PURE__*/React.createElement(Divider, {
|
297
|
+
key: button.key,
|
298
|
+
direction: "ver"
|
299
|
+
});
|
300
|
+
}
|
301
|
+
|
274
302
|
var buttonContext = button.context,
|
275
303
|
text = button.text,
|
276
304
|
others = _objectWithoutProperties(button, _excluded5);
|
@@ -287,25 +315,36 @@ function renderCommonActionButton(button, context, isTypeText) {
|
|
287
315
|
return /*#__PURE__*/React.createElement(ProActionMenuButton, _objectSpread({}, buttonProps));
|
288
316
|
}
|
289
317
|
|
290
|
-
function getDefaultMoreButton(type,
|
291
|
-
|
292
|
-
|
293
|
-
|
294
|
-
|
295
|
-
}
|
296
|
-
|
297
|
-
if (moreText) {
|
298
|
-
return {
|
299
|
-
label: moreText
|
300
|
-
};
|
301
|
-
}
|
302
|
-
|
303
|
-
return {
|
318
|
+
function getDefaultMoreButton(type, more) {
|
319
|
+
var noArrowClassName = 'teamix-pro-actions-text-menu-btn-no-arrow';
|
320
|
+
var defaultConfig = type === 'button' ? {
|
321
|
+
children: getMessage('more')
|
322
|
+
} : {
|
304
323
|
icon: 'more-line',
|
305
324
|
// iconSize: 'small',
|
306
325
|
autoWidth: false,
|
307
|
-
className:
|
326
|
+
className: noArrowClassName
|
308
327
|
};
|
328
|
+
|
329
|
+
if (!more) {
|
330
|
+
return defaultConfig;
|
331
|
+
}
|
332
|
+
|
333
|
+
var moreConfig = typeof more === 'string' ? {
|
334
|
+
children: more
|
335
|
+
} : more;
|
336
|
+
|
337
|
+
if (type === 'button') {
|
338
|
+
return Object.assign(defaultConfig, moreConfig);
|
339
|
+
}
|
340
|
+
|
341
|
+
var noArrow = moreConfig.noArrow,
|
342
|
+
className = moreConfig.className,
|
343
|
+
others = _objectWithoutProperties(moreConfig, _excluded6);
|
344
|
+
|
345
|
+
return _objectSpread({
|
346
|
+
className: cls(className, _defineProperty({}, "".concat(noArrowClassName), noArrow))
|
347
|
+
}, others);
|
309
348
|
}
|
310
349
|
|
311
350
|
var MAX_ACTTIONS = 4;
|
@@ -322,7 +361,7 @@ function getActionConfig(action, index, context) {
|
|
322
361
|
if (action.actions) {
|
323
362
|
var _key = action.key,
|
324
363
|
actions = action.actions,
|
325
|
-
_others = _objectWithoutProperties(action,
|
364
|
+
_others = _objectWithoutProperties(action, _excluded7);
|
326
365
|
|
327
366
|
return _objectSpread({
|
328
367
|
key: getKey(index, _key),
|
@@ -334,7 +373,7 @@ function getActionConfig(action, index, context) {
|
|
334
373
|
|
335
374
|
var key = action.key,
|
336
375
|
config = action.config,
|
337
|
-
others = _objectWithoutProperties(action,
|
376
|
+
others = _objectWithoutProperties(action, _excluded8);
|
338
377
|
|
339
378
|
return _objectSpread({
|
340
379
|
key: getKey(index, key),
|
@@ -350,11 +389,12 @@ export function ProActionGroup(props) {
|
|
350
389
|
_props$max = props.max,
|
351
390
|
max = _props$max === void 0 ? MAX_ACTTIONS : _props$max,
|
352
391
|
moreText = props.moreText,
|
392
|
+
more = props.more,
|
353
393
|
context = props.context,
|
354
394
|
_props$actions = props.actions,
|
355
395
|
actions = _props$actions === void 0 ? [] : _props$actions,
|
356
396
|
className = props.className,
|
357
|
-
containerProps = _objectWithoutProperties(props,
|
397
|
+
containerProps = _objectWithoutProperties(props, _excluded9);
|
358
398
|
|
359
399
|
var isTypeText = type === 'text';
|
360
400
|
var filteredActions = actions.map(function (action, index) {
|
@@ -362,7 +402,7 @@ export function ProActionGroup(props) {
|
|
362
402
|
}).filter(function (action) {
|
363
403
|
return action.visible !== false;
|
364
404
|
});
|
365
|
-
var formatedActions = formatGroupActions(filteredActions, max, getDefaultMoreButton(type, moreText));
|
405
|
+
var formatedActions = formatGroupActions(filteredActions, max, getDefaultMoreButton(type, more || moreText));
|
366
406
|
return /*#__PURE__*/React.createElement("div", _objectSpread({
|
367
407
|
className: cls('teamix-pro-actions', "teamix-pro-actions-type-".concat(type), className, {
|
368
408
|
'teamix-pro-actions-divider': type === 'button' ? false : divider
|
package/es/actions/index.scss
CHANGED
@@ -2,12 +2,23 @@
|
|
2
2
|
display: flex;
|
3
3
|
align-items: center;
|
4
4
|
flex-wrap: wrap;
|
5
|
+
|
6
|
+
& > .next-divider {
|
7
|
+
& + .next-divider {
|
8
|
+
display: none;
|
9
|
+
}
|
10
|
+
}
|
11
|
+
|
5
12
|
&.teamix-pro-actions-type-button {
|
6
13
|
& > button {
|
7
14
|
&:not(:last-child) {
|
8
15
|
margin-right: var(--s-2);
|
9
16
|
}
|
10
17
|
}
|
18
|
+
& > .next-divider {
|
19
|
+
margin-left: 0;
|
20
|
+
margin-right: var(--s-2);
|
21
|
+
}
|
11
22
|
}
|
12
23
|
|
13
24
|
&.teamix-pro-actions-type-text:not(.teamix-pro-actions-divider) {
|
@@ -109,4 +120,4 @@
|
|
109
120
|
}
|
110
121
|
}
|
111
122
|
}
|
112
|
-
}
|
123
|
+
}
|
@@ -0,0 +1,24 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { TableProps, ColumnProps } from '@alifd/next/types/table';
|
3
|
+
import './index.scss';
|
4
|
+
declare type ISelectTableFilterOption = boolean | ((optipn: any, kewword: string) => boolean);
|
5
|
+
declare type ISelectTableFilterSort = (optionA: any, optionB: any) => number;
|
6
|
+
export interface ISelectTableColumnProps extends ColumnProps {
|
7
|
+
key: React.ReactText;
|
8
|
+
}
|
9
|
+
export interface ISelectTableProps extends TableProps {
|
10
|
+
mode?: 'multiple' | 'single';
|
11
|
+
dataSource?: any[];
|
12
|
+
optionAsValue?: boolean;
|
13
|
+
showSearch?: boolean;
|
14
|
+
filterOption?: ISelectTableFilterOption;
|
15
|
+
filterSort?: ISelectTableFilterSort;
|
16
|
+
onSearch?: (kekword: string) => void;
|
17
|
+
onChange?: (value: any) => void;
|
18
|
+
value?: any;
|
19
|
+
}
|
20
|
+
declare type ComposedSelectTable = React.FC<ISelectTableProps> & {
|
21
|
+
TableColumn?: React.FC<ISelectTableColumnProps>;
|
22
|
+
};
|
23
|
+
declare const SelectTable: ComposedSelectTable;
|
24
|
+
export default SelectTable;
|
@@ -0,0 +1,135 @@
|
|
1
|
+
var _excluded = ["mode", "dataSource", "optionAsValue", "showSearch", "filterOption", "filterSort", "onSearch", "className", "value", "onChange", "rowSelection"];
|
2
|
+
|
3
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
4
|
+
|
5
|
+
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."); }
|
6
|
+
|
7
|
+
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); }
|
8
|
+
|
9
|
+
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; }
|
10
|
+
|
11
|
+
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; }
|
12
|
+
|
13
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
14
|
+
|
15
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
16
|
+
|
17
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
18
|
+
|
19
|
+
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; }
|
20
|
+
|
21
|
+
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; }
|
22
|
+
|
23
|
+
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; }
|
24
|
+
|
25
|
+
import React, { useEffect, useState } from 'react';
|
26
|
+
import { Table, Search } from '@alicloudfe/components';
|
27
|
+
import { observer, useFieldSchema } from '@formily/react';
|
28
|
+
import cls from 'classnames';
|
29
|
+
import { isArr } from '@formily/shared';
|
30
|
+
import { usePrefixCls } from '@teamix/utils';
|
31
|
+
import './index.scss';
|
32
|
+
|
33
|
+
var useColumns = function useColumns() {
|
34
|
+
var schema = useFieldSchema();
|
35
|
+
var columns = [];
|
36
|
+
schema.mapProperties(function (schema, name) {
|
37
|
+
var _schema$xComponent;
|
38
|
+
|
39
|
+
if (((_schema$xComponent = schema['x-component']) === null || _schema$xComponent === void 0 ? void 0 : _schema$xComponent.indexOf('Column')) > -1) {
|
40
|
+
var props = schema === null || schema === void 0 ? void 0 : schema['x-component-props'];
|
41
|
+
columns.push({
|
42
|
+
name: name,
|
43
|
+
props: _objectSpread(_objectSpread({}, props), {}, {
|
44
|
+
title: (props === null || props === void 0 ? void 0 : props.title) || (schema === null || schema === void 0 ? void 0 : schema.title),
|
45
|
+
dataIndex: (props === null || props === void 0 ? void 0 : props.dataIndex) || name
|
46
|
+
}),
|
47
|
+
schema: schema
|
48
|
+
});
|
49
|
+
}
|
50
|
+
});
|
51
|
+
return columns;
|
52
|
+
};
|
53
|
+
|
54
|
+
var SelectTable = observer(function (props) {
|
55
|
+
var mode = props.mode,
|
56
|
+
dataSource = props.dataSource,
|
57
|
+
optionAsValue = props.optionAsValue,
|
58
|
+
showSearch = props.showSearch,
|
59
|
+
filterOption = props.filterOption,
|
60
|
+
filterSort = props.filterSort,
|
61
|
+
onSearch = props.onSearch,
|
62
|
+
className = props.className,
|
63
|
+
value = props.value,
|
64
|
+
onChange = props.onChange,
|
65
|
+
rowSelection = props.rowSelection,
|
66
|
+
otherTableProps = _objectWithoutProperties(props, _excluded);
|
67
|
+
|
68
|
+
var prefixCls = usePrefixCls('formily-selectTable', props);
|
69
|
+
|
70
|
+
var _useState = useState(),
|
71
|
+
_useState2 = _slicedToArray(_useState, 2),
|
72
|
+
selected = _useState2[0],
|
73
|
+
setSelected = _useState2[1];
|
74
|
+
|
75
|
+
var tabs = useColumns();
|
76
|
+
|
77
|
+
var expandedRowRender = function expandedRowRender(record, index) {
|
78
|
+
var children = isArr(record.children) ? record.children : [];
|
79
|
+
return /*#__PURE__*/React.createElement(Table, {
|
80
|
+
dataSource: children,
|
81
|
+
key: index
|
82
|
+
}, tabs.map(function (_ref, key) {
|
83
|
+
var props = _ref.props;
|
84
|
+
return /*#__PURE__*/React.createElement(Table.Column, _objectSpread({
|
85
|
+
key: key
|
86
|
+
}, props));
|
87
|
+
}));
|
88
|
+
};
|
89
|
+
|
90
|
+
var onInnerChange = function onInnerChange(selectedRowKeys, records) {
|
91
|
+
var outputValue = optionAsValue ? records : selectedRowKeys;
|
92
|
+
outputValue = mode === 'single' ? outputValue[0] : outputValue;
|
93
|
+
onChange && onChange(outputValue);
|
94
|
+
};
|
95
|
+
|
96
|
+
useEffect(function () {
|
97
|
+
var primaryKey = props.primaryKey;
|
98
|
+
var inputValue = mode === 'single' ? [value] : isArr(value) ? value : [];
|
99
|
+
inputValue = optionAsValue ? inputValue.map(function (v) {
|
100
|
+
return v === null || v === void 0 ? void 0 : v[primaryKey];
|
101
|
+
}) : inputValue;
|
102
|
+
setSelected(inputValue);
|
103
|
+
}, [value, mode]);
|
104
|
+
return /*#__PURE__*/React.createElement("div", {
|
105
|
+
className: cls(prefixCls, props.className)
|
106
|
+
}, showSearch ? /*#__PURE__*/React.createElement(Search, {
|
107
|
+
className: "".concat(prefixCls, "-search"),
|
108
|
+
onSearch: console.log
|
109
|
+
}) : null, /*#__PURE__*/React.createElement(Table, _objectSpread({
|
110
|
+
className: "".concat(prefixCls, "-table"),
|
111
|
+
dataSource: dataSource,
|
112
|
+
rowSelection: _objectSpread(_objectSpread({}, rowSelection), {}, {
|
113
|
+
mode: mode,
|
114
|
+
onChange: onInnerChange,
|
115
|
+
selectedRowKeys: selected
|
116
|
+
})
|
117
|
+
}, otherTableProps), tabs.map(function (_ref2, key) {
|
118
|
+
var props = _ref2.props;
|
119
|
+
return /*#__PURE__*/React.createElement(Table.Column, _objectSpread({
|
120
|
+
key: key
|
121
|
+
}, props));
|
122
|
+
})));
|
123
|
+
});
|
124
|
+
|
125
|
+
var TableColumn = function TableColumn(_ref3) {
|
126
|
+
var children = _ref3.children;
|
127
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, children);
|
128
|
+
};
|
129
|
+
|
130
|
+
SelectTable.TableColumn = TableColumn;
|
131
|
+
SelectTable.defaultProps = {
|
132
|
+
showSearch: false,
|
133
|
+
primaryKey: 'key'
|
134
|
+
};
|
135
|
+
export default SelectTable;
|
@@ -0,0 +1,28 @@
|
|
1
|
+
@import '../../global.scss';
|
2
|
+
|
3
|
+
$selectTable: #{$css-prefix}formily-selectTable;
|
4
|
+
|
5
|
+
.#{$selectTable} {
|
6
|
+
.#{$selectTable}-search {
|
7
|
+
margin-bottom: 8px;
|
8
|
+
}
|
9
|
+
.#{$selectTable}-table {
|
10
|
+
}
|
11
|
+
}
|
12
|
+
|
13
|
+
.next-table-row-nochildren {
|
14
|
+
> .next-table-expanded {
|
15
|
+
> * {
|
16
|
+
visibility: hidden;
|
17
|
+
}
|
18
|
+
}
|
19
|
+
}
|
20
|
+
.next-table-expanded-row {
|
21
|
+
.next-table-body {
|
22
|
+
> tr:last-child {
|
23
|
+
> td {
|
24
|
+
border-bottom: 0;
|
25
|
+
}
|
26
|
+
}
|
27
|
+
}
|
28
|
+
}
|
@@ -0,0 +1,64 @@
|
|
1
|
+
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; }
|
2
|
+
|
3
|
+
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; }
|
4
|
+
|
5
|
+
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; }
|
6
|
+
|
7
|
+
import React from 'React';
|
8
|
+
import { Table as NextTable } from '@alicloudfe/components';
|
9
|
+
import './index.scss';
|
10
|
+
|
11
|
+
var Table = function Table(props) {
|
12
|
+
var onChange = function onChange(selectedRowKeys, records) {
|
13
|
+
console.log(selectedRowKeys);
|
14
|
+
};
|
15
|
+
|
16
|
+
var onSelect = function onSelect() {};
|
17
|
+
|
18
|
+
var onSelectAll = function onSelectAll() {};
|
19
|
+
|
20
|
+
var rowProps = function rowProps(record) {
|
21
|
+
var _record$children;
|
22
|
+
|
23
|
+
if (!(record === null || record === void 0 ? void 0 : (_record$children = record.children) === null || _record$children === void 0 ? void 0 : _record$children.length)) {
|
24
|
+
return {// className: 'next-table-row-nochildren',
|
25
|
+
};
|
26
|
+
}
|
27
|
+
|
28
|
+
return {};
|
29
|
+
};
|
30
|
+
|
31
|
+
var expandedRowRender = function expandedRowRender(record, index) {
|
32
|
+
var children = record.children;
|
33
|
+
|
34
|
+
if (children === null || children === void 0 ? void 0 : children.length) {
|
35
|
+
return React.createElement(Table, _objectSpread(_objectSpread({}, props), {}, {
|
36
|
+
key: index,
|
37
|
+
dataSource: children,
|
38
|
+
hasHeader: false,
|
39
|
+
hasBorder: false,
|
40
|
+
rowProps: rowProps,
|
41
|
+
rowSelection: {
|
42
|
+
onChange: onChange
|
43
|
+
},
|
44
|
+
expandedRowRender: expandedRowRender,
|
45
|
+
expandedRowIndent: [1, 0]
|
46
|
+
}));
|
47
|
+
}
|
48
|
+
|
49
|
+
return React.createElement(React.Fragment, null);
|
50
|
+
};
|
51
|
+
|
52
|
+
return React.createElement(NextTable, _objectSpread(_objectSpread({}, props), {}, {
|
53
|
+
rowProps: rowProps,
|
54
|
+
rowSelection: {
|
55
|
+
onChange: onChange,
|
56
|
+
onSelectAll: onSelectAll,
|
57
|
+
onSelect: onSelect
|
58
|
+
},
|
59
|
+
expandedRowRender: expandedRowRender,
|
60
|
+
expandedRowIndent: [1, 0]
|
61
|
+
}));
|
62
|
+
};
|
63
|
+
|
64
|
+
export default Table;
|