es-grid-template 1.3.9 → 1.4.0
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/es/grid-component/EditableCell.js +9 -8
- package/es/grid-component/InternalTable.js +24 -2
- package/es/grid-component/hooks/useColumns.d.ts +1 -0
- package/es/grid-component/hooks/useColumns.js +9 -2
- package/es/grid-component/hooks/useLazyKVMap.d.ts +4 -0
- package/es/grid-component/hooks/useLazyKVMap.js +35 -0
- package/es/grid-component/hooks/utils.js +4 -2
- package/es/grid-component/table/GridEdit.js +6 -1
- package/lib/grid-component/EditableCell.js +9 -8
- package/lib/grid-component/InternalTable.js +26 -2
- package/lib/grid-component/hooks/useColumns.d.ts +1 -0
- package/lib/grid-component/hooks/useColumns.js +9 -2
- package/lib/grid-component/hooks/useLazyKVMap.d.ts +4 -0
- package/lib/grid-component/hooks/useLazyKVMap.js +43 -0
- package/lib/grid-component/hooks/utils.js +4 -2
- package/lib/grid-component/table/GridEdit.js +6 -1
- package/package.json +109 -109
|
@@ -33,7 +33,10 @@ const filterTreeNode = (input, treeNode) => {
|
|
|
33
33
|
title,
|
|
34
34
|
value
|
|
35
35
|
} = treeNode;
|
|
36
|
-
|
|
36
|
+
if (typeof title === "string" || typeof title === 'number') {
|
|
37
|
+
return title.toString().toLowerCase().includes(input.toLowerCase()) || value.toLowerCase().includes(input.toLowerCase());
|
|
38
|
+
}
|
|
39
|
+
return value.toLowerCase().includes(input.toLowerCase());
|
|
37
40
|
};
|
|
38
41
|
const EditableCell = props => {
|
|
39
42
|
const {
|
|
@@ -558,19 +561,17 @@ const EditableCell = props => {
|
|
|
558
561
|
// autoFocus={true}
|
|
559
562
|
,
|
|
560
563
|
virtual: true,
|
|
561
|
-
allowClear: true
|
|
564
|
+
allowClear: true,
|
|
565
|
+
showSearch: true
|
|
562
566
|
// maxTagTextLength={column?.editSelectSettings?.showItems}
|
|
563
567
|
,
|
|
564
568
|
maxTagCount: column?.editSelectSettings?.showItems,
|
|
565
569
|
maxTagPlaceholder: 2,
|
|
566
570
|
treeTitleRender: column?.editSelectSettings?.formatOptionLabel,
|
|
567
571
|
showCheckedStrategy: SHOW_PARENT,
|
|
568
|
-
multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti
|
|
569
|
-
fieldNames:
|
|
570
|
-
|
|
571
|
-
value: keySelect,
|
|
572
|
-
children: 'children'
|
|
573
|
-
},
|
|
572
|
+
multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti
|
|
573
|
+
// fieldNames={{label: inputKey ? inputKey : 'title', value: keySelect, children: 'children'}}
|
|
574
|
+
,
|
|
574
575
|
treeCheckable: column?.editSelectSettings?.selectMode === 'checkbox',
|
|
575
576
|
filterTreeNode: filterTreeNode,
|
|
576
577
|
popupMatchSelectWidth: menuWidth ? menuWidth + 10 : undefined,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import React from 'react';
|
|
2
|
+
import React, { Fragment } from 'react';
|
|
3
3
|
import { Resizable } from "react-resizable";
|
|
4
4
|
import 'react-resizable/css/styles.css';
|
|
5
5
|
import customParseFormat from 'dayjs/plugin/customParseFormat';
|
|
@@ -26,6 +26,7 @@ import { flatColumns2 } from "./hooks/columns";
|
|
|
26
26
|
import Group from "./table/Group";
|
|
27
27
|
import Swal from "sweetalert2";
|
|
28
28
|
import withReactContent from "sweetalert2-react-content";
|
|
29
|
+
import { Tooltip } from "react-tooltip";
|
|
29
30
|
dayjs.extend(customParseFormat);
|
|
30
31
|
const MySwal = withReactContent(Swal);
|
|
31
32
|
|
|
@@ -103,6 +104,7 @@ const InternalTable = props => {
|
|
|
103
104
|
|
|
104
105
|
// const [filterStates, setFilterState] = React.useState<any>(null)
|
|
105
106
|
// const [isFilter, setIsFilter] = React.useState<boolean>(false);
|
|
107
|
+
// const [cellTooltip, seCellTooltip] = React.useState<any>(undefined);
|
|
106
108
|
|
|
107
109
|
const mergerdData = React.useMemo(() => {
|
|
108
110
|
// return filterDataByColumns2(addRowIdArray(dataSource), filterStates)
|
|
@@ -149,6 +151,11 @@ const InternalTable = props => {
|
|
|
149
151
|
// @ts-ignore
|
|
150
152
|
return record => record?.[rowKey];
|
|
151
153
|
}, [rowKey]);
|
|
154
|
+
|
|
155
|
+
// const onMouseHover = (record: any, col: ColumnTable) => {
|
|
156
|
+
//
|
|
157
|
+
// }
|
|
158
|
+
|
|
152
159
|
const [transformSelectionColumns] = useColumns({
|
|
153
160
|
locale,
|
|
154
161
|
t,
|
|
@@ -163,6 +170,7 @@ const InternalTable = props => {
|
|
|
163
170
|
groupSetting,
|
|
164
171
|
groupColumns,
|
|
165
172
|
handleResize
|
|
173
|
+
// onMouseHover
|
|
166
174
|
});
|
|
167
175
|
const mergedColumns = React.useMemo(() => {
|
|
168
176
|
return transformSelectionColumns(columns);
|
|
@@ -391,7 +399,7 @@ const InternalTable = props => {
|
|
|
391
399
|
}
|
|
392
400
|
};
|
|
393
401
|
const TableComponent = groupAble ? Group : editAble ? GridEdit : Grid;
|
|
394
|
-
return /*#__PURE__*/React.createElement(TableComponent, _extends({}, rest, {
|
|
402
|
+
return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(TableComponent, _extends({}, rest, {
|
|
395
403
|
t: t,
|
|
396
404
|
locale: locale,
|
|
397
405
|
tableRef: tableRef,
|
|
@@ -426,6 +434,20 @@ const InternalTable = props => {
|
|
|
426
434
|
// isFilter={isFilter}
|
|
427
435
|
// setIsFilter={setIsFilter}
|
|
428
436
|
// onScroll={onScroll}
|
|
437
|
+
})), /*#__PURE__*/React.createElement(Tooltip, {
|
|
438
|
+
id: "tooltip-cell-content",
|
|
439
|
+
style: {
|
|
440
|
+
zIndex: 1999
|
|
441
|
+
}
|
|
442
|
+
// content={'sssss'}
|
|
443
|
+
// content={cellTooltip}
|
|
444
|
+
// render={() => {
|
|
445
|
+
// return (
|
|
446
|
+
// <span>
|
|
447
|
+
// aaaa
|
|
448
|
+
// </span>
|
|
449
|
+
// )
|
|
450
|
+
// }}
|
|
429
451
|
}));
|
|
430
452
|
};
|
|
431
453
|
export default InternalTable;
|
|
@@ -13,6 +13,7 @@ interface UseColumnsConfig<RecordType> {
|
|
|
13
13
|
groupSetting?: IGroupSetting;
|
|
14
14
|
groupColumns?: string[];
|
|
15
15
|
rowKey?: any;
|
|
16
|
+
onMouseHover?: any;
|
|
16
17
|
}
|
|
17
18
|
declare const useColumns: <RecordType extends AnyObject = AnyObject>(config: UseColumnsConfig<RecordType>) => readonly [any];
|
|
18
19
|
export default useColumns;
|
|
@@ -37,6 +37,7 @@ const useColumns = config => {
|
|
|
37
37
|
sortMultiple,
|
|
38
38
|
format,
|
|
39
39
|
handleResize,
|
|
40
|
+
// onMouseHover,
|
|
40
41
|
groupAble,
|
|
41
42
|
groupColumns,
|
|
42
43
|
groupSetting,
|
|
@@ -273,7 +274,11 @@ const useColumns = config => {
|
|
|
273
274
|
className: classNames(transformedColumn?.onCell?.(data, index).className ?? '', {
|
|
274
275
|
'cell-group': groupColumns && data.children,
|
|
275
276
|
'cell-group-fixed': groupColumns && data.children && col.field === firstNonGroupColumn?.field
|
|
276
|
-
})
|
|
277
|
+
}),
|
|
278
|
+
'data-tooltip-id': "tooltip-cell-content"
|
|
279
|
+
// onMouseEnter: () => {
|
|
280
|
+
// onMouseHover(data, col as any)
|
|
281
|
+
// },
|
|
277
282
|
};
|
|
278
283
|
},
|
|
279
284
|
render: (value, record, rowIndex) => {
|
|
@@ -301,7 +306,9 @@ const useColumns = config => {
|
|
|
301
306
|
});
|
|
302
307
|
};
|
|
303
308
|
return convertColumns(cloneColumns);
|
|
304
|
-
}, [
|
|
309
|
+
}, [groupColumns, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, dataSource, rowKey, handleResize, format]
|
|
310
|
+
// format, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, groupColumns, , handleResize, , t, cellHover
|
|
311
|
+
);
|
|
305
312
|
return [transformColumns];
|
|
306
313
|
};
|
|
307
314
|
export default useColumns;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { AnyObject, GetRowKey } from "../type";
|
|
2
|
+
import type { Key } from "react";
|
|
3
|
+
declare const useLazyKVMap: <RecordType extends AnyObject = AnyObject>(data: readonly RecordType[], childrenColumnName: string, getRowKey: GetRowKey<RecordType>) => readonly [(key: Key) => RecordType];
|
|
4
|
+
export default useLazyKVMap;
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
|
|
4
|
+
// import type { AnyObject } from '../../_util/type';
|
|
5
|
+
// import type { GetRowKey, Key } from '../interface';
|
|
6
|
+
|
|
7
|
+
const useLazyKVMap = (data, childrenColumnName, getRowKey) => {
|
|
8
|
+
const mapCacheRef = React.useRef({});
|
|
9
|
+
function getRecordByKey(key) {
|
|
10
|
+
if (!mapCacheRef.current || mapCacheRef.current.data !== data || mapCacheRef.current.childrenColumnName !== childrenColumnName || mapCacheRef.current.getRowKey !== getRowKey) {
|
|
11
|
+
const kvMap = new Map();
|
|
12
|
+
|
|
13
|
+
// @ts-ignore
|
|
14
|
+
function dig(records) {
|
|
15
|
+
records.forEach((record, index) => {
|
|
16
|
+
const rowKey = getRowKey(record, index);
|
|
17
|
+
kvMap.set(rowKey, record);
|
|
18
|
+
if (record && typeof record === 'object' && childrenColumnName in record) {
|
|
19
|
+
dig(record[childrenColumnName] || []);
|
|
20
|
+
}
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
dig(data);
|
|
24
|
+
mapCacheRef.current = {
|
|
25
|
+
data,
|
|
26
|
+
childrenColumnName,
|
|
27
|
+
kvMap,
|
|
28
|
+
getRowKey
|
|
29
|
+
};
|
|
30
|
+
}
|
|
31
|
+
return mapCacheRef.current.kvMap?.get(key);
|
|
32
|
+
}
|
|
33
|
+
return [getRecordByKey];
|
|
34
|
+
};
|
|
35
|
+
export default useLazyKVMap;
|
|
@@ -274,13 +274,15 @@ export const convertLabelToTitle = data => {
|
|
|
274
274
|
label,
|
|
275
275
|
title,
|
|
276
276
|
value,
|
|
277
|
+
key,
|
|
277
278
|
...rest
|
|
278
279
|
} = item;
|
|
279
280
|
const newItem = {
|
|
280
281
|
...rest,
|
|
281
282
|
value,
|
|
282
|
-
|
|
283
|
-
|
|
283
|
+
label,
|
|
284
|
+
key: key ?? value,
|
|
285
|
+
title: title ?? label
|
|
284
286
|
};
|
|
285
287
|
if (item.children) {
|
|
286
288
|
newItem.children = convertLabelToTitle(item.children);
|
|
@@ -1930,6 +1930,7 @@ const GridEdit = props => {
|
|
|
1930
1930
|
onCell: (record, rowIndex) => {
|
|
1931
1931
|
const rowNumber = getRowNumber(dataSource, record[rowKey], rowKey);
|
|
1932
1932
|
return {
|
|
1933
|
+
...column?.onCell?.(record, rowIndex),
|
|
1933
1934
|
onKeyDown: event => {
|
|
1934
1935
|
const key = getRowKey(record, dataSource.indexOf(record));
|
|
1935
1936
|
if (event.key === 'Control' && event.ctrlKey) {} else {
|
|
@@ -2050,6 +2051,10 @@ const GridEdit = props => {
|
|
|
2050
2051
|
rowsSelected.current = new Set();
|
|
2051
2052
|
}
|
|
2052
2053
|
},
|
|
2054
|
+
// onMouseEnter: () => {
|
|
2055
|
+
//
|
|
2056
|
+
// },
|
|
2057
|
+
|
|
2053
2058
|
onClick: () => {
|
|
2054
2059
|
if (record[rowKey] !== editingKey && editingKey !== '') {
|
|
2055
2060
|
setEditingKey('');
|
|
@@ -2065,7 +2070,7 @@ const GridEdit = props => {
|
|
|
2065
2070
|
title: getValueCell(column, record[column.field], format),
|
|
2066
2071
|
'data-col-index': colIndex,
|
|
2067
2072
|
'data-row-index': rowNumber,
|
|
2068
|
-
|
|
2073
|
+
'data-tooltip-id': "tooltip-cell-content",
|
|
2069
2074
|
// 'data-tooltip-content': 'tooltip-cell-content',
|
|
2070
2075
|
// 'data-tooltip-delay-show': 1000,
|
|
2071
2076
|
// 'data-tooltip-content': getValueCell(column, record[column.field as any], format),
|
|
@@ -35,7 +35,10 @@ const filterTreeNode = (input, treeNode) => {
|
|
|
35
35
|
title,
|
|
36
36
|
value
|
|
37
37
|
} = treeNode;
|
|
38
|
-
|
|
38
|
+
if (typeof title === "string" || typeof title === 'number') {
|
|
39
|
+
return title.toString().toLowerCase().includes(input.toLowerCase()) || value.toLowerCase().includes(input.toLowerCase());
|
|
40
|
+
}
|
|
41
|
+
return value.toLowerCase().includes(input.toLowerCase());
|
|
39
42
|
};
|
|
40
43
|
const EditableCell = props => {
|
|
41
44
|
const {
|
|
@@ -560,19 +563,17 @@ const EditableCell = props => {
|
|
|
560
563
|
// autoFocus={true}
|
|
561
564
|
,
|
|
562
565
|
virtual: true,
|
|
563
|
-
allowClear: true
|
|
566
|
+
allowClear: true,
|
|
567
|
+
showSearch: true
|
|
564
568
|
// maxTagTextLength={column?.editSelectSettings?.showItems}
|
|
565
569
|
,
|
|
566
570
|
maxTagCount: column?.editSelectSettings?.showItems,
|
|
567
571
|
maxTagPlaceholder: 2,
|
|
568
572
|
treeTitleRender: column?.editSelectSettings?.formatOptionLabel,
|
|
569
573
|
showCheckedStrategy: SHOW_PARENT,
|
|
570
|
-
multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti
|
|
571
|
-
fieldNames:
|
|
572
|
-
|
|
573
|
-
value: keySelect,
|
|
574
|
-
children: 'children'
|
|
575
|
-
},
|
|
574
|
+
multiple: column?.editSelectSettings?.selectMode === 'checkbox' || column?.editSelectSettings?.isMulti
|
|
575
|
+
// fieldNames={{label: inputKey ? inputKey : 'title', value: keySelect, children: 'children'}}
|
|
576
|
+
,
|
|
576
577
|
treeCheckable: column?.editSelectSettings?.selectMode === 'checkbox',
|
|
577
578
|
filterTreeNode: filterTreeNode,
|
|
578
579
|
popupMatchSelectWidth: menuWidth ? menuWidth + 10 : undefined,
|
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
-
var _react =
|
|
9
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _reactResizable = require("react-resizable");
|
|
11
11
|
require("react-resizable/css/styles.css");
|
|
12
12
|
var _customParseFormat = _interopRequireDefault(require("dayjs/plugin/customParseFormat"));
|
|
@@ -24,6 +24,9 @@ var _columns = require("./hooks/columns");
|
|
|
24
24
|
var _Group = _interopRequireDefault(require("./table/Group"));
|
|
25
25
|
var _sweetalert = _interopRequireDefault(require("sweetalert2"));
|
|
26
26
|
var _sweetalert2ReactContent = _interopRequireDefault(require("sweetalert2-react-content"));
|
|
27
|
+
var _reactTooltip = require("react-tooltip");
|
|
28
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
29
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
27
30
|
_dayjs.default.extend(_customParseFormat.default);
|
|
28
31
|
const MySwal = (0, _sweetalert2ReactContent.default)(_sweetalert.default);
|
|
29
32
|
|
|
@@ -101,6 +104,7 @@ const InternalTable = props => {
|
|
|
101
104
|
|
|
102
105
|
// const [filterStates, setFilterState] = React.useState<any>(null)
|
|
103
106
|
// const [isFilter, setIsFilter] = React.useState<boolean>(false);
|
|
107
|
+
// const [cellTooltip, seCellTooltip] = React.useState<any>(undefined);
|
|
104
108
|
|
|
105
109
|
const mergerdData = _react.default.useMemo(() => {
|
|
106
110
|
// return filterDataByColumns2(addRowIdArray(dataSource), filterStates)
|
|
@@ -147,6 +151,11 @@ const InternalTable = props => {
|
|
|
147
151
|
// @ts-ignore
|
|
148
152
|
return record => record?.[rowKey];
|
|
149
153
|
}, [rowKey]);
|
|
154
|
+
|
|
155
|
+
// const onMouseHover = (record: any, col: ColumnTable) => {
|
|
156
|
+
//
|
|
157
|
+
// }
|
|
158
|
+
|
|
150
159
|
const [transformSelectionColumns] = (0, _useColumns.default)({
|
|
151
160
|
locale,
|
|
152
161
|
t,
|
|
@@ -161,6 +170,7 @@ const InternalTable = props => {
|
|
|
161
170
|
groupSetting,
|
|
162
171
|
groupColumns,
|
|
163
172
|
handleResize
|
|
173
|
+
// onMouseHover
|
|
164
174
|
});
|
|
165
175
|
const mergedColumns = _react.default.useMemo(() => {
|
|
166
176
|
return transformSelectionColumns(columns);
|
|
@@ -389,7 +399,7 @@ const InternalTable = props => {
|
|
|
389
399
|
}
|
|
390
400
|
};
|
|
391
401
|
const TableComponent = groupAble ? _Group.default : editAble ? _GridEdit.default : _Grid.default;
|
|
392
|
-
return /*#__PURE__*/_react.default.createElement(TableComponent, (0, _extends2.default)({}, rest, {
|
|
402
|
+
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(TableComponent, (0, _extends2.default)({}, rest, {
|
|
393
403
|
t: t,
|
|
394
404
|
locale: locale,
|
|
395
405
|
tableRef: tableRef,
|
|
@@ -424,6 +434,20 @@ const InternalTable = props => {
|
|
|
424
434
|
// isFilter={isFilter}
|
|
425
435
|
// setIsFilter={setIsFilter}
|
|
426
436
|
// onScroll={onScroll}
|
|
437
|
+
})), /*#__PURE__*/_react.default.createElement(_reactTooltip.Tooltip, {
|
|
438
|
+
id: "tooltip-cell-content",
|
|
439
|
+
style: {
|
|
440
|
+
zIndex: 1999
|
|
441
|
+
}
|
|
442
|
+
// content={'sssss'}
|
|
443
|
+
// content={cellTooltip}
|
|
444
|
+
// render={() => {
|
|
445
|
+
// return (
|
|
446
|
+
// <span>
|
|
447
|
+
// aaaa
|
|
448
|
+
// </span>
|
|
449
|
+
// )
|
|
450
|
+
// }}
|
|
427
451
|
}));
|
|
428
452
|
};
|
|
429
453
|
var _default = exports.default = InternalTable;
|
|
@@ -13,6 +13,7 @@ interface UseColumnsConfig<RecordType> {
|
|
|
13
13
|
groupSetting?: IGroupSetting;
|
|
14
14
|
groupColumns?: string[];
|
|
15
15
|
rowKey?: any;
|
|
16
|
+
onMouseHover?: any;
|
|
16
17
|
}
|
|
17
18
|
declare const useColumns: <RecordType extends AnyObject = AnyObject>(config: UseColumnsConfig<RecordType>) => readonly [any];
|
|
18
19
|
export default useColumns;
|
|
@@ -48,6 +48,7 @@ const useColumns = config => {
|
|
|
48
48
|
sortMultiple,
|
|
49
49
|
format,
|
|
50
50
|
handleResize,
|
|
51
|
+
// onMouseHover,
|
|
51
52
|
groupAble,
|
|
52
53
|
groupColumns,
|
|
53
54
|
groupSetting,
|
|
@@ -284,7 +285,11 @@ const useColumns = config => {
|
|
|
284
285
|
className: (0, _classnames.default)(transformedColumn?.onCell?.(data, index).className ?? '', {
|
|
285
286
|
'cell-group': groupColumns && data.children,
|
|
286
287
|
'cell-group-fixed': groupColumns && data.children && col.field === firstNonGroupColumn?.field
|
|
287
|
-
})
|
|
288
|
+
}),
|
|
289
|
+
'data-tooltip-id': "tooltip-cell-content"
|
|
290
|
+
// onMouseEnter: () => {
|
|
291
|
+
// onMouseHover(data, col as any)
|
|
292
|
+
// },
|
|
288
293
|
};
|
|
289
294
|
},
|
|
290
295
|
render: (value, record, rowIndex) => {
|
|
@@ -312,7 +317,9 @@ const useColumns = config => {
|
|
|
312
317
|
});
|
|
313
318
|
};
|
|
314
319
|
return convertColumns(cloneColumns);
|
|
315
|
-
}, [
|
|
320
|
+
}, [groupColumns, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, dataSource, rowKey, handleResize, format]
|
|
321
|
+
// format, getColumnSearchProps, sortMultiple, groupSetting, groupAble, t, groupColumns, , handleResize, , t, cellHover
|
|
322
|
+
);
|
|
316
323
|
return [transformColumns];
|
|
317
324
|
};
|
|
318
325
|
var _default = exports.default = useColumns;
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import type { AnyObject, GetRowKey } from "../type";
|
|
2
|
+
import type { Key } from "react";
|
|
3
|
+
declare const useLazyKVMap: <RecordType extends AnyObject = AnyObject>(data: readonly RecordType[], childrenColumnName: string, getRowKey: GetRowKey<RecordType>) => readonly [(key: Key) => RecordType];
|
|
4
|
+
export default useLazyKVMap;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var React = _interopRequireWildcard(require("react"));
|
|
8
|
+
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
|
|
9
|
+
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
10
|
+
/* eslint-disable @typescript-eslint/no-non-null-asserted-optional-chain */
|
|
11
|
+
|
|
12
|
+
// import type { AnyObject } from '../../_util/type';
|
|
13
|
+
// import type { GetRowKey, Key } from '../interface';
|
|
14
|
+
|
|
15
|
+
const useLazyKVMap = (data, childrenColumnName, getRowKey) => {
|
|
16
|
+
const mapCacheRef = React.useRef({});
|
|
17
|
+
function getRecordByKey(key) {
|
|
18
|
+
if (!mapCacheRef.current || mapCacheRef.current.data !== data || mapCacheRef.current.childrenColumnName !== childrenColumnName || mapCacheRef.current.getRowKey !== getRowKey) {
|
|
19
|
+
const kvMap = new Map();
|
|
20
|
+
|
|
21
|
+
// @ts-ignore
|
|
22
|
+
function dig(records) {
|
|
23
|
+
records.forEach((record, index) => {
|
|
24
|
+
const rowKey = getRowKey(record, index);
|
|
25
|
+
kvMap.set(rowKey, record);
|
|
26
|
+
if (record && typeof record === 'object' && childrenColumnName in record) {
|
|
27
|
+
dig(record[childrenColumnName] || []);
|
|
28
|
+
}
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
dig(data);
|
|
32
|
+
mapCacheRef.current = {
|
|
33
|
+
data,
|
|
34
|
+
childrenColumnName,
|
|
35
|
+
kvMap,
|
|
36
|
+
getRowKey
|
|
37
|
+
};
|
|
38
|
+
}
|
|
39
|
+
return mapCacheRef.current.kvMap?.get(key);
|
|
40
|
+
}
|
|
41
|
+
return [getRecordByKey];
|
|
42
|
+
};
|
|
43
|
+
var _default = exports.default = useLazyKVMap;
|
|
@@ -327,13 +327,15 @@ const convertLabelToTitle = data => {
|
|
|
327
327
|
label,
|
|
328
328
|
title,
|
|
329
329
|
value,
|
|
330
|
+
key,
|
|
330
331
|
...rest
|
|
331
332
|
} = item;
|
|
332
333
|
const newItem = {
|
|
333
334
|
...rest,
|
|
334
335
|
value,
|
|
335
|
-
|
|
336
|
-
|
|
336
|
+
label,
|
|
337
|
+
key: key ?? value,
|
|
338
|
+
title: title ?? label
|
|
337
339
|
};
|
|
338
340
|
if (item.children) {
|
|
339
341
|
newItem.children = convertLabelToTitle(item.children);
|
|
@@ -1938,6 +1938,7 @@ const GridEdit = props => {
|
|
|
1938
1938
|
onCell: (record, rowIndex) => {
|
|
1939
1939
|
const rowNumber = (0, _hooks.getRowNumber)(dataSource, record[rowKey], rowKey);
|
|
1940
1940
|
return {
|
|
1941
|
+
...column?.onCell?.(record, rowIndex),
|
|
1941
1942
|
onKeyDown: event => {
|
|
1942
1943
|
const key = getRowKey(record, dataSource.indexOf(record));
|
|
1943
1944
|
if (event.key === 'Control' && event.ctrlKey) {} else {
|
|
@@ -2058,6 +2059,10 @@ const GridEdit = props => {
|
|
|
2058
2059
|
rowsSelected.current = new Set();
|
|
2059
2060
|
}
|
|
2060
2061
|
},
|
|
2062
|
+
// onMouseEnter: () => {
|
|
2063
|
+
//
|
|
2064
|
+
// },
|
|
2065
|
+
|
|
2061
2066
|
onClick: () => {
|
|
2062
2067
|
if (record[rowKey] !== editingKey && editingKey !== '') {
|
|
2063
2068
|
setEditingKey('');
|
|
@@ -2073,7 +2078,7 @@ const GridEdit = props => {
|
|
|
2073
2078
|
title: (0, _columns.getValueCell)(column, record[column.field], format),
|
|
2074
2079
|
'data-col-index': colIndex,
|
|
2075
2080
|
'data-row-index': rowNumber,
|
|
2076
|
-
|
|
2081
|
+
'data-tooltip-id': "tooltip-cell-content",
|
|
2077
2082
|
// 'data-tooltip-content': 'tooltip-cell-content',
|
|
2078
2083
|
// 'data-tooltip-delay-show': 1000,
|
|
2079
2084
|
// 'data-tooltip-content': getValueCell(column, record[column.field as any], format),
|
package/package.json
CHANGED
|
@@ -1,109 +1,109 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "es-grid-template",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"description": "es-grid-template",
|
|
5
|
-
"keywords": [
|
|
6
|
-
"react",
|
|
7
|
-
"react-component",
|
|
8
|
-
"grid",
|
|
9
|
-
"table"
|
|
10
|
-
],
|
|
11
|
-
"license": "MIT",
|
|
12
|
-
"main": "lib/index",
|
|
13
|
-
"module": "es/index",
|
|
14
|
-
"files": [
|
|
15
|
-
"lib",
|
|
16
|
-
"es",
|
|
17
|
-
"assets/*.css",
|
|
18
|
-
"assets/*.scss"
|
|
19
|
-
],
|
|
20
|
-
"scripts": {
|
|
21
|
-
"__compile": "father build && ",
|
|
22
|
-
"compile": "father build && sass assets/index.scss assets/index.css",
|
|
23
|
-
"docs:build": "dumi build",
|
|
24
|
-
"__docs:deploy": "gh-pages -d dist",
|
|
25
|
-
"lint": "eslint src/ --ext .tsx,.ts,.jsx,.js",
|
|
26
|
-
"now-build": "npm run docs:build",
|
|
27
|
-
"prepare": "dumi setup",
|
|
28
|
-
"prepublishOnly": "npm run compile",
|
|
29
|
-
"postpublish": "npm run docs:build",
|
|
30
|
-
"__postpublish": "npm run docs:build && npm run docs:deploy",
|
|
31
|
-
"start": "dumi dev",
|
|
32
|
-
"test": "vitest --watch false",
|
|
33
|
-
"coverage": "vitest run --coverage"
|
|
34
|
-
},
|
|
35
|
-
"dependencies": {
|
|
36
|
-
"@ant-design/colors": "^8.0.0",
|
|
37
|
-
"@ant-design/cssinjs": "^1.22.0",
|
|
38
|
-
"@ant-design/cssinjs-utils": "^1.1.1",
|
|
39
|
-
"@ant-design/icons": "^5.5.2",
|
|
40
|
-
"@babel/runtime": "^7.11.2",
|
|
41
|
-
"@core-rc/rc-select": "^0.0.8",
|
|
42
|
-
"@ctrl/tinycolor": "^3.6.1",
|
|
43
|
-
"@faker-js/faker": "^9.5.0",
|
|
44
|
-
"@floating-ui/react": "^0.27.5",
|
|
45
|
-
"@rc-component/color-picker": "^2.0.1",
|
|
46
|
-
"@rc-component/father-plugin": "^2.0.1",
|
|
47
|
-
"@rc-component/trigger": "^2.0.0",
|
|
48
|
-
"@rc-component/util": "^1.0.1",
|
|
49
|
-
"@types/react-resizable": "^3.0.8",
|
|
50
|
-
"@types/styled-components": "^5.1.34",
|
|
51
|
-
"@vitest/coverage-v8": "^2.0.5",
|
|
52
|
-
"antd": "^5.24.1",
|
|
53
|
-
"antd-style": "^3.7.1",
|
|
54
|
-
"becoxy-icons": "^2.0.1",
|
|
55
|
-
"classnames": "^2.3.1",
|
|
56
|
-
"dayjs": "^1.11.13",
|
|
57
|
-
"lodash": "^4.17.21",
|
|
58
|
-
"moment": "^2.30.1",
|
|
59
|
-
"postcss": "^8.4.35",
|
|
60
|
-
"rc-checkbox": "^3.5.0",
|
|
61
|
-
"rc-dropdown": "^4.2.1",
|
|
62
|
-
"rc-field-form": "^2.6.0",
|
|
63
|
-
"rc-master-ui": "^1.1.
|
|
64
|
-
"rc-select": "^14.16.3",
|
|
65
|
-
"rc-tooltip": "^6.3.0",
|
|
66
|
-
"rc-tree": "^5.10.1",
|
|
67
|
-
"rc-tree-select": "^5.24.5",
|
|
68
|
-
"react-hook-form": "^7.54.2",
|
|
69
|
-
"react-hot-toast": "^2.5.2",
|
|
70
|
-
"react-numeric-component": "^1.0.7",
|
|
71
|
-
"react-resizable": "^3.0.5",
|
|
72
|
-
"react-tooltip": "^5.28.1",
|
|
73
|
-
"sass": "^1.81.0",
|
|
74
|
-
"styled-components": "^6.1.15",
|
|
75
|
-
"sweetalert2": "^11.4.14",
|
|
76
|
-
"sweetalert2-react-content": "^5.0.0",
|
|
77
|
-
"throttle-debounce": "^5.0.2",
|
|
78
|
-
"vitest": "^2.0.5"
|
|
79
|
-
},
|
|
80
|
-
"devDependencies": {
|
|
81
|
-
"@babel/cli": "^7.26.4",
|
|
82
|
-
"@babel/preset-env": "^7.26.9",
|
|
83
|
-
"@rc-component/np": "^1.0.3",
|
|
84
|
-
"@testing-library/react": "^14.0.0",
|
|
85
|
-
"@types/jest": "^29.4.0",
|
|
86
|
-
"@types/react": "^18.0.26",
|
|
87
|
-
"@types/react-dom": "^18.0.10",
|
|
88
|
-
"@types/warning": "^3.0.0",
|
|
89
|
-
"cross-env": "^7.0.0",
|
|
90
|
-
"dumi": "^2.2.13",
|
|
91
|
-
"eslint": "^8.56.0",
|
|
92
|
-
"eslint-plugin-unicorn": "^55.0.0",
|
|
93
|
-
"father": "^4.0.0",
|
|
94
|
-
"gh-pages": "^3.1.0",
|
|
95
|
-
"less": "^4.1.1",
|
|
96
|
-
"np": "^7.1.0",
|
|
97
|
-
"rc-test": "^7.0.9",
|
|
98
|
-
"react": "^18.2.0",
|
|
99
|
-
"react-dom": "^18.2.0",
|
|
100
|
-
"typescript": "^4.0.5"
|
|
101
|
-
},
|
|
102
|
-
"peerDependencies": {
|
|
103
|
-
"react": ">=16.9.0",
|
|
104
|
-
"react-dom": ">=16.9.0"
|
|
105
|
-
},
|
|
106
|
-
"umi": {
|
|
107
|
-
"configFile": "config.ts"
|
|
108
|
-
}
|
|
109
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "es-grid-template",
|
|
3
|
+
"version": "1.4.0",
|
|
4
|
+
"description": "es-grid-template",
|
|
5
|
+
"keywords": [
|
|
6
|
+
"react",
|
|
7
|
+
"react-component",
|
|
8
|
+
"grid",
|
|
9
|
+
"table"
|
|
10
|
+
],
|
|
11
|
+
"license": "MIT",
|
|
12
|
+
"main": "lib/index",
|
|
13
|
+
"module": "es/index",
|
|
14
|
+
"files": [
|
|
15
|
+
"lib",
|
|
16
|
+
"es",
|
|
17
|
+
"assets/*.css",
|
|
18
|
+
"assets/*.scss"
|
|
19
|
+
],
|
|
20
|
+
"scripts": {
|
|
21
|
+
"__compile": "father build && ",
|
|
22
|
+
"compile": "father build && sass assets/index.scss assets/index.css",
|
|
23
|
+
"docs:build": "dumi build",
|
|
24
|
+
"__docs:deploy": "gh-pages -d dist",
|
|
25
|
+
"lint": "eslint src/ --ext .tsx,.ts,.jsx,.js",
|
|
26
|
+
"now-build": "npm run docs:build",
|
|
27
|
+
"prepare": "dumi setup",
|
|
28
|
+
"prepublishOnly": "npm run compile",
|
|
29
|
+
"postpublish": "npm run docs:build",
|
|
30
|
+
"__postpublish": "npm run docs:build && npm run docs:deploy",
|
|
31
|
+
"start": "dumi dev",
|
|
32
|
+
"test": "vitest --watch false",
|
|
33
|
+
"coverage": "vitest run --coverage"
|
|
34
|
+
},
|
|
35
|
+
"dependencies": {
|
|
36
|
+
"@ant-design/colors": "^8.0.0",
|
|
37
|
+
"@ant-design/cssinjs": "^1.22.0",
|
|
38
|
+
"@ant-design/cssinjs-utils": "^1.1.1",
|
|
39
|
+
"@ant-design/icons": "^5.5.2",
|
|
40
|
+
"@babel/runtime": "^7.11.2",
|
|
41
|
+
"@core-rc/rc-select": "^0.0.8",
|
|
42
|
+
"@ctrl/tinycolor": "^3.6.1",
|
|
43
|
+
"@faker-js/faker": "^9.5.0",
|
|
44
|
+
"@floating-ui/react": "^0.27.5",
|
|
45
|
+
"@rc-component/color-picker": "^2.0.1",
|
|
46
|
+
"@rc-component/father-plugin": "^2.0.1",
|
|
47
|
+
"@rc-component/trigger": "^2.0.0",
|
|
48
|
+
"@rc-component/util": "^1.0.1",
|
|
49
|
+
"@types/react-resizable": "^3.0.8",
|
|
50
|
+
"@types/styled-components": "^5.1.34",
|
|
51
|
+
"@vitest/coverage-v8": "^2.0.5",
|
|
52
|
+
"antd": "^5.24.1",
|
|
53
|
+
"antd-style": "^3.7.1",
|
|
54
|
+
"becoxy-icons": "^2.0.1",
|
|
55
|
+
"classnames": "^2.3.1",
|
|
56
|
+
"dayjs": "^1.11.13",
|
|
57
|
+
"lodash": "^4.17.21",
|
|
58
|
+
"moment": "^2.30.1",
|
|
59
|
+
"postcss": "^8.4.35",
|
|
60
|
+
"rc-checkbox": "^3.5.0",
|
|
61
|
+
"rc-dropdown": "^4.2.1",
|
|
62
|
+
"rc-field-form": "^2.6.0",
|
|
63
|
+
"rc-master-ui": "^1.1.31",
|
|
64
|
+
"rc-select": "^14.16.3",
|
|
65
|
+
"rc-tooltip": "^6.3.0",
|
|
66
|
+
"rc-tree": "^5.10.1",
|
|
67
|
+
"rc-tree-select": "^5.24.5",
|
|
68
|
+
"react-hook-form": "^7.54.2",
|
|
69
|
+
"react-hot-toast": "^2.5.2",
|
|
70
|
+
"react-numeric-component": "^1.0.7",
|
|
71
|
+
"react-resizable": "^3.0.5",
|
|
72
|
+
"react-tooltip": "^5.28.1",
|
|
73
|
+
"sass": "^1.81.0",
|
|
74
|
+
"styled-components": "^6.1.15",
|
|
75
|
+
"sweetalert2": "^11.4.14",
|
|
76
|
+
"sweetalert2-react-content": "^5.0.0",
|
|
77
|
+
"throttle-debounce": "^5.0.2",
|
|
78
|
+
"vitest": "^2.0.5"
|
|
79
|
+
},
|
|
80
|
+
"devDependencies": {
|
|
81
|
+
"@babel/cli": "^7.26.4",
|
|
82
|
+
"@babel/preset-env": "^7.26.9",
|
|
83
|
+
"@rc-component/np": "^1.0.3",
|
|
84
|
+
"@testing-library/react": "^14.0.0",
|
|
85
|
+
"@types/jest": "^29.4.0",
|
|
86
|
+
"@types/react": "^18.0.26",
|
|
87
|
+
"@types/react-dom": "^18.0.10",
|
|
88
|
+
"@types/warning": "^3.0.0",
|
|
89
|
+
"cross-env": "^7.0.0",
|
|
90
|
+
"dumi": "^2.2.13",
|
|
91
|
+
"eslint": "^8.56.0",
|
|
92
|
+
"eslint-plugin-unicorn": "^55.0.0",
|
|
93
|
+
"father": "^4.0.0",
|
|
94
|
+
"gh-pages": "^3.1.0",
|
|
95
|
+
"less": "^4.1.1",
|
|
96
|
+
"np": "^7.1.0",
|
|
97
|
+
"rc-test": "^7.0.9",
|
|
98
|
+
"react": "^18.2.0",
|
|
99
|
+
"react-dom": "^18.2.0",
|
|
100
|
+
"typescript": "^4.0.5"
|
|
101
|
+
},
|
|
102
|
+
"peerDependencies": {
|
|
103
|
+
"react": ">=16.9.0",
|
|
104
|
+
"react-dom": ">=16.9.0"
|
|
105
|
+
},
|
|
106
|
+
"umi": {
|
|
107
|
+
"configFile": "config.ts"
|
|
108
|
+
}
|
|
109
|
+
}
|