@para-ui/core 4.0.85 → 4.0.88
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/Cascader/index.js +6 -7
- package/Checkbox/index.d.ts +1 -0
- package/Checkbox/index.js +37 -12
- package/ComboSelect/index.js +3 -4
- package/CycleSelector/index.js +1 -4
- package/DatePicker/index.js +1 -4
- package/DynamicMultiBox/index.js +3 -4
- package/FieldForm/index.js +4 -5
- package/Form/index.js +3 -4
- package/FormItem/index.js +3 -4
- package/Image/index.js +16 -16
- package/Menu/index.js +296 -348
- package/Message/index.js +5 -1
- package/OperateBtn/index.js +2 -2
- package/README.md +13 -0
- package/Radio/index.d.ts +1 -0
- package/Radio/index.js +31 -9
- package/Selector/index.js +280 -222
- package/SelectorPicker/index.js +2 -2
- package/Table/index.js +432 -497
- package/Tabs/index.js +2 -2
- package/Tag/index.js +55 -87
- package/TextEditor/index.js +3 -3
- package/TimePicker/index.js +1 -4
- package/Timeline/index.js +1 -2
- package/ToggleButton/index.js +1 -2
- package/Tree/index.js +3 -4
- package/Upload/index.js +4 -5
- package/_verture/{Portal-502bb85e.js → Portal-274c5bd8.js} +2 -2
- package/_verture/{defineProperty-6f62bb2a.js → defineProperty-f0e15205.js} +10 -2
- package/_verture/{index-d068959c.js → index-62845506.js} +1 -2
- package/_verture/{index-78f0f0e7.js → index-99b02582.js} +4 -5
- package/_verture/{index-1856bbeb.js → index-9e4b0e32.js} +1 -1
- package/_verture/{isEqual-30b6f859.js → isEqual-38aa74f9.js} +2 -2
- package/_verture/{useState-f2419d68.js → useState-05fc6660.js} +2 -3
- package/index.js +8 -9
- package/package.json +1 -1
- package/umd/Argv.js +1 -1
- package/umd/Checkbox.js +1 -1
- package/umd/CheckboxGroup.js +1 -1
- package/umd/ComboSelect.js +1 -1
- package/umd/DynamicMultiBox.js +1 -1
- package/umd/Form.js +3 -3
- package/umd/FormItem.js +1 -1
- package/umd/Menu.js +1 -1
- package/umd/Message.js +1 -1
- package/umd/QuickReply.js +1 -1
- package/umd/Radio.js +3 -3
- package/umd/RadioGroup.js +1 -1
- package/umd/Selector.js +3 -3
- package/umd/SelectorPicker.js +1 -1
- package/umd/Table.js +1 -1
- package/umd/Tabs.js +1 -1
- package/umd/Tree.js +1 -1
- package/_verture/typeof-adeedc13.js +0 -11
- /package/_verture/{index-73a11529.js → index-32a8f7db.js} +0 -0
package/Table/index.js
CHANGED
|
@@ -2,8 +2,6 @@ import { _ as __rest, a as __awaiter } from '../_verture/tslib.es6-55ed4bd2.js';
|
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
3
|
import { useRef, useState, useEffect, useMemo, useCallback, Fragment as Fragment$1 } from 'react';
|
|
4
4
|
import { Get, Post, DeepClone, GetBrowserClass, Cancel, ArrayToObject, UUID } from '@paraview/lib';
|
|
5
|
-
import { _ as _typeof } from '../_verture/typeof-adeedc13.js';
|
|
6
|
-
import { _ as _slicedToArray } from '../_verture/slicedToArray-61604a6c.js';
|
|
7
5
|
import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
|
|
8
6
|
import { $ as $prefixCls } from '../_verture/constant-5317fc89.js';
|
|
9
7
|
import { Popover } from '../Popover/index.js';
|
|
@@ -16,7 +14,6 @@ import SolidArrowDown from '@para-ui/icons/DownTriangleF';
|
|
|
16
14
|
import Panel from '@para-ui/icons/Panel';
|
|
17
15
|
import { u as useFormatMessage } from '../_verture/useFormatMessage-1fc7c957.js';
|
|
18
16
|
import Empty from '../Empty/index.js';
|
|
19
|
-
import { _ as _defineProperty } from '../_verture/defineProperty-6f62bb2a.js';
|
|
20
17
|
import { d as dist } from '../_verture/index-0f5ee6f7.js';
|
|
21
18
|
import { Radio } from '../Radio/index.js';
|
|
22
19
|
import OperateBtn from '../OperateBtn/index.js';
|
|
@@ -67,23 +64,25 @@ import '@para-ui/icons/DoubleRight';
|
|
|
67
64
|
* 发送请求
|
|
68
65
|
* @param obj {ReqProps} 请求信息
|
|
69
66
|
*/
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
67
|
+
const requestFunc = obj => {
|
|
68
|
+
const {
|
|
69
|
+
method,
|
|
70
|
+
url,
|
|
71
|
+
ctx,
|
|
72
|
+
data
|
|
73
|
+
} = obj,
|
|
75
74
|
otherProps = __rest(obj, ["method", "url", "ctx", "data"]);
|
|
76
75
|
if (method === 'Get') {
|
|
77
76
|
return Get(Object.assign({
|
|
78
77
|
url: url,
|
|
79
|
-
ctx
|
|
78
|
+
ctx
|
|
80
79
|
}, otherProps));
|
|
81
80
|
}
|
|
82
81
|
if (method === 'Post') {
|
|
83
82
|
return Post(Object.assign({
|
|
84
83
|
url: url,
|
|
85
|
-
ctx
|
|
86
|
-
data
|
|
84
|
+
ctx,
|
|
85
|
+
data
|
|
87
86
|
}, otherProps));
|
|
88
87
|
}
|
|
89
88
|
};
|
|
@@ -92,23 +91,23 @@ var requestFunc = function requestFunc(obj) {
|
|
|
92
91
|
* @param obj {ReqProps} 请求信息
|
|
93
92
|
* @return string get请求地址参数
|
|
94
93
|
*/
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
for (
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
if (
|
|
94
|
+
const handGetReqParams = obj => {
|
|
95
|
+
let str = obj.url;
|
|
96
|
+
const params = obj.data || {};
|
|
97
|
+
const arrKey = Object.keys(params);
|
|
98
|
+
const paramsArr = [];
|
|
99
|
+
for (let i = 0, l = arrKey.length; i < l; i++) {
|
|
100
|
+
const key = arrKey[i];
|
|
101
|
+
let val = params[key];
|
|
102
|
+
if (typeof val === 'object') {
|
|
104
103
|
val = encodeURIComponent(JSON.stringify(val));
|
|
105
104
|
} else {
|
|
106
105
|
val = encodeURIComponent(val);
|
|
107
106
|
}
|
|
108
107
|
paramsArr.push("".concat(key, "=").concat(val));
|
|
109
108
|
}
|
|
110
|
-
|
|
111
|
-
|
|
109
|
+
const paramsStr = paramsArr.join('&');
|
|
110
|
+
const pos = str.indexOf('?');
|
|
112
111
|
if (pos !== -1) {
|
|
113
112
|
str += (pos === str.length - 1 ? '' : '&') + paramsStr;
|
|
114
113
|
} else {
|
|
@@ -119,9 +118,9 @@ var handGetReqParams = function handGetReqParams(obj) {
|
|
|
119
118
|
/**
|
|
120
119
|
* 提取字符串里面的数字
|
|
121
120
|
* */
|
|
122
|
-
|
|
121
|
+
const getStringInNumber = str => {
|
|
123
122
|
if (typeof str === 'number') return str;
|
|
124
|
-
|
|
123
|
+
const strHand = str.replace(/[^0-9$]/gi, '');
|
|
125
124
|
return Number(strHand);
|
|
126
125
|
};
|
|
127
126
|
/**
|
|
@@ -129,23 +128,23 @@ var getStringInNumber = function getStringInNumber(str) {
|
|
|
129
128
|
* @param key {string} 键值
|
|
130
129
|
* @param num {number} 过期天数
|
|
131
130
|
* */
|
|
132
|
-
|
|
131
|
+
const getLocalStorageSelectHead = (key, num) => {
|
|
133
132
|
//debugger
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
for (
|
|
138
|
-
|
|
139
|
-
|
|
133
|
+
const headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
|
|
134
|
+
const headJson = JSON.parse(headJsonStr);
|
|
135
|
+
const headJsonArr = Object.keys(headJson);
|
|
136
|
+
for (let i = 0, l = headJsonArr.length; i < l; i++) {
|
|
137
|
+
const keyStr = headJsonArr[i];
|
|
138
|
+
const item = headJson[i];
|
|
140
139
|
if (!item) continue;
|
|
141
|
-
|
|
142
|
-
|
|
140
|
+
const newDate = new Date().getTime(); // 当前时间
|
|
141
|
+
const endTime = item.storageTime + item.validity; // 过期时间
|
|
143
142
|
// 过期时间 小于 当前时间, 说明已经过期了, 删除当前表格列数据
|
|
144
143
|
if (endTime < newDate) {
|
|
145
144
|
delete headJson[keyStr];
|
|
146
145
|
}
|
|
147
146
|
}
|
|
148
|
-
|
|
147
|
+
const headJsonItem = headJson[key];
|
|
149
148
|
// 重置过期时间
|
|
150
149
|
if (headJsonItem) {
|
|
151
150
|
headJsonItem.storageTime = new Date().getTime();
|
|
@@ -158,9 +157,9 @@ var getLocalStorageSelectHead = function getLocalStorageSelectHead(key, num) {
|
|
|
158
157
|
* @param key {string} 键值
|
|
159
158
|
* @param val {HeadLocalStorageItem} 保存值
|
|
160
159
|
* */
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
160
|
+
const setLocalStorageSelectHead = (key, val) => {
|
|
161
|
+
const headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
|
|
162
|
+
const headJson = JSON.parse(headJsonStr);
|
|
164
163
|
headJson[key] = val;
|
|
165
164
|
window.localStorage.setItem('_paraui_table_head', JSON.stringify(headJson));
|
|
166
165
|
};
|
|
@@ -169,8 +168,8 @@ var setLocalStorageSelectHead = function setLocalStorageSelectHead(key, val) {
|
|
|
169
168
|
* @param el 当前元素
|
|
170
169
|
* @param selector 查找元素class
|
|
171
170
|
*/
|
|
172
|
-
|
|
173
|
-
|
|
171
|
+
const closest = (el, selector) => {
|
|
172
|
+
const matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
|
|
174
173
|
while (el) {
|
|
175
174
|
if (matchesSelector.call(el, selector)) {
|
|
176
175
|
break;
|
|
@@ -366,70 +365,50 @@ var zh = {
|
|
|
366
365
|
};
|
|
367
366
|
|
|
368
367
|
var localeJson = {
|
|
369
|
-
zh
|
|
370
|
-
en
|
|
368
|
+
zh,
|
|
369
|
+
en
|
|
371
370
|
};
|
|
372
371
|
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
headData =
|
|
376
|
-
sortTable
|
|
377
|
-
filter
|
|
378
|
-
expandable
|
|
379
|
-
check
|
|
380
|
-
radio
|
|
381
|
-
onRequestSort
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
checked = _useState4[0],
|
|
414
|
-
setChecked = _useState4[1]; // 选中
|
|
415
|
-
var _useState5 = useState(null),
|
|
416
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
417
|
-
anchorElColums = _useState6[0],
|
|
418
|
-
setAnchorElColums = _useState6[1]; // 显示列定位元素
|
|
419
|
-
var _useState7 = useState({}),
|
|
420
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
421
|
-
headDataJson = _useState8[0],
|
|
422
|
-
setHeadDataJson = _useState8[1]; // 显示列json
|
|
423
|
-
var _useState9 = useState({}),
|
|
424
|
-
_useState10 = _slicedToArray(_useState9, 2),
|
|
425
|
-
filterHead = _useState10[0],
|
|
426
|
-
setFilterHead = _useState10[1]; // 过滤项当前表头数据
|
|
427
|
-
var _useState11 = useState({}),
|
|
428
|
-
_useState12 = _slicedToArray(_useState11, 2),
|
|
429
|
-
selectFilterCom = _useState12[0],
|
|
430
|
-
setSelectFilterCom = _useState12[1]; // 过滤项当前选中值
|
|
431
|
-
var intl = useFormatMessage('Table', localeJson);
|
|
432
|
-
useEffect(function () {
|
|
372
|
+
const TableHead$1 = props => {
|
|
373
|
+
const {
|
|
374
|
+
headData = [],
|
|
375
|
+
sortTable,
|
|
376
|
+
filter,
|
|
377
|
+
expandable,
|
|
378
|
+
check,
|
|
379
|
+
radio,
|
|
380
|
+
onRequestSort,
|
|
381
|
+
orderFieldArr = [],
|
|
382
|
+
orderTypeArr = [],
|
|
383
|
+
selectAll,
|
|
384
|
+
selectStatus,
|
|
385
|
+
align,
|
|
386
|
+
showList = [],
|
|
387
|
+
changeShowList,
|
|
388
|
+
selectFilter,
|
|
389
|
+
changeFilter,
|
|
390
|
+
operate,
|
|
391
|
+
showColumns,
|
|
392
|
+
fixedTable,
|
|
393
|
+
fixedColumn,
|
|
394
|
+
posFixed,
|
|
395
|
+
beyondText,
|
|
396
|
+
lineWidth,
|
|
397
|
+
dragColumn,
|
|
398
|
+
dragRow,
|
|
399
|
+
changeColumnWidth,
|
|
400
|
+
headDataConfig,
|
|
401
|
+
getPopupContainer,
|
|
402
|
+
tipMaxWidth
|
|
403
|
+
} = props;
|
|
404
|
+
const [indeterminate, setIndeterminate] = useState(false); // 半选中
|
|
405
|
+
const [checked, setChecked] = useState(false); // 选中
|
|
406
|
+
const [anchorElColums, setAnchorElColums] = useState(null); // 显示列定位元素
|
|
407
|
+
const [headDataJson, setHeadDataJson] = useState({}); // 显示列json
|
|
408
|
+
const [filterHead, setFilterHead] = useState({}); // 过滤项当前表头数据
|
|
409
|
+
const [selectFilterCom, setSelectFilterCom] = useState({}); // 过滤项当前选中值
|
|
410
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
411
|
+
useEffect(() => {
|
|
433
412
|
// 全选
|
|
434
413
|
if (selectStatus === 'all') {
|
|
435
414
|
setChecked(true);
|
|
@@ -446,17 +425,17 @@ var TableHead$1 = function TableHead(props) {
|
|
|
446
425
|
setIndeterminate(false);
|
|
447
426
|
}
|
|
448
427
|
}, [selectStatus]);
|
|
449
|
-
useEffect(
|
|
428
|
+
useEffect(() => {
|
|
450
429
|
if (headData) {
|
|
451
|
-
|
|
452
|
-
for (
|
|
453
|
-
|
|
430
|
+
const json = [];
|
|
431
|
+
for (let i = 0, l = headData.length; i < l; i++) {
|
|
432
|
+
const item = headData[i];
|
|
454
433
|
json[item.name] = item;
|
|
455
434
|
}
|
|
456
435
|
setHeadDataJson(json);
|
|
457
436
|
}
|
|
458
437
|
}, [headData]);
|
|
459
|
-
useEffect(
|
|
438
|
+
useEffect(() => {
|
|
460
439
|
if (selectFilter) setSelectFilterCom(DeepClone(selectFilter));
|
|
461
440
|
}, [selectFilter]);
|
|
462
441
|
/**
|
|
@@ -464,30 +443,28 @@ var TableHead$1 = function TableHead(props) {
|
|
|
464
443
|
* @param name 排序列
|
|
465
444
|
* @param event 当前排序元素
|
|
466
445
|
*/
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
if (onRequestSort) onRequestSort(event, name);
|
|
472
|
-
};
|
|
446
|
+
const createSortHandler = (name, item) => event => {
|
|
447
|
+
// 不存在排序,不触发事件
|
|
448
|
+
if (!(sortTable && item.name && item.sort !== false)) return;
|
|
449
|
+
if (onRequestSort) onRequestSort(event, name);
|
|
473
450
|
};
|
|
474
451
|
/**
|
|
475
452
|
* 全选 / 全不选
|
|
476
453
|
* @param event 操作元素
|
|
477
454
|
* @param bol 选中 / 不选中
|
|
478
455
|
*/
|
|
479
|
-
|
|
456
|
+
const onSelectAll = (event, bol) => {
|
|
480
457
|
if (selectAll) selectAll(event, bol);
|
|
481
458
|
};
|
|
482
459
|
/**
|
|
483
460
|
* 点击显示选择列
|
|
484
461
|
* @param event 点击元素
|
|
485
462
|
*/
|
|
486
|
-
|
|
463
|
+
const clickShowColums = event => {
|
|
487
464
|
setAnchorElColums(event.currentTarget);
|
|
488
465
|
};
|
|
489
466
|
// 点击隐藏选择列
|
|
490
|
-
|
|
467
|
+
const clickHideColums = bol => {
|
|
491
468
|
if (bol) return;
|
|
492
469
|
setAnchorElColums(null);
|
|
493
470
|
};
|
|
@@ -495,29 +472,27 @@ var TableHead$1 = function TableHead(props) {
|
|
|
495
472
|
* 点击显示列 列表
|
|
496
473
|
* @param item 详细
|
|
497
474
|
*/
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
arr1.push(headDataJson[_name]);
|
|
511
|
-
}
|
|
512
|
-
changeShowList && changeShowList(arr1, false, item);
|
|
513
|
-
} else {
|
|
514
|
-
headData.push(item);
|
|
515
|
-
changeShowList && changeShowList(headData, false, item);
|
|
475
|
+
const clickColumsList = item => () => {
|
|
476
|
+
if (item.disabledSelection) return;
|
|
477
|
+
const name = item.name;
|
|
478
|
+
const itemHead = headDataJson[name];
|
|
479
|
+
if (itemHead) {
|
|
480
|
+
// 取消勾选
|
|
481
|
+
delete headDataJson[name];
|
|
482
|
+
const arr = Object.keys(headDataJson);
|
|
483
|
+
const arr1 = [];
|
|
484
|
+
for (let i = 0, l = arr.length; i < l; i++) {
|
|
485
|
+
const name = arr[i];
|
|
486
|
+
arr1.push(headDataJson[name]);
|
|
516
487
|
}
|
|
517
|
-
|
|
488
|
+
changeShowList && changeShowList(arr1, false, item);
|
|
489
|
+
} else {
|
|
490
|
+
headData.push(item);
|
|
491
|
+
changeShowList && changeShowList(headData, false, item);
|
|
492
|
+
}
|
|
518
493
|
};
|
|
519
494
|
// 重置显示列
|
|
520
|
-
|
|
495
|
+
const resetShowList = () => {
|
|
521
496
|
changeShowList && changeShowList(headData, true);
|
|
522
497
|
};
|
|
523
498
|
/**
|
|
@@ -525,69 +500,63 @@ var TableHead$1 = function TableHead(props) {
|
|
|
525
500
|
* @param headCell 当前列信息
|
|
526
501
|
* @param event 元素
|
|
527
502
|
*/
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
532
|
-
};
|
|
503
|
+
const clickShowFilter = headCell => event => {
|
|
504
|
+
setFilterHead(headCell);
|
|
505
|
+
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
533
506
|
};
|
|
534
507
|
// 点击隐藏过滤
|
|
535
|
-
|
|
508
|
+
const clickHideFilter = bol => {
|
|
536
509
|
if (bol) return;
|
|
537
510
|
setFilterHead({});
|
|
538
511
|
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
539
512
|
};
|
|
540
513
|
// 点击过滤
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
filterValue = [filterValue[num]];
|
|
559
|
-
}
|
|
514
|
+
const clickFilter = item => () => {
|
|
515
|
+
const name = filterHead.name;
|
|
516
|
+
let filterValue = DeepClone(selectFilterCom[name] || []);
|
|
517
|
+
const index = filterValue.indexOf(item.value);
|
|
518
|
+
if (index !== -1) {
|
|
519
|
+
// 勾选 -> 不勾选
|
|
520
|
+
filterValue.splice(index, 1);
|
|
521
|
+
} else {
|
|
522
|
+
// 不勾选 -> 勾选
|
|
523
|
+
filterValue.push(item.value);
|
|
524
|
+
}
|
|
525
|
+
const filterRadio = filterHead.filterRadio;
|
|
526
|
+
if (filterRadio) {
|
|
527
|
+
// 过滤单个
|
|
528
|
+
const num = filterValue.indexOf(item.value);
|
|
529
|
+
if (num !== -1) {
|
|
530
|
+
filterValue = [filterValue[num]];
|
|
560
531
|
}
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
};
|
|
532
|
+
}
|
|
533
|
+
selectFilterCom[name] = filterValue;
|
|
534
|
+
setSelectFilterCom(Object.assign({}, selectFilterCom));
|
|
564
535
|
};
|
|
565
536
|
/**
|
|
566
537
|
* 重置 / 确定过滤
|
|
567
538
|
* @param type {'reset' | 'confirm'} 重置 / 确定过滤
|
|
568
539
|
*/
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
}
|
|
583
|
-
};
|
|
540
|
+
const filterFunc = type => () => {
|
|
541
|
+
if (type === 'confirm') {
|
|
542
|
+
// 确定
|
|
543
|
+
changeFilter && changeFilter(Object.assign({}, selectFilterCom));
|
|
544
|
+
setFilterHead({});
|
|
545
|
+
} else {
|
|
546
|
+
// 重置
|
|
547
|
+
const json = DeepClone(selectFilterCom);
|
|
548
|
+
delete json[filterHead.name];
|
|
549
|
+
setSelectFilterCom(json);
|
|
550
|
+
changeFilter && changeFilter(Object.assign({}, json));
|
|
551
|
+
setFilterHead({});
|
|
552
|
+
}
|
|
584
553
|
};
|
|
585
554
|
/**
|
|
586
555
|
* 自定义过滤确定
|
|
587
556
|
* @param val {[name: string]: any[]}
|
|
588
557
|
* */
|
|
589
|
-
|
|
590
|
-
|
|
558
|
+
const filterCustomConfirm = function () {
|
|
559
|
+
let val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
591
560
|
changeFilter && changeFilter(Object.assign({}, val));
|
|
592
561
|
setFilterHead({});
|
|
593
562
|
};
|
|
@@ -595,12 +564,12 @@ var TableHead$1 = function TableHead(props) {
|
|
|
595
564
|
* 处理TableCell
|
|
596
565
|
* @param item 当前列信息
|
|
597
566
|
*/
|
|
598
|
-
|
|
599
|
-
|
|
567
|
+
const handCellClass = item => {
|
|
568
|
+
let str = 'table-header-box';
|
|
600
569
|
// 排序
|
|
601
570
|
if (sortTable && item.name && item.sort !== false) {
|
|
602
571
|
str += ' table-header-box-sort';
|
|
603
|
-
|
|
572
|
+
const index = orderFieldArr.indexOf(item.name);
|
|
604
573
|
if (index !== -1) {
|
|
605
574
|
// 升序
|
|
606
575
|
if (orderTypeArr[index] === 'asc') {
|
|
@@ -619,10 +588,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
619
588
|
return str;
|
|
620
589
|
};
|
|
621
590
|
// 复选框memo
|
|
622
|
-
|
|
591
|
+
const TableCheckMemo = useMemo(() => {
|
|
623
592
|
if (check) {
|
|
624
|
-
|
|
625
|
-
|
|
593
|
+
const handCls = () => {
|
|
594
|
+
let str = 'table-checkbox table-head-btn';
|
|
626
595
|
if (fixedColumn) {
|
|
627
596
|
str += ' table-fixed-dom-left';
|
|
628
597
|
// 左边没有定位,且没有单选,没有嵌套表格
|
|
@@ -650,10 +619,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
650
619
|
}
|
|
651
620
|
}, [check, indeterminate, checked, selectAll, posFixed, radio, expandable, fixedColumn]);
|
|
652
621
|
// 单选框memo
|
|
653
|
-
|
|
622
|
+
const TableRadioMemo = useMemo(() => {
|
|
654
623
|
if (radio) {
|
|
655
|
-
|
|
656
|
-
|
|
624
|
+
const handCls = () => {
|
|
625
|
+
let str = 'table-radio table-head-btn';
|
|
657
626
|
if (fixedColumn) {
|
|
658
627
|
str += ' table-fixed-dom-left';
|
|
659
628
|
// 左边没有定位,没有嵌套表格
|
|
@@ -675,10 +644,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
675
644
|
}
|
|
676
645
|
}, [radio, posFixed, expandable, fixedColumn]);
|
|
677
646
|
// 嵌套表格memo
|
|
678
|
-
|
|
647
|
+
const TableExpandableMemo = useMemo(() => {
|
|
679
648
|
if (expandable) {
|
|
680
|
-
|
|
681
|
-
|
|
649
|
+
const handCls = () => {
|
|
650
|
+
let str = 'table-expandable table-head-btn';
|
|
682
651
|
if (fixedColumn) {
|
|
683
652
|
str += ' table-fixed-dom-left';
|
|
684
653
|
// 左边没有定位,没有嵌套表格
|
|
@@ -700,21 +669,21 @@ var TableHead$1 = function TableHead(props) {
|
|
|
700
669
|
}
|
|
701
670
|
}, [expandable, posFixed, fixedColumn]);
|
|
702
671
|
// 过滤弹窗内容
|
|
703
|
-
|
|
704
|
-
|
|
672
|
+
const filterPopoverContent = () => {
|
|
673
|
+
const name = filterHead.name;
|
|
705
674
|
if (!name) return;
|
|
706
|
-
|
|
675
|
+
const filterValue = selectFilterCom[name] || [];
|
|
707
676
|
if (filterHead.filterRender) {
|
|
708
677
|
// 自定义渲染过滤
|
|
709
678
|
return filterHead.filterRender({
|
|
710
|
-
filterValue
|
|
679
|
+
filterValue,
|
|
711
680
|
selectFilter: selectFilterCom,
|
|
712
|
-
filterHead
|
|
681
|
+
filterHead,
|
|
713
682
|
setFilter: filterCustomConfirm
|
|
714
683
|
});
|
|
715
684
|
}
|
|
716
|
-
|
|
717
|
-
|
|
685
|
+
const arr = filterHead.enums || [];
|
|
686
|
+
let str = 'filter-select';
|
|
718
687
|
if (arr.length === 0) str += ' filter-select-none';
|
|
719
688
|
return jsx("div", Object.assign({
|
|
720
689
|
className: str
|
|
@@ -729,8 +698,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
729
698
|
children: [jsx("div", Object.assign({
|
|
730
699
|
className: "filter-select-box"
|
|
731
700
|
}, {
|
|
732
|
-
children: arr.map(
|
|
733
|
-
|
|
701
|
+
children: arr.map((item, index) => {
|
|
702
|
+
const checked = filterValue.indexOf(item.value) !== -1;
|
|
734
703
|
return jsxs("div", Object.assign({
|
|
735
704
|
onClick: clickFilter(item),
|
|
736
705
|
className: checked ? 'filter-select-item filter-select-item-select' : 'filter-select-item'
|
|
@@ -769,30 +738,28 @@ var TableHead$1 = function TableHead(props) {
|
|
|
769
738
|
}));
|
|
770
739
|
};
|
|
771
740
|
// 表格列拖拽放下
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
changeColumnWidth && changeColumnWidth(headCell, result);
|
|
775
|
-
};
|
|
741
|
+
const onDragDown = headCell => result => {
|
|
742
|
+
changeColumnWidth && changeColumnWidth(headCell, result);
|
|
776
743
|
};
|
|
777
744
|
// 获取宽度
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
745
|
+
const getWidth = item => {
|
|
746
|
+
let w = item.width || '';
|
|
747
|
+
const name = item.name || '';
|
|
748
|
+
const wDrag = headDataConfig[name] && headDataConfig[name].width;
|
|
782
749
|
if (wDrag) w = "".concat(wDrag, "px");
|
|
783
750
|
return w;
|
|
784
751
|
};
|
|
785
752
|
// 内容列memo
|
|
786
|
-
|
|
753
|
+
const TableContentMemo = useMemo(() => {
|
|
787
754
|
// 处理过滤的class
|
|
788
|
-
|
|
789
|
-
|
|
755
|
+
const handFilterClass = item => {
|
|
756
|
+
let str = 'table-header-filter';
|
|
790
757
|
if (filterHead.name === item.name) str += ' table-header-filter-show';
|
|
791
758
|
if (item.name && selectFilterCom[item.name] && selectFilterCom[item.name].length > 0) str += ' table-header-filter-select';
|
|
792
759
|
return str;
|
|
793
760
|
};
|
|
794
|
-
|
|
795
|
-
|
|
761
|
+
const handCls = item => {
|
|
762
|
+
let str = '';
|
|
796
763
|
if (item.className) str += item.className;
|
|
797
764
|
if (fixedColumn && item.fixed) {
|
|
798
765
|
str += " table-fixed-dom-".concat(item.fixed);
|
|
@@ -807,8 +774,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
807
774
|
}
|
|
808
775
|
return str;
|
|
809
776
|
};
|
|
810
|
-
|
|
811
|
-
|
|
777
|
+
const handStyle = item => {
|
|
778
|
+
const json = {
|
|
812
779
|
width: getWidth(item)
|
|
813
780
|
};
|
|
814
781
|
if (fixedColumn && item.fixed && item.width) {
|
|
@@ -822,13 +789,13 @@ var TableHead$1 = function TableHead(props) {
|
|
|
822
789
|
return Object.assign(Object.assign({}, json), item.style);
|
|
823
790
|
};
|
|
824
791
|
// 处理拖拽
|
|
825
|
-
|
|
792
|
+
const handDrag = item => {
|
|
826
793
|
if (item.name === 'table-serial-number') return false; // 序号不拖拽
|
|
827
794
|
if (dragColumn && item.drag !== false) return true;
|
|
828
795
|
return false;
|
|
829
796
|
};
|
|
830
|
-
return headData.map(
|
|
831
|
-
|
|
797
|
+
return headData.map((headCell, index) => {
|
|
798
|
+
let str = "".concat($prefixCls, "-filter-popover ").concat($prefixCls, "-scrollbar-small");
|
|
832
799
|
if (!headCell.filterRender) str += " ".concat($prefixCls, "-filter-popover-default");
|
|
833
800
|
return jsx(ThElement, Object.assign({
|
|
834
801
|
className: handCls(headCell),
|
|
@@ -848,9 +815,7 @@ var TableHead$1 = function TableHead(props) {
|
|
|
848
815
|
content: headCell.name !== undefined && filterHead.name === headCell.name && filterPopoverContent(),
|
|
849
816
|
onVisibleChange: clickHideFilter,
|
|
850
817
|
overlayClassName: str,
|
|
851
|
-
getPopupContainer: getPopupContainer ? getPopupContainer :
|
|
852
|
-
return document.body;
|
|
853
|
-
},
|
|
818
|
+
getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body,
|
|
854
819
|
maxWidth: headCell.filterMaxWidth
|
|
855
820
|
}, {
|
|
856
821
|
children: jsxs("div", Object.assign({
|
|
@@ -895,10 +860,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
895
860
|
});
|
|
896
861
|
}, [headData, sortTable, filter, orderFieldArr, orderTypeArr, align, filterHead, selectFilterCom, beyondText, selectFilter, fixedColumn, lineWidth, dragColumn, changeColumnWidth, headDataConfig, getPopupContainer, tipMaxWidth]);
|
|
897
862
|
// 操作栏memo
|
|
898
|
-
|
|
863
|
+
const TableOperateMemo = useMemo(() => {
|
|
899
864
|
if (operate) {
|
|
900
|
-
|
|
901
|
-
|
|
865
|
+
const handCls = () => {
|
|
866
|
+
let str = 'table-operate';
|
|
902
867
|
if (operate.operateBtnRender) str += ' table-operate-small';
|
|
903
868
|
if (showColumns === false) str += ' table-operate-not-columns';
|
|
904
869
|
if (dragRow) str += ' table-operate-drag-row';
|
|
@@ -911,8 +876,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
911
876
|
}
|
|
912
877
|
return str;
|
|
913
878
|
};
|
|
914
|
-
|
|
915
|
-
|
|
879
|
+
const handStyle = () => {
|
|
880
|
+
const json = {
|
|
916
881
|
width: operate.width
|
|
917
882
|
};
|
|
918
883
|
if (fixedColumn) {
|
|
@@ -948,16 +913,16 @@ var TableHead$1 = function TableHead(props) {
|
|
|
948
913
|
}
|
|
949
914
|
}, [operate, align, posFixed, showColumns, posFixed, beyondText, fixedColumn, tipMaxWidth, dragRow]);
|
|
950
915
|
// 显示列弹窗内容
|
|
951
|
-
|
|
916
|
+
const showListContent = () => {
|
|
952
917
|
return jsxs("div", Object.assign({
|
|
953
918
|
className: "show-colums-select"
|
|
954
919
|
}, {
|
|
955
920
|
children: [jsx("div", Object.assign({
|
|
956
921
|
className: "show-colums-select-box"
|
|
957
922
|
}, {
|
|
958
|
-
children: showList.map(
|
|
959
|
-
|
|
960
|
-
|
|
923
|
+
children: showList.map((item, index) => {
|
|
924
|
+
const checked = Boolean(headDataJson[item.name]);
|
|
925
|
+
let str = 'show-colums-select-item';
|
|
961
926
|
if (checked) str += ' show-colums-select-item-select';
|
|
962
927
|
if (item.disabledSelection) str += ' show-colums-select-item-disabled';
|
|
963
928
|
return jsxs("div", Object.assign({
|
|
@@ -991,9 +956,9 @@ var TableHead$1 = function TableHead(props) {
|
|
|
991
956
|
}));
|
|
992
957
|
};
|
|
993
958
|
// 显示列memo
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
959
|
+
const TableShowList = useMemo(() => {
|
|
960
|
+
const handCls = () => {
|
|
961
|
+
let str = 'show-colums table-fixed-dom-right';
|
|
997
962
|
// 没有固定列参数 或者 没有操作栏且没有右侧固定列
|
|
998
963
|
if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
|
|
999
964
|
str += ' table-fixed-dom-right-first';
|
|
@@ -1006,9 +971,7 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1006
971
|
content: showListContent(),
|
|
1007
972
|
onVisibleChange: clickHideColums,
|
|
1008
973
|
overlayClassName: "".concat($prefixCls, "-table-show-colums-popover ").concat($prefixCls, "-scrollbar-small"),
|
|
1009
|
-
getPopupContainer: getPopupContainer ? getPopupContainer :
|
|
1010
|
-
return document.body;
|
|
1011
|
-
}
|
|
974
|
+
getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body
|
|
1012
975
|
}, {
|
|
1013
976
|
children: jsx(ThElement, Object.assign({
|
|
1014
977
|
align: "center",
|
|
@@ -1025,10 +988,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1025
988
|
}));
|
|
1026
989
|
}, [showColumns, posFixed, operate, anchorElColums, showList, headDataJson, getPopupContainer, tipMaxWidth]);
|
|
1027
990
|
// 拖动行
|
|
1028
|
-
|
|
991
|
+
const TbaleDragRow = useMemo(() => {
|
|
1029
992
|
if (!dragRow || operate || showColumns === 'inside') return null;
|
|
1030
|
-
|
|
1031
|
-
|
|
993
|
+
const handCls = () => {
|
|
994
|
+
let str = 'drag-row table-fixed-dom-right';
|
|
1032
995
|
// 没有固定列参数 或者 没有操作栏且没有右侧固定列
|
|
1033
996
|
if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
|
|
1034
997
|
str += ' table-fixed-dom-right-first';
|
|
@@ -1042,8 +1005,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1042
1005
|
});
|
|
1043
1006
|
}, [operate, showColumns, fixedColumn, posFixed, dragRow]);
|
|
1044
1007
|
// 处理class
|
|
1045
|
-
|
|
1046
|
-
|
|
1008
|
+
const handClass = () => {
|
|
1009
|
+
let str = 'table-head';
|
|
1047
1010
|
if (showColumns === 'inside') str += ' table-head-inside';
|
|
1048
1011
|
if (!fixedTable) str += ' table-head-scroll'; // 防止长度过长
|
|
1049
1012
|
// 没有 复选框,单选框,展开 按钮
|
|
@@ -1121,100 +1084,76 @@ var TdElement = function TdElement(props) {
|
|
|
1121
1084
|
}));
|
|
1122
1085
|
};
|
|
1123
1086
|
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
rowData =
|
|
1129
|
-
|
|
1130
|
-
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1143
|
-
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1151
|
-
|
|
1152
|
-
|
|
1153
|
-
|
|
1154
|
-
|
|
1155
|
-
|
|
1156
|
-
|
|
1157
|
-
|
|
1158
|
-
|
|
1159
|
-
|
|
1160
|
-
|
|
1161
|
-
|
|
1162
|
-
|
|
1163
|
-
|
|
1164
|
-
|
|
1165
|
-
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1171
|
-
|
|
1172
|
-
|
|
1173
|
-
|
|
1174
|
-
|
|
1175
|
-
|
|
1176
|
-
|
|
1177
|
-
|
|
1178
|
-
|
|
1179
|
-
|
|
1180
|
-
|
|
1181
|
-
|
|
1182
|
-
onDragRow = props.onDragRow,
|
|
1183
|
-
virtualIndex = props.virtualIndex,
|
|
1184
|
-
virtual = props.virtual;
|
|
1185
|
-
var _useState = useState(0),
|
|
1186
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
1187
|
-
expandableColSpan = _useState2[0],
|
|
1188
|
-
setExpandableColSpan = _useState2[1]; // 嵌套表格合并列数
|
|
1189
|
-
var _useState3 = useState({}),
|
|
1190
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
1191
|
-
expandableRow = _useState4[0],
|
|
1192
|
-
setExpandableRow = _useState4[1]; // 当前哪行展开表格嵌套
|
|
1193
|
-
var _useState5 = useState(true),
|
|
1194
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
1195
|
-
showMoreBtn = _useState6[0],
|
|
1196
|
-
setShowMoreBtn = _useState6[1]; // 加载更多
|
|
1197
|
-
var _useState7 = useState({}),
|
|
1198
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
1199
|
-
disabledExpandJson = _useState8[0],
|
|
1200
|
-
setDisabledExpand = _useState8[1]; // 禁用加减部分嵌套
|
|
1201
|
-
var _useState9 = useState(false),
|
|
1202
|
-
_useState10 = _slicedToArray(_useState9, 2),
|
|
1203
|
-
dragBol = _useState10[0],
|
|
1204
|
-
setDragBol = _useState10[1];
|
|
1205
|
-
var intl = useFormatMessage('Table', localeJson);
|
|
1087
|
+
const TableBody = props => {
|
|
1088
|
+
const {
|
|
1089
|
+
url,
|
|
1090
|
+
emptyProps,
|
|
1091
|
+
rowData = [],
|
|
1092
|
+
rowKey = 'key',
|
|
1093
|
+
check,
|
|
1094
|
+
radio,
|
|
1095
|
+
tableCell,
|
|
1096
|
+
expandable,
|
|
1097
|
+
headData = [],
|
|
1098
|
+
disabledJson = {},
|
|
1099
|
+
disabledArrStatus,
|
|
1100
|
+
checkJson = {},
|
|
1101
|
+
radioValue,
|
|
1102
|
+
selectCheck,
|
|
1103
|
+
selectRadio,
|
|
1104
|
+
align,
|
|
1105
|
+
operate,
|
|
1106
|
+
showColumns,
|
|
1107
|
+
fixedTable,
|
|
1108
|
+
fixedColumn,
|
|
1109
|
+
formatter,
|
|
1110
|
+
orderFieldArr = [],
|
|
1111
|
+
orderTypeArr = [],
|
|
1112
|
+
sortTable,
|
|
1113
|
+
loadState,
|
|
1114
|
+
loadMore,
|
|
1115
|
+
loadMoreRender,
|
|
1116
|
+
onClickMore,
|
|
1117
|
+
total,
|
|
1118
|
+
page,
|
|
1119
|
+
currentRowsPerPage,
|
|
1120
|
+
changePage,
|
|
1121
|
+
loadMoreUrl,
|
|
1122
|
+
expandMultiple = false,
|
|
1123
|
+
expandValue = [],
|
|
1124
|
+
disabledExpand = [],
|
|
1125
|
+
defaultExpandAllRows = false,
|
|
1126
|
+
onExpand,
|
|
1127
|
+
onRefresh,
|
|
1128
|
+
posFixed,
|
|
1129
|
+
beyondText,
|
|
1130
|
+
onClickRow,
|
|
1131
|
+
rowClassMapping,
|
|
1132
|
+
tipMaxWidth,
|
|
1133
|
+
lineHeight,
|
|
1134
|
+
dragRow,
|
|
1135
|
+
onDragRow,
|
|
1136
|
+
virtualIndex,
|
|
1137
|
+
virtual
|
|
1138
|
+
} = props;
|
|
1139
|
+
const [expandableColSpan, setExpandableColSpan] = useState(0); // 嵌套表格合并列数
|
|
1140
|
+
const [expandableRow, setExpandableRow] = useState({}); // 当前哪行展开表格嵌套
|
|
1141
|
+
const [showMoreBtn, setShowMoreBtn] = useState(true); // 加载更多
|
|
1142
|
+
const [disabledExpandJson, setDisabledExpand] = useState({}); // 禁用加减部分嵌套
|
|
1143
|
+
const [dragBol, setDragBol] = useState(false);
|
|
1144
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
1206
1145
|
// 默认是否展开所有
|
|
1207
|
-
useEffect(
|
|
1146
|
+
useEffect(() => {
|
|
1208
1147
|
if (!defaultExpandAllRows) {
|
|
1209
1148
|
setExpandableRow({});
|
|
1210
1149
|
return;
|
|
1211
1150
|
}
|
|
1212
|
-
|
|
1213
|
-
for (
|
|
1214
|
-
|
|
1215
|
-
|
|
1151
|
+
const json = {};
|
|
1152
|
+
for (let i = 0, l = rowData.length; i < l; i++) {
|
|
1153
|
+
const item = rowData[i] || {};
|
|
1154
|
+
const id = item[rowKey];
|
|
1216
1155
|
json[id] = {
|
|
1217
|
-
id
|
|
1156
|
+
id,
|
|
1218
1157
|
status: 'develop'
|
|
1219
1158
|
};
|
|
1220
1159
|
}
|
|
@@ -1222,41 +1161,41 @@ var TableBody = function TableBody(props) {
|
|
|
1222
1161
|
}, [defaultExpandAllRows, rowData, rowKey]);
|
|
1223
1162
|
// 监听展开表格
|
|
1224
1163
|
// 如果直接写expandMultiple, expandValue会死循环
|
|
1225
|
-
useEffect(
|
|
1164
|
+
useEffect(() => {
|
|
1226
1165
|
if (props.expandValue === undefined) return;
|
|
1227
|
-
|
|
1228
|
-
|
|
1166
|
+
const json = {};
|
|
1167
|
+
let expandValueHand = expandValue;
|
|
1229
1168
|
// 只展开一个,去第一个值
|
|
1230
1169
|
if (!expandMultiple && expandValue.length > 0) {
|
|
1231
1170
|
expandValueHand = [expandValue[0]];
|
|
1232
1171
|
}
|
|
1233
|
-
for (
|
|
1234
|
-
|
|
1172
|
+
for (let i = 0, l = expandValueHand.length; i < l; i++) {
|
|
1173
|
+
const id = expandValueHand[i];
|
|
1235
1174
|
json[id] = {
|
|
1236
|
-
id
|
|
1175
|
+
id,
|
|
1237
1176
|
status: 'develop'
|
|
1238
1177
|
};
|
|
1239
1178
|
}
|
|
1240
1179
|
setExpandableRow(json);
|
|
1241
1180
|
}, [props.expandMultiple, props.expandValue, rowData]);
|
|
1242
1181
|
// 监听禁用嵌套 props.disabledExpand 防止死循环
|
|
1243
|
-
useEffect(
|
|
1244
|
-
|
|
1245
|
-
for (
|
|
1246
|
-
|
|
1182
|
+
useEffect(() => {
|
|
1183
|
+
const json = {};
|
|
1184
|
+
for (let i = 0, l = disabledExpand.length; i < l; i++) {
|
|
1185
|
+
const id = disabledExpand[i];
|
|
1247
1186
|
json[id] = true;
|
|
1248
1187
|
}
|
|
1249
1188
|
setDisabledExpand(json);
|
|
1250
1189
|
}, [props.disabledExpand]);
|
|
1251
|
-
useEffect(
|
|
1190
|
+
useEffect(() => {
|
|
1252
1191
|
if (loadMoreUrl) {
|
|
1253
|
-
|
|
1192
|
+
const bol = Number(total) > Number(page) * Number(currentRowsPerPage);
|
|
1254
1193
|
setShowMoreBtn(bol);
|
|
1255
1194
|
}
|
|
1256
1195
|
}, [loadMoreUrl, total, page, currentRowsPerPage]);
|
|
1257
1196
|
// 处理嵌套表格合并列数
|
|
1258
|
-
useEffect(
|
|
1259
|
-
|
|
1197
|
+
useEffect(() => {
|
|
1198
|
+
let num = headData.length;
|
|
1260
1199
|
if (expandable) num += 1;
|
|
1261
1200
|
if (check) num += 1;
|
|
1262
1201
|
if (radio) num += 1;
|
|
@@ -1265,55 +1204,55 @@ var TableBody = function TableBody(props) {
|
|
|
1265
1204
|
setExpandableColSpan(num);
|
|
1266
1205
|
}, [headData, expandable, check, radio]);
|
|
1267
1206
|
// 展开/收起嵌套表格
|
|
1268
|
-
|
|
1269
|
-
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
|
|
1273
|
-
|
|
1274
|
-
|
|
1275
|
-
|
|
1276
|
-
status: status
|
|
1277
|
-
};
|
|
1278
|
-
if (expandMultiple) {
|
|
1279
|
-
// 展开多个
|
|
1280
|
-
expandableRow[id] = expandItem;
|
|
1281
|
-
setExpandableRow(Object.assign({}, expandableRow));
|
|
1282
|
-
} else {
|
|
1283
|
-
// 展开一个
|
|
1284
|
-
setExpandableRow(_defineProperty({}, id, expandItem));
|
|
1285
|
-
}
|
|
1286
|
-
onExpand && onExpand(row, status);
|
|
1287
|
-
event.stopPropagation();
|
|
1207
|
+
const handClickNestTable = row => event => {
|
|
1208
|
+
const id = row[rowKey];
|
|
1209
|
+
let expandItem = expandableRow[id] || {};
|
|
1210
|
+
let status = 'develop';
|
|
1211
|
+
if (expandItem.status === 'develop') status = 'retract';
|
|
1212
|
+
expandItem = {
|
|
1213
|
+
id,
|
|
1214
|
+
status
|
|
1288
1215
|
};
|
|
1216
|
+
if (expandMultiple) {
|
|
1217
|
+
// 展开多个
|
|
1218
|
+
expandableRow[id] = expandItem;
|
|
1219
|
+
setExpandableRow(Object.assign({}, expandableRow));
|
|
1220
|
+
} else {
|
|
1221
|
+
// 展开一个
|
|
1222
|
+
setExpandableRow({
|
|
1223
|
+
[id]: expandItem
|
|
1224
|
+
});
|
|
1225
|
+
}
|
|
1226
|
+
onExpand && onExpand(row, status);
|
|
1227
|
+
event.stopPropagation();
|
|
1289
1228
|
};
|
|
1290
1229
|
// 处理class
|
|
1291
|
-
|
|
1292
|
-
|
|
1230
|
+
const handClass = () => {
|
|
1231
|
+
let str = 'table-body';
|
|
1293
1232
|
if (!fixedTable) str += ' table-body-scroll';
|
|
1294
1233
|
// 没有 复选框,单选框,展开 按钮
|
|
1295
1234
|
if (!check && !radio && !expandable) str += ' table-body-no-btn';
|
|
1296
1235
|
return str;
|
|
1297
1236
|
};
|
|
1298
1237
|
// 处理嵌套表格class
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1238
|
+
const handExpandClass = row => {
|
|
1239
|
+
const id = row[rowKey];
|
|
1240
|
+
const expandItem = expandableRow[id] || {};
|
|
1241
|
+
let str = 'retract';
|
|
1303
1242
|
if (expandItem.status === 'develop') {
|
|
1304
1243
|
str = 'expand';
|
|
1305
1244
|
}
|
|
1306
1245
|
return str;
|
|
1307
1246
|
};
|
|
1308
1247
|
// 点击加载更多
|
|
1309
|
-
|
|
1248
|
+
const clickMore = () => {
|
|
1310
1249
|
if (loadMoreUrl) changePage && changePage();
|
|
1311
1250
|
onClickMore && onClickMore();
|
|
1312
1251
|
};
|
|
1313
1252
|
// 暂无数据memo
|
|
1314
|
-
|
|
1253
|
+
const NodataMemo = useMemo(() => {
|
|
1315
1254
|
// 处理刷新按钮
|
|
1316
|
-
|
|
1255
|
+
const handRefreshBtn = () => {
|
|
1317
1256
|
if ((emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh) !== undefined) {
|
|
1318
1257
|
return emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh;
|
|
1319
1258
|
}
|
|
@@ -1323,7 +1262,7 @@ var TableBody = function TableBody(props) {
|
|
|
1323
1262
|
return false;
|
|
1324
1263
|
};
|
|
1325
1264
|
// 处理非首页非空状态
|
|
1326
|
-
|
|
1265
|
+
const handleDescription = () => {
|
|
1327
1266
|
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.description) return emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.description;
|
|
1328
1267
|
if (Number(page) > 1) {
|
|
1329
1268
|
return jsxs("div", Object.assign({
|
|
@@ -1341,7 +1280,7 @@ var TableBody = function TableBody(props) {
|
|
|
1341
1280
|
children: jsx(Button, Object.assign({
|
|
1342
1281
|
variant: "text",
|
|
1343
1282
|
size: "small",
|
|
1344
|
-
onClick:
|
|
1283
|
+
onClick: () => {
|
|
1345
1284
|
changePage && changePage(Number(page) - 1);
|
|
1346
1285
|
}
|
|
1347
1286
|
}, {
|
|
@@ -1354,8 +1293,8 @@ var TableBody = function TableBody(props) {
|
|
|
1354
1293
|
}
|
|
1355
1294
|
};
|
|
1356
1295
|
// 处理className
|
|
1357
|
-
|
|
1358
|
-
|
|
1296
|
+
const handClassNoData = () => {
|
|
1297
|
+
let str = 'table-no-data';
|
|
1359
1298
|
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size) str += " table-no-data-".concat(emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size);
|
|
1360
1299
|
return str;
|
|
1361
1300
|
};
|
|
@@ -1369,24 +1308,24 @@ var TableBody = function TableBody(props) {
|
|
|
1369
1308
|
children: jsx(Empty, Object.assign({}, emptyProps, {
|
|
1370
1309
|
description: handleDescription(),
|
|
1371
1310
|
showRefresh: handRefreshBtn(),
|
|
1372
|
-
onRefresh:
|
|
1311
|
+
onRefresh: event => {
|
|
1373
1312
|
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh) {
|
|
1374
1313
|
emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh(event);
|
|
1375
1314
|
return;
|
|
1376
1315
|
}
|
|
1377
|
-
|
|
1316
|
+
onRefresh && onRefresh();
|
|
1378
1317
|
}
|
|
1379
1318
|
}))
|
|
1380
1319
|
}), expandableColSpan)
|
|
1381
1320
|
}));
|
|
1382
|
-
}, [expandableColSpan, emptyProps, url,
|
|
1321
|
+
}, [expandableColSpan, emptyProps, url, onRefresh, page, changePage]);
|
|
1383
1322
|
// 复选框useCallback
|
|
1384
|
-
|
|
1323
|
+
const TableCheckCallback = useCallback(row => {
|
|
1385
1324
|
if (check) {
|
|
1386
|
-
|
|
1387
|
-
|
|
1388
|
-
|
|
1389
|
-
|
|
1325
|
+
const handId = row[rowKey];
|
|
1326
|
+
const disabledHand = Boolean(disabledJson[handId]);
|
|
1327
|
+
let checkHand = checkJson[handId] || false;
|
|
1328
|
+
let showCheck = true;
|
|
1390
1329
|
if (disabledHand && disabledArrStatus) {
|
|
1391
1330
|
// 选中
|
|
1392
1331
|
if (disabledArrStatus[handId] === true) {
|
|
@@ -1401,8 +1340,8 @@ var TableBody = function TableBody(props) {
|
|
|
1401
1340
|
showCheck = false;
|
|
1402
1341
|
}
|
|
1403
1342
|
}
|
|
1404
|
-
|
|
1405
|
-
|
|
1343
|
+
const handCls = () => {
|
|
1344
|
+
let str = 'table-checkbox table-body-btn';
|
|
1406
1345
|
if (fixedColumn) {
|
|
1407
1346
|
str += ' table-fixed-dom-left';
|
|
1408
1347
|
// 左边没有定位,且没有单选,没有嵌套表格
|
|
@@ -1419,7 +1358,7 @@ var TableBody = function TableBody(props) {
|
|
|
1419
1358
|
children: showCheck && jsx(Checkbox, {
|
|
1420
1359
|
disabled: disabledHand,
|
|
1421
1360
|
checked: checkHand,
|
|
1422
|
-
onChange:
|
|
1361
|
+
onChange: (event, bol) => {
|
|
1423
1362
|
event.stopPropagation();
|
|
1424
1363
|
selectCheck && selectCheck(event, bol, row[rowKey]);
|
|
1425
1364
|
}
|
|
@@ -1428,12 +1367,12 @@ var TableBody = function TableBody(props) {
|
|
|
1428
1367
|
}
|
|
1429
1368
|
}, [check, disabledJson, rowKey, checkJson, selectCheck, disabledArrStatus, posFixed, expandable, radio, fixedColumn]);
|
|
1430
1369
|
// 单选框useCallback
|
|
1431
|
-
|
|
1370
|
+
const TableRadioCallback = useCallback(row => {
|
|
1432
1371
|
if (radio) {
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
|
|
1372
|
+
const handId = row[rowKey];
|
|
1373
|
+
const disabledHand = Boolean(disabledJson[handId]);
|
|
1374
|
+
let checkHand = radioValue === row[rowKey];
|
|
1375
|
+
let showRadio = true;
|
|
1437
1376
|
if (disabledHand && disabledArrStatus) {
|
|
1438
1377
|
// 选中
|
|
1439
1378
|
if (disabledArrStatus[handId] === true) {
|
|
@@ -1448,8 +1387,8 @@ var TableBody = function TableBody(props) {
|
|
|
1448
1387
|
showRadio = false;
|
|
1449
1388
|
}
|
|
1450
1389
|
}
|
|
1451
|
-
|
|
1452
|
-
|
|
1390
|
+
const handCls = () => {
|
|
1391
|
+
let str = 'table-radio table-body-btn';
|
|
1453
1392
|
if (fixedColumn) {
|
|
1454
1393
|
str += ' table-fixed-dom-left';
|
|
1455
1394
|
// 左边没有定位,没有嵌套表格
|
|
@@ -1466,7 +1405,7 @@ var TableBody = function TableBody(props) {
|
|
|
1466
1405
|
children: showRadio && jsx(Radio, {
|
|
1467
1406
|
disabled: disabledHand,
|
|
1468
1407
|
checked: checkHand,
|
|
1469
|
-
onChange:
|
|
1408
|
+
onChange: event => {
|
|
1470
1409
|
event.stopPropagation();
|
|
1471
1410
|
selectRadio && selectRadio(event, row[rowKey]);
|
|
1472
1411
|
}
|
|
@@ -1475,13 +1414,13 @@ var TableBody = function TableBody(props) {
|
|
|
1475
1414
|
}
|
|
1476
1415
|
}, [radio, disabledJson, radioValue, rowKey, selectRadio, disabledArrStatus, expandable, posFixed, fixedColumn]);
|
|
1477
1416
|
// 嵌套加减useCallback
|
|
1478
|
-
|
|
1417
|
+
const TableExpandableMemo = useCallback(row => {
|
|
1479
1418
|
if (!expandable) return null;
|
|
1480
|
-
|
|
1419
|
+
const expandableDemo = expandable(row);
|
|
1481
1420
|
// 禁用一行表格展开 或者 展开表格返回值为false,返回空列
|
|
1482
1421
|
if (disabledExpandJson[row[rowKey]] || expandableDemo === false) return jsx(TdElement, {});
|
|
1483
|
-
|
|
1484
|
-
|
|
1422
|
+
const handCls = () => {
|
|
1423
|
+
let str = 'table-expandable table-body-btn';
|
|
1485
1424
|
if (fixedColumn) {
|
|
1486
1425
|
str += ' table-fixed-dom-left';
|
|
1487
1426
|
// 左边没有定位,没有嵌套表格
|
|
@@ -1502,17 +1441,17 @@ var TableBody = function TableBody(props) {
|
|
|
1502
1441
|
}));
|
|
1503
1442
|
}, [expandable, expandableRow, rowKey, disabledExpandJson, onExpand, fixedColumn]);
|
|
1504
1443
|
// 表格一行内容useCallback
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
orderFieldArr
|
|
1508
|
-
orderTypeArr
|
|
1444
|
+
const TableContentUseCallback = useCallback((row, rowIndex) => {
|
|
1445
|
+
const params = {
|
|
1446
|
+
orderFieldArr,
|
|
1447
|
+
orderTypeArr
|
|
1509
1448
|
};
|
|
1510
|
-
|
|
1511
|
-
|
|
1449
|
+
const handContentClass = item => {
|
|
1450
|
+
let str = 'table-content-columms';
|
|
1512
1451
|
if (item.className) str += " ".concat(item.className);
|
|
1513
1452
|
// 排序
|
|
1514
1453
|
if (sortTable && item.name && item.sort !== false) {
|
|
1515
|
-
|
|
1454
|
+
const index = orderFieldArr.indexOf(item.name);
|
|
1516
1455
|
if (index !== -1) {
|
|
1517
1456
|
// 升序
|
|
1518
1457
|
if (orderTypeArr[index] === 'asc') {
|
|
@@ -1537,8 +1476,8 @@ var TableBody = function TableBody(props) {
|
|
|
1537
1476
|
}
|
|
1538
1477
|
return str;
|
|
1539
1478
|
};
|
|
1540
|
-
|
|
1541
|
-
|
|
1479
|
+
const handStyle = item => {
|
|
1480
|
+
const json = {};
|
|
1542
1481
|
if (fixedColumn && item.fixed && item.width) {
|
|
1543
1482
|
if (item.fixed === 'left') {
|
|
1544
1483
|
json.left = "".concat(item.paraui_left_width, "px");
|
|
@@ -1549,12 +1488,12 @@ var TableBody = function TableBody(props) {
|
|
|
1549
1488
|
}
|
|
1550
1489
|
return json;
|
|
1551
1490
|
};
|
|
1552
|
-
return tableCell ? tableCell(row, params) : headData.map(
|
|
1553
|
-
|
|
1554
|
-
|
|
1491
|
+
return tableCell ? tableCell(row, params) : headData.map((item, index) => {
|
|
1492
|
+
let text = row[item.name];
|
|
1493
|
+
let colSpan = 1;
|
|
1555
1494
|
if (item.render) text = item.render(row, item, row[item.name], index, rowIndex);
|
|
1556
1495
|
if (formatter) text = formatter(row, item, row[item.name], index, rowIndex);
|
|
1557
|
-
|
|
1496
|
+
const itemStyle = handStyle(item);
|
|
1558
1497
|
// 存在显示列,最后一列占两格
|
|
1559
1498
|
if (showColumns === 'inside' && !operate && index === headData.length - 1 && !dragRow) {
|
|
1560
1499
|
colSpan = 2;
|
|
@@ -1578,25 +1517,25 @@ var TableBody = function TableBody(props) {
|
|
|
1578
1517
|
});
|
|
1579
1518
|
}, [tableCell, headData, align, formatter, orderFieldArr, orderTypeArr, sortTable, showColumns, operate, beyondText, fixedColumn, tipMaxWidth, dragRow]);
|
|
1580
1519
|
// 操作栏useCallback
|
|
1581
|
-
|
|
1520
|
+
const TableOperateUseCallback = useCallback((row, rowIndex) => {
|
|
1582
1521
|
if (operate || dragRow) {
|
|
1583
|
-
|
|
1522
|
+
let colSpan = 1;
|
|
1584
1523
|
if (showColumns === 'inside' && operate) colSpan = 2;
|
|
1585
|
-
|
|
1524
|
+
const handOperate = () => {
|
|
1586
1525
|
if (operate === null || operate === void 0 ? void 0 : operate.render) return operate.render(row);
|
|
1587
1526
|
if (operate === null || operate === void 0 ? void 0 : operate.operateBtnRender) {
|
|
1588
|
-
|
|
1527
|
+
const operateConfig = operate.operateBtnRender(row, rowIndex);
|
|
1589
1528
|
return jsx(OperateBtn, Object.assign({}, operateConfig));
|
|
1590
1529
|
}
|
|
1591
1530
|
};
|
|
1592
|
-
|
|
1593
|
-
|
|
1531
|
+
const handStyle = () => {
|
|
1532
|
+
const json = {
|
|
1594
1533
|
right: '0'
|
|
1595
1534
|
};
|
|
1596
1535
|
return json;
|
|
1597
1536
|
};
|
|
1598
|
-
|
|
1599
|
-
|
|
1537
|
+
const handCls = () => {
|
|
1538
|
+
let str = 'table-operate';
|
|
1600
1539
|
if (!operate) str += ' table-operate-center';
|
|
1601
1540
|
if (fixedColumn) {
|
|
1602
1541
|
str += ' table-fixed-dom-right';
|
|
@@ -1637,11 +1576,11 @@ var TableBody = function TableBody(props) {
|
|
|
1637
1576
|
}
|
|
1638
1577
|
}, [operate, align, showColumns, posFixed, fixedColumn, dragRow, onDragRow, dragBol]);
|
|
1639
1578
|
// 嵌套表格useCallback
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1579
|
+
const TableExpandableContentUseCallback = useCallback(row => {
|
|
1580
|
+
const id = row[rowKey];
|
|
1581
|
+
const expandItem = expandableRow[id] || {};
|
|
1643
1582
|
if (expandable && expandItem.status === 'develop') {
|
|
1644
|
-
|
|
1583
|
+
const expandableDemo = expandable(row);
|
|
1645
1584
|
if (expandableDemo === false) return null; // 展开表格返回值为false,不展示这一行
|
|
1646
1585
|
return jsx(TrElement, Object.assign({
|
|
1647
1586
|
className: "table-body-expand-row"
|
|
@@ -1656,7 +1595,7 @@ var TableBody = function TableBody(props) {
|
|
|
1656
1595
|
}
|
|
1657
1596
|
}, [expandable, expandableRow, expandableColSpan, rowKey]);
|
|
1658
1597
|
// 加载更多
|
|
1659
|
-
|
|
1598
|
+
const MoreMemo = useMemo(() => {
|
|
1660
1599
|
if (!loadMore || !showMoreBtn) return null;
|
|
1661
1600
|
return jsx(TrElement, Object.assign({
|
|
1662
1601
|
className: "more-table-row",
|
|
@@ -1679,25 +1618,25 @@ var TableBody = function TableBody(props) {
|
|
|
1679
1618
|
}))
|
|
1680
1619
|
}));
|
|
1681
1620
|
}, [expandableColSpan, loadMore, loadMoreRender, onClickMore, showMoreBtn, changePage, loadMoreUrl, lineHeight]);
|
|
1682
|
-
|
|
1683
|
-
|
|
1621
|
+
const TableBodySubjectContentMemo = useMemo(() => {
|
|
1622
|
+
let rowDataCom = rowData;
|
|
1684
1623
|
if (virtual) {
|
|
1685
1624
|
rowDataCom = rowDataCom.slice(virtualIndex[0], virtualIndex[1]);
|
|
1686
1625
|
}
|
|
1687
1626
|
return jsx(Fragment, {
|
|
1688
|
-
children: rowDataCom.map(
|
|
1689
|
-
|
|
1627
|
+
children: rowDataCom.map((row, idx) => {
|
|
1628
|
+
let str = 'table-body-row';
|
|
1690
1629
|
if (rowClassMapping && rowClassMapping[row[rowKey]]) {
|
|
1691
1630
|
str += " ".concat(rowClassMapping[row[rowKey]]);
|
|
1692
1631
|
}
|
|
1693
|
-
|
|
1632
|
+
const index = idx + virtualIndex[0];
|
|
1694
1633
|
return jsxs(Fragment$1, {
|
|
1695
1634
|
children: [jsxs(TrElement, Object.assign({
|
|
1696
1635
|
className: str,
|
|
1697
1636
|
style: {
|
|
1698
1637
|
height: "".concat(lineHeight, "px")
|
|
1699
1638
|
},
|
|
1700
|
-
onClick:
|
|
1639
|
+
onClick: e => {
|
|
1701
1640
|
onClickRow && onClickRow(row, e);
|
|
1702
1641
|
}
|
|
1703
1642
|
}, {
|
|
@@ -1708,7 +1647,7 @@ var TableBody = function TableBody(props) {
|
|
|
1708
1647
|
});
|
|
1709
1648
|
}, [rowData, rowKey, disabledJson, checkJson, radio, radioValue, expandable, expandableRow, tableCell, headData, align, operate, expandableColSpan, selectCheck, selectRadio, disabledExpandJson, onExpand, disabledArrStatus, showColumns, onClickRow, rowClassMapping, tipMaxWidth, lineHeight, dragRow, onDragRow, dragBol, virtualIndex, virtual]);
|
|
1710
1649
|
// 内容memo
|
|
1711
|
-
|
|
1650
|
+
const TableBodyContentMemo = useMemo(() => {
|
|
1712
1651
|
return jsxs(Fragment$1, {
|
|
1713
1652
|
children: [TableBodySubjectContentMemo, MoreMemo, virtual && jsx(TrElement, {
|
|
1714
1653
|
className: 'virtual-scroll-height'
|
|
@@ -1716,31 +1655,31 @@ var TableBody = function TableBody(props) {
|
|
|
1716
1655
|
});
|
|
1717
1656
|
}, [rowData, rowKey, disabledJson, checkJson, radio, radioValue, expandable, expandableRow, tableCell, headData, align, operate, expandableColSpan, selectCheck, selectRadio, loadMore, loadMoreRender, onClickMore, changePage, loadMoreUrl, disabledExpandJson, onExpand, showMoreBtn, disabledArrStatus, showColumns, onClickRow, rowClassMapping, tipMaxWidth, lineHeight, dragRow, onDragRow, dragBol, virtualIndex, virtual]);
|
|
1718
1657
|
// 处理内容
|
|
1719
|
-
|
|
1658
|
+
const handContent = () => {
|
|
1720
1659
|
// 无数据,且不再请求,显示暂无数据
|
|
1721
1660
|
if (rowData.length === 0 && !loadState) return NodataMemo;
|
|
1722
1661
|
return TableBodyContentMemo;
|
|
1723
1662
|
};
|
|
1724
|
-
|
|
1725
|
-
|
|
1663
|
+
const handleRowData = () => {
|
|
1664
|
+
const arr = [];
|
|
1726
1665
|
if (dragRow) {
|
|
1727
|
-
rowData.forEach(
|
|
1728
|
-
|
|
1666
|
+
rowData.forEach(item => {
|
|
1667
|
+
const obj = {};
|
|
1729
1668
|
obj[rowKey] = item[rowKey];
|
|
1730
1669
|
arr.push(obj);
|
|
1731
1670
|
});
|
|
1732
1671
|
}
|
|
1733
1672
|
return arr;
|
|
1734
1673
|
};
|
|
1735
|
-
|
|
1674
|
+
const onChoose = () => {
|
|
1736
1675
|
setDragBol(true);
|
|
1737
1676
|
};
|
|
1738
|
-
|
|
1677
|
+
const onDragRowCom = evt => {
|
|
1739
1678
|
setDragBol(false);
|
|
1740
1679
|
onDragRow && onDragRow(evt);
|
|
1741
1680
|
};
|
|
1742
|
-
|
|
1743
|
-
|
|
1681
|
+
const handleStyle = () => {
|
|
1682
|
+
const obj = {};
|
|
1744
1683
|
if (virtual) {
|
|
1745
1684
|
obj.height = rowData.length * lineHeight + 'px';
|
|
1746
1685
|
obj.position = 'relative';
|
|
@@ -1761,36 +1700,30 @@ var TableBody = function TableBody(props) {
|
|
|
1761
1700
|
}));
|
|
1762
1701
|
};
|
|
1763
1702
|
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
|
|
1773
|
-
|
|
1774
|
-
|
|
1775
|
-
|
|
1776
|
-
|
|
1777
|
-
|
|
1778
|
-
|
|
1779
|
-
|
|
1780
|
-
checkNumber =
|
|
1781
|
-
|
|
1782
|
-
|
|
1783
|
-
|
|
1784
|
-
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
setIndeterminate = _useState2[1]; // 半选中
|
|
1789
|
-
var _useState3 = useState(false),
|
|
1790
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
1791
|
-
checked = _useState4[0],
|
|
1792
|
-
setChecked = _useState4[1]; // 选中
|
|
1793
|
-
useEffect(function () {
|
|
1703
|
+
const TableHead = props => {
|
|
1704
|
+
const {
|
|
1705
|
+
paginationType,
|
|
1706
|
+
flippingArrow,
|
|
1707
|
+
autoPagination,
|
|
1708
|
+
total,
|
|
1709
|
+
page,
|
|
1710
|
+
rowsPerPage,
|
|
1711
|
+
currentRowsPerPage,
|
|
1712
|
+
changePage,
|
|
1713
|
+
changeRowsPerPage,
|
|
1714
|
+
refreshInside,
|
|
1715
|
+
checkCount,
|
|
1716
|
+
onRefresh,
|
|
1717
|
+
selectAll,
|
|
1718
|
+
selectStatus,
|
|
1719
|
+
checkNumber = 0,
|
|
1720
|
+
currentPageTotal = 0,
|
|
1721
|
+
resizePaginationLine
|
|
1722
|
+
} = props;
|
|
1723
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
1724
|
+
const [indeterminate, setIndeterminate] = useState(false); // 半选中
|
|
1725
|
+
const [checked, setChecked] = useState(false); // 选中
|
|
1726
|
+
useEffect(() => {
|
|
1794
1727
|
// 全选
|
|
1795
1728
|
if (selectStatus === 'all') {
|
|
1796
1729
|
setChecked(true);
|
|
@@ -1812,23 +1745,23 @@ var TableHead = function TableHead(props) {
|
|
|
1812
1745
|
* @param event 操作元素
|
|
1813
1746
|
* @param bol 选中 / 不选中
|
|
1814
1747
|
*/
|
|
1815
|
-
|
|
1748
|
+
const onSelectAll = (event, bol) => {
|
|
1816
1749
|
if (selectAll) selectAll(event, bol);
|
|
1817
1750
|
};
|
|
1818
1751
|
// 改变页面
|
|
1819
|
-
|
|
1752
|
+
const changePageCom = num => {
|
|
1820
1753
|
changePage && changePage(num);
|
|
1821
1754
|
};
|
|
1822
1755
|
// 改变每页显示条数
|
|
1823
|
-
|
|
1756
|
+
const changeRowsPerPageCom = num => {
|
|
1824
1757
|
changeRowsPerPage && changeRowsPerPage(num);
|
|
1825
1758
|
};
|
|
1826
1759
|
// 刷新
|
|
1827
|
-
|
|
1760
|
+
const clickRefresh = () => {
|
|
1828
1761
|
onRefresh && onRefresh();
|
|
1829
1762
|
};
|
|
1830
1763
|
// 处理分页右侧
|
|
1831
|
-
|
|
1764
|
+
const handlePaginationRight = () => {
|
|
1832
1765
|
if (!checkCount) return null;
|
|
1833
1766
|
return jsxs("div", Object.assign({
|
|
1834
1767
|
className: 'table-pagination-right'
|
|
@@ -1851,8 +1784,8 @@ var TableHead = function TableHead(props) {
|
|
|
1851
1784
|
}));
|
|
1852
1785
|
};
|
|
1853
1786
|
// 处理样式
|
|
1854
|
-
|
|
1855
|
-
|
|
1787
|
+
const handleClass = () => {
|
|
1788
|
+
const str = 'table-pagination';
|
|
1856
1789
|
return str;
|
|
1857
1790
|
};
|
|
1858
1791
|
return jsxs("div", Object.assign({
|
|
@@ -1870,9 +1803,7 @@ var TableHead = function TableHead(props) {
|
|
|
1870
1803
|
currentRowsPerPage: currentRowsPerPage,
|
|
1871
1804
|
changePage: changePageCom,
|
|
1872
1805
|
changeRowsPerPage: changeRowsPerPageCom,
|
|
1873
|
-
getPopupContainer:
|
|
1874
|
-
return document.body;
|
|
1875
|
-
},
|
|
1806
|
+
getPopupContainer: () => document.body,
|
|
1876
1807
|
resizeLine: resizePaginationLine
|
|
1877
1808
|
}), refreshInside && jsx(Button.IconButton, Object.assign({
|
|
1878
1809
|
className: 'refresh-btn',
|
|
@@ -1887,14 +1818,16 @@ var TableHead = function TableHead(props) {
|
|
|
1887
1818
|
var css_248z$2 = ".table-container {\n overflow-x: auto;\n}";
|
|
1888
1819
|
styleInject(css_248z$2);
|
|
1889
1820
|
|
|
1890
|
-
|
|
1891
|
-
|
|
1892
|
-
|
|
1893
|
-
|
|
1894
|
-
|
|
1821
|
+
const TableContainer = props => {
|
|
1822
|
+
const {
|
|
1823
|
+
cRef,
|
|
1824
|
+
className,
|
|
1825
|
+
style,
|
|
1826
|
+
children
|
|
1827
|
+
} = props,
|
|
1895
1828
|
otherProps = __rest(props, ["cRef", "className", "style", "children"]);
|
|
1896
|
-
|
|
1897
|
-
|
|
1829
|
+
const handClass = () => {
|
|
1830
|
+
let str = 'table-container';
|
|
1898
1831
|
if (className) str += " ".concat(className);
|
|
1899
1832
|
return str;
|
|
1900
1833
|
};
|
|
@@ -1910,15 +1843,17 @@ var TableContainer = function TableContainer(props) {
|
|
|
1910
1843
|
var css_248z$1 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2023/4/11 14:16\n* @description 最新色卡\n*/\n.table-element {\n width: 100%;\n display: table;\n border-collapse: separate;\n border-spacing: 0;\n}\n.table-element.table-element-fixed-column > .table-body-element > .tr-element > .td-element {\n position: sticky;\n}\n.table-element > .table-head-element > .tr-element > .th-element {\n position: sticky;\n top: 0;\n z-index: 10;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n height: 100%;\n width: 30px;\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(100%);\n content: \"\";\n transition: box-shadow 0.3s;\n pointer-events: none;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n height: 100%;\n width: 30px;\n position: absolute;\n top: 0;\n left: 0;\n transform: translate(-100%);\n content: \"\";\n transition: box-shadow 0.3s;\n pointer-events: none;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left {\n z-index: 11;\n}\n.table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right {\n z-index: 11;\n}\n.table-element > .table-body-element > .tr-element > .td-element {\n z-index: 1;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n height: 100%;\n width: 30px;\n position: absolute;\n top: 0;\n right: 0;\n transform: translate(100%);\n content: \"\";\n transition: box-shadow 0.3s;\n pointer-events: none;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n height: 100%;\n width: 30px;\n position: absolute;\n top: 0;\n left: 0;\n transform: translate(-100%);\n content: \"\";\n transition: box-shadow 0.3s;\n pointer-events: none;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left {\n z-index: 2;\n}\n.table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right {\n z-index: 2;\n}\n\n.table-scroll-left .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-left .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}\n\n.table-scroll-right .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-right .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n\n.table-scroll-middle .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-middle .table-element > .table-head-element > .tr-element > .th-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-middle .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-left.table-fixed-dom-left-last::after {\n box-shadow: inset 10px 0 10px -8px rgb(234, 236, 241);\n}\n.table-scroll-middle .table-element > .table-body-element > .tr-element > .td-element.table-fixed-dom-right.table-fixed-dom-right-first::after {\n box-shadow: inset -10px 0 10px -8px rgb(234, 236, 241);\n}";
|
|
1911
1844
|
styleInject(css_248z$1);
|
|
1912
1845
|
|
|
1913
|
-
|
|
1914
|
-
|
|
1915
|
-
|
|
1916
|
-
|
|
1917
|
-
|
|
1918
|
-
|
|
1846
|
+
const TableElement = props => {
|
|
1847
|
+
const {
|
|
1848
|
+
className,
|
|
1849
|
+
style,
|
|
1850
|
+
fixedColumn,
|
|
1851
|
+
children,
|
|
1852
|
+
cRef
|
|
1853
|
+
} = props,
|
|
1919
1854
|
otherProps = __rest(props, ["className", "style", "fixedColumn", "children", "cRef"]);
|
|
1920
|
-
|
|
1921
|
-
|
|
1855
|
+
const handClass = () => {
|
|
1856
|
+
let str = 'table-element';
|
|
1922
1857
|
if (fixedColumn) str += ' table-element-fixed-column';
|
|
1923
1858
|
if (className) str += " ".concat(className);
|
|
1924
1859
|
return str;
|