ztxkui 4.2.23-13 → 4.2.23-15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/DemoCom/PrintContainerDemo.js +27 -25
- package/dist/UI/Table/EditTable.js +17 -3
- package/dist/components/PrintContainer/print-container.js +4 -1
- package/dist/components/ProTable/hooks.d.ts +1 -1
- package/dist/components/ProTable/hooks.js +56 -20
- package/dist/components/ProTable/index.js +2 -2
- package/dist/components/ProTable/interface.d.ts +16 -4
- package/package.json +2 -3
- package/dist/UI/Table/ProEditTable/hooks.d.ts +0 -18
- package/dist/UI/Table/ProEditTable/hooks.js +0 -184
- package/dist/UI/Table/ProEditTable/index.d.ts +0 -8
- package/dist/UI/Table/ProEditTable/index.js +0 -67
- package/dist/UI/Table/ProEditTable/interface.d.ts +0 -31
- package/dist/UI/Table/ProEditTable/interface.js +0 -1
|
@@ -39,31 +39,33 @@ import { createDownloadUrl } from 'ztxkutils/dist/fileOperation';
|
|
|
39
39
|
import './print.scss';
|
|
40
40
|
import { token } from '../constants';
|
|
41
41
|
import imgSrc from '../assets/img/logo002.jpg';
|
|
42
|
-
import imgSrc1 from './e07149cd42bdc328ced1cabf152c76d.png';
|
|
43
|
-
function test() {
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
42
|
+
// import imgSrc1 from './e07149cd42bdc328ced1cabf152c76d.png';
|
|
43
|
+
// function test() {
|
|
44
|
+
// const image = new Image();
|
|
45
|
+
// image.setAttribute('crossOrigin', 'anonymous');
|
|
46
|
+
// image.src = imgSrc1;
|
|
47
|
+
// image.onload = () => {
|
|
48
|
+
// const canvas = document.createElement('canvas');
|
|
49
|
+
// canvas.width = image.width;
|
|
50
|
+
// canvas.height = image.height;
|
|
51
|
+
// const ctx = canvas.getContext('2d');
|
|
52
|
+
// ctx?.drawImage(image, 0, 0, image.width, image.height);
|
|
53
|
+
// const dataURL = canvas.toDataURL('image/png');
|
|
54
|
+
// const imgDom = document.createElement('img');
|
|
55
|
+
// imgDom.src = dataURL;
|
|
56
|
+
// imgDom.style.width = '156px';
|
|
57
|
+
// imgDom.style.height = '156px';
|
|
58
|
+
// imgDom.style.bottom = `20px`;
|
|
59
|
+
// imgDom.style.right = `${1 * 156 + 166}px`;
|
|
60
|
+
// imgDom.classList.add('seal-img-position');
|
|
61
|
+
// const allDom = document.getElementsByClassName(
|
|
62
|
+
// 'html2canvas-container-page'
|
|
63
|
+
// )[0];
|
|
64
|
+
// const copyDom = imgDom.cloneNode(true);
|
|
65
|
+
// allDom.appendChild(copyDom);
|
|
66
|
+
// };
|
|
67
|
+
// }
|
|
68
|
+
// test();
|
|
67
69
|
function request(options) {
|
|
68
70
|
var headers = options.headers, restOptions = __rest(options, ["headers"]);
|
|
69
71
|
return axios(__assign({ baseURL: options.baseURL ? options.baseURL : 'http://192.168.0.83:8000', url: options.url, headers: __assign({ 'Zmdms-Auth': "bearer " + token }, options.headers), method: options.method, data: options.data, params: options.params }, restOptions));
|
|
@@ -34,10 +34,21 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
|
|
|
34
34
|
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
|
|
35
35
|
}
|
|
36
36
|
};
|
|
37
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
38
|
+
var t = {};
|
|
39
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
40
|
+
t[p] = s[p];
|
|
41
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
42
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
43
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
44
|
+
t[p[i]] = s[p[i]];
|
|
45
|
+
}
|
|
46
|
+
return t;
|
|
47
|
+
};
|
|
37
48
|
// 带编辑属性的表格使用
|
|
38
49
|
import { useState, useEffect, useCallback, useRef } from 'react';
|
|
39
50
|
import { data2 } from './data';
|
|
40
|
-
import ProEditTable from '
|
|
51
|
+
import ProEditTable from 'components/ProTable';
|
|
41
52
|
import { Button, message, EnhanceSelect } from '../../index';
|
|
42
53
|
// 表格列配置相关逻辑
|
|
43
54
|
// 可以把columns定义成常量再最外面,或者state
|
|
@@ -186,7 +197,7 @@ export default function EditTable() {
|
|
|
186
197
|
setNum(2);
|
|
187
198
|
}, []);
|
|
188
199
|
// 触发onChange事件
|
|
189
|
-
var onChange = useCallback(function (dataSource) {
|
|
200
|
+
var onChange = useCallback(function (dataSource, info) {
|
|
190
201
|
setData(dataSource);
|
|
191
202
|
}, [setData]);
|
|
192
203
|
return (React.createElement("div", null,
|
|
@@ -229,7 +240,10 @@ export default function EditTable() {
|
|
|
229
240
|
// 是否开启增减行
|
|
230
241
|
showDelIcon: true, showAddIcon: true,
|
|
231
242
|
// 增加数据的规则 是增加空白行 还是 复制一行
|
|
232
|
-
addDataMode: "blank",
|
|
243
|
+
addDataMode: "blank", addDataReturnRecord: useCallback(function (record) {
|
|
244
|
+
var id = record.id, resetRecord = __rest(record, ["id"]);
|
|
245
|
+
return resetRecord;
|
|
246
|
+
}, []),
|
|
233
247
|
// 是否记录列宽,但是又不要显示那个按钮
|
|
234
248
|
showColumnDynamic: true, showColumnDynamicKey: "single-110011", hiddenColumnDynamicIcon: true,
|
|
235
249
|
// 开启内部分页
|
|
@@ -250,14 +250,16 @@ var PrintContainer = function (_a) {
|
|
|
250
250
|
useEffect(function () {
|
|
251
251
|
if (defaultAddWater) {
|
|
252
252
|
addWaterHandle({
|
|
253
|
+
waterText: waterText,
|
|
253
254
|
waterClassName: ['.html2canvas-container-page'],
|
|
254
255
|
});
|
|
255
256
|
setShowWater(true);
|
|
256
257
|
}
|
|
257
|
-
}, [defaultAddWater]);
|
|
258
|
+
}, [defaultAddWater, waterText]);
|
|
258
259
|
var onWaterHandle = function () {
|
|
259
260
|
if (!showWater) {
|
|
260
261
|
addWaterHandle({
|
|
262
|
+
waterText: waterText,
|
|
261
263
|
waterClassName: ['.html2canvas-container-page'],
|
|
262
264
|
});
|
|
263
265
|
setShowWater(true);
|
|
@@ -590,6 +592,7 @@ var PrintContainer = function (_a) {
|
|
|
590
592
|
isShowPage: isAddExportPage,
|
|
591
593
|
pdfOptions: __assign({}, (pdfOptions || {})),
|
|
592
594
|
imgPositionX: imgPositionX,
|
|
595
|
+
waterText: waterText,
|
|
593
596
|
})
|
|
594
597
|
.then(function () {
|
|
595
598
|
setSpinning(false);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare function useDataSourceRef<D>(dataSource: D[]): import("react").MutableRefObject<D[]>;
|
|
3
|
-
export declare function useAddAndDelRow(showAddIcon: any, showDelIcon: any, dataSourceRef: any, addDataMode: any, onChange: any, rowKey: any, refreshScuCell: any): {
|
|
3
|
+
export declare function useAddAndDelRow(showAddIcon: any, showDelIcon: any, dataSourceRef: any, addDataMode: any, addDataReturnRecord: any, onChange: any, rowKey: any, refreshScuCell: any): {
|
|
4
4
|
needAddAndDel: any;
|
|
5
5
|
onAddAndDelHandle: (type: 'add' | 'del', index: number) => void;
|
|
6
6
|
};
|
|
@@ -25,7 +25,7 @@ export function useDataSourceRef(dataSource) {
|
|
|
25
25
|
return dataSourceRef;
|
|
26
26
|
}
|
|
27
27
|
// 加减行相关
|
|
28
|
-
export function useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addDataMode, onChange, rowKey, refreshScuCell) {
|
|
28
|
+
export function useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addDataMode, addDataReturnRecord, onChange, rowKey, refreshScuCell) {
|
|
29
29
|
var needAddAndDel = useMemo(function () {
|
|
30
30
|
return showAddIcon || showDelIcon;
|
|
31
31
|
}, [showAddIcon, showDelIcon]);
|
|
@@ -33,25 +33,29 @@ export function useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addData
|
|
|
33
33
|
var onAddAndDelHandle = useCallback(function (type, index) {
|
|
34
34
|
var _a, _b;
|
|
35
35
|
if (typeof addDataMode === 'function') {
|
|
36
|
-
var newDataSource_1 = addDataMode(index, dataSourceRef.current);
|
|
36
|
+
var newDataSource_1 = addDataMode(index, dataSourceRef.current, type);
|
|
37
37
|
refreshScuCell();
|
|
38
|
-
onChange &&
|
|
38
|
+
onChange &&
|
|
39
|
+
onChange(newDataSource_1, {
|
|
40
|
+
currentIndex: index,
|
|
41
|
+
type: type,
|
|
42
|
+
});
|
|
39
43
|
return;
|
|
40
44
|
}
|
|
41
45
|
var newDataSource = __spreadArray([], dataSourceRef.current);
|
|
42
46
|
var newRecord = {};
|
|
43
47
|
if (type === 'add') {
|
|
48
|
+
var currentRecord = newDataSource[index];
|
|
49
|
+
var outsideRecord = addDataReturnRecord
|
|
50
|
+
? addDataReturnRecord(currentRecord)
|
|
51
|
+
: {};
|
|
44
52
|
if (addDataMode === 'blank') {
|
|
45
53
|
// 生成一条空白数据
|
|
46
|
-
newRecord = (_a = {},
|
|
47
|
-
_a[rowKey] = Date.now() + "-" + index,
|
|
48
|
-
_a.__INNER__ADD__DATA = true,
|
|
49
|
-
_a);
|
|
54
|
+
newRecord = __assign((_a = {}, _a[rowKey] = Date.now() + "-" + index, _a.__INNER__ADD__DATA = true, _a), outsideRecord);
|
|
50
55
|
}
|
|
51
56
|
else {
|
|
52
57
|
// 复制当前这条数据
|
|
53
|
-
|
|
54
|
-
newRecord = __assign(__assign({}, currentRecord), (_b = {}, _b[rowKey] = Date.now() + "-" + index, _b.__INNER__ADD__DATA = true, _b));
|
|
58
|
+
newRecord = __assign(__assign(__assign({}, currentRecord), (_b = {}, _b[rowKey] = Date.now() + "-" + index, _b.__INNER__ADD__DATA = true, _b)), outsideRecord);
|
|
55
59
|
}
|
|
56
60
|
newDataSource.splice(index + 1, 0, newRecord);
|
|
57
61
|
}
|
|
@@ -59,8 +63,19 @@ export function useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addData
|
|
|
59
63
|
newDataSource.splice(index, 1);
|
|
60
64
|
}
|
|
61
65
|
refreshScuCell();
|
|
62
|
-
onChange &&
|
|
63
|
-
|
|
66
|
+
onChange &&
|
|
67
|
+
onChange(newDataSource, {
|
|
68
|
+
currentIndex: index,
|
|
69
|
+
type: type,
|
|
70
|
+
});
|
|
71
|
+
}, [
|
|
72
|
+
addDataMode,
|
|
73
|
+
onChange,
|
|
74
|
+
dataSourceRef,
|
|
75
|
+
rowKey,
|
|
76
|
+
refreshScuCell,
|
|
77
|
+
addDataReturnRecord,
|
|
78
|
+
]);
|
|
64
79
|
return {
|
|
65
80
|
needAddAndDel: needAddAndDel,
|
|
66
81
|
onAddAndDelHandle: onAddAndDelHandle,
|
|
@@ -78,7 +93,12 @@ export function useMoveRow(onChange, dataSourceRef, refreshScuCell) {
|
|
|
78
93
|
],
|
|
79
94
|
});
|
|
80
95
|
refreshScuCell();
|
|
81
|
-
onChange &&
|
|
96
|
+
onChange &&
|
|
97
|
+
onChange(newDataSource, {
|
|
98
|
+
currentIndex: dragIndex,
|
|
99
|
+
targetIndex: hoverIndex,
|
|
100
|
+
type: 'move',
|
|
101
|
+
});
|
|
82
102
|
}, [onChange, dataSourceRef, refreshScuCell]);
|
|
83
103
|
return onMoveRowHandle;
|
|
84
104
|
}
|
|
@@ -100,21 +120,25 @@ export function useEditRow(onChange, dataSourceRef, innerTableHandleRef, _a) {
|
|
|
100
120
|
var _b, _c, _d, _e;
|
|
101
121
|
if (_dataIndex === void 0) { _dataIndex = ''; }
|
|
102
122
|
if (typeof index === 'number') {
|
|
123
|
+
// TODO:帮助找到真实的index,如果开启内部分页 需要这么做
|
|
124
|
+
var realyIndex = (_c = (_b = innerTableHandleRef.current) === null || _b === void 0 ? void 0 : _b.getRealyIndex) === null || _c === void 0 ? void 0 : _c.call(_b, index);
|
|
103
125
|
var newDataSource = __spreadArray([], dataSourceRef.current);
|
|
104
|
-
var oldRecord = newDataSource[
|
|
126
|
+
var oldRecord = newDataSource[realyIndex];
|
|
105
127
|
// 如果新的record里面的值 老的Record里面有 那么不需要触发onChange
|
|
106
128
|
// 这里主要是为了优化物料组件带来的多次rerender导致的一些问题
|
|
107
129
|
if (objIsEqual(record, oldRecord)) {
|
|
108
130
|
return;
|
|
109
131
|
}
|
|
110
132
|
// TODO:清楚错误样式
|
|
111
|
-
(
|
|
112
|
-
// TODO:帮助找到真实的index,如果开启内部分页 需要这么做
|
|
113
|
-
var realyIndex = (_e = (_d = innerTableHandleRef.current) === null || _d === void 0 ? void 0 : _d.getRealyIndex) === null || _e === void 0 ? void 0 : _e.call(_d, index);
|
|
133
|
+
(_e = (_d = innerTableHandleRef === null || innerTableHandleRef === void 0 ? void 0 : innerTableHandleRef.current) === null || _d === void 0 ? void 0 : _d.clearErrorClass) === null || _e === void 0 ? void 0 : _e.call(_d, index);
|
|
114
134
|
var newRecord = _dataIndex
|
|
115
135
|
? __assign(__assign(__assign({}, record), oldRecord), (_a = {}, _a[_dataIndex] = record[_dataIndex], _a)) : __assign(__assign({}, oldRecord), record);
|
|
116
136
|
newDataSource.splice(realyIndex, 1, newRecord);
|
|
117
|
-
onChange &&
|
|
137
|
+
onChange &&
|
|
138
|
+
onChange(newDataSource, {
|
|
139
|
+
currentIndex: realyIndex,
|
|
140
|
+
type: 'edit',
|
|
141
|
+
});
|
|
118
142
|
}
|
|
119
143
|
}, [dataSourceRef, onChange, innerTableHandleRef]);
|
|
120
144
|
var onBatchPasteHandle = useCallback(function (records, startIndex) {
|
|
@@ -122,7 +146,11 @@ export function useEditRow(onChange, dataSourceRef, innerTableHandleRef, _a) {
|
|
|
122
146
|
return;
|
|
123
147
|
}
|
|
124
148
|
// 前置处理
|
|
125
|
-
var pasteRecords = onBatchPastePre
|
|
149
|
+
var pasteRecords = onBatchPastePre
|
|
150
|
+
? onBatchPastePre(records, {
|
|
151
|
+
currentIndex: startIndex,
|
|
152
|
+
})
|
|
153
|
+
: records;
|
|
126
154
|
// 计算结束位置
|
|
127
155
|
var endIndex = startIndex + pasteRecords.length - 1;
|
|
128
156
|
var currentRecords = Array.isArray(dataSourceRef.current)
|
|
@@ -143,10 +171,18 @@ export function useEditRow(onChange, dataSourceRef, innerTableHandleRef, _a) {
|
|
|
143
171
|
});
|
|
144
172
|
// 后置处理
|
|
145
173
|
var newDataSource = onBatchPastePost
|
|
146
|
-
? onBatchPastePost(dataSource
|
|
174
|
+
? onBatchPastePost(dataSource, {
|
|
175
|
+
currentIndex: startIndex,
|
|
176
|
+
endIndex: endIndex,
|
|
177
|
+
})
|
|
147
178
|
: dataSource;
|
|
148
179
|
// 触发onChange事件
|
|
149
|
-
onChange &&
|
|
180
|
+
onChange &&
|
|
181
|
+
onChange(newDataSource, {
|
|
182
|
+
currentIndex: startIndex,
|
|
183
|
+
endIndex: endIndex,
|
|
184
|
+
type: 'paste',
|
|
185
|
+
});
|
|
150
186
|
}, [dataSourceRef, onChange, onBatchPastePre, onBatchPastePost]);
|
|
151
187
|
return {
|
|
152
188
|
onEditableSaveHandle: onEditableSaveHandle,
|
|
@@ -27,7 +27,7 @@ import React, { memo, useRef, useImperativeHandle } from 'react';
|
|
|
27
27
|
import { Table } from '../../index';
|
|
28
28
|
import { useDataSourceRef, useAddAndDelRow, useScuRfresh, useMoveRow, useEditRow, } from './hooks';
|
|
29
29
|
function ProEditTable(props) {
|
|
30
|
-
var rowKey = props.rowKey, dataSource = props.dataSource, columns = props.columns, onChange = props.onChange, showAddIcon = props.showAddIcon, showDelIcon = props.showDelIcon, _a = props.addDataMode, addDataMode = _a === void 0 ? 'blank' : _a, isMove = props.isMove, isEdit = props.isEdit, isPaste = props.isPaste, tableHandleRef = props.tableHandleRef, onBatchPastePre = props.onBatchPastePre, onBatchPastePost = props.onBatchPastePost, restProps = __rest(props, ["rowKey", "dataSource", "columns", "onChange", "showAddIcon", "showDelIcon", "addDataMode", "isMove", "isEdit", "isPaste", "tableHandleRef", "onBatchPastePre", "onBatchPastePost"]);
|
|
30
|
+
var rowKey = props.rowKey, dataSource = props.dataSource, columns = props.columns, onChange = props.onChange, showAddIcon = props.showAddIcon, showDelIcon = props.showDelIcon, _a = props.addDataMode, addDataMode = _a === void 0 ? 'blank' : _a, addDataReturnRecord = props.addDataReturnRecord, isMove = props.isMove, isEdit = props.isEdit, isPaste = props.isPaste, tableHandleRef = props.tableHandleRef, onBatchPastePre = props.onBatchPastePre, onBatchPastePost = props.onBatchPastePost, restProps = __rest(props, ["rowKey", "dataSource", "columns", "onChange", "showAddIcon", "showDelIcon", "addDataMode", "addDataReturnRecord", "isMove", "isEdit", "isPaste", "tableHandleRef", "onBatchPastePre", "onBatchPastePost"]);
|
|
31
31
|
var innerTableHandleRef = useRef();
|
|
32
32
|
var tableColumns = columns.map(function (item) {
|
|
33
33
|
if (item.shouldCellUpdate) {
|
|
@@ -46,7 +46,7 @@ function ProEditTable(props) {
|
|
|
46
46
|
// SCU逻辑
|
|
47
47
|
var _b = useScuRfresh(), refreshScuCell = _b.refreshScuCell, getRefreshScuCell = _b.getRefreshScuCell;
|
|
48
48
|
// 增减行相关hook
|
|
49
|
-
var _c = useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addDataMode, onChange, rowKey, refreshScuCell), needAddAndDel = _c.needAddAndDel, onAddAndDelHandle = _c.onAddAndDelHandle;
|
|
49
|
+
var _c = useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addDataMode, addDataReturnRecord, onChange, rowKey, refreshScuCell), needAddAndDel = _c.needAddAndDel, onAddAndDelHandle = _c.onAddAndDelHandle;
|
|
50
50
|
// 拖拽行相关hook
|
|
51
51
|
var onMoveRowHandle = useMoveRow(onChange, dataSourceRef, refreshScuCell);
|
|
52
52
|
// 修改行相关hook
|
|
@@ -5,18 +5,30 @@ export interface IProps<RecordType> extends Omit<TableIProps<RecordType>, 'colum
|
|
|
5
5
|
dataSource: any[];
|
|
6
6
|
columns: ColumnsType<any>;
|
|
7
7
|
rowKey: string;
|
|
8
|
-
onChange?: (dataSource: any[]
|
|
8
|
+
onChange?: (dataSource: any[], info?: {
|
|
9
|
+
currentIndex: number;
|
|
10
|
+
endIndex?: number;
|
|
11
|
+
targetIndex?: number;
|
|
12
|
+
type?: string;
|
|
13
|
+
}) => void;
|
|
9
14
|
showAddIcon?: boolean;
|
|
10
15
|
showDelIcon?: boolean;
|
|
11
16
|
/**
|
|
12
17
|
* 增加数据的模式 blank add空白数据; copy add复制数据; 自定义增加
|
|
13
18
|
*/
|
|
14
|
-
addDataMode?: 'blank' | 'copy' | ((index: number, dataSource: any[]) => any[]);
|
|
19
|
+
addDataMode?: 'blank' | 'copy' | ((index: number, dataSource: any[], type: string) => any[]);
|
|
20
|
+
addDataReturnRecord?: (record: any) => any;
|
|
15
21
|
isMove?: boolean;
|
|
16
22
|
isEdit?: boolean;
|
|
17
23
|
isPaste?: boolean;
|
|
18
|
-
onBatchPastePre?: (data: any[]
|
|
19
|
-
|
|
24
|
+
onBatchPastePre?: (data: any[], info?: {
|
|
25
|
+
currentIndex: number;
|
|
26
|
+
endIndex?: number;
|
|
27
|
+
}) => any[];
|
|
28
|
+
onBatchPastePost?: (data: any[], info?: {
|
|
29
|
+
currentIndex: number;
|
|
30
|
+
endIndex?: number;
|
|
31
|
+
}) => any[];
|
|
20
32
|
tableHandleRef?: React.Ref<{
|
|
21
33
|
validate: () => Promise<any>;
|
|
22
34
|
clearErrorClass: (index: number) => void;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "ztxkui",
|
|
3
|
-
"version": "4.2.23-
|
|
3
|
+
"version": "4.2.23-15",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "React components library",
|
|
6
6
|
"author": "zt-front-end",
|
|
@@ -23,8 +23,7 @@
|
|
|
23
23
|
"react-dnd-html5-backend": "^14.0.0",
|
|
24
24
|
"react-infinite-scroll-component": "^6.1.0",
|
|
25
25
|
"react-resizable": "^3.0.4",
|
|
26
|
-
"react-to-print": "^2.14.7"
|
|
27
|
-
"ztxkutils": "^2.10.18"
|
|
26
|
+
"react-to-print": "^2.14.7"
|
|
28
27
|
},
|
|
29
28
|
"scripts": {
|
|
30
29
|
"analyze": "source-map-explorer 'dist/static/js/*.js'",
|
|
@@ -1,18 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
export declare function useDataSourceRef<D>(dataSource: D[]): import("react").MutableRefObject<D[]>;
|
|
3
|
-
export declare function useAddAndDelRow(showAddIcon: any, showDelIcon: any, dataSourceRef: any, addDataMode: any, onChange: any, rowKey: any, refreshScuCell: any): {
|
|
4
|
-
needAddAndDel: any;
|
|
5
|
-
onAddAndDelHandle: (type: 'add' | 'del', index: number) => void;
|
|
6
|
-
};
|
|
7
|
-
export declare function useMoveRow(onChange: any, dataSourceRef: any, refreshScuCell: any): (dragIndex: number, hoverIndex: number) => void;
|
|
8
|
-
export declare function useEditRow(onChange: any, dataSourceRef: any, innerTableHandleRef: any, { onBatchPastePre, onBatchPastePost }: {
|
|
9
|
-
onBatchPastePre: any;
|
|
10
|
-
onBatchPastePost: any;
|
|
11
|
-
}): {
|
|
12
|
-
onEditableSaveHandle: (record: any, index: number | undefined, _dataIndex?: string) => void;
|
|
13
|
-
onBatchPasteHandle: (records: any, startIndex: any) => void;
|
|
14
|
-
};
|
|
15
|
-
export declare function useScuRfresh(): {
|
|
16
|
-
refreshScuCell: () => void;
|
|
17
|
-
getRefreshScuCell: () => boolean;
|
|
18
|
-
};
|
|
@@ -1,184 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __spreadArray = (this && this.__spreadArray) || function (to, from) {
|
|
13
|
-
for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
|
|
14
|
-
to[j] = from[i];
|
|
15
|
-
return to;
|
|
16
|
-
};
|
|
17
|
-
import { useRef, useEffect, useMemo, useCallback } from 'react';
|
|
18
|
-
import update from 'immutability-helper';
|
|
19
|
-
// 设置数据源临时Ref对象
|
|
20
|
-
export function useDataSourceRef(dataSource) {
|
|
21
|
-
var dataSourceRef = useRef(dataSource);
|
|
22
|
-
useEffect(function () {
|
|
23
|
-
dataSourceRef.current = dataSource;
|
|
24
|
-
}, [dataSource]);
|
|
25
|
-
return dataSourceRef;
|
|
26
|
-
}
|
|
27
|
-
// 加减行相关
|
|
28
|
-
export function useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addDataMode, onChange, rowKey, refreshScuCell) {
|
|
29
|
-
var needAddAndDel = useMemo(function () {
|
|
30
|
-
return showAddIcon || showDelIcon;
|
|
31
|
-
}, [showAddIcon, showDelIcon]);
|
|
32
|
-
// 增减行回调
|
|
33
|
-
var onAddAndDelHandle = useCallback(function (type, index) {
|
|
34
|
-
var _a, _b;
|
|
35
|
-
if (typeof addDataMode === 'function') {
|
|
36
|
-
var newDataSource_1 = addDataMode(index, dataSourceRef.current);
|
|
37
|
-
refreshScuCell();
|
|
38
|
-
onChange && onChange(newDataSource_1);
|
|
39
|
-
return;
|
|
40
|
-
}
|
|
41
|
-
var newDataSource = __spreadArray([], dataSourceRef.current);
|
|
42
|
-
var newRecord = {};
|
|
43
|
-
if (type === 'add') {
|
|
44
|
-
if (addDataMode === 'blank') {
|
|
45
|
-
// 生成一条空白数据
|
|
46
|
-
newRecord = (_a = {},
|
|
47
|
-
_a[rowKey] = Date.now() + "-" + index,
|
|
48
|
-
_a.__INNER__ADD__DATA = true,
|
|
49
|
-
_a);
|
|
50
|
-
}
|
|
51
|
-
else {
|
|
52
|
-
// 复制当前这条数据
|
|
53
|
-
var currentRecord = newDataSource[index];
|
|
54
|
-
newRecord = __assign(__assign({}, currentRecord), (_b = {}, _b[rowKey] = Date.now() + "-" + index, _b.__INNER__ADD__DATA = true, _b));
|
|
55
|
-
}
|
|
56
|
-
newDataSource.splice(index + 1, 0, newRecord);
|
|
57
|
-
}
|
|
58
|
-
else {
|
|
59
|
-
newDataSource.splice(index, 1);
|
|
60
|
-
}
|
|
61
|
-
refreshScuCell();
|
|
62
|
-
onChange && onChange(newDataSource);
|
|
63
|
-
}, [addDataMode, onChange, dataSourceRef, rowKey, refreshScuCell]);
|
|
64
|
-
return {
|
|
65
|
-
needAddAndDel: needAddAndDel,
|
|
66
|
-
onAddAndDelHandle: onAddAndDelHandle,
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
// 拖拽行相关
|
|
70
|
-
export function useMoveRow(onChange, dataSourceRef, refreshScuCell) {
|
|
71
|
-
var onMoveRowHandle = useCallback(function (dragIndex, hoverIndex) {
|
|
72
|
-
var copyDataSource = __spreadArray([], dataSourceRef.current);
|
|
73
|
-
var dragRow = copyDataSource[dragIndex];
|
|
74
|
-
var newDataSource = update(copyDataSource, {
|
|
75
|
-
$splice: [
|
|
76
|
-
[dragIndex, 1],
|
|
77
|
-
[hoverIndex, 0, dragRow],
|
|
78
|
-
],
|
|
79
|
-
});
|
|
80
|
-
refreshScuCell();
|
|
81
|
-
onChange && onChange(newDataSource);
|
|
82
|
-
}, [onChange, dataSourceRef, refreshScuCell]);
|
|
83
|
-
return onMoveRowHandle;
|
|
84
|
-
}
|
|
85
|
-
// 编辑行相关
|
|
86
|
-
function objIsEqual(newObj, oldObj) {
|
|
87
|
-
var keys = Object.keys(newObj);
|
|
88
|
-
for (var i = 0; i < keys.length; i++) {
|
|
89
|
-
var key = keys[i];
|
|
90
|
-
if (oldObj[key] !== newObj[key]) {
|
|
91
|
-
return false;
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
return true;
|
|
95
|
-
}
|
|
96
|
-
export function useEditRow(onChange, dataSourceRef, innerTableHandleRef, _a) {
|
|
97
|
-
var onBatchPastePre = _a.onBatchPastePre, onBatchPastePost = _a.onBatchPastePost;
|
|
98
|
-
var onEditableSaveHandle = useCallback(function (record, index, _dataIndex) {
|
|
99
|
-
var _a;
|
|
100
|
-
var _b, _c, _d, _e;
|
|
101
|
-
if (_dataIndex === void 0) { _dataIndex = ''; }
|
|
102
|
-
if (typeof index === 'number') {
|
|
103
|
-
var newDataSource = __spreadArray([], dataSourceRef.current);
|
|
104
|
-
var oldRecord = newDataSource[index];
|
|
105
|
-
// 如果新的record里面的值 老的Record里面有 那么不需要触发onChange
|
|
106
|
-
// 这里主要是为了优化物料组件带来的多次rerender导致的一些问题
|
|
107
|
-
if (objIsEqual(record, oldRecord)) {
|
|
108
|
-
return;
|
|
109
|
-
}
|
|
110
|
-
// TODO:清楚错误样式
|
|
111
|
-
(_c = (_b = innerTableHandleRef === null || innerTableHandleRef === void 0 ? void 0 : innerTableHandleRef.current) === null || _b === void 0 ? void 0 : _b.clearErrorClass) === null || _c === void 0 ? void 0 : _c.call(_b, index);
|
|
112
|
-
// TODO:帮助找到真实的index,如果开启内部分页 需要这么做
|
|
113
|
-
var realyIndex = (_e = (_d = innerTableHandleRef.current) === null || _d === void 0 ? void 0 : _d.getRealyIndex) === null || _e === void 0 ? void 0 : _e.call(_d, index);
|
|
114
|
-
var newRecord = _dataIndex
|
|
115
|
-
? __assign(__assign(__assign({}, record), oldRecord), (_a = {}, _a[_dataIndex] = record[_dataIndex], _a)) : __assign(__assign({}, oldRecord), record);
|
|
116
|
-
newDataSource.splice(realyIndex, 1, newRecord);
|
|
117
|
-
onChange && onChange(newDataSource);
|
|
118
|
-
}
|
|
119
|
-
}, [dataSourceRef, onChange, innerTableHandleRef]);
|
|
120
|
-
var onBatchPasteHandle = useCallback(function (records, startIndex) {
|
|
121
|
-
if (!Array.isArray(records)) {
|
|
122
|
-
return;
|
|
123
|
-
}
|
|
124
|
-
// 前置处理
|
|
125
|
-
var pasteRecords = onBatchPastePre ? onBatchPastePre(records) : records;
|
|
126
|
-
// 计算结束位置
|
|
127
|
-
var endIndex = startIndex + pasteRecords.length - 1;
|
|
128
|
-
var currentRecords = Array.isArray(dataSourceRef.current)
|
|
129
|
-
? dataSourceRef.current.slice()
|
|
130
|
-
: [];
|
|
131
|
-
if (endIndex > currentRecords.length - 1) {
|
|
132
|
-
endIndex = currentRecords.length - 1;
|
|
133
|
-
}
|
|
134
|
-
// 从开始位置开始,替换对应的值
|
|
135
|
-
var currentIndex = 0;
|
|
136
|
-
var dataSource = currentRecords.map(function (record, index) {
|
|
137
|
-
if (index >= startIndex && index <= endIndex) {
|
|
138
|
-
var obj = __assign(__assign({}, record), pasteRecords[currentIndex]);
|
|
139
|
-
currentIndex++;
|
|
140
|
-
return obj;
|
|
141
|
-
}
|
|
142
|
-
return record;
|
|
143
|
-
});
|
|
144
|
-
// 后置处理
|
|
145
|
-
var newDataSource = onBatchPastePost
|
|
146
|
-
? onBatchPastePost(dataSource)
|
|
147
|
-
: dataSource;
|
|
148
|
-
// 触发onChange事件
|
|
149
|
-
onChange && onChange(newDataSource);
|
|
150
|
-
}, [dataSourceRef, onChange, onBatchPastePre, onBatchPastePost]);
|
|
151
|
-
return {
|
|
152
|
-
onEditableSaveHandle: onEditableSaveHandle,
|
|
153
|
-
onBatchPasteHandle: onBatchPasteHandle,
|
|
154
|
-
};
|
|
155
|
-
}
|
|
156
|
-
// SCU刷新逻辑
|
|
157
|
-
// 这么写的原因是 如果拖拽行 增减行后,并不能触发column的scu
|
|
158
|
-
// 之前的写法是,通过useState刷新。但是 setState会触发整个组件的刷新
|
|
159
|
-
// 设置数据后,本身会触发setState。导致执行两次rerender。每个单元格都会执行rerender
|
|
160
|
-
// 通过Ref并不会触发 setState 通过setTimeout也不会导致每一个单元格的刷新出现问题
|
|
161
|
-
export function useScuRfresh() {
|
|
162
|
-
var timeOutRef = useRef(null);
|
|
163
|
-
var tableSCURefreshRef = useRef();
|
|
164
|
-
var refreshScuCell = useCallback(function () {
|
|
165
|
-
tableSCURefreshRef.current = true;
|
|
166
|
-
}, []);
|
|
167
|
-
var getRefreshScuCell = useCallback(function () {
|
|
168
|
-
if (tableSCURefreshRef.current) {
|
|
169
|
-
if (timeOutRef.current) {
|
|
170
|
-
clearTimeout(timeOutRef.current);
|
|
171
|
-
timeOutRef.current = null;
|
|
172
|
-
}
|
|
173
|
-
timeOutRef.current = setTimeout(function () {
|
|
174
|
-
tableSCURefreshRef.current = false;
|
|
175
|
-
});
|
|
176
|
-
return true;
|
|
177
|
-
}
|
|
178
|
-
return false;
|
|
179
|
-
}, []);
|
|
180
|
-
return {
|
|
181
|
-
refreshScuCell: refreshScuCell,
|
|
182
|
-
getRefreshScuCell: getRefreshScuCell,
|
|
183
|
-
};
|
|
184
|
-
}
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
var __assign = (this && this.__assign) || function () {
|
|
2
|
-
__assign = Object.assign || function(t) {
|
|
3
|
-
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
4
|
-
s = arguments[i];
|
|
5
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
6
|
-
t[p] = s[p];
|
|
7
|
-
}
|
|
8
|
-
return t;
|
|
9
|
-
};
|
|
10
|
-
return __assign.apply(this, arguments);
|
|
11
|
-
};
|
|
12
|
-
var __rest = (this && this.__rest) || function (s, e) {
|
|
13
|
-
var t = {};
|
|
14
|
-
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
15
|
-
t[p] = s[p];
|
|
16
|
-
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
17
|
-
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
18
|
-
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
19
|
-
t[p[i]] = s[p[i]];
|
|
20
|
-
}
|
|
21
|
-
return t;
|
|
22
|
-
};
|
|
23
|
-
/**
|
|
24
|
-
* 业务封装可编辑表格组件
|
|
25
|
-
*/
|
|
26
|
-
import React, { memo, useRef, useImperativeHandle } from 'react';
|
|
27
|
-
// import { Table } from 'ztxkui';
|
|
28
|
-
import { Table } from '../../../index';
|
|
29
|
-
import { useDataSourceRef, useAddAndDelRow, useScuRfresh, useMoveRow, useEditRow, } from './hooks';
|
|
30
|
-
function ProEditTable(props) {
|
|
31
|
-
var rowKey = props.rowKey, dataSource = props.dataSource, columns = props.columns, onChange = props.onChange, showAddIcon = props.showAddIcon, showDelIcon = props.showDelIcon, _a = props.addDataMode, addDataMode = _a === void 0 ? 'blank' : _a, isMove = props.isMove, isEdit = props.isEdit, isPaste = props.isPaste, tableHandleRef = props.tableHandleRef, onBatchPastePre = props.onBatchPastePre, onBatchPastePost = props.onBatchPastePost, restProps = __rest(props, ["rowKey", "dataSource", "columns", "onChange", "showAddIcon", "showDelIcon", "addDataMode", "isMove", "isEdit", "isPaste", "tableHandleRef", "onBatchPastePre", "onBatchPastePost"]);
|
|
32
|
-
var innerTableHandleRef = useRef();
|
|
33
|
-
var tableColumns = columns.map(function (item) {
|
|
34
|
-
if (item.shouldCellUpdate) {
|
|
35
|
-
var fn_1 = item.shouldCellUpdate;
|
|
36
|
-
item.shouldCellUpdate = function (record, preRecord) {
|
|
37
|
-
if (getRefreshScuCell()) {
|
|
38
|
-
return true;
|
|
39
|
-
}
|
|
40
|
-
return fn_1(record, preRecord);
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
return item;
|
|
44
|
-
});
|
|
45
|
-
// 保存dataSource值存为Ref
|
|
46
|
-
var dataSourceRef = useDataSourceRef(dataSource);
|
|
47
|
-
// SCU逻辑
|
|
48
|
-
var _b = useScuRfresh(), refreshScuCell = _b.refreshScuCell, getRefreshScuCell = _b.getRefreshScuCell;
|
|
49
|
-
// 增减行相关hook
|
|
50
|
-
var _c = useAddAndDelRow(showAddIcon, showDelIcon, dataSourceRef, addDataMode, onChange, rowKey, refreshScuCell), needAddAndDel = _c.needAddAndDel, onAddAndDelHandle = _c.onAddAndDelHandle;
|
|
51
|
-
// 拖拽行相关hook
|
|
52
|
-
var onMoveRowHandle = useMoveRow(onChange, dataSourceRef, refreshScuCell);
|
|
53
|
-
// 修改行相关hook
|
|
54
|
-
var _d = useEditRow(onChange, dataSourceRef, innerTableHandleRef, {
|
|
55
|
-
onBatchPastePre: onBatchPastePre,
|
|
56
|
-
onBatchPastePost: onBatchPastePost,
|
|
57
|
-
}), onEditableSaveHandle = _d.onEditableSaveHandle, onBatchPasteHandle = _d.onBatchPasteHandle;
|
|
58
|
-
useImperativeHandle(tableHandleRef, function () { return ({
|
|
59
|
-
validate: innerTableHandleRef.current.validate,
|
|
60
|
-
clearErrorClass: innerTableHandleRef.current.clearErrorClass,
|
|
61
|
-
getCurrentPage: innerTableHandleRef.current.getCurrentPage,
|
|
62
|
-
getRealyIndex: innerTableHandleRef.current.getRealyIndex,
|
|
63
|
-
onEditableSaveHandle: onEditableSaveHandle,
|
|
64
|
-
}); });
|
|
65
|
-
return (React.createElement(Table, __assign({ rowKey: rowKey, dataSource: dataSource, columns: tableColumns, hideAddIcon: !showAddIcon, hideDelIcon: !showDelIcon, onAddAndDelHandle: needAddAndDel ? onAddAndDelHandle : undefined, onMoveRow: isMove ? onMoveRowHandle : undefined, onEditableSave: isEdit ? onEditableSaveHandle : undefined, tableHandleRef: innerTableHandleRef, onTableChange: isPaste ? onBatchPasteHandle : undefined }, restProps)));
|
|
66
|
-
}
|
|
67
|
-
export default memo(ProEditTable);
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ColumnsType } from '../../../components/Table';
|
|
3
|
-
import { IProps as TableIProps } from '../../../components/Table/table';
|
|
4
|
-
export interface IProps<RecordType> extends Omit<TableIProps<RecordType>, 'columns' | 'onChange' | 'onEditableSave'> {
|
|
5
|
-
dataSource: any[];
|
|
6
|
-
columns: ColumnsType<any>;
|
|
7
|
-
rowKey: string;
|
|
8
|
-
onChange?: (dataSource: any[]) => void;
|
|
9
|
-
showAddIcon?: boolean;
|
|
10
|
-
showDelIcon?: boolean;
|
|
11
|
-
/**
|
|
12
|
-
* 增加数据的模式 blank add空白数据; copy add复制数据; 自定义增加
|
|
13
|
-
*/
|
|
14
|
-
addDataMode?: 'blank' | 'copy' | ((index: number, dataSource: any[]) => any[]);
|
|
15
|
-
isMove?: boolean;
|
|
16
|
-
isEdit?: boolean;
|
|
17
|
-
isPaste?: boolean;
|
|
18
|
-
onBatchPastePre?: (data: any[]) => any[];
|
|
19
|
-
onBatchPastePost?: (data: any[]) => any[];
|
|
20
|
-
tableHandleRef?: React.Ref<{
|
|
21
|
-
validate: () => Promise<any>;
|
|
22
|
-
clearErrorClass: (index: number) => void;
|
|
23
|
-
getCurrentPage: () => {
|
|
24
|
-
page: number;
|
|
25
|
-
pageSize: number;
|
|
26
|
-
} | null;
|
|
27
|
-
getRealyIndex: (index: number) => number;
|
|
28
|
-
onEditableSaveHandle: (record: any, index: number | undefined, _dataIndex: string) => void;
|
|
29
|
-
[prop: string]: any;
|
|
30
|
-
}>;
|
|
31
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|