@para-ui/core 4.0.42 → 4.0.44
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 +5 -6
- package/CodeEditor/index.d.ts +164 -0
- package/CodeEditor/index.js +231 -0
- package/CodeEditor/lang/en_US.d.ts +7 -0
- package/CodeEditor/lang/index.d.ts +27 -0
- package/CodeEditor/lang/zh_CN.d.ts +7 -0
- package/ComboSelect/index.js +6 -7
- package/CycleSelector/index.js +3 -6
- package/DatePicker/index.js +1 -4
- package/DynamicMultiBox/index.js +6 -7
- package/Form/index.js +7 -8
- package/FormItem/index.js +7 -8
- package/Image/index.js +2 -3
- package/Pagination/index.d.ts +4 -0
- package/Pagination/index.js +5 -4
- package/QuickReply/index.js +1 -1
- package/README.md +11 -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/Switch/index.js +2 -2
- package/Table/index.js +465 -493
- package/Table/lang/en_US.d.ts +2 -0
- package/Table/lang/index.d.ts +4 -0
- package/Table/lang/zh_CN.d.ts +2 -0
- package/Tabs/index.js +2 -2
- package/Tag/index.js +53 -82
- 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 +5 -6
- package/Upload/index.js +4 -5
- package/_verture/{Portal-edd94cac.js → Portal-42560ff0.js} +1 -2
- package/_verture/{defineProperty-6f62bb2a.js → defineProperty-f0e15205.js} +10 -2
- package/_verture/{index-2824e7a7.js → index-3fcb421f.js} +3 -4
- package/_verture/{index-77fff5bd.js → index-5f0bfdcf.js} +2 -3
- package/_verture/{index-94e24006.js → index-8ac46bd9.js} +1 -1
- package/_verture/{index-67fe714a.js → index-fd0727b2.js} +54 -56
- package/index.d.ts +2 -0
- package/index.js +9 -9
- package/locale/en-US.d.ts +8 -0
- package/locale/index.d.ts +16 -0
- package/locale/index.js +18 -2
- package/locale/zh-CN.d.ts +8 -0
- package/package.json +3 -2
- package/umd/CodeEditor.js +31 -0
- package/umd/ComboSelect.js +1 -1
- package/umd/DynamicMultiBox.js +1 -1
- package/umd/Form.js +1 -1
- package/umd/FormItem.js +1 -1
- package/umd/Pagination.js +1 -1
- package/umd/Table.js +2 -2
- package/umd/locale.js +1 -1
- package/_verture/typeof-adeedc13.js +0 -11
- /package/_verture/{index-c8cb6751.js → index-0f5ee6f7.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;
|
|
@@ -344,7 +343,9 @@ var en = {
|
|
|
344
343
|
refresh: 'Refresh',
|
|
345
344
|
selectNum: 'Selected {num} items',
|
|
346
345
|
selectAll: 'Select All',
|
|
347
|
-
dragSort: 'Drag Sort'
|
|
346
|
+
dragSort: 'Drag Sort',
|
|
347
|
+
noHomePageEmpty: 'There is no data on this page',
|
|
348
|
+
returnPrevPage: 'Return to previous page'
|
|
348
349
|
};
|
|
349
350
|
|
|
350
351
|
var zh = {
|
|
@@ -356,74 +357,56 @@ var zh = {
|
|
|
356
357
|
refresh: '刷新',
|
|
357
358
|
selectNum: '已选{num}项',
|
|
358
359
|
selectAll: '全选',
|
|
359
|
-
dragSort: '拖动排序'
|
|
360
|
+
dragSort: '拖动排序',
|
|
361
|
+
noHomePageEmpty: '当前页面无数据',
|
|
362
|
+
returnPrevPage: '返回上一页'
|
|
360
363
|
};
|
|
361
364
|
|
|
362
365
|
var localeJson = {
|
|
363
|
-
zh
|
|
364
|
-
en
|
|
366
|
+
zh,
|
|
367
|
+
en
|
|
365
368
|
};
|
|
366
369
|
|
|
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 () {
|
|
370
|
+
const TableHead$1 = props => {
|
|
371
|
+
const {
|
|
372
|
+
headData = [],
|
|
373
|
+
sortTable,
|
|
374
|
+
filter,
|
|
375
|
+
expandable,
|
|
376
|
+
check,
|
|
377
|
+
radio,
|
|
378
|
+
onRequestSort,
|
|
379
|
+
orderFieldArr = [],
|
|
380
|
+
orderTypeArr = [],
|
|
381
|
+
selectAll,
|
|
382
|
+
selectStatus,
|
|
383
|
+
align,
|
|
384
|
+
showList = [],
|
|
385
|
+
changeShowList,
|
|
386
|
+
selectFilter,
|
|
387
|
+
changeFilter,
|
|
388
|
+
operate,
|
|
389
|
+
showColumns,
|
|
390
|
+
fixedTable,
|
|
391
|
+
fixedColumn,
|
|
392
|
+
posFixed,
|
|
393
|
+
beyondText,
|
|
394
|
+
lineWidth,
|
|
395
|
+
dragColumn,
|
|
396
|
+
dragRow,
|
|
397
|
+
changeColumnWidth,
|
|
398
|
+
headDataConfig,
|
|
399
|
+
getPopupContainer,
|
|
400
|
+
tipMaxWidth
|
|
401
|
+
} = props;
|
|
402
|
+
const [indeterminate, setIndeterminate] = useState(false); // 半选中
|
|
403
|
+
const [checked, setChecked] = useState(false); // 选中
|
|
404
|
+
const [anchorElColums, setAnchorElColums] = useState(null); // 显示列定位元素
|
|
405
|
+
const [headDataJson, setHeadDataJson] = useState({}); // 显示列json
|
|
406
|
+
const [filterHead, setFilterHead] = useState({}); // 过滤项当前表头数据
|
|
407
|
+
const [selectFilterCom, setSelectFilterCom] = useState({}); // 过滤项当前选中值
|
|
408
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
409
|
+
useEffect(() => {
|
|
427
410
|
// 全选
|
|
428
411
|
if (selectStatus === 'all') {
|
|
429
412
|
setChecked(true);
|
|
@@ -440,17 +423,17 @@ var TableHead$1 = function TableHead(props) {
|
|
|
440
423
|
setIndeterminate(false);
|
|
441
424
|
}
|
|
442
425
|
}, [selectStatus]);
|
|
443
|
-
useEffect(
|
|
426
|
+
useEffect(() => {
|
|
444
427
|
if (headData) {
|
|
445
|
-
|
|
446
|
-
for (
|
|
447
|
-
|
|
428
|
+
const json = [];
|
|
429
|
+
for (let i = 0, l = headData.length; i < l; i++) {
|
|
430
|
+
const item = headData[i];
|
|
448
431
|
json[item.name] = item;
|
|
449
432
|
}
|
|
450
433
|
setHeadDataJson(json);
|
|
451
434
|
}
|
|
452
435
|
}, [headData]);
|
|
453
|
-
useEffect(
|
|
436
|
+
useEffect(() => {
|
|
454
437
|
if (selectFilter) setSelectFilterCom(DeepClone(selectFilter));
|
|
455
438
|
}, [selectFilter]);
|
|
456
439
|
/**
|
|
@@ -458,30 +441,28 @@ var TableHead$1 = function TableHead(props) {
|
|
|
458
441
|
* @param name 排序列
|
|
459
442
|
* @param event 当前排序元素
|
|
460
443
|
*/
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
if (onRequestSort) onRequestSort(event, name);
|
|
466
|
-
};
|
|
444
|
+
const createSortHandler = (name, item) => event => {
|
|
445
|
+
// 不存在排序,不触发事件
|
|
446
|
+
if (!(sortTable && item.name && item.sort !== false)) return;
|
|
447
|
+
if (onRequestSort) onRequestSort(event, name);
|
|
467
448
|
};
|
|
468
449
|
/**
|
|
469
450
|
* 全选 / 全不选
|
|
470
451
|
* @param event 操作元素
|
|
471
452
|
* @param bol 选中 / 不选中
|
|
472
453
|
*/
|
|
473
|
-
|
|
454
|
+
const onSelectAll = (event, bol) => {
|
|
474
455
|
if (selectAll) selectAll(event, bol);
|
|
475
456
|
};
|
|
476
457
|
/**
|
|
477
458
|
* 点击显示选择列
|
|
478
459
|
* @param event 点击元素
|
|
479
460
|
*/
|
|
480
|
-
|
|
461
|
+
const clickShowColums = event => {
|
|
481
462
|
setAnchorElColums(event.currentTarget);
|
|
482
463
|
};
|
|
483
464
|
// 点击隐藏选择列
|
|
484
|
-
|
|
465
|
+
const clickHideColums = bol => {
|
|
485
466
|
if (bol) return;
|
|
486
467
|
setAnchorElColums(null);
|
|
487
468
|
};
|
|
@@ -489,29 +470,27 @@ var TableHead$1 = function TableHead(props) {
|
|
|
489
470
|
* 点击显示列 列表
|
|
490
471
|
* @param item 详细
|
|
491
472
|
*/
|
|
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);
|
|
473
|
+
const clickColumsList = item => () => {
|
|
474
|
+
if (item.disabledSelection) return;
|
|
475
|
+
const name = item.name;
|
|
476
|
+
const itemHead = headDataJson[name];
|
|
477
|
+
if (itemHead) {
|
|
478
|
+
// 取消勾选
|
|
479
|
+
delete headDataJson[name];
|
|
480
|
+
const arr = Object.keys(headDataJson);
|
|
481
|
+
const arr1 = [];
|
|
482
|
+
for (let i = 0, l = arr.length; i < l; i++) {
|
|
483
|
+
const name = arr[i];
|
|
484
|
+
arr1.push(headDataJson[name]);
|
|
510
485
|
}
|
|
511
|
-
|
|
486
|
+
changeShowList && changeShowList(arr1, false, item);
|
|
487
|
+
} else {
|
|
488
|
+
headData.push(item);
|
|
489
|
+
changeShowList && changeShowList(headData, false, item);
|
|
490
|
+
}
|
|
512
491
|
};
|
|
513
492
|
// 重置显示列
|
|
514
|
-
|
|
493
|
+
const resetShowList = () => {
|
|
515
494
|
changeShowList && changeShowList(headData, true);
|
|
516
495
|
};
|
|
517
496
|
/**
|
|
@@ -519,69 +498,63 @@ var TableHead$1 = function TableHead(props) {
|
|
|
519
498
|
* @param headCell 当前列信息
|
|
520
499
|
* @param event 元素
|
|
521
500
|
*/
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
526
|
-
};
|
|
501
|
+
const clickShowFilter = headCell => event => {
|
|
502
|
+
setFilterHead(headCell);
|
|
503
|
+
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
527
504
|
};
|
|
528
505
|
// 点击隐藏过滤
|
|
529
|
-
|
|
506
|
+
const clickHideFilter = bol => {
|
|
530
507
|
if (bol) return;
|
|
531
508
|
setFilterHead({});
|
|
532
509
|
setSelectFilterCom(Object.assign({}, selectFilter));
|
|
533
510
|
};
|
|
534
511
|
// 点击过滤
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
filterValue = [filterValue[num]];
|
|
553
|
-
}
|
|
512
|
+
const clickFilter = item => () => {
|
|
513
|
+
const name = filterHead.name;
|
|
514
|
+
let filterValue = DeepClone(selectFilterCom[name] || []);
|
|
515
|
+
const index = filterValue.indexOf(item.value);
|
|
516
|
+
if (index !== -1) {
|
|
517
|
+
// 勾选 -> 不勾选
|
|
518
|
+
filterValue.splice(index, 1);
|
|
519
|
+
} else {
|
|
520
|
+
// 不勾选 -> 勾选
|
|
521
|
+
filterValue.push(item.value);
|
|
522
|
+
}
|
|
523
|
+
const filterRadio = filterHead.filterRadio;
|
|
524
|
+
if (filterRadio) {
|
|
525
|
+
// 过滤单个
|
|
526
|
+
const num = filterValue.indexOf(item.value);
|
|
527
|
+
if (num !== -1) {
|
|
528
|
+
filterValue = [filterValue[num]];
|
|
554
529
|
}
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
};
|
|
530
|
+
}
|
|
531
|
+
selectFilterCom[name] = filterValue;
|
|
532
|
+
setSelectFilterCom(Object.assign({}, selectFilterCom));
|
|
558
533
|
};
|
|
559
534
|
/**
|
|
560
535
|
* 重置 / 确定过滤
|
|
561
536
|
* @param type {'reset' | 'confirm'} 重置 / 确定过滤
|
|
562
537
|
*/
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
}
|
|
577
|
-
};
|
|
538
|
+
const filterFunc = type => () => {
|
|
539
|
+
if (type === 'confirm') {
|
|
540
|
+
// 确定
|
|
541
|
+
changeFilter && changeFilter(Object.assign({}, selectFilterCom));
|
|
542
|
+
setFilterHead({});
|
|
543
|
+
} else {
|
|
544
|
+
// 重置
|
|
545
|
+
const json = DeepClone(selectFilterCom);
|
|
546
|
+
delete json[filterHead.name];
|
|
547
|
+
setSelectFilterCom(json);
|
|
548
|
+
changeFilter && changeFilter(Object.assign({}, json));
|
|
549
|
+
setFilterHead({});
|
|
550
|
+
}
|
|
578
551
|
};
|
|
579
552
|
/**
|
|
580
553
|
* 自定义过滤确定
|
|
581
554
|
* @param val {[name: string]: any[]}
|
|
582
555
|
* */
|
|
583
|
-
|
|
584
|
-
|
|
556
|
+
const filterCustomConfirm = function () {
|
|
557
|
+
let val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
585
558
|
changeFilter && changeFilter(Object.assign({}, val));
|
|
586
559
|
setFilterHead({});
|
|
587
560
|
};
|
|
@@ -589,12 +562,12 @@ var TableHead$1 = function TableHead(props) {
|
|
|
589
562
|
* 处理TableCell
|
|
590
563
|
* @param item 当前列信息
|
|
591
564
|
*/
|
|
592
|
-
|
|
593
|
-
|
|
565
|
+
const handCellClass = item => {
|
|
566
|
+
let str = 'table-header-box';
|
|
594
567
|
// 排序
|
|
595
568
|
if (sortTable && item.name && item.sort !== false) {
|
|
596
569
|
str += ' table-header-box-sort';
|
|
597
|
-
|
|
570
|
+
const index = orderFieldArr.indexOf(item.name);
|
|
598
571
|
if (index !== -1) {
|
|
599
572
|
// 升序
|
|
600
573
|
if (orderTypeArr[index] === 'asc') {
|
|
@@ -613,10 +586,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
613
586
|
return str;
|
|
614
587
|
};
|
|
615
588
|
// 复选框memo
|
|
616
|
-
|
|
589
|
+
const TableCheckMemo = useMemo(() => {
|
|
617
590
|
if (check) {
|
|
618
|
-
|
|
619
|
-
|
|
591
|
+
const handCls = () => {
|
|
592
|
+
let str = 'table-checkbox table-head-btn';
|
|
620
593
|
if (fixedColumn) {
|
|
621
594
|
str += ' table-fixed-dom-left';
|
|
622
595
|
// 左边没有定位,且没有单选,没有嵌套表格
|
|
@@ -644,10 +617,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
644
617
|
}
|
|
645
618
|
}, [check, indeterminate, checked, selectAll, posFixed, radio, expandable, fixedColumn]);
|
|
646
619
|
// 单选框memo
|
|
647
|
-
|
|
620
|
+
const TableRadioMemo = useMemo(() => {
|
|
648
621
|
if (radio) {
|
|
649
|
-
|
|
650
|
-
|
|
622
|
+
const handCls = () => {
|
|
623
|
+
let str = 'table-radio table-head-btn';
|
|
651
624
|
if (fixedColumn) {
|
|
652
625
|
str += ' table-fixed-dom-left';
|
|
653
626
|
// 左边没有定位,没有嵌套表格
|
|
@@ -669,10 +642,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
669
642
|
}
|
|
670
643
|
}, [radio, posFixed, expandable, fixedColumn]);
|
|
671
644
|
// 嵌套表格memo
|
|
672
|
-
|
|
645
|
+
const TableExpandableMemo = useMemo(() => {
|
|
673
646
|
if (expandable) {
|
|
674
|
-
|
|
675
|
-
|
|
647
|
+
const handCls = () => {
|
|
648
|
+
let str = 'table-expandable table-head-btn';
|
|
676
649
|
if (fixedColumn) {
|
|
677
650
|
str += ' table-fixed-dom-left';
|
|
678
651
|
// 左边没有定位,没有嵌套表格
|
|
@@ -694,21 +667,21 @@ var TableHead$1 = function TableHead(props) {
|
|
|
694
667
|
}
|
|
695
668
|
}, [expandable, posFixed, fixedColumn]);
|
|
696
669
|
// 过滤弹窗内容
|
|
697
|
-
|
|
698
|
-
|
|
670
|
+
const filterPopoverContent = () => {
|
|
671
|
+
const name = filterHead.name;
|
|
699
672
|
if (!name) return;
|
|
700
|
-
|
|
673
|
+
const filterValue = selectFilterCom[name] || [];
|
|
701
674
|
if (filterHead.filterRender) {
|
|
702
675
|
// 自定义渲染过滤
|
|
703
676
|
return filterHead.filterRender({
|
|
704
|
-
filterValue
|
|
677
|
+
filterValue,
|
|
705
678
|
selectFilter: selectFilterCom,
|
|
706
|
-
filterHead
|
|
679
|
+
filterHead,
|
|
707
680
|
setFilter: filterCustomConfirm
|
|
708
681
|
});
|
|
709
682
|
}
|
|
710
|
-
|
|
711
|
-
|
|
683
|
+
const arr = filterHead.enums || [];
|
|
684
|
+
let str = 'filter-select';
|
|
712
685
|
if (arr.length === 0) str += ' filter-select-none';
|
|
713
686
|
return jsx("div", Object.assign({
|
|
714
687
|
className: str
|
|
@@ -723,8 +696,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
723
696
|
children: [jsx("div", Object.assign({
|
|
724
697
|
className: "filter-select-box"
|
|
725
698
|
}, {
|
|
726
|
-
children: arr.map(
|
|
727
|
-
|
|
699
|
+
children: arr.map((item, index) => {
|
|
700
|
+
const checked = filterValue.indexOf(item.value) !== -1;
|
|
728
701
|
return jsxs("div", Object.assign({
|
|
729
702
|
onClick: clickFilter(item),
|
|
730
703
|
className: checked ? 'filter-select-item filter-select-item-select' : 'filter-select-item'
|
|
@@ -763,30 +736,28 @@ var TableHead$1 = function TableHead(props) {
|
|
|
763
736
|
}));
|
|
764
737
|
};
|
|
765
738
|
// 表格列拖拽放下
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
changeColumnWidth && changeColumnWidth(headCell, result);
|
|
769
|
-
};
|
|
739
|
+
const onDragDown = headCell => result => {
|
|
740
|
+
changeColumnWidth && changeColumnWidth(headCell, result);
|
|
770
741
|
};
|
|
771
742
|
// 获取宽度
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
743
|
+
const getWidth = item => {
|
|
744
|
+
let w = item.width || '';
|
|
745
|
+
const name = item.name || '';
|
|
746
|
+
const wDrag = headDataConfig[name] && headDataConfig[name].width;
|
|
776
747
|
if (wDrag) w = "".concat(wDrag, "px");
|
|
777
748
|
return w;
|
|
778
749
|
};
|
|
779
750
|
// 内容列memo
|
|
780
|
-
|
|
751
|
+
const TableContentMemo = useMemo(() => {
|
|
781
752
|
// 处理过滤的class
|
|
782
|
-
|
|
783
|
-
|
|
753
|
+
const handFilterClass = item => {
|
|
754
|
+
let str = 'table-header-filter';
|
|
784
755
|
if (filterHead.name === item.name) str += ' table-header-filter-show';
|
|
785
756
|
if (item.name && selectFilterCom[item.name] && selectFilterCom[item.name].length > 0) str += ' table-header-filter-select';
|
|
786
757
|
return str;
|
|
787
758
|
};
|
|
788
|
-
|
|
789
|
-
|
|
759
|
+
const handCls = item => {
|
|
760
|
+
let str = '';
|
|
790
761
|
if (item.className) str += item.className;
|
|
791
762
|
if (fixedColumn && item.fixed) {
|
|
792
763
|
str += " table-fixed-dom-".concat(item.fixed);
|
|
@@ -801,8 +772,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
801
772
|
}
|
|
802
773
|
return str;
|
|
803
774
|
};
|
|
804
|
-
|
|
805
|
-
|
|
775
|
+
const handStyle = item => {
|
|
776
|
+
const json = {
|
|
806
777
|
width: getWidth(item)
|
|
807
778
|
};
|
|
808
779
|
if (fixedColumn && item.fixed && item.width) {
|
|
@@ -816,13 +787,13 @@ var TableHead$1 = function TableHead(props) {
|
|
|
816
787
|
return Object.assign(Object.assign({}, json), item.style);
|
|
817
788
|
};
|
|
818
789
|
// 处理拖拽
|
|
819
|
-
|
|
790
|
+
const handDrag = item => {
|
|
820
791
|
if (item.name === 'table-serial-number') return false; // 序号不拖拽
|
|
821
792
|
if (dragColumn && item.drag !== false) return true;
|
|
822
793
|
return false;
|
|
823
794
|
};
|
|
824
|
-
return headData.map(
|
|
825
|
-
|
|
795
|
+
return headData.map((headCell, index) => {
|
|
796
|
+
let str = "".concat($prefixCls, "-filter-popover ").concat($prefixCls, "-scrollbar-small");
|
|
826
797
|
if (!headCell.filterRender) str += " ".concat($prefixCls, "-filter-popover-default");
|
|
827
798
|
return jsx(ThElement, Object.assign({
|
|
828
799
|
className: handCls(headCell),
|
|
@@ -842,9 +813,7 @@ var TableHead$1 = function TableHead(props) {
|
|
|
842
813
|
content: headCell.name !== undefined && filterHead.name === headCell.name && filterPopoverContent(),
|
|
843
814
|
onVisibleChange: clickHideFilter,
|
|
844
815
|
overlayClassName: str,
|
|
845
|
-
getPopupContainer: getPopupContainer ? getPopupContainer :
|
|
846
|
-
return document.body;
|
|
847
|
-
},
|
|
816
|
+
getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body,
|
|
848
817
|
maxWidth: headCell.filterMaxWidth
|
|
849
818
|
}, {
|
|
850
819
|
children: jsxs("div", Object.assign({
|
|
@@ -889,10 +858,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
889
858
|
});
|
|
890
859
|
}, [headData, sortTable, filter, orderFieldArr, orderTypeArr, align, filterHead, selectFilterCom, beyondText, selectFilter, fixedColumn, lineWidth, dragColumn, changeColumnWidth, headDataConfig, getPopupContainer, tipMaxWidth]);
|
|
891
860
|
// 操作栏memo
|
|
892
|
-
|
|
861
|
+
const TableOperateMemo = useMemo(() => {
|
|
893
862
|
if (operate) {
|
|
894
|
-
|
|
895
|
-
|
|
863
|
+
const handCls = () => {
|
|
864
|
+
let str = 'table-operate';
|
|
896
865
|
if (operate.operateBtnRender) str += ' table-operate-small';
|
|
897
866
|
if (showColumns === false) str += ' table-operate-not-columns';
|
|
898
867
|
if (dragRow) str += ' table-operate-drag-row';
|
|
@@ -905,8 +874,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
905
874
|
}
|
|
906
875
|
return str;
|
|
907
876
|
};
|
|
908
|
-
|
|
909
|
-
|
|
877
|
+
const handStyle = () => {
|
|
878
|
+
const json = {
|
|
910
879
|
width: operate.width
|
|
911
880
|
};
|
|
912
881
|
if (fixedColumn) {
|
|
@@ -942,16 +911,16 @@ var TableHead$1 = function TableHead(props) {
|
|
|
942
911
|
}
|
|
943
912
|
}, [operate, align, posFixed, showColumns, posFixed, beyondText, fixedColumn, tipMaxWidth, dragRow]);
|
|
944
913
|
// 显示列弹窗内容
|
|
945
|
-
|
|
914
|
+
const showListContent = () => {
|
|
946
915
|
return jsxs("div", Object.assign({
|
|
947
916
|
className: "show-colums-select"
|
|
948
917
|
}, {
|
|
949
918
|
children: [jsx("div", Object.assign({
|
|
950
919
|
className: "show-colums-select-box"
|
|
951
920
|
}, {
|
|
952
|
-
children: showList.map(
|
|
953
|
-
|
|
954
|
-
|
|
921
|
+
children: showList.map((item, index) => {
|
|
922
|
+
const checked = Boolean(headDataJson[item.name]);
|
|
923
|
+
let str = 'show-colums-select-item';
|
|
955
924
|
if (checked) str += ' show-colums-select-item-select';
|
|
956
925
|
if (item.disabledSelection) str += ' show-colums-select-item-disabled';
|
|
957
926
|
return jsxs("div", Object.assign({
|
|
@@ -985,9 +954,9 @@ var TableHead$1 = function TableHead(props) {
|
|
|
985
954
|
}));
|
|
986
955
|
};
|
|
987
956
|
// 显示列memo
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
957
|
+
const TableShowList = useMemo(() => {
|
|
958
|
+
const handCls = () => {
|
|
959
|
+
let str = 'show-colums table-fixed-dom-right';
|
|
991
960
|
// 没有固定列参数 或者 没有操作栏且没有右侧固定列
|
|
992
961
|
if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
|
|
993
962
|
str += ' table-fixed-dom-right-first';
|
|
@@ -1000,9 +969,7 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1000
969
|
content: showListContent(),
|
|
1001
970
|
onVisibleChange: clickHideColums,
|
|
1002
971
|
overlayClassName: "".concat($prefixCls, "-table-show-colums-popover ").concat($prefixCls, "-scrollbar-small"),
|
|
1003
|
-
getPopupContainer: getPopupContainer ? getPopupContainer :
|
|
1004
|
-
return document.body;
|
|
1005
|
-
}
|
|
972
|
+
getPopupContainer: getPopupContainer ? getPopupContainer : () => document.body
|
|
1006
973
|
}, {
|
|
1007
974
|
children: jsx(ThElement, Object.assign({
|
|
1008
975
|
align: "center",
|
|
@@ -1019,10 +986,10 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1019
986
|
}));
|
|
1020
987
|
}, [showColumns, posFixed, operate, anchorElColums, showList, headDataJson, getPopupContainer, tipMaxWidth]);
|
|
1021
988
|
// 拖动行
|
|
1022
|
-
|
|
989
|
+
const TbaleDragRow = useMemo(() => {
|
|
1023
990
|
if (!dragRow || operate || showColumns === 'inside') return null;
|
|
1024
|
-
|
|
1025
|
-
|
|
991
|
+
const handCls = () => {
|
|
992
|
+
let str = 'drag-row table-fixed-dom-right';
|
|
1026
993
|
// 没有固定列参数 或者 没有操作栏且没有右侧固定列
|
|
1027
994
|
if (!fixedColumn || !operate && !(posFixed === null || posFixed === void 0 ? void 0 : posFixed.rightBol)) {
|
|
1028
995
|
str += ' table-fixed-dom-right-first';
|
|
@@ -1036,8 +1003,8 @@ var TableHead$1 = function TableHead(props) {
|
|
|
1036
1003
|
});
|
|
1037
1004
|
}, [operate, showColumns, fixedColumn, posFixed, dragRow]);
|
|
1038
1005
|
// 处理class
|
|
1039
|
-
|
|
1040
|
-
|
|
1006
|
+
const handClass = () => {
|
|
1007
|
+
let str = 'table-head';
|
|
1041
1008
|
if (showColumns === 'inside') str += ' table-head-inside';
|
|
1042
1009
|
if (!fixedTable) str += ' table-head-scroll'; // 防止长度过长
|
|
1043
1010
|
// 没有 复选框,单选框,展开 按钮
|
|
@@ -1115,98 +1082,74 @@ var TdElement = function TdElement(props) {
|
|
|
1115
1082
|
}));
|
|
1116
1083
|
};
|
|
1117
1084
|
|
|
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);
|
|
1085
|
+
const TableBody = props => {
|
|
1086
|
+
const {
|
|
1087
|
+
url,
|
|
1088
|
+
emptyProps,
|
|
1089
|
+
rowData = [],
|
|
1090
|
+
rowKey = 'key',
|
|
1091
|
+
check,
|
|
1092
|
+
radio,
|
|
1093
|
+
tableCell,
|
|
1094
|
+
expandable,
|
|
1095
|
+
headData = [],
|
|
1096
|
+
disabledJson = {},
|
|
1097
|
+
disabledArrStatus,
|
|
1098
|
+
checkJson = {},
|
|
1099
|
+
radioValue,
|
|
1100
|
+
selectCheck,
|
|
1101
|
+
selectRadio,
|
|
1102
|
+
align,
|
|
1103
|
+
operate,
|
|
1104
|
+
showColumns,
|
|
1105
|
+
fixedTable,
|
|
1106
|
+
fixedColumn,
|
|
1107
|
+
formatter,
|
|
1108
|
+
orderFieldArr = [],
|
|
1109
|
+
orderTypeArr = [],
|
|
1110
|
+
sortTable,
|
|
1111
|
+
loadState,
|
|
1112
|
+
loadMore,
|
|
1113
|
+
loadMoreRender,
|
|
1114
|
+
onClickMore,
|
|
1115
|
+
total,
|
|
1116
|
+
page,
|
|
1117
|
+
currentRowsPerPage,
|
|
1118
|
+
changePage,
|
|
1119
|
+
loadMoreUrl,
|
|
1120
|
+
expandMultiple = false,
|
|
1121
|
+
expandValue = [],
|
|
1122
|
+
disabledExpand = [],
|
|
1123
|
+
defaultExpandAllRows = false,
|
|
1124
|
+
onExpand,
|
|
1125
|
+
onRefresh,
|
|
1126
|
+
posFixed,
|
|
1127
|
+
beyondText,
|
|
1128
|
+
onClickRow,
|
|
1129
|
+
rowClassMapping,
|
|
1130
|
+
tipMaxWidth,
|
|
1131
|
+
lineHeight,
|
|
1132
|
+
dragRow,
|
|
1133
|
+
onDragRow
|
|
1134
|
+
} = props;
|
|
1135
|
+
const [expandableColSpan, setExpandableColSpan] = useState(0); // 嵌套表格合并列数
|
|
1136
|
+
const [expandableRow, setExpandableRow] = useState({}); // 当前哪行展开表格嵌套
|
|
1137
|
+
const [showMoreBtn, setShowMoreBtn] = useState(true); // 加载更多
|
|
1138
|
+
const [disabledExpandJson, setDisabledExpand] = useState({}); // 禁用加减部分嵌套
|
|
1139
|
+
const [dragBol, setDragBol] = useState(false);
|
|
1140
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
1198
1141
|
// 默认是否展开所有
|
|
1199
|
-
useEffect(
|
|
1142
|
+
useEffect(() => {
|
|
1200
1143
|
if (!defaultExpandAllRows) {
|
|
1201
1144
|
setExpandableRow({});
|
|
1202
1145
|
return;
|
|
1203
1146
|
}
|
|
1204
|
-
|
|
1205
|
-
for (
|
|
1206
|
-
|
|
1207
|
-
|
|
1147
|
+
const json = {};
|
|
1148
|
+
for (let i = 0, l = rowData.length; i < l; i++) {
|
|
1149
|
+
const item = rowData[i] || {};
|
|
1150
|
+
const id = item[rowKey];
|
|
1208
1151
|
json[id] = {
|
|
1209
|
-
id
|
|
1152
|
+
id,
|
|
1210
1153
|
status: 'develop'
|
|
1211
1154
|
};
|
|
1212
1155
|
}
|
|
@@ -1214,41 +1157,41 @@ var TableBody = function TableBody(props) {
|
|
|
1214
1157
|
}, [defaultExpandAllRows, rowData, rowKey]);
|
|
1215
1158
|
// 监听展开表格
|
|
1216
1159
|
// 如果直接写expandMultiple, expandValue会死循环
|
|
1217
|
-
useEffect(
|
|
1160
|
+
useEffect(() => {
|
|
1218
1161
|
if (props.expandValue === undefined) return;
|
|
1219
|
-
|
|
1220
|
-
|
|
1162
|
+
const json = {};
|
|
1163
|
+
let expandValueHand = expandValue;
|
|
1221
1164
|
// 只展开一个,去第一个值
|
|
1222
1165
|
if (!expandMultiple && expandValue.length > 0) {
|
|
1223
1166
|
expandValueHand = [expandValue[0]];
|
|
1224
1167
|
}
|
|
1225
|
-
for (
|
|
1226
|
-
|
|
1168
|
+
for (let i = 0, l = expandValueHand.length; i < l; i++) {
|
|
1169
|
+
const id = expandValueHand[i];
|
|
1227
1170
|
json[id] = {
|
|
1228
|
-
id
|
|
1171
|
+
id,
|
|
1229
1172
|
status: 'develop'
|
|
1230
1173
|
};
|
|
1231
1174
|
}
|
|
1232
1175
|
setExpandableRow(json);
|
|
1233
1176
|
}, [props.expandMultiple, props.expandValue, rowData]);
|
|
1234
1177
|
// 监听禁用嵌套 props.disabledExpand 防止死循环
|
|
1235
|
-
useEffect(
|
|
1236
|
-
|
|
1237
|
-
for (
|
|
1238
|
-
|
|
1178
|
+
useEffect(() => {
|
|
1179
|
+
const json = {};
|
|
1180
|
+
for (let i = 0, l = disabledExpand.length; i < l; i++) {
|
|
1181
|
+
const id = disabledExpand[i];
|
|
1239
1182
|
json[id] = true;
|
|
1240
1183
|
}
|
|
1241
1184
|
setDisabledExpand(json);
|
|
1242
1185
|
}, [props.disabledExpand]);
|
|
1243
|
-
useEffect(
|
|
1186
|
+
useEffect(() => {
|
|
1244
1187
|
if (loadMoreUrl) {
|
|
1245
|
-
|
|
1188
|
+
const bol = Number(total) > Number(page) * Number(currentRowsPerPage);
|
|
1246
1189
|
setShowMoreBtn(bol);
|
|
1247
1190
|
}
|
|
1248
1191
|
}, [loadMoreUrl, total, page, currentRowsPerPage]);
|
|
1249
1192
|
// 处理嵌套表格合并列数
|
|
1250
|
-
useEffect(
|
|
1251
|
-
|
|
1193
|
+
useEffect(() => {
|
|
1194
|
+
let num = headData.length;
|
|
1252
1195
|
if (expandable) num += 1;
|
|
1253
1196
|
if (check) num += 1;
|
|
1254
1197
|
if (radio) num += 1;
|
|
@@ -1257,66 +1200,97 @@ var TableBody = function TableBody(props) {
|
|
|
1257
1200
|
setExpandableColSpan(num);
|
|
1258
1201
|
}, [headData, expandable, check, radio]);
|
|
1259
1202
|
// 展开/收起嵌套表格
|
|
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();
|
|
1203
|
+
const handClickNestTable = row => event => {
|
|
1204
|
+
const id = row[rowKey];
|
|
1205
|
+
let expandItem = expandableRow[id] || {};
|
|
1206
|
+
let status = 'develop';
|
|
1207
|
+
if (expandItem.status === 'develop') status = 'retract';
|
|
1208
|
+
expandItem = {
|
|
1209
|
+
id,
|
|
1210
|
+
status
|
|
1280
1211
|
};
|
|
1212
|
+
if (expandMultiple) {
|
|
1213
|
+
// 展开多个
|
|
1214
|
+
expandableRow[id] = expandItem;
|
|
1215
|
+
setExpandableRow(Object.assign({}, expandableRow));
|
|
1216
|
+
} else {
|
|
1217
|
+
// 展开一个
|
|
1218
|
+
setExpandableRow({
|
|
1219
|
+
[id]: expandItem
|
|
1220
|
+
});
|
|
1221
|
+
}
|
|
1222
|
+
onExpand && onExpand(row, status);
|
|
1223
|
+
event.stopPropagation();
|
|
1281
1224
|
};
|
|
1282
1225
|
// 处理class
|
|
1283
|
-
|
|
1284
|
-
|
|
1226
|
+
const handClass = () => {
|
|
1227
|
+
let str = 'table-body';
|
|
1285
1228
|
if (!fixedTable) str += ' table-body-scroll';
|
|
1286
1229
|
// 没有 复选框,单选框,展开 按钮
|
|
1287
1230
|
if (!check && !radio && !expandable) str += ' table-body-no-btn';
|
|
1288
1231
|
return str;
|
|
1289
1232
|
};
|
|
1290
1233
|
// 处理嵌套表格class
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1234
|
+
const handExpandClass = row => {
|
|
1235
|
+
const id = row[rowKey];
|
|
1236
|
+
const expandItem = expandableRow[id] || {};
|
|
1237
|
+
let str = 'retract';
|
|
1295
1238
|
if (expandItem.status === 'develop') {
|
|
1296
1239
|
str = 'expand';
|
|
1297
1240
|
}
|
|
1298
1241
|
return str;
|
|
1299
1242
|
};
|
|
1300
1243
|
// 点击加载更多
|
|
1301
|
-
|
|
1244
|
+
const clickMore = () => {
|
|
1302
1245
|
if (loadMoreUrl) changePage && changePage();
|
|
1303
1246
|
onClickMore && onClickMore();
|
|
1304
1247
|
};
|
|
1305
1248
|
// 暂无数据memo
|
|
1306
|
-
|
|
1249
|
+
const NodataMemo = useMemo(() => {
|
|
1307
1250
|
// 处理刷新按钮
|
|
1308
|
-
|
|
1251
|
+
const handRefreshBtn = () => {
|
|
1309
1252
|
if ((emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh) !== undefined) {
|
|
1310
1253
|
return emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.showRefresh;
|
|
1311
1254
|
}
|
|
1312
|
-
if (url) {
|
|
1255
|
+
if (url && Number(page) <= 1) {
|
|
1313
1256
|
return true;
|
|
1314
1257
|
}
|
|
1315
1258
|
return false;
|
|
1316
1259
|
};
|
|
1260
|
+
// 处理非首页非空状态
|
|
1261
|
+
const handleDescription = () => {
|
|
1262
|
+
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.description) return emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.description;
|
|
1263
|
+
if (Number(page) > 1) {
|
|
1264
|
+
return jsxs("div", Object.assign({
|
|
1265
|
+
className: 'no-home-page-empty'
|
|
1266
|
+
}, {
|
|
1267
|
+
children: [jsx("div", Object.assign({
|
|
1268
|
+
className: 'empty-desc'
|
|
1269
|
+
}, {
|
|
1270
|
+
children: intl({
|
|
1271
|
+
id: 'noHomePageEmpty'
|
|
1272
|
+
})
|
|
1273
|
+
})), jsx("div", Object.assign({
|
|
1274
|
+
className: 'return-prev-page'
|
|
1275
|
+
}, {
|
|
1276
|
+
children: jsx(Button, Object.assign({
|
|
1277
|
+
variant: "text",
|
|
1278
|
+
size: "small",
|
|
1279
|
+
onClick: () => {
|
|
1280
|
+
changePage && changePage(Number(page) - 1);
|
|
1281
|
+
}
|
|
1282
|
+
}, {
|
|
1283
|
+
children: intl({
|
|
1284
|
+
id: 'returnPrevPage'
|
|
1285
|
+
})
|
|
1286
|
+
}))
|
|
1287
|
+
}))]
|
|
1288
|
+
}));
|
|
1289
|
+
}
|
|
1290
|
+
};
|
|
1317
1291
|
// 处理className
|
|
1318
|
-
|
|
1319
|
-
|
|
1292
|
+
const handClassNoData = () => {
|
|
1293
|
+
let str = 'table-no-data';
|
|
1320
1294
|
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
1295
|
return str;
|
|
1322
1296
|
};
|
|
@@ -1328,25 +1302,26 @@ var TableBody = function TableBody(props) {
|
|
|
1328
1302
|
colSpan: expandableColSpan
|
|
1329
1303
|
}, {
|
|
1330
1304
|
children: jsx(Empty, Object.assign({}, emptyProps, {
|
|
1305
|
+
description: handleDescription(),
|
|
1331
1306
|
showRefresh: handRefreshBtn(),
|
|
1332
|
-
onRefresh:
|
|
1307
|
+
onRefresh: event => {
|
|
1333
1308
|
if (emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh) {
|
|
1334
1309
|
emptyProps === null || emptyProps === void 0 ? void 0 : emptyProps.onRefresh(event);
|
|
1335
1310
|
return;
|
|
1336
1311
|
}
|
|
1337
|
-
|
|
1312
|
+
onRefresh && onRefresh();
|
|
1338
1313
|
}
|
|
1339
1314
|
}))
|
|
1340
1315
|
}))
|
|
1341
1316
|
}));
|
|
1342
|
-
}, [expandableColSpan, emptyProps, url,
|
|
1317
|
+
}, [expandableColSpan, emptyProps, url, onRefresh, page, changePage]);
|
|
1343
1318
|
// 复选框useCallback
|
|
1344
|
-
|
|
1319
|
+
const TableCheckCallback = useCallback(row => {
|
|
1345
1320
|
if (check) {
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1321
|
+
const handId = row[rowKey];
|
|
1322
|
+
const disabledHand = Boolean(disabledJson[handId]);
|
|
1323
|
+
let checkHand = checkJson[handId] || false;
|
|
1324
|
+
let showCheck = true;
|
|
1350
1325
|
if (disabledHand && disabledArrStatus) {
|
|
1351
1326
|
// 选中
|
|
1352
1327
|
if (disabledArrStatus[handId] === true) {
|
|
@@ -1361,8 +1336,8 @@ var TableBody = function TableBody(props) {
|
|
|
1361
1336
|
showCheck = false;
|
|
1362
1337
|
}
|
|
1363
1338
|
}
|
|
1364
|
-
|
|
1365
|
-
|
|
1339
|
+
const handCls = () => {
|
|
1340
|
+
let str = 'table-checkbox table-body-btn';
|
|
1366
1341
|
if (fixedColumn) {
|
|
1367
1342
|
str += ' table-fixed-dom-left';
|
|
1368
1343
|
// 左边没有定位,且没有单选,没有嵌套表格
|
|
@@ -1379,7 +1354,7 @@ var TableBody = function TableBody(props) {
|
|
|
1379
1354
|
children: showCheck && jsx(Checkbox, {
|
|
1380
1355
|
disabled: disabledHand,
|
|
1381
1356
|
checked: checkHand,
|
|
1382
|
-
onChange:
|
|
1357
|
+
onChange: (event, bol) => {
|
|
1383
1358
|
event.stopPropagation();
|
|
1384
1359
|
selectCheck && selectCheck(event, bol, row[rowKey]);
|
|
1385
1360
|
}
|
|
@@ -1388,12 +1363,12 @@ var TableBody = function TableBody(props) {
|
|
|
1388
1363
|
}
|
|
1389
1364
|
}, [check, disabledJson, rowKey, checkJson, selectCheck, disabledArrStatus, posFixed, expandable, radio, fixedColumn]);
|
|
1390
1365
|
// 单选框useCallback
|
|
1391
|
-
|
|
1366
|
+
const TableRadioCallback = useCallback(row => {
|
|
1392
1367
|
if (radio) {
|
|
1393
|
-
|
|
1394
|
-
|
|
1395
|
-
|
|
1396
|
-
|
|
1368
|
+
const handId = row[rowKey];
|
|
1369
|
+
const disabledHand = Boolean(disabledJson[handId]);
|
|
1370
|
+
let checkHand = radioValue === row[rowKey];
|
|
1371
|
+
let showRadio = true;
|
|
1397
1372
|
if (disabledHand && disabledArrStatus) {
|
|
1398
1373
|
// 选中
|
|
1399
1374
|
if (disabledArrStatus[handId] === true) {
|
|
@@ -1408,8 +1383,8 @@ var TableBody = function TableBody(props) {
|
|
|
1408
1383
|
showRadio = false;
|
|
1409
1384
|
}
|
|
1410
1385
|
}
|
|
1411
|
-
|
|
1412
|
-
|
|
1386
|
+
const handCls = () => {
|
|
1387
|
+
let str = 'table-radio table-body-btn';
|
|
1413
1388
|
if (fixedColumn) {
|
|
1414
1389
|
str += ' table-fixed-dom-left';
|
|
1415
1390
|
// 左边没有定位,没有嵌套表格
|
|
@@ -1426,7 +1401,7 @@ var TableBody = function TableBody(props) {
|
|
|
1426
1401
|
children: showRadio && jsx(Radio, {
|
|
1427
1402
|
disabled: disabledHand,
|
|
1428
1403
|
checked: checkHand,
|
|
1429
|
-
onChange:
|
|
1404
|
+
onChange: event => {
|
|
1430
1405
|
event.stopPropagation();
|
|
1431
1406
|
selectRadio && selectRadio(event, row[rowKey]);
|
|
1432
1407
|
}
|
|
@@ -1435,13 +1410,13 @@ var TableBody = function TableBody(props) {
|
|
|
1435
1410
|
}
|
|
1436
1411
|
}, [radio, disabledJson, radioValue, rowKey, selectRadio, disabledArrStatus, expandable, posFixed, fixedColumn]);
|
|
1437
1412
|
// 嵌套加减useCallback
|
|
1438
|
-
|
|
1413
|
+
const TableExpandableMemo = useCallback(row => {
|
|
1439
1414
|
if (!expandable) return null;
|
|
1440
|
-
|
|
1415
|
+
const expandableDemo = expandable(row);
|
|
1441
1416
|
// 禁用一行表格展开 或者 展开表格返回值为false,返回空列
|
|
1442
1417
|
if (disabledExpandJson[row[rowKey]] || expandableDemo === false) return jsx(TdElement, {});
|
|
1443
|
-
|
|
1444
|
-
|
|
1418
|
+
const handCls = () => {
|
|
1419
|
+
let str = 'table-expandable table-body-btn';
|
|
1445
1420
|
if (fixedColumn) {
|
|
1446
1421
|
str += ' table-fixed-dom-left';
|
|
1447
1422
|
// 左边没有定位,没有嵌套表格
|
|
@@ -1462,17 +1437,17 @@ var TableBody = function TableBody(props) {
|
|
|
1462
1437
|
}));
|
|
1463
1438
|
}, [expandable, expandableRow, rowKey, disabledExpandJson, onExpand, fixedColumn]);
|
|
1464
1439
|
// 表格一行内容useCallback
|
|
1465
|
-
|
|
1466
|
-
|
|
1467
|
-
orderFieldArr
|
|
1468
|
-
orderTypeArr
|
|
1440
|
+
const TableContentUseCallback = useCallback((row, rowIndex) => {
|
|
1441
|
+
const params = {
|
|
1442
|
+
orderFieldArr,
|
|
1443
|
+
orderTypeArr
|
|
1469
1444
|
};
|
|
1470
|
-
|
|
1471
|
-
|
|
1445
|
+
const handContentClass = item => {
|
|
1446
|
+
let str = 'table-content-columms';
|
|
1472
1447
|
if (item.className) str += " ".concat(item.className);
|
|
1473
1448
|
// 排序
|
|
1474
1449
|
if (sortTable && item.name && item.sort !== false) {
|
|
1475
|
-
|
|
1450
|
+
const index = orderFieldArr.indexOf(item.name);
|
|
1476
1451
|
if (index !== -1) {
|
|
1477
1452
|
// 升序
|
|
1478
1453
|
if (orderTypeArr[index] === 'asc') {
|
|
@@ -1497,8 +1472,8 @@ var TableBody = function TableBody(props) {
|
|
|
1497
1472
|
}
|
|
1498
1473
|
return str;
|
|
1499
1474
|
};
|
|
1500
|
-
|
|
1501
|
-
|
|
1475
|
+
const handStyle = item => {
|
|
1476
|
+
const json = {};
|
|
1502
1477
|
if (fixedColumn && item.fixed && item.width) {
|
|
1503
1478
|
if (item.fixed === 'left') {
|
|
1504
1479
|
json.left = "".concat(item.paraui_left_width, "px");
|
|
@@ -1509,12 +1484,12 @@ var TableBody = function TableBody(props) {
|
|
|
1509
1484
|
}
|
|
1510
1485
|
return json;
|
|
1511
1486
|
};
|
|
1512
|
-
return tableCell ? tableCell(row, params) : headData.map(
|
|
1513
|
-
|
|
1514
|
-
|
|
1487
|
+
return tableCell ? tableCell(row, params) : headData.map((item, index) => {
|
|
1488
|
+
let text = row[item.name];
|
|
1489
|
+
let colSpan = 1;
|
|
1515
1490
|
if (item.render) text = item.render(row, item, row[item.name], index, rowIndex);
|
|
1516
1491
|
if (formatter) text = formatter(row, item, row[item.name], index, rowIndex);
|
|
1517
|
-
|
|
1492
|
+
const itemStyle = handStyle(item);
|
|
1518
1493
|
// 存在显示列,最后一列占两格
|
|
1519
1494
|
if (showColumns === 'inside' && !operate && index === headData.length - 1 && !dragRow) {
|
|
1520
1495
|
colSpan = 2;
|
|
@@ -1538,25 +1513,25 @@ var TableBody = function TableBody(props) {
|
|
|
1538
1513
|
});
|
|
1539
1514
|
}, [tableCell, headData, align, formatter, orderFieldArr, orderTypeArr, sortTable, showColumns, operate, beyondText, fixedColumn, tipMaxWidth, dragRow]);
|
|
1540
1515
|
// 操作栏useCallback
|
|
1541
|
-
|
|
1516
|
+
const TableOperateUseCallback = useCallback((row, rowIndex) => {
|
|
1542
1517
|
if (operate || dragRow) {
|
|
1543
|
-
|
|
1518
|
+
let colSpan = 1;
|
|
1544
1519
|
if (showColumns === 'inside' && operate) colSpan = 2;
|
|
1545
|
-
|
|
1520
|
+
const handOperate = () => {
|
|
1546
1521
|
if (operate === null || operate === void 0 ? void 0 : operate.render) return operate.render(row);
|
|
1547
1522
|
if (operate === null || operate === void 0 ? void 0 : operate.operateBtnRender) {
|
|
1548
|
-
|
|
1523
|
+
const operateConfig = operate.operateBtnRender(row, rowIndex);
|
|
1549
1524
|
return jsx(OperateBtn, Object.assign({}, operateConfig));
|
|
1550
1525
|
}
|
|
1551
1526
|
};
|
|
1552
|
-
|
|
1553
|
-
|
|
1527
|
+
const handStyle = () => {
|
|
1528
|
+
const json = {
|
|
1554
1529
|
right: '0'
|
|
1555
1530
|
};
|
|
1556
1531
|
return json;
|
|
1557
1532
|
};
|
|
1558
|
-
|
|
1559
|
-
|
|
1533
|
+
const handCls = () => {
|
|
1534
|
+
let str = 'table-operate';
|
|
1560
1535
|
if (!operate) str += ' table-operate-center';
|
|
1561
1536
|
if (fixedColumn) {
|
|
1562
1537
|
str += ' table-fixed-dom-right';
|
|
@@ -1597,11 +1572,11 @@ var TableBody = function TableBody(props) {
|
|
|
1597
1572
|
}
|
|
1598
1573
|
}, [operate, align, showColumns, posFixed, fixedColumn, dragRow, onDragRow, dragBol]);
|
|
1599
1574
|
// 嵌套表格useCallback
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1575
|
+
const TableExpandableContentUseCallback = useCallback(row => {
|
|
1576
|
+
const id = row[rowKey];
|
|
1577
|
+
const expandItem = expandableRow[id] || {};
|
|
1603
1578
|
if (expandable && expandItem.status === 'develop') {
|
|
1604
|
-
|
|
1579
|
+
const expandableDemo = expandable(row);
|
|
1605
1580
|
if (expandableDemo === false) return null; // 展开表格返回值为false,不展示这一行
|
|
1606
1581
|
return jsx(TrElement, Object.assign({
|
|
1607
1582
|
className: "table-body-expand-row"
|
|
@@ -1616,7 +1591,7 @@ var TableBody = function TableBody(props) {
|
|
|
1616
1591
|
}
|
|
1617
1592
|
}, [expandable, expandableRow, expandableColSpan, rowKey]);
|
|
1618
1593
|
// 加载更多
|
|
1619
|
-
|
|
1594
|
+
const MoreMemo = useMemo(() => {
|
|
1620
1595
|
if (!loadMore || !showMoreBtn) return null;
|
|
1621
1596
|
return jsx(TrElement, Object.assign({
|
|
1622
1597
|
className: "more-table-row",
|
|
@@ -1639,10 +1614,10 @@ var TableBody = function TableBody(props) {
|
|
|
1639
1614
|
}))
|
|
1640
1615
|
}));
|
|
1641
1616
|
}, [expandableColSpan, loadMore, loadMoreRender, onClickMore, showMoreBtn, changePage, loadMoreUrl, lineHeight]);
|
|
1642
|
-
|
|
1617
|
+
const TableBodySubjectContentMemo = useMemo(() => {
|
|
1643
1618
|
return jsx(Fragment, {
|
|
1644
|
-
children: rowData.map(
|
|
1645
|
-
|
|
1619
|
+
children: rowData.map((row, index) => {
|
|
1620
|
+
let str = 'table-body-row';
|
|
1646
1621
|
if (rowClassMapping && rowClassMapping[row[rowKey]]) {
|
|
1647
1622
|
str += " ".concat(rowClassMapping[row[rowKey]]);
|
|
1648
1623
|
}
|
|
@@ -1652,7 +1627,7 @@ var TableBody = function TableBody(props) {
|
|
|
1652
1627
|
style: {
|
|
1653
1628
|
height: "".concat(lineHeight, "px")
|
|
1654
1629
|
},
|
|
1655
|
-
onClick:
|
|
1630
|
+
onClick: e => {
|
|
1656
1631
|
onClickRow && onClickRow(row, e);
|
|
1657
1632
|
}
|
|
1658
1633
|
}, {
|
|
@@ -1663,32 +1638,32 @@ var TableBody = function TableBody(props) {
|
|
|
1663
1638
|
});
|
|
1664
1639
|
}, [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
1640
|
// 内容memo
|
|
1666
|
-
|
|
1641
|
+
const TableBodyContentMemo = useMemo(() => {
|
|
1667
1642
|
return jsxs(Fragment$1, {
|
|
1668
1643
|
children: [TableBodySubjectContentMemo, MoreMemo]
|
|
1669
1644
|
});
|
|
1670
1645
|
}, [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
1646
|
// 处理内容
|
|
1672
|
-
|
|
1647
|
+
const handContent = () => {
|
|
1673
1648
|
// 无数据,且不再请求,显示暂无数据
|
|
1674
1649
|
if (rowData.length === 0 && !loadState) return NodataMemo;
|
|
1675
1650
|
return TableBodyContentMemo;
|
|
1676
1651
|
};
|
|
1677
|
-
|
|
1678
|
-
|
|
1652
|
+
const handleRowData = () => {
|
|
1653
|
+
const arr = [];
|
|
1679
1654
|
if (dragRow) {
|
|
1680
|
-
rowData.forEach(
|
|
1681
|
-
|
|
1655
|
+
rowData.forEach(item => {
|
|
1656
|
+
const obj = {};
|
|
1682
1657
|
obj[rowKey] = item[rowKey];
|
|
1683
1658
|
arr.push(obj);
|
|
1684
1659
|
});
|
|
1685
1660
|
}
|
|
1686
1661
|
return arr;
|
|
1687
1662
|
};
|
|
1688
|
-
|
|
1663
|
+
const onChoose = () => {
|
|
1689
1664
|
setDragBol(true);
|
|
1690
1665
|
};
|
|
1691
|
-
|
|
1666
|
+
const onDragRowCom = evt => {
|
|
1692
1667
|
setDragBol(false);
|
|
1693
1668
|
onDragRow && onDragRow(evt);
|
|
1694
1669
|
};
|
|
@@ -1704,35 +1679,29 @@ var TableBody = function TableBody(props) {
|
|
|
1704
1679
|
}));
|
|
1705
1680
|
};
|
|
1706
1681
|
|
|
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 () {
|
|
1682
|
+
const TableHead = props => {
|
|
1683
|
+
const {
|
|
1684
|
+
paginationType,
|
|
1685
|
+
flippingArrow,
|
|
1686
|
+
autoPagination,
|
|
1687
|
+
total,
|
|
1688
|
+
page,
|
|
1689
|
+
rowsPerPage,
|
|
1690
|
+
currentRowsPerPage,
|
|
1691
|
+
changePage,
|
|
1692
|
+
changeRowsPerPage,
|
|
1693
|
+
refreshInside,
|
|
1694
|
+
checkCount,
|
|
1695
|
+
onRefresh,
|
|
1696
|
+
selectAll,
|
|
1697
|
+
selectStatus,
|
|
1698
|
+
checkNumber = 0,
|
|
1699
|
+
currentPageTotal = 0
|
|
1700
|
+
} = props;
|
|
1701
|
+
const intl = useFormatMessage('Table', localeJson);
|
|
1702
|
+
const [indeterminate, setIndeterminate] = useState(false); // 半选中
|
|
1703
|
+
const [checked, setChecked] = useState(false); // 选中
|
|
1704
|
+
useEffect(() => {
|
|
1736
1705
|
// 全选
|
|
1737
1706
|
if (selectStatus === 'all') {
|
|
1738
1707
|
setChecked(true);
|
|
@@ -1754,23 +1723,23 @@ var TableHead = function TableHead(props) {
|
|
|
1754
1723
|
* @param event 操作元素
|
|
1755
1724
|
* @param bol 选中 / 不选中
|
|
1756
1725
|
*/
|
|
1757
|
-
|
|
1726
|
+
const onSelectAll = (event, bol) => {
|
|
1758
1727
|
if (selectAll) selectAll(event, bol);
|
|
1759
1728
|
};
|
|
1760
1729
|
// 改变页面
|
|
1761
|
-
|
|
1730
|
+
const changePageCom = num => {
|
|
1762
1731
|
changePage && changePage(num);
|
|
1763
1732
|
};
|
|
1764
1733
|
// 改变每页显示条数
|
|
1765
|
-
|
|
1734
|
+
const changeRowsPerPageCom = num => {
|
|
1766
1735
|
changeRowsPerPage && changeRowsPerPage(num);
|
|
1767
1736
|
};
|
|
1768
1737
|
// 刷新
|
|
1769
|
-
|
|
1738
|
+
const clickRefresh = () => {
|
|
1770
1739
|
onRefresh && onRefresh();
|
|
1771
1740
|
};
|
|
1772
1741
|
// 处理分页右侧
|
|
1773
|
-
|
|
1742
|
+
const handlePaginationRight = () => {
|
|
1774
1743
|
if (!checkCount) return null;
|
|
1775
1744
|
return jsxs("div", Object.assign({
|
|
1776
1745
|
className: 'table-pagination-right'
|
|
@@ -1793,8 +1762,8 @@ var TableHead = function TableHead(props) {
|
|
|
1793
1762
|
}));
|
|
1794
1763
|
};
|
|
1795
1764
|
// 处理样式
|
|
1796
|
-
|
|
1797
|
-
|
|
1765
|
+
const handleClass = () => {
|
|
1766
|
+
const str = 'table-pagination';
|
|
1798
1767
|
return str;
|
|
1799
1768
|
};
|
|
1800
1769
|
return jsxs("div", Object.assign({
|
|
@@ -1802,6 +1771,7 @@ var TableHead = function TableHead(props) {
|
|
|
1802
1771
|
}, {
|
|
1803
1772
|
children: [handlePaginationRight(), jsx(Pagination, {
|
|
1804
1773
|
className: 'table-pagination-com',
|
|
1774
|
+
pageMaxLimit: false,
|
|
1805
1775
|
type: paginationType,
|
|
1806
1776
|
autoType: autoPagination,
|
|
1807
1777
|
flippingArrow: flippingArrow,
|
|
@@ -1811,9 +1781,7 @@ var TableHead = function TableHead(props) {
|
|
|
1811
1781
|
currentRowsPerPage: currentRowsPerPage,
|
|
1812
1782
|
changePage: changePageCom,
|
|
1813
1783
|
changeRowsPerPage: changeRowsPerPageCom,
|
|
1814
|
-
getPopupContainer:
|
|
1815
|
-
return document.body;
|
|
1816
|
-
}
|
|
1784
|
+
getPopupContainer: () => document.body
|
|
1817
1785
|
}), refreshInside && jsx(Button.IconButton, Object.assign({
|
|
1818
1786
|
className: 'refresh-btn',
|
|
1819
1787
|
variant: "outlined",
|
|
@@ -1827,14 +1795,16 @@ var TableHead = function TableHead(props) {
|
|
|
1827
1795
|
var css_248z$2 = ".table-container {\n overflow-x: auto;\n}";
|
|
1828
1796
|
styleInject(css_248z$2);
|
|
1829
1797
|
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1798
|
+
const TableContainer = props => {
|
|
1799
|
+
const {
|
|
1800
|
+
cRef,
|
|
1801
|
+
className,
|
|
1802
|
+
style,
|
|
1803
|
+
children
|
|
1804
|
+
} = props,
|
|
1835
1805
|
otherProps = __rest(props, ["cRef", "className", "style", "children"]);
|
|
1836
|
-
|
|
1837
|
-
|
|
1806
|
+
const handClass = () => {
|
|
1807
|
+
let str = 'table-container';
|
|
1838
1808
|
if (className) str += " ".concat(className);
|
|
1839
1809
|
return str;
|
|
1840
1810
|
};
|
|
@@ -1850,14 +1820,16 @@ var TableContainer = function TableContainer(props) {
|
|
|
1850
1820
|
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
1821
|
styleInject(css_248z$1);
|
|
1852
1822
|
|
|
1853
|
-
|
|
1854
|
-
|
|
1855
|
-
|
|
1856
|
-
|
|
1857
|
-
|
|
1823
|
+
const TableElement = props => {
|
|
1824
|
+
const {
|
|
1825
|
+
className,
|
|
1826
|
+
style,
|
|
1827
|
+
fixedColumn,
|
|
1828
|
+
children
|
|
1829
|
+
} = props,
|
|
1858
1830
|
otherProps = __rest(props, ["className", "style", "fixedColumn", "children"]);
|
|
1859
|
-
|
|
1860
|
-
|
|
1831
|
+
const handClass = () => {
|
|
1832
|
+
let str = 'table-element';
|
|
1861
1833
|
if (fixedColumn) str += ' table-element-fixed-column';
|
|
1862
1834
|
if (className) str += " ".concat(className);
|
|
1863
1835
|
return str;
|
|
@@ -2738,8 +2710,8 @@ const Table = propsInit => {
|
|
|
2738
2710
|
/**
|
|
2739
2711
|
* 加载更多,点击改变分页
|
|
2740
2712
|
*/
|
|
2741
|
-
const changePageMore =
|
|
2742
|
-
const pageHnad = Number(pageCom) + 1;
|
|
2713
|
+
const changePageMore = num => {
|
|
2714
|
+
const pageHnad = num ? num : Number(pageCom) + 1;
|
|
2743
2715
|
handPage(pageHnad);
|
|
2744
2716
|
};
|
|
2745
2717
|
/**
|