@para-ui/core 4.0.40 → 4.0.41
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 +4 -4
- package/ComboSelect/index.js +7 -7
- package/DynamicMultiBox/index.js +7 -7
- package/Form/index.js +7 -7
- package/FormItem/index.js +7 -7
- package/FunctionModal/index.js +2 -2
- package/Image/index.js +1 -1
- package/Modal/index.js +28 -5
- package/MultiBox/index.js +2 -2
- package/Querying/index.js +4 -4
- package/QuickReply/index.js +1 -1
- package/README.md +5 -0
- package/Selector/index.js +223 -281
- package/SelectorPicker/index.js +4 -4
- package/SingleBox/index.js +2 -2
- package/SortBox/index.js +1 -1
- package/Stepper/index.js +1 -1
- package/Switch/index.js +2 -2
- package/Table/index.js +423 -488
- package/Tabs/index.js +2 -2
- package/TextEditor/index.js +3 -3
- package/Timeline/index.js +20 -14
- package/Tree/index.js +4 -4
- package/Upload/index.js +3 -3
- package/_verture/{index-77fff5bd.js → index-5b4ff3b2.js} +1 -1
- package/_verture/{index-2824e7a7.js → index-6016a7ed.js} +2 -2
- package/_verture/{index-94e24006.js → index-8ac46bd9.js} +1 -1
- package/index.js +8 -8
- package/package.json +3 -2
- package/umd/Argv.js +2 -2
- package/umd/FunctionModal.js +6 -6
- package/umd/Modal.js +2 -2
- package/umd/Upload.js +2 -2
- /package/_verture/{Portal-edd94cac.js → Portal-f9bedb3a.js} +0 -0
- /package/_verture/{index-c8cb6751.js → index-0f5ee6f7.js} +0 -0
- /package/_verture/{index-b040e10a.js → index-8a431cd6.js} +0 -0
- /package/_verture/{modalContext-205db1f4.js → modalContext-efa83b5c.js} +0 -0
- /package/_verture/{typeof-4646b22c.js → typeof-6ec38efd.js} +0 -0
package/Table/index.js
CHANGED
|
@@ -2,8 +2,6 @@ import { a as __rest, _ as __awaiter } from '../_verture/tslib.es6-f43aa41d.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 } from '@paraview/lib';
|
|
5
|
-
import { _ as _typeof } from '../_verture/typeof-adeedc13.js';
|
|
6
|
-
import { _ as _slicedToArray } from '../_verture/slicedToArray-75fa4188.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,8 +14,7 @@ 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 {
|
|
20
|
-
import { d as dist } from '../_verture/index-c8cb6751.js';
|
|
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';
|
|
23
20
|
import Down from '@para-ui/icons/Down';
|
|
@@ -65,23 +62,25 @@ import '@para-ui/icons/DoubleRight';
|
|
|
65
62
|
* 发送请求
|
|
66
63
|
* @param obj {ReqProps} 请求信息
|
|
67
64
|
*/
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
65
|
+
const requestFunc = obj => {
|
|
66
|
+
const {
|
|
67
|
+
method,
|
|
68
|
+
url,
|
|
69
|
+
ctx,
|
|
70
|
+
data
|
|
71
|
+
} = obj,
|
|
73
72
|
otherProps = __rest(obj, ["method", "url", "ctx", "data"]);
|
|
74
73
|
if (method === 'Get') {
|
|
75
74
|
return Get(Object.assign({
|
|
76
75
|
url: url,
|
|
77
|
-
ctx
|
|
76
|
+
ctx
|
|
78
77
|
}, otherProps));
|
|
79
78
|
}
|
|
80
79
|
if (method === 'Post') {
|
|
81
80
|
return Post(Object.assign({
|
|
82
81
|
url: url,
|
|
83
|
-
ctx
|
|
84
|
-
data
|
|
82
|
+
ctx,
|
|
83
|
+
data
|
|
85
84
|
}, otherProps));
|
|
86
85
|
}
|
|
87
86
|
};
|
|
@@ -90,23 +89,23 @@ var requestFunc = function requestFunc(obj) {
|
|
|
90
89
|
* @param obj {ReqProps} 请求信息
|
|
91
90
|
* @return string get请求地址参数
|
|
92
91
|
*/
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
for (
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
if (
|
|
92
|
+
const handGetReqParams = obj => {
|
|
93
|
+
let str = obj.url;
|
|
94
|
+
const params = obj.data || {};
|
|
95
|
+
const arrKey = Object.keys(params);
|
|
96
|
+
const paramsArr = [];
|
|
97
|
+
for (let i = 0, l = arrKey.length; i < l; i++) {
|
|
98
|
+
const key = arrKey[i];
|
|
99
|
+
let val = params[key];
|
|
100
|
+
if (typeof val === 'object') {
|
|
102
101
|
val = encodeURIComponent(JSON.stringify(val));
|
|
103
102
|
} else {
|
|
104
103
|
val = encodeURIComponent(val);
|
|
105
104
|
}
|
|
106
105
|
paramsArr.push("".concat(key, "=").concat(val));
|
|
107
106
|
}
|
|
108
|
-
|
|
109
|
-
|
|
107
|
+
const paramsStr = paramsArr.join('&');
|
|
108
|
+
const pos = str.indexOf('?');
|
|
110
109
|
if (pos !== -1) {
|
|
111
110
|
str += (pos === str.length - 1 ? '' : '&') + paramsStr;
|
|
112
111
|
} else {
|
|
@@ -117,9 +116,9 @@ var handGetReqParams = function handGetReqParams(obj) {
|
|
|
117
116
|
/**
|
|
118
117
|
* 提取字符串里面的数字
|
|
119
118
|
* */
|
|
120
|
-
|
|
119
|
+
const getStringInNumber = str => {
|
|
121
120
|
if (typeof str === 'number') return str;
|
|
122
|
-
|
|
121
|
+
const strHand = str.replace(/[^0-9$]/gi, '');
|
|
123
122
|
return Number(strHand);
|
|
124
123
|
};
|
|
125
124
|
/**
|
|
@@ -127,23 +126,23 @@ var getStringInNumber = function getStringInNumber(str) {
|
|
|
127
126
|
* @param key {string} 键值
|
|
128
127
|
* @param num {number} 过期天数
|
|
129
128
|
* */
|
|
130
|
-
|
|
129
|
+
const getLocalStorageSelectHead = (key, num) => {
|
|
131
130
|
//debugger
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
for (
|
|
136
|
-
|
|
137
|
-
|
|
131
|
+
const headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
|
|
132
|
+
const headJson = JSON.parse(headJsonStr);
|
|
133
|
+
const headJsonArr = Object.keys(headJson);
|
|
134
|
+
for (let i = 0, l = headJsonArr.length; i < l; i++) {
|
|
135
|
+
const keyStr = headJsonArr[i];
|
|
136
|
+
const item = headJson[i];
|
|
138
137
|
if (!item) continue;
|
|
139
|
-
|
|
140
|
-
|
|
138
|
+
const newDate = new Date().getTime(); // 当前时间
|
|
139
|
+
const endTime = item.storageTime + item.validity; // 过期时间
|
|
141
140
|
// 过期时间 小于 当前时间, 说明已经过期了, 删除当前表格列数据
|
|
142
141
|
if (endTime < newDate) {
|
|
143
142
|
delete headJson[keyStr];
|
|
144
143
|
}
|
|
145
144
|
}
|
|
146
|
-
|
|
145
|
+
const headJsonItem = headJson[key];
|
|
147
146
|
// 重置过期时间
|
|
148
147
|
if (headJsonItem) {
|
|
149
148
|
headJsonItem.storageTime = new Date().getTime();
|
|
@@ -156,9 +155,9 @@ var getLocalStorageSelectHead = function getLocalStorageSelectHead(key, num) {
|
|
|
156
155
|
* @param key {string} 键值
|
|
157
156
|
* @param val {HeadLocalStorageItem} 保存值
|
|
158
157
|
* */
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
158
|
+
const setLocalStorageSelectHead = (key, val) => {
|
|
159
|
+
const headJsonStr = window.localStorage.getItem('_paraui_table_head') || '{}';
|
|
160
|
+
const headJson = JSON.parse(headJsonStr);
|
|
162
161
|
headJson[key] = val;
|
|
163
162
|
window.localStorage.setItem('_paraui_table_head', JSON.stringify(headJson));
|
|
164
163
|
};
|
|
@@ -167,8 +166,8 @@ var setLocalStorageSelectHead = function setLocalStorageSelectHead(key, val) {
|
|
|
167
166
|
* @param el 当前元素
|
|
168
167
|
* @param selector 查找元素class
|
|
169
168
|
*/
|
|
170
|
-
|
|
171
|
-
|
|
169
|
+
const closest = (el, selector) => {
|
|
170
|
+
const matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
|
|
172
171
|
while (el) {
|
|
173
172
|
if (matchesSelector.call(el, selector)) {
|
|
174
173
|
break;
|
|
@@ -360,70 +359,50 @@ var zh = {
|
|
|
360
359
|
};
|
|
361
360
|
|
|
362
361
|
var localeJson = {
|
|
363
|
-
zh
|
|
364
|
-
en
|
|
362
|
+
zh,
|
|
363
|
+
en
|
|
365
364
|
};
|
|
366
365
|
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
headData =
|
|
370
|
-
sortTable
|
|
371
|
-
filter
|
|
372
|
-
expandable
|
|
373
|
-
check
|
|
374
|
-
radio
|
|
375
|
-
onRequestSort
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
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
|
-
checked = _useState4[0],
|
|
408
|
-
setChecked = _useState4[1]; // 选中
|
|
409
|
-
var _useState5 = useState(null),
|
|
410
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
411
|
-
anchorElColums = _useState6[0],
|
|
412
|
-
setAnchorElColums = _useState6[1]; // 显示列定位元素
|
|
413
|
-
var _useState7 = useState({}),
|
|
414
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
415
|
-
headDataJson = _useState8[0],
|
|
416
|
-
setHeadDataJson = _useState8[1]; // 显示列json
|
|
417
|
-
var _useState9 = useState({}),
|
|
418
|
-
_useState10 = _slicedToArray(_useState9, 2),
|
|
419
|
-
filterHead = _useState10[0],
|
|
420
|
-
setFilterHead = _useState10[1]; // 过滤项当前表头数据
|
|
421
|
-
var _useState11 = useState({}),
|
|
422
|
-
_useState12 = _slicedToArray(_useState11, 2),
|
|
423
|
-
selectFilterCom = _useState12[0],
|
|
424
|
-
setSelectFilterCom = _useState12[1]; // 过滤项当前选中值
|
|
425
|
-
var intl = useFormatMessage('Table', localeJson);
|
|
426
|
-
useEffect(function () {
|
|
366
|
+
const TableHead$1 = props => {
|
|
367
|
+
const {
|
|
368
|
+
headData = [],
|
|
369
|
+
sortTable,
|
|
370
|
+
filter,
|
|
371
|
+
expandable,
|
|
372
|
+
check,
|
|
373
|
+
radio,
|
|
374
|
+
onRequestSort,
|
|
375
|
+
orderFieldArr = [],
|
|
376
|
+
orderTypeArr = [],
|
|
377
|
+
selectAll,
|
|
378
|
+
selectStatus,
|
|
379
|
+
align,
|
|
380
|
+
showList = [],
|
|
381
|
+
changeShowList,
|
|
382
|
+
selectFilter,
|
|
383
|
+
changeFilter,
|
|
384
|
+
operate,
|
|
385
|
+
showColumns,
|
|
386
|
+
fixedTable,
|
|
387
|
+
fixedColumn,
|
|
388
|
+
posFixed,
|
|
389
|
+
beyondText,
|
|
390
|
+
lineWidth,
|
|
391
|
+
dragColumn,
|
|
392
|
+
dragRow,
|
|
393
|
+
changeColumnWidth,
|
|
394
|
+
headDataConfig,
|
|
395
|
+
getPopupContainer,
|
|
396
|
+
tipMaxWidth
|
|
397
|
+
} = props;
|
|
398
|
+
const [indeterminate, setIndeterminate] = useState(false); // 半选中
|
|
399
|
+
const [checked, setChecked] = useState(false); // 选中
|
|
400
|
+
const [anchorElColums, setAnchorElColums] = useState(null); // 显示列定位元素
|
|
401
|
+
const [headDataJson, setHeadDataJson] = useState({}); // 显示列json
|
|
402
|
+
const [filterHead, setFilterHead] = useState({}); // 过滤项当前表头数据
|
|
403
|
+
const [selectFilterCom, setSelectFilterCom] = useState({}); // 过滤项当前选中值
|
|
404
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
405
|
+
useEffect(() => {
|
|
427
406
|
// 全选
|
|
428
407
|
if (selectStatus === 'all') {
|
|
429
408
|
setChecked(true);
|
|
@@ -440,17 +419,17 @@ var TableHead$1 = function TableHead(props) {
|
|
|
440
419
|
setIndeterminate(false);
|
|
441
420
|
}
|
|
442
421
|
}, [selectStatus]);
|
|
443
|
-
useEffect(
|
|
422
|
+
useEffect(() => {
|
|
444
423
|
if (headData) {
|
|
445
|
-
|
|
446
|
-
for (
|
|
447
|
-
|
|
424
|
+
const json = [];
|
|
425
|
+
for (let i = 0, l = headData.length; i < l; i++) {
|
|
426
|
+
const item = headData[i];
|
|
448
427
|
json[item.name] = item;
|
|
449
428
|
}
|
|
450
429
|
setHeadDataJson(json);
|
|
451
430
|
}
|
|
452
431
|
}, [headData]);
|
|
453
|
-
useEffect(
|
|
432
|
+
useEffect(() => {
|
|
454
433
|
if (selectFilter) setSelectFilterCom(DeepClone(selectFilter));
|
|
455
434
|
}, [selectFilter]);
|
|
456
435
|
/**
|
|
@@ -458,30 +437,28 @@ var TableHead$1 = function TableHead(props) {
|
|
|
458
437
|
* @param name 排序列
|
|
459
438
|
* @param event 当前排序元素
|
|
460
439
|
*/
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
if (onRequestSort) onRequestSort(event, name);
|
|
466
|
-
};
|
|
440
|
+
const createSortHandler = (name, item) => event => {
|
|
441
|
+
// 不存在排序,不触发事件
|
|
442
|
+
if (!(sortTable && item.name && item.sort !== false)) return;
|
|
443
|
+
if (onRequestSort) onRequestSort(event, name);
|
|
467
444
|
};
|
|
468
445
|
/**
|
|
469
446
|
* 全选 / 全不选
|
|
470
447
|
* @param event 操作元素
|
|
471
448
|
* @param bol 选中 / 不选中
|
|
472
449
|
*/
|
|
473
|
-
|
|
450
|
+
const onSelectAll = (event, bol) => {
|
|
474
451
|
if (selectAll) selectAll(event, bol);
|
|
475
452
|
};
|
|
476
453
|
/**
|
|
477
454
|
* 点击显示选择列
|
|
478
455
|
* @param event 点击元素
|
|
479
456
|
*/
|
|
480
|
-
|
|
457
|
+
const clickShowColums = event => {
|
|
481
458
|
setAnchorElColums(event.currentTarget);
|
|
482
459
|
};
|
|
483
460
|
// 点击隐藏选择列
|
|
484
|
-
|
|
461
|
+
const clickHideColums = bol => {
|
|
485
462
|
if (bol) return;
|
|
486
463
|
setAnchorElColums(null);
|
|
487
464
|
};
|
|
@@ -489,29 +466,27 @@ var TableHead$1 = function TableHead(props) {
|
|
|
489
466
|
* 点击显示列 列表
|
|
490
467
|
* @param item 详细
|
|
491
468
|
*/
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
arr1.push(headDataJson[_name]);
|
|
505
|
-
}
|
|
506
|
-
changeShowList && changeShowList(arr1, false, item);
|
|
507
|
-
} else {
|
|
508
|
-
headData.push(item);
|
|
509
|
-
changeShowList && changeShowList(headData, false, item);
|
|
469
|
+
const clickColumsList = item => () => {
|
|
470
|
+
if (item.disabledSelection) return;
|
|
471
|
+
const name = item.name;
|
|
472
|
+
const itemHead = headDataJson[name];
|
|
473
|
+
if (itemHead) {
|
|
474
|
+
// 取消勾选
|
|
475
|
+
delete headDataJson[name];
|
|
476
|
+
const arr = Object.keys(headDataJson);
|
|
477
|
+
const arr1 = [];
|
|
478
|
+
for (let i = 0, l = arr.length; i < l; i++) {
|
|
479
|
+
const name = arr[i];
|
|
480
|
+
arr1.push(headDataJson[name]);
|
|
510
481
|
}
|
|
511
|
-
|
|
482
|
+
changeShowList && changeShowList(arr1, false, item);
|
|
483
|
+
} else {
|
|
484
|
+
headData.push(item);
|
|
485
|
+
changeShowList && changeShowList(headData, false, item);
|
|
486
|
+
}
|
|
512
487
|
};
|
|
513
488
|
// 重置显示列
|
|
514
|
-
|
|
489
|
+
const resetShowList = () => {
|
|
515
490
|
changeShowList && changeShowList(headData, true);
|
|
516
491
|
};
|
|
517
492
|
/**
|
|
@@ -519,69 +494,63 @@ var TableHead$1 = function TableHead(props) {
|
|
|
519
494
|
* @param headCell 当前列信息
|
|
520
495
|
* @param event 元素
|
|
521
496
|
*/
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
526
|
-
};
|
|
497
|
+
const clickShowFilter = headCell => event => {
|
|
498
|
+
setFilterHead(headCell);
|
|
499
|
+
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
527
500
|
};
|
|
528
501
|
// 点击隐藏过滤
|
|
529
|
-
|
|
502
|
+
const clickHideFilter = bol => {
|
|
530
503
|
if (bol) return;
|
|
531
504
|
setFilterHead({});
|
|
532
505
|
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
533
506
|
};
|
|
534
507
|
// 点击过滤
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
filterValue = [filterValue[num]];
|
|
553
|
-
}
|
|
508
|
+
const clickFilter = item => () => {
|
|
509
|
+
const name = filterHead.name;
|
|
510
|
+
let filterValue = DeepClone(selectFilterCom[name] || []);
|
|
511
|
+
const index = filterValue.indexOf(item.value);
|
|
512
|
+
if (index !== -1) {
|
|
513
|
+
// 勾选 -> 不勾选
|
|
514
|
+
filterValue.splice(index, 1);
|
|
515
|
+
} else {
|
|
516
|
+
// 不勾选 -> 勾选
|
|
517
|
+
filterValue.push(item.value);
|
|
518
|
+
}
|
|
519
|
+
const filterRadio = filterHead.filterRadio;
|
|
520
|
+
if (filterRadio) {
|
|
521
|
+
// 过滤单个
|
|
522
|
+
const num = filterValue.indexOf(item.value);
|
|
523
|
+
if (num !== -1) {
|
|
524
|
+
filterValue = [filterValue[num]];
|
|
554
525
|
}
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
};
|
|
526
|
+
}
|
|
527
|
+
selectFilterCom[name] = filterValue;
|
|
528
|
+
setSelectFilterCom(Object.assign({}, selectFilterCom));
|
|
558
529
|
};
|
|
559
530
|
/**
|
|
560
531
|
* 重置 / 确定过滤
|
|
561
532
|
* @param type {'reset' | 'confirm'} 重置 / 确定过滤
|
|
562
533
|
*/
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
}
|
|
577
|
-
};
|
|
534
|
+
const filterFunc = type => () => {
|
|
535
|
+
if (type === 'confirm') {
|
|
536
|
+
// 确定
|
|
537
|
+
changeFilter && changeFilter(Object.assign({}, selectFilterCom));
|
|
538
|
+
setFilterHead({});
|
|
539
|
+
} else {
|
|
540
|
+
// 重置
|
|
541
|
+
const json = DeepClone(selectFilterCom);
|
|
542
|
+
delete json[filterHead.name];
|
|
543
|
+
setSelectFilterCom(json);
|
|
544
|
+
changeFilter && changeFilter(Object.assign({}, json));
|
|
545
|
+
setFilterHead({});
|
|
546
|
+
}
|
|
578
547
|
};
|
|
579
548
|
/**
|
|
580
549
|
* 自定义过滤确定
|
|
581
550
|
* @param val {[name: string]: any[]}
|
|
582
551
|
* */
|
|
583
|
-
|
|
584
|
-
|
|
552
|
+
const filterCustomConfirm = function () {
|
|
553
|
+
let val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
585
554
|
changeFilter && changeFilter(Object.assign({}, val));
|
|
586
555
|
setFilterHead({});
|
|
587
556
|
};
|
|
@@ -589,12 +558,12 @@ var TableHead$1 = function TableHead(props) {
|
|
|
589
558
|
* 处理TableCell
|
|
590
559
|
* @param item 当前列信息
|
|
591
560
|
*/
|
|
592
|
-
|
|
593
|
-
|
|
561
|
+
const handCellClass = item => {
|
|
562
|
+
let str = 'table-header-box';
|
|
594
563
|
// 排序
|
|
595
564
|
if (sortTable && item.name && item.sort !== false) {
|
|
596
565
|
str += ' table-header-box-sort';
|
|
597
|
-
|
|
566
|
+
const index = orderFieldArr.indexOf(item.name);
|
|
598
567
|
if (index !== -1) {
|
|
599
568
|
// 升序
|
|
600
569
|
if (orderTypeArr[index] === 'asc') {
|
|
@@ -613,10 +582,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
613
582
|
return str;
|
|
614
583
|
};
|
|
615
584
|
// 复选框memo
|
|
616
|
-
|
|
585
|
+
const TableCheckMemo = useMemo(() => {
|
|
617
586
|
if (check) {
|
|
618
|
-
|
|
619
|
-
|
|
587
|
+
const handCls = () => {
|
|
588
|
+
let str = 'table-checkbox table-head-btn';
|
|
620
589
|
if (fixedColumn) {
|
|
621
590
|
str += ' table-fixed-dom-left';
|
|
622
591
|
// 左边没有定位,且没有单选,没有嵌套表格
|
|
@@ -644,10 +613,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
644
613
|
}
|
|
645
614
|
}, [check, indeterminate, checked, selectAll, posFixed, radio, expandable, fixedColumn]);
|
|
646
615
|
// 单选框memo
|
|
647
|
-
|
|
616
|
+
const TableRadioMemo = useMemo(() => {
|
|
648
617
|
if (radio) {
|
|
649
|
-
|
|
650
|
-
|
|
618
|
+
const handCls = () => {
|
|
619
|
+
let str = 'table-radio table-head-btn';
|
|
651
620
|
if (fixedColumn) {
|
|
652
621
|
str += ' table-fixed-dom-left';
|
|
653
622
|
// 左边没有定位,没有嵌套表格
|
|
@@ -669,10 +638,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
669
638
|
}
|
|
670
639
|
}, [radio, posFixed, expandable, fixedColumn]);
|
|
671
640
|
// 嵌套表格memo
|
|
672
|
-
|
|
641
|
+
const TableExpandableMemo = useMemo(() => {
|
|
673
642
|
if (expandable) {
|
|
674
|
-
|
|
675
|
-
|
|
643
|
+
const handCls = () => {
|
|
644
|
+
let str = 'table-expandable table-head-btn';
|
|
676
645
|
if (fixedColumn) {
|
|
677
646
|
str += ' table-fixed-dom-left';
|
|
678
647
|
// 左边没有定位,没有嵌套表格
|
|
@@ -694,21 +663,21 @@ var TableHead$1 = function TableHead(props) {
|
|
|
694
663
|
}
|
|
695
664
|
}, [expandable, posFixed, fixedColumn]);
|
|
696
665
|
// 过滤弹窗内容
|
|
697
|
-
|
|
698
|
-
|
|
666
|
+
const filterPopoverContent = () => {
|
|
667
|
+
const name = filterHead.name;
|
|
699
668
|
if (!name) return;
|
|
700
|
-
|
|
669
|
+
const filterValue = selectFilterCom[name] || [];
|
|
701
670
|
if (filterHead.filterRender) {
|
|
702
671
|
// 自定义渲染过滤
|
|
703
672
|
return filterHead.filterRender({
|
|
704
|
-
filterValue
|
|
673
|
+
filterValue,
|
|
705
674
|
selectFilter: selectFilterCom,
|
|
706
|
-
filterHead
|
|
675
|
+
filterHead,
|
|
707
676
|
setFilter: filterCustomConfirm
|
|
708
677
|
});
|
|
709
678
|
}
|
|
710
|
-
|
|
711
|
-
|
|
679
|
+
const arr = filterHead.enums || [];
|
|
680
|
+
let str = 'filter-select';
|
|
712
681
|
if (arr.length === 0) str += ' filter-select-none';
|
|
713
682
|
return jsx("div", Object.assign({
|
|
714
683
|
className: str
|
|
@@ -723,8 +692,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
723
692
|
children: [jsx("div", Object.assign({
|
|
724
693
|
className: "filter-select-box"
|
|
725
694
|
}, {
|
|
726
|
-
children: arr.map(
|
|
727
|
-
|
|
695
|
+
children: arr.map((item, index) => {
|
|
696
|
+
const checked = filterValue.indexOf(item.value) !== -1;
|
|
728
697
|
return jsxs("div", Object.assign({
|
|
729
698
|
onClick: clickFilter(item),
|
|
730
699
|
className: checked ? 'filter-select-item filter-select-item-select' : 'filter-select-item'
|
|
@@ -763,30 +732,28 @@ var TableHead$1 = function TableHead(props) {
|
|
|
763
732
|
}));
|
|
764
733
|
};
|
|
765
734
|
// 表格列拖拽放下
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
changeColumnWidth && changeColumnWidth(headCell, result);
|
|
769
|
-
};
|
|
735
|
+
const onDragDown = headCell => result => {
|
|
736
|
+
changeColumnWidth && changeColumnWidth(headCell, result);
|
|
770
737
|
};
|
|
771
738
|
// 获取宽度
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
739
|
+
const getWidth = item => {
|
|
740
|
+
let w = item.width || '';
|
|
741
|
+
const name = item.name || '';
|
|
742
|
+
const wDrag = headDataConfig[name] && headDataConfig[name].width;
|
|
776
743
|
if (wDrag) w = "".concat(wDrag, "px");
|
|
777
744
|
return w;
|
|
778
745
|
};
|
|
779
746
|
// 内容列memo
|
|
780
|
-
|
|
747
|
+
const TableContentMemo = useMemo(() => {
|
|
781
748
|
// 处理过滤的class
|
|
782
|
-
|
|
783
|
-
|
|
749
|
+
const handFilterClass = item => {
|
|
750
|
+
let str = 'table-header-filter';
|
|
784
751
|
if (filterHead.name === item.name) str += ' table-header-filter-show';
|
|
785
752
|
if (item.name && selectFilterCom[item.name] && selectFilterCom[item.name].length > 0) str += ' table-header-filter-select';
|
|
786
753
|
return str;
|
|
787
754
|
};
|
|
788
|
-
|
|
789
|
-
|
|
755
|
+
const handCls = item => {
|
|
756
|
+
let str = '';
|
|
790
757
|
if (item.className) str += item.className;
|
|
791
758
|
if (fixedColumn && item.fixed) {
|
|
792
759
|
str += " table-fixed-dom-".concat(item.fixed);
|
|
@@ -801,8 +768,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
801
768
|
}
|
|
802
769
|
return str;
|
|
803
770
|
};
|
|
804
|
-
|
|
805
|
-
|
|
771
|
+
const handStyle = item => {
|
|
772
|
+
const json = {
|
|
806
773
|
width: getWidth(item)
|
|
807
774
|
};
|
|
808
775
|
if (fixedColumn && item.fixed && item.width) {
|
|
@@ -816,13 +783,13 @@ var TableHead$1 = function TableHead(props) {
|
|
|
816
783
|
return Object.assign(Object.assign({}, json), item.style);
|
|
817
784
|
};
|
|
818
785
|
// 处理拖拽
|
|
819
|
-
|
|
786
|
+
const handDrag = item => {
|
|
820
787
|
if (item.name === 'table-serial-number') return false; // 序号不拖拽
|
|
821
788
|
if (dragColumn && item.drag !== false) return true;
|
|
822
789
|
return false;
|
|
823
790
|
};
|
|
824
|
-
return headData.map(
|
|
825
|
-
|
|
791
|
+
return headData.map((headCell, index) => {
|
|
792
|
+
let str = "".concat($prefixCls, "-filter-popover ").concat($prefixCls, "-scrollbar-small");
|
|
826
793
|
if (!headCell.filterRender) str += " ".concat($prefixCls, "-filter-popover-default");
|
|
827
794
|
return jsx(ThElement, Object.assign({
|
|
828
795
|
className: handCls(headCell),
|
|
@@ -842,9 +809,7 @@ var TableHead$1 = function TableHead(props) {
|
|
|
842
809
|
content: headCell.name !== undefined && filterHead.name === headCell.name && filterPopoverContent(),
|
|
843
810
|
onVisibleChange: clickHideFilter,
|
|
844
811
|
overlayClassName: str,
|
|
845
|
-
getPopupContainer: getPopupContainer ? getPopupContainer :
|
|
846
|
-
return document.body;
|
|
847
|
-
},
|
|
812
|
+
getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body,
|
|
848
813
|
maxWidth: headCell.filterMaxWidth
|
|
849
814
|
}, {
|
|
850
815
|
children: jsxs("div", Object.assign({
|
|
@@ -889,10 +854,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
889
854
|
});
|
|
890
855
|
}, [headData, sortTable, filter, orderFieldArr, orderTypeArr, align, filterHead, selectFilterCom, beyondText, selectFilter, fixedColumn, lineWidth, dragColumn, changeColumnWidth, headDataConfig, getPopupContainer, tipMaxWidth]);
|
|
891
856
|
// 操作栏memo
|
|
892
|
-
|
|
857
|
+
const TableOperateMemo = useMemo(() => {
|
|
893
858
|
if (operate) {
|
|
894
|
-
|
|
895
|
-
|
|
859
|
+
const handCls = () => {
|
|
860
|
+
let str = 'table-operate';
|
|
896
861
|
if (operate.operateBtnRender) str += ' table-operate-small';
|
|
897
862
|
if (showColumns === false) str += ' table-operate-not-columns';
|
|
898
863
|
if (dragRow) str += ' table-operate-drag-row';
|
|
@@ -905,8 +870,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
905
870
|
}
|
|
906
871
|
return str;
|
|
907
872
|
};
|
|
908
|
-
|
|
909
|
-
|
|
873
|
+
const handStyle = () => {
|
|
874
|
+
const json = {
|
|
910
875
|
width: operate.width
|
|
911
876
|
};
|
|
912
877
|
if (fixedColumn) {
|
|
@@ -942,16 +907,16 @@ var TableHead$1 = function TableHead(props) {
|
|
|
942
907
|
}
|
|
943
908
|
}, [operate, align, posFixed, showColumns, posFixed, beyondText, fixedColumn, tipMaxWidth, dragRow]);
|
|
944
909
|
// 显示列弹窗内容
|
|
945
|
-
|
|
910
|
+
const showListContent = () => {
|
|
946
911
|
return jsxs("div", Object.assign({
|
|
947
912
|
className: "show-colums-select"
|
|
948
913
|
}, {
|
|
949
914
|
children: [jsx("div", Object.assign({
|
|
950
915
|
className: "show-colums-select-box"
|
|
951
916
|
}, {
|
|
952
|
-
children: showList.map(
|
|
953
|
-
|
|
954
|
-
|
|
917
|
+
children: showList.map((item, index) => {
|
|
918
|
+
const checked = Boolean(headDataJson[item.name]);
|
|
919
|
+
let str = 'show-colums-select-item';
|
|
955
920
|
if (checked) str += ' show-colums-select-item-select';
|
|
956
921
|
if (item.disabledSelection) str += ' show-colums-select-item-disabled';
|
|
957
922
|
return jsxs("div", Object.assign({
|
|
@@ -985,9 +950,9 @@ var TableHead$1 = function TableHead(props) {
|
|
|
985
950
|
}));
|
|
986
951
|
};
|
|
987
952
|
// 显示列memo
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
953
|
+
const TableShowList = useMemo(() => {
|
|
954
|
+
const handCls = () => {
|
|
955
|
+
let str = 'show-colums table-fixed-dom-right';
|
|
991
956
|
// 没有固定列参数 或者 没有操作栏且没有右侧固定列
|
|
992
957
|
if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
|
|
993
958
|
str += ' table-fixed-dom-right-first';
|
|
@@ -1000,9 +965,7 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1000
965
|
content: showListContent(),
|
|
1001
966
|
onVisibleChange: clickHideColums,
|
|
1002
967
|
overlayClassName: "".concat($prefixCls, "-table-show-colums-popover ").concat($prefixCls, "-scrollbar-small"),
|
|
1003
|
-
getPopupContainer: getPopupContainer ? getPopupContainer :
|
|
1004
|
-
return document.body;
|
|
1005
|
-
}
|
|
968
|
+
getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body
|
|
1006
969
|
}, {
|
|
1007
970
|
children: jsx(ThElement, Object.assign({
|
|
1008
971
|
align: "center",
|
|
@@ -1019,10 +982,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1019
982
|
}));
|
|
1020
983
|
}, [showColumns, posFixed, operate, anchorElColums, showList, headDataJson, getPopupContainer, tipMaxWidth]);
|
|
1021
984
|
// 拖动行
|
|
1022
|
-
|
|
985
|
+
const TbaleDragRow = useMemo(() => {
|
|
1023
986
|
if (!dragRow || operate || showColumns === 'inside') return null;
|
|
1024
|
-
|
|
1025
|
-
|
|
987
|
+
const handCls = () => {
|
|
988
|
+
let str = 'drag-row table-fixed-dom-right';
|
|
1026
989
|
// 没有固定列参数 或者 没有操作栏且没有右侧固定列
|
|
1027
990
|
if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
|
|
1028
991
|
str += ' table-fixed-dom-right-first';
|
|
@@ -1036,8 +999,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1036
999
|
});
|
|
1037
1000
|
}, [operate, showColumns, fixedColumn, posFixed, dragRow]);
|
|
1038
1001
|
// 处理class
|
|
1039
|
-
|
|
1040
|
-
|
|
1002
|
+
const handClass = () => {
|
|
1003
|
+
let str = 'table-head';
|
|
1041
1004
|
if (showColumns === 'inside') str += ' table-head-inside';
|
|
1042
1005
|
if (!fixedTable) str += ' table-head-scroll'; // 防止长度过长
|
|
1043
1006
|
// 没有 复选框,单选框,展开 按钮
|
|
@@ -1115,98 +1078,74 @@ var TdElement = function TdElement(props) {
|
|
|
1115
1078
|
}));
|
|
1116
1079
|
};
|
|
1117
1080
|
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
rowData =
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
|
|
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
|
-
lineHeight = props.lineHeight,
|
|
1175
|
-
dragRow = props.dragRow,
|
|
1176
|
-
onDragRow = props.onDragRow;
|
|
1177
|
-
var _useState = useState(0),
|
|
1178
|
-
_useState2 = _slicedToArray(_useState, 2),
|
|
1179
|
-
expandableColSpan = _useState2[0],
|
|
1180
|
-
setExpandableColSpan = _useState2[1]; // 嵌套表格合并列数
|
|
1181
|
-
var _useState3 = useState({}),
|
|
1182
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
1183
|
-
expandableRow = _useState4[0],
|
|
1184
|
-
setExpandableRow = _useState4[1]; // 当前哪行展开表格嵌套
|
|
1185
|
-
var _useState5 = useState(true),
|
|
1186
|
-
_useState6 = _slicedToArray(_useState5, 2),
|
|
1187
|
-
showMoreBtn = _useState6[0],
|
|
1188
|
-
setShowMoreBtn = _useState6[1]; // 加载更多
|
|
1189
|
-
var _useState7 = useState({}),
|
|
1190
|
-
_useState8 = _slicedToArray(_useState7, 2),
|
|
1191
|
-
disabledExpandJson = _useState8[0],
|
|
1192
|
-
setDisabledExpand = _useState8[1]; // 禁用加减部分嵌套
|
|
1193
|
-
var _useState9 = useState(false),
|
|
1194
|
-
_useState10 = _slicedToArray(_useState9, 2),
|
|
1195
|
-
dragBol = _useState10[0],
|
|
1196
|
-
setDragBol = _useState10[1];
|
|
1197
|
-
var intl = useFormatMessage('Table', localeJson);
|
|
1081
|
+
const TableBody = props => {
|
|
1082
|
+
const {
|
|
1083
|
+
url,
|
|
1084
|
+
emptyProps,
|
|
1085
|
+
rowData = [],
|
|
1086
|
+
rowKey = 'key',
|
|
1087
|
+
check,
|
|
1088
|
+
radio,
|
|
1089
|
+
tableCell,
|
|
1090
|
+
expandable,
|
|
1091
|
+
headData = [],
|
|
1092
|
+
disabledJson = {},
|
|
1093
|
+
disabledArrStatus,
|
|
1094
|
+
checkJson = {},
|
|
1095
|
+
radioValue,
|
|
1096
|
+
selectCheck,
|
|
1097
|
+
selectRadio,
|
|
1098
|
+
align,
|
|
1099
|
+
operate,
|
|
1100
|
+
showColumns,
|
|
1101
|
+
fixedTable,
|
|
1102
|
+
fixedColumn,
|
|
1103
|
+
formatter,
|
|
1104
|
+
orderFieldArr = [],
|
|
1105
|
+
orderTypeArr = [],
|
|
1106
|
+
sortTable,
|
|
1107
|
+
loadState,
|
|
1108
|
+
loadMore,
|
|
1109
|
+
loadMoreRender,
|
|
1110
|
+
onClickMore,
|
|
1111
|
+
total,
|
|
1112
|
+
page,
|
|
1113
|
+
currentRowsPerPage,
|
|
1114
|
+
changePage,
|
|
1115
|
+
loadMoreUrl,
|
|
1116
|
+
expandMultiple = false,
|
|
1117
|
+
expandValue = [],
|
|
1118
|
+
disabledExpand = [],
|
|
1119
|
+
defaultExpandAllRows = false,
|
|
1120
|
+
onExpand,
|
|
1121
|
+
onRefresh,
|
|
1122
|
+
posFixed,
|
|
1123
|
+
beyondText,
|
|
1124
|
+
onClickRow,
|
|
1125
|
+
rowClassMapping,
|
|
1126
|
+
tipMaxWidth,
|
|
1127
|
+
lineHeight,
|
|
1128
|
+
dragRow,
|
|
1129
|
+
onDragRow
|
|
1130
|
+
} = props;
|
|
1131
|
+
const [expandableColSpan, setExpandableColSpan] = useState(0); // 嵌套表格合并列数
|
|
1132
|
+
const [expandableRow, setExpandableRow] = useState({}); // 当前哪行展开表格嵌套
|
|
1133
|
+
const [showMoreBtn, setShowMoreBtn] = useState(true); // 加载更多
|
|
1134
|
+
const [disabledExpandJson, setDisabledExpand] = useState({}); // 禁用加减部分嵌套
|
|
1135
|
+
const [dragBol, setDragBol] = useState(false);
|
|
1136
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
1198
1137
|
// 默认是否展开所有
|
|
1199
|
-
useEffect(
|
|
1138
|
+
useEffect(() => {
|
|
1200
1139
|
if (!defaultExpandAllRows) {
|
|
1201
1140
|
setExpandableRow({});
|
|
1202
1141
|
return;
|
|
1203
1142
|
}
|
|
1204
|
-
|
|
1205
|
-
for (
|
|
1206
|
-
|
|
1207
|
-
|
|
1143
|
+
const json = {};
|
|
1144
|
+
for (let i = 0, l = rowData.length; i < l; i++) {
|
|
1145
|
+
const item = rowData[i] || {};
|
|
1146
|
+
const id = item[rowKey];
|
|
1208
1147
|
json[id] = {
|
|
1209
|
-
id
|
|
1148
|
+
id,
|
|
1210
1149
|
status: 'develop'
|
|
1211
1150
|
};
|
|
1212
1151
|
}
|
|
@@ -1214,41 +1153,41 @@ var TableBody = function TableBody(props) {
|
|
|
1214
1153
|
}, [defaultExpandAllRows, rowData, rowKey]);
|
|
1215
1154
|
// 监听展开表格
|
|
1216
1155
|
// 如果直接写expandMultiple, expandValue会死循环
|
|
1217
|
-
useEffect(
|
|
1156
|
+
useEffect(() => {
|
|
1218
1157
|
if (props.expandValue === undefined) return;
|
|
1219
|
-
|
|
1220
|
-
|
|
1158
|
+
const json = {};
|
|
1159
|
+
let expandValueHand = expandValue;
|
|
1221
1160
|
// 只展开一个,去第一个值
|
|
1222
1161
|
if (!expandMultiple && expandValue.length > 0) {
|
|
1223
1162
|
expandValueHand = [expandValue[0]];
|
|
1224
1163
|
}
|
|
1225
|
-
for (
|
|
1226
|
-
|
|
1164
|
+
for (let i = 0, l = expandValueHand.length; i < l; i++) {
|
|
1165
|
+
const id = expandValueHand[i];
|
|
1227
1166
|
json[id] = {
|
|
1228
|
-
id
|
|
1167
|
+
id,
|
|
1229
1168
|
status: 'develop'
|
|
1230
1169
|
};
|
|
1231
1170
|
}
|
|
1232
1171
|
setExpandableRow(json);
|
|
1233
1172
|
}, [props.expandMultiple, props.expandValue, rowData]);
|
|
1234
1173
|
// 监听禁用嵌套 props.disabledExpand 防止死循环
|
|
1235
|
-
useEffect(
|
|
1236
|
-
|
|
1237
|
-
for (
|
|
1238
|
-
|
|
1174
|
+
useEffect(() => {
|
|
1175
|
+
const json = {};
|
|
1176
|
+
for (let i = 0, l = disabledExpand.length; i < l; i++) {
|
|
1177
|
+
const id = disabledExpand[i];
|
|
1239
1178
|
json[id] = true;
|
|
1240
1179
|
}
|
|
1241
1180
|
setDisabledExpand(json);
|
|
1242
1181
|
}, [props.disabledExpand]);
|
|
1243
|
-
useEffect(
|
|
1182
|
+
useEffect(() => {
|
|
1244
1183
|
if (loadMoreUrl) {
|
|
1245
|
-
|
|
1184
|
+
const bol = Number(total) > Number(page) * Number(currentRowsPerPage);
|
|
1246
1185
|
setShowMoreBtn(bol);
|
|
1247
1186
|
}
|
|
1248
1187
|
}, [loadMoreUrl, total, page, currentRowsPerPage]);
|
|
1249
1188
|
// 处理嵌套表格合并列数
|
|
1250
|
-
useEffect(
|
|
1251
|
-
|
|
1189
|
+
useEffect(() => {
|
|
1190
|
+
let num = headData.length;
|
|
1252
1191
|
if (expandable) num += 1;
|
|
1253
1192
|
if (check) num += 1;
|
|
1254
1193
|
if (radio) num += 1;
|
|
@@ -1257,55 +1196,55 @@ var TableBody = function TableBody(props) {
|
|
|
1257
1196
|
setExpandableColSpan(num);
|
|
1258
1197
|
}, [headData, expandable, check, radio]);
|
|
1259
1198
|
// 展开/收起嵌套表格
|
|
1260
|
-
|
|
1261
|
-
|
|
1262
|
-
|
|
1263
|
-
|
|
1264
|
-
|
|
1265
|
-
|
|
1266
|
-
|
|
1267
|
-
|
|
1268
|
-
status: status
|
|
1269
|
-
};
|
|
1270
|
-
if (expandMultiple) {
|
|
1271
|
-
// 展开多个
|
|
1272
|
-
expandableRow[id] = expandItem;
|
|
1273
|
-
setExpandableRow(Object.assign({}, expandableRow));
|
|
1274
|
-
} else {
|
|
1275
|
-
// 展开一个
|
|
1276
|
-
setExpandableRow(_defineProperty({}, id, expandItem));
|
|
1277
|
-
}
|
|
1278
|
-
onExpand && onExpand(row, status);
|
|
1279
|
-
event.stopPropagation();
|
|
1199
|
+
const handClickNestTable = row => event => {
|
|
1200
|
+
const id = row[rowKey];
|
|
1201
|
+
let expandItem = expandableRow[id] || {};
|
|
1202
|
+
let status = 'develop';
|
|
1203
|
+
if (expandItem.status === 'develop') status = 'retract';
|
|
1204
|
+
expandItem = {
|
|
1205
|
+
id,
|
|
1206
|
+
status
|
|
1280
1207
|
};
|
|
1208
|
+
if (expandMultiple) {
|
|
1209
|
+
// 展开多个
|
|
1210
|
+
expandableRow[id] = expandItem;
|
|
1211
|
+
setExpandableRow(Object.assign({}, expandableRow));
|
|
1212
|
+
} else {
|
|
1213
|
+
// 展开一个
|
|
1214
|
+
setExpandableRow({
|
|
1215
|
+
[id]: expandItem
|
|
1216
|
+
});
|
|
1217
|
+
}
|
|
1218
|
+
onExpand && onExpand(row, status);
|
|
1219
|
+
event.stopPropagation();
|
|
1281
1220
|
};
|
|
1282
1221
|
// 处理class
|
|
1283
|
-
|
|
1284
|
-
|
|
1222
|
+
const handClass = () => {
|
|
1223
|
+
let str = 'table-body';
|
|
1285
1224
|
if (!fixedTable) str += ' table-body-scroll';
|
|
1286
1225
|
// 没有 复选框,单选框,展开 按钮
|
|
1287
1226
|
if (!check && !radio && !expandable) str += ' table-body-no-btn';
|
|
1288
1227
|
return str;
|
|
1289
1228
|
};
|
|
1290
1229
|
// 处理嵌套表格class
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1230
|
+
const handExpandClass = row => {
|
|
1231
|
+
const id = row[rowKey];
|
|
1232
|
+
const expandItem = expandableRow[id] || {};
|
|
1233
|
+
let str = 'retract';
|
|
1295
1234
|
if (expandItem.status === 'develop') {
|
|
1296
1235
|
str = 'expand';
|
|
1297
1236
|
}
|
|
1298
1237
|
return str;
|
|
1299
1238
|
};
|
|
1300
1239
|
// 点击加载更多
|
|
1301
|
-
|
|
1240
|
+
const clickMore = () => {
|
|
1302
1241
|
if (loadMoreUrl) changePage && changePage();
|
|
1303
1242
|
onClickMore && onClickMore();
|
|
1304
1243
|
};
|
|
1305
1244
|
// 暂无数据memo
|
|
1306
|
-
|
|
1245
|
+
const NodataMemo = useMemo(() => {
|
|
1307
1246
|
// 处理刷新按钮
|
|
1308
|
-
|
|
1247
|
+
const handRefreshBtn = () => {
|
|
1309
1248
|
if ((emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh) !== undefined) {
|
|
1310
1249
|
return emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh;
|
|
1311
1250
|
}
|
|
@@ -1315,8 +1254,8 @@ var TableBody = function TableBody(props) {
|
|
|
1315
1254
|
return false;
|
|
1316
1255
|
};
|
|
1317
1256
|
// 处理className
|
|
1318
|
-
|
|
1319
|
-
|
|
1257
|
+
const handClassNoData = () => {
|
|
1258
|
+
let str = 'table-no-data';
|
|
1320
1259
|
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size) str += " table-no-data-".concat(emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.size);
|
|
1321
1260
|
return str;
|
|
1322
1261
|
};
|
|
@@ -1329,24 +1268,24 @@ var TableBody = function TableBody(props) {
|
|
|
1329
1268
|
}, {
|
|
1330
1269
|
children: jsx(Empty, Object.assign({}, emptyProps, {
|
|
1331
1270
|
showRefresh: handRefreshBtn(),
|
|
1332
|
-
onRefresh:
|
|
1271
|
+
onRefresh: event => {
|
|
1333
1272
|
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh) {
|
|
1334
1273
|
emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh(event);
|
|
1335
1274
|
return;
|
|
1336
1275
|
}
|
|
1337
|
-
|
|
1276
|
+
onRefresh && onRefresh();
|
|
1338
1277
|
}
|
|
1339
1278
|
}))
|
|
1340
1279
|
}))
|
|
1341
1280
|
}));
|
|
1342
|
-
}, [expandableColSpan, emptyProps, url,
|
|
1281
|
+
}, [expandableColSpan, emptyProps, url, onRefresh]);
|
|
1343
1282
|
// 复选框useCallback
|
|
1344
|
-
|
|
1283
|
+
const TableCheckCallback = useCallback(row => {
|
|
1345
1284
|
if (check) {
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1285
|
+
const handId = row[rowKey];
|
|
1286
|
+
const disabledHand = Boolean(disabledJson[handId]);
|
|
1287
|
+
let checkHand = checkJson[handId] || false;
|
|
1288
|
+
let showCheck = true;
|
|
1350
1289
|
if (disabledHand && disabledArrStatus) {
|
|
1351
1290
|
// 选中
|
|
1352
1291
|
if (disabledArrStatus[handId] === true) {
|
|
@@ -1361,8 +1300,8 @@ var TableBody = function TableBody(props) {
|
|
|
1361
1300
|
showCheck = false;
|
|
1362
1301
|
}
|
|
1363
1302
|
}
|
|
1364
|
-
|
|
1365
|
-
|
|
1303
|
+
const handCls = () => {
|
|
1304
|
+
let str = 'table-checkbox table-body-btn';
|
|
1366
1305
|
if (fixedColumn) {
|
|
1367
1306
|
str += ' table-fixed-dom-left';
|
|
1368
1307
|
// 左边没有定位,且没有单选,没有嵌套表格
|
|
@@ -1379,7 +1318,7 @@ var TableBody = function TableBody(props) {
|
|
|
1379
1318
|
children: showCheck && jsx(Checkbox, {
|
|
1380
1319
|
disabled: disabledHand,
|
|
1381
1320
|
checked: checkHand,
|
|
1382
|
-
onChange:
|
|
1321
|
+
onChange: (event, bol) => {
|
|
1383
1322
|
event.stopPropagation();
|
|
1384
1323
|
selectCheck && selectCheck(event, bol, row[rowKey]);
|
|
1385
1324
|
}
|
|
@@ -1388,12 +1327,12 @@ var TableBody = function TableBody(props) {
|
|
|
1388
1327
|
}
|
|
1389
1328
|
}, [check, disabledJson, rowKey, checkJson, selectCheck, disabledArrStatus, posFixed, expandable, radio, fixedColumn]);
|
|
1390
1329
|
// 单选框useCallback
|
|
1391
|
-
|
|
1330
|
+
const TableRadioCallback = useCallback(row => {
|
|
1392
1331
|
if (radio) {
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1332
|
+
const handId = row[rowKey];
|
|
1333
|
+
const disabledHand = Boolean(disabledJson[handId]);
|
|
1334
|
+
let checkHand = radioValue === row[rowKey];
|
|
1335
|
+
let showRadio = true;
|
|
1397
1336
|
if (disabledHand && disabledArrStatus) {
|
|
1398
1337
|
// 选中
|
|
1399
1338
|
if (disabledArrStatus[handId] === true) {
|
|
@@ -1408,8 +1347,8 @@ var TableBody = function TableBody(props) {
|
|
|
1408
1347
|
showRadio = false;
|
|
1409
1348
|
}
|
|
1410
1349
|
}
|
|
1411
|
-
|
|
1412
|
-
|
|
1350
|
+
const handCls = () => {
|
|
1351
|
+
let str = 'table-radio table-body-btn';
|
|
1413
1352
|
if (fixedColumn) {
|
|
1414
1353
|
str += ' table-fixed-dom-left';
|
|
1415
1354
|
// 左边没有定位,没有嵌套表格
|
|
@@ -1426,7 +1365,7 @@ var TableBody = function TableBody(props) {
|
|
|
1426
1365
|
children: showRadio && jsx(Radio, {
|
|
1427
1366
|
disabled: disabledHand,
|
|
1428
1367
|
checked: checkHand,
|
|
1429
|
-
onChange:
|
|
1368
|
+
onChange: event => {
|
|
1430
1369
|
event.stopPropagation();
|
|
1431
1370
|
selectRadio && selectRadio(event, row[rowKey]);
|
|
1432
1371
|
}
|
|
@@ -1435,13 +1374,13 @@ var TableBody = function TableBody(props) {
|
|
|
1435
1374
|
}
|
|
1436
1375
|
}, [radio, disabledJson, radioValue, rowKey, selectRadio, disabledArrStatus, expandable, posFixed, fixedColumn]);
|
|
1437
1376
|
// 嵌套加减useCallback
|
|
1438
|
-
|
|
1377
|
+
const TableExpandableMemo = useCallback(row => {
|
|
1439
1378
|
if (!expandable) return null;
|
|
1440
|
-
|
|
1379
|
+
const expandableDemo = expandable(row);
|
|
1441
1380
|
// 禁用一行表格展开 或者 展开表格返回值为false,返回空列
|
|
1442
1381
|
if (disabledExpandJson[row[rowKey]] || expandableDemo === false) return jsx(TdElement, {});
|
|
1443
|
-
|
|
1444
|
-
|
|
1382
|
+
const handCls = () => {
|
|
1383
|
+
let str = 'table-expandable table-body-btn';
|
|
1445
1384
|
if (fixedColumn) {
|
|
1446
1385
|
str += ' table-fixed-dom-left';
|
|
1447
1386
|
// 左边没有定位,没有嵌套表格
|
|
@@ -1462,17 +1401,17 @@ var TableBody = function TableBody(props) {
|
|
|
1462
1401
|
}));
|
|
1463
1402
|
}, [expandable, expandableRow, rowKey, disabledExpandJson, onExpand, fixedColumn]);
|
|
1464
1403
|
// 表格一行内容useCallback
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
orderFieldArr
|
|
1468
|
-
orderTypeArr
|
|
1404
|
+
const TableContentUseCallback = useCallback((row, rowIndex) => {
|
|
1405
|
+
const params = {
|
|
1406
|
+
orderFieldArr,
|
|
1407
|
+
orderTypeArr
|
|
1469
1408
|
};
|
|
1470
|
-
|
|
1471
|
-
|
|
1409
|
+
const handContentClass = item => {
|
|
1410
|
+
let str = 'table-content-columms';
|
|
1472
1411
|
if (item.className) str += " ".concat(item.className);
|
|
1473
1412
|
// 排序
|
|
1474
1413
|
if (sortTable && item.name && item.sort !== false) {
|
|
1475
|
-
|
|
1414
|
+
const index = orderFieldArr.indexOf(item.name);
|
|
1476
1415
|
if (index !== -1) {
|
|
1477
1416
|
// 升序
|
|
1478
1417
|
if (orderTypeArr[index] === 'asc') {
|
|
@@ -1497,8 +1436,8 @@ var TableBody = function TableBody(props) {
|
|
|
1497
1436
|
}
|
|
1498
1437
|
return str;
|
|
1499
1438
|
};
|
|
1500
|
-
|
|
1501
|
-
|
|
1439
|
+
const handStyle = item => {
|
|
1440
|
+
const json = {};
|
|
1502
1441
|
if (fixedColumn && item.fixed && item.width) {
|
|
1503
1442
|
if (item.fixed === 'left') {
|
|
1504
1443
|
json.left = "".concat(item.paraui_left_width, "px");
|
|
@@ -1509,12 +1448,12 @@ var TableBody = function TableBody(props) {
|
|
|
1509
1448
|
}
|
|
1510
1449
|
return json;
|
|
1511
1450
|
};
|
|
1512
|
-
return tableCell ? tableCell(row, params) : headData.map(
|
|
1513
|
-
|
|
1514
|
-
|
|
1451
|
+
return tableCell ? tableCell(row, params) : headData.map((item, index) => {
|
|
1452
|
+
let text = row[item.name];
|
|
1453
|
+
let colSpan = 1;
|
|
1515
1454
|
if (item.render) text = item.render(row, item, row[item.name], index, rowIndex);
|
|
1516
1455
|
if (formatter) text = formatter(row, item, row[item.name], index, rowIndex);
|
|
1517
|
-
|
|
1456
|
+
const itemStyle = handStyle(item);
|
|
1518
1457
|
// 存在显示列,最后一列占两格
|
|
1519
1458
|
if (showColumns === 'inside' && !operate && index === headData.length - 1 && !dragRow) {
|
|
1520
1459
|
colSpan = 2;
|
|
@@ -1538,25 +1477,25 @@ var TableBody = function TableBody(props) {
|
|
|
1538
1477
|
});
|
|
1539
1478
|
}, [tableCell, headData, align, formatter, orderFieldArr, orderTypeArr, sortTable, showColumns, operate, beyondText, fixedColumn, tipMaxWidth, dragRow]);
|
|
1540
1479
|
// 操作栏useCallback
|
|
1541
|
-
|
|
1480
|
+
const TableOperateUseCallback = useCallback((row, rowIndex) => {
|
|
1542
1481
|
if (operate || dragRow) {
|
|
1543
|
-
|
|
1482
|
+
let colSpan = 1;
|
|
1544
1483
|
if (showColumns === 'inside' && operate) colSpan = 2;
|
|
1545
|
-
|
|
1484
|
+
const handOperate = () => {
|
|
1546
1485
|
if (operate === null || operate === void 0 ? void 0 : operate.render) return operate.render(row);
|
|
1547
1486
|
if (operate === null || operate === void 0 ? void 0 : operate.operateBtnRender) {
|
|
1548
|
-
|
|
1487
|
+
const operateConfig = operate.operateBtnRender(row, rowIndex);
|
|
1549
1488
|
return jsx(OperateBtn, Object.assign({}, operateConfig));
|
|
1550
1489
|
}
|
|
1551
1490
|
};
|
|
1552
|
-
|
|
1553
|
-
|
|
1491
|
+
const handStyle = () => {
|
|
1492
|
+
const json = {
|
|
1554
1493
|
right: '0'
|
|
1555
1494
|
};
|
|
1556
1495
|
return json;
|
|
1557
1496
|
};
|
|
1558
|
-
|
|
1559
|
-
|
|
1497
|
+
const handCls = () => {
|
|
1498
|
+
let str = 'table-operate';
|
|
1560
1499
|
if (!operate) str += ' table-operate-center';
|
|
1561
1500
|
if (fixedColumn) {
|
|
1562
1501
|
str += ' table-fixed-dom-right';
|
|
@@ -1597,11 +1536,11 @@ var TableBody = function TableBody(props) {
|
|
|
1597
1536
|
}
|
|
1598
1537
|
}, [operate, align, showColumns, posFixed, fixedColumn, dragRow, onDragRow, dragBol]);
|
|
1599
1538
|
// 嵌套表格useCallback
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1539
|
+
const TableExpandableContentUseCallback = useCallback(row => {
|
|
1540
|
+
const id = row[rowKey];
|
|
1541
|
+
const expandItem = expandableRow[id] || {};
|
|
1603
1542
|
if (expandable && expandItem.status === 'develop') {
|
|
1604
|
-
|
|
1543
|
+
const expandableDemo = expandable(row);
|
|
1605
1544
|
if (expandableDemo === false) return null; // 展开表格返回值为false,不展示这一行
|
|
1606
1545
|
return jsx(TrElement, Object.assign({
|
|
1607
1546
|
className: "table-body-expand-row"
|
|
@@ -1616,7 +1555,7 @@ var TableBody = function TableBody(props) {
|
|
|
1616
1555
|
}
|
|
1617
1556
|
}, [expandable, expandableRow, expandableColSpan, rowKey]);
|
|
1618
1557
|
// 加载更多
|
|
1619
|
-
|
|
1558
|
+
const MoreMemo = useMemo(() => {
|
|
1620
1559
|
if (!loadMore || !showMoreBtn) return null;
|
|
1621
1560
|
return jsx(TrElement, Object.assign({
|
|
1622
1561
|
className: "more-table-row",
|
|
@@ -1639,10 +1578,10 @@ var TableBody = function TableBody(props) {
|
|
|
1639
1578
|
}))
|
|
1640
1579
|
}));
|
|
1641
1580
|
}, [expandableColSpan, loadMore, loadMoreRender, onClickMore, showMoreBtn, changePage, loadMoreUrl, lineHeight]);
|
|
1642
|
-
|
|
1581
|
+
const TableBodySubjectContentMemo = useMemo(() => {
|
|
1643
1582
|
return jsx(Fragment, {
|
|
1644
|
-
children: rowData.map(
|
|
1645
|
-
|
|
1583
|
+
children: rowData.map((row, index) => {
|
|
1584
|
+
let str = 'table-body-row';
|
|
1646
1585
|
if (rowClassMapping && rowClassMapping[row[rowKey]]) {
|
|
1647
1586
|
str += " ".concat(rowClassMapping[row[rowKey]]);
|
|
1648
1587
|
}
|
|
@@ -1652,7 +1591,7 @@ var TableBody = function TableBody(props) {
|
|
|
1652
1591
|
style: {
|
|
1653
1592
|
height: "".concat(lineHeight, "px")
|
|
1654
1593
|
},
|
|
1655
|
-
onClick:
|
|
1594
|
+
onClick: e => {
|
|
1656
1595
|
onClickRow && onClickRow(row, e);
|
|
1657
1596
|
}
|
|
1658
1597
|
}, {
|
|
@@ -1663,32 +1602,32 @@ var TableBody = function TableBody(props) {
|
|
|
1663
1602
|
});
|
|
1664
1603
|
}, [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]);
|
|
1665
1604
|
// 内容memo
|
|
1666
|
-
|
|
1605
|
+
const TableBodyContentMemo = useMemo(() => {
|
|
1667
1606
|
return jsxs(Fragment$1, {
|
|
1668
1607
|
children: [TableBodySubjectContentMemo, MoreMemo]
|
|
1669
1608
|
});
|
|
1670
1609
|
}, [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]);
|
|
1671
1610
|
// 处理内容
|
|
1672
|
-
|
|
1611
|
+
const handContent = () => {
|
|
1673
1612
|
// 无数据,且不再请求,显示暂无数据
|
|
1674
1613
|
if (rowData.length === 0 && !loadState) return NodataMemo;
|
|
1675
1614
|
return TableBodyContentMemo;
|
|
1676
1615
|
};
|
|
1677
|
-
|
|
1678
|
-
|
|
1616
|
+
const handleRowData = () => {
|
|
1617
|
+
const arr = [];
|
|
1679
1618
|
if (dragRow) {
|
|
1680
|
-
rowData.forEach(
|
|
1681
|
-
|
|
1619
|
+
rowData.forEach(item => {
|
|
1620
|
+
const obj = {};
|
|
1682
1621
|
obj[rowKey] = item[rowKey];
|
|
1683
1622
|
arr.push(obj);
|
|
1684
1623
|
});
|
|
1685
1624
|
}
|
|
1686
1625
|
return arr;
|
|
1687
1626
|
};
|
|
1688
|
-
|
|
1627
|
+
const onChoose = () => {
|
|
1689
1628
|
setDragBol(true);
|
|
1690
1629
|
};
|
|
1691
|
-
|
|
1630
|
+
const onDragRowCom = evt => {
|
|
1692
1631
|
setDragBol(false);
|
|
1693
1632
|
onDragRow && onDragRow(evt);
|
|
1694
1633
|
};
|
|
@@ -1704,35 +1643,29 @@ var TableBody = function TableBody(props) {
|
|
|
1704
1643
|
}));
|
|
1705
1644
|
};
|
|
1706
1645
|
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
checkNumber =
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
setIndeterminate = _useState2[1]; // 半选中
|
|
1731
|
-
var _useState3 = useState(false),
|
|
1732
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
1733
|
-
checked = _useState4[0],
|
|
1734
|
-
setChecked = _useState4[1]; // 选中
|
|
1735
|
-
useEffect(function () {
|
|
1646
|
+
const TableHead = props => {
|
|
1647
|
+
const {
|
|
1648
|
+
paginationType,
|
|
1649
|
+
flippingArrow,
|
|
1650
|
+
autoPagination,
|
|
1651
|
+
total,
|
|
1652
|
+
page,
|
|
1653
|
+
rowsPerPage,
|
|
1654
|
+
currentRowsPerPage,
|
|
1655
|
+
changePage,
|
|
1656
|
+
changeRowsPerPage,
|
|
1657
|
+
refreshInside,
|
|
1658
|
+
checkCount,
|
|
1659
|
+
onRefresh,
|
|
1660
|
+
selectAll,
|
|
1661
|
+
selectStatus,
|
|
1662
|
+
checkNumber = 0,
|
|
1663
|
+
currentPageTotal = 0
|
|
1664
|
+
} = props;
|
|
1665
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
1666
|
+
const [indeterminate, setIndeterminate] = useState(false); // 半选中
|
|
1667
|
+
const [checked, setChecked] = useState(false); // 选中
|
|
1668
|
+
useEffect(() => {
|
|
1736
1669
|
// 全选
|
|
1737
1670
|
if (selectStatus === 'all') {
|
|
1738
1671
|
setChecked(true);
|
|
@@ -1754,23 +1687,23 @@ var TableHead = function TableHead(props) {
|
|
|
1754
1687
|
* @param event 操作元素
|
|
1755
1688
|
* @param bol 选中 / 不选中
|
|
1756
1689
|
*/
|
|
1757
|
-
|
|
1690
|
+
const onSelectAll = (event, bol) => {
|
|
1758
1691
|
if (selectAll) selectAll(event, bol);
|
|
1759
1692
|
};
|
|
1760
1693
|
// 改变页面
|
|
1761
|
-
|
|
1694
|
+
const changePageCom = num => {
|
|
1762
1695
|
changePage && changePage(num);
|
|
1763
1696
|
};
|
|
1764
1697
|
// 改变每页显示条数
|
|
1765
|
-
|
|
1698
|
+
const changeRowsPerPageCom = num => {
|
|
1766
1699
|
changeRowsPerPage && changeRowsPerPage(num);
|
|
1767
1700
|
};
|
|
1768
1701
|
// 刷新
|
|
1769
|
-
|
|
1702
|
+
const clickRefresh = () => {
|
|
1770
1703
|
onRefresh && onRefresh();
|
|
1771
1704
|
};
|
|
1772
1705
|
// 处理分页右侧
|
|
1773
|
-
|
|
1706
|
+
const handlePaginationRight = () => {
|
|
1774
1707
|
if (!checkCount) return null;
|
|
1775
1708
|
return jsxs("div", Object.assign({
|
|
1776
1709
|
className: 'table-pagination-right'
|
|
@@ -1793,8 +1726,8 @@ var TableHead = function TableHead(props) {
|
|
|
1793
1726
|
}));
|
|
1794
1727
|
};
|
|
1795
1728
|
// 处理样式
|
|
1796
|
-
|
|
1797
|
-
|
|
1729
|
+
const handleClass = () => {
|
|
1730
|
+
const str = 'table-pagination';
|
|
1798
1731
|
return str;
|
|
1799
1732
|
};
|
|
1800
1733
|
return jsxs("div", Object.assign({
|
|
@@ -1811,9 +1744,7 @@ var TableHead = function TableHead(props) {
|
|
|
1811
1744
|
currentRowsPerPage: currentRowsPerPage,
|
|
1812
1745
|
changePage: changePageCom,
|
|
1813
1746
|
changeRowsPerPage: changeRowsPerPageCom,
|
|
1814
|
-
getPopupContainer:
|
|
1815
|
-
return document.body;
|
|
1816
|
-
}
|
|
1747
|
+
getPopupContainer: () => document.body
|
|
1817
1748
|
}), refreshInside && jsx(Button.IconButton, Object.assign({
|
|
1818
1749
|
className: 'refresh-btn',
|
|
1819
1750
|
variant: "outlined",
|
|
@@ -1827,14 +1758,16 @@ var TableHead = function TableHead(props) {
|
|
|
1827
1758
|
var css_248z$2 = ".table-container {\n overflow-x: auto;\n}";
|
|
1828
1759
|
styleInject(css_248z$2);
|
|
1829
1760
|
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1761
|
+
const TableContainer = props => {
|
|
1762
|
+
const {
|
|
1763
|
+
cRef,
|
|
1764
|
+
className,
|
|
1765
|
+
style,
|
|
1766
|
+
children
|
|
1767
|
+
} = props,
|
|
1835
1768
|
otherProps = __rest(props, ["cRef", "className", "style", "children"]);
|
|
1836
|
-
|
|
1837
|
-
|
|
1769
|
+
const handClass = () => {
|
|
1770
|
+
let str = 'table-container';
|
|
1838
1771
|
if (className) str += " ".concat(className);
|
|
1839
1772
|
return str;
|
|
1840
1773
|
};
|
|
@@ -1850,14 +1783,16 @@ var TableContainer = function TableContainer(props) {
|
|
|
1850
1783
|
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}";
|
|
1851
1784
|
styleInject(css_248z$1);
|
|
1852
1785
|
|
|
1853
|
-
|
|
1854
|
-
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
|
|
1786
|
+
const TableElement = props => {
|
|
1787
|
+
const {
|
|
1788
|
+
className,
|
|
1789
|
+
style,
|
|
1790
|
+
fixedColumn,
|
|
1791
|
+
children
|
|
1792
|
+
} = props,
|
|
1858
1793
|
otherProps = __rest(props, ["className", "style", "fixedColumn", "children"]);
|
|
1859
|
-
|
|
1860
|
-
|
|
1794
|
+
const handClass = () => {
|
|
1795
|
+
let str = 'table-element';
|
|
1861
1796
|
if (fixedColumn) str += ' table-element-fixed-column';
|
|
1862
1797
|
if (className) str += " ".concat(className);
|
|
1863
1798
|
return str;
|