es-grid-template 1.3.5 → 1.3.7
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/assets/index.css +33 -13
- package/assets/index.scss +49 -14
- package/es/grid-component/EditableCell.js +1 -0
- package/es/grid-component/GridStyle.d.ts +5 -3
- package/es/grid-component/GridStyle.js +1 -1
- package/es/grid-component/TableGrid.js +16 -12
- package/es/grid-component/hooks/columns/index.js +4 -3
- package/es/grid-component/hooks/useColumns.js +7 -5
- package/es/grid-component/hooks/utils.d.ts +23 -0
- package/es/grid-component/hooks/utils.js +512 -2
- package/es/grid-component/number/index.d.ts +2 -2
- package/es/grid-component/number/index.js +2 -2
- package/es/grid-component/styles.scss +49 -14
- package/es/grid-component/table/Grid.js +1 -1
- package/es/grid-component/table/GridEdit.js +474 -206
- package/es/grid-component/table/Group.js +1 -1
- package/lib/grid-component/EditableCell.js +1 -0
- package/lib/grid-component/GridStyle.d.ts +5 -3
- package/lib/grid-component/GridStyle.js +1 -1
- package/lib/grid-component/TableGrid.js +14 -11
- package/lib/grid-component/hooks/columns/index.js +2 -1
- package/lib/grid-component/hooks/useColumns.js +7 -5
- package/lib/grid-component/hooks/utils.d.ts +23 -0
- package/lib/grid-component/hooks/utils.js +537 -8
- package/lib/grid-component/number/index.d.ts +2 -2
- package/lib/grid-component/number/index.js +2 -2
- package/lib/grid-component/styles.scss +49 -14
- package/lib/grid-component/table/Grid.js +1 -1
- package/lib/grid-component/table/GridEdit.js +474 -197
- package/lib/grid-component/table/Group.js +1 -1
- package/package.json +2 -2
|
@@ -574,6 +574,7 @@ const EditableCell = props => {
|
|
|
574
574
|
},
|
|
575
575
|
treeCheckable: column?.editSelectSettings?.selectMode === 'checkbox',
|
|
576
576
|
filterTreeNode: filterTreeNode,
|
|
577
|
+
popupMatchSelectWidth: menuWidth ? menuWidth + 10 : undefined,
|
|
577
578
|
onSelect: (val, option) => {
|
|
578
579
|
onChange(val ?? '');
|
|
579
580
|
const formState = getValues();
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
|
|
3
|
-
heightTable?: number | string;
|
|
4
|
-
}
|
|
2
|
+
interface GridProps {
|
|
3
|
+
$heightTable?: number | string;
|
|
4
|
+
}
|
|
5
|
+
export declare const GridStyle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, GridProps>> & string;
|
|
6
|
+
export {};
|
|
@@ -9,4 +9,4 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
9
9
|
const GridStyle = exports.GridStyle = _styledComponents.default.div.withConfig({
|
|
10
10
|
displayName: "GridStyle",
|
|
11
11
|
componentId: "es-grid-template__sc-sueu2e-0"
|
|
12
|
-
})([".ui-rc-table-container{min-height:", ";}.ui-rc-toolbar-bottom{position:relative;padding:.25rem 1rem;background-color:#ffffff;&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;visibility:visible;right:0;}.toolbar-button{border-radius:0;.ant-btn{border-radius:0;}}}.ui-rc-pagination{border-bottom:1px solid #e0e0e0;border-top:1px solid #e0e0e0;margin:0;padding:.75rem 1rem;background-color:#ffffff;.ui-rc-pagination-total-text{order:2;margin-left:auto;}&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:50px;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:50px;bottom:0;visibility:visible;right:0;}&.pagination-template{position:relative;&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;visibility:visible;right:0;}}}.react-resizable{position:relative;background-clip:padding-box;}.rc-resizable-handle{position:absolute;right:0px;bottom:0;z-index:1;width:5px;height:100%;cursor:col-resize;&.none{cursor:auto;display:none;}}"], props => props
|
|
12
|
+
})([".ui-rc-table-container{min-height:", ";}.ui-rc-toolbar-bottom{position:relative;padding:.25rem 1rem;background-color:#ffffff;&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;visibility:visible;right:0;}.toolbar-button{border-radius:0;.ant-btn{border-radius:0;}}}.ui-rc-pagination{border-bottom:1px solid #e0e0e0;border-top:1px solid #e0e0e0;margin:0;padding:.75rem 1rem;background-color:#ffffff;.ui-rc-pagination-total-text{order:2;margin-left:auto;}&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:50px;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:50px;bottom:0;visibility:visible;right:0;}&.pagination-template{position:relative;&::before{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;left:0;}&::after{content:\"\";position:absolute;border-left:1px solid #e0e0e0;height:100%;bottom:0;visibility:visible;right:0;}}}.react-resizable{position:relative;background-clip:padding-box;}.rc-resizable-handle{position:absolute;right:0px;bottom:0;z-index:1;width:5px;height:100%;cursor:col-resize;&.none{cursor:auto;display:none;}}"], props => props.$heightTable ? typeof props.$heightTable === 'string' ? props.$heightTable : `${props.$heightTable}px` : undefined);
|
|
@@ -24,6 +24,8 @@ var _AdvanceFilter = _interopRequireDefault(require("./AdvanceFilter"));
|
|
|
24
24
|
var _reactTooltip = require("react-tooltip");
|
|
25
25
|
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); }
|
|
26
26
|
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
|
+
// import Table from "../../core/table"
|
|
28
|
+
|
|
27
29
|
// import {ConfigProvider} from "antd";
|
|
28
30
|
|
|
29
31
|
const convertFilters = filters => {
|
|
@@ -366,8 +368,10 @@ const TableGrid = props => {
|
|
|
366
368
|
loading: {
|
|
367
369
|
spinning: columns && columns.length === 0 || loading === true,
|
|
368
370
|
indicator: /*#__PURE__*/_react.default.createElement(_LoadingSpinner.default, null)
|
|
369
|
-
}
|
|
370
|
-
dataSource
|
|
371
|
+
}
|
|
372
|
+
// dataSource={columns && columns.length > 0 ? filterDataByColumns3(dataSource, filterStates) : []}
|
|
373
|
+
,
|
|
374
|
+
dataSource: columns && columns.length > 0 ? (0, _hooks.filterDataByColumns4)(dataSource, filterStates) : []
|
|
371
375
|
// dataSource={columns && columns.length > 0 && loading !== true ? dataSource : []}
|
|
372
376
|
// className={styles.customTable}
|
|
373
377
|
,
|
|
@@ -392,17 +396,16 @@ const TableGrid = props => {
|
|
|
392
396
|
},
|
|
393
397
|
rowSelection: columns && columns.length === 0 ? undefined : {
|
|
394
398
|
...selectionSettings,
|
|
395
|
-
type: selectionSettings?.mode
|
|
396
|
-
|
|
399
|
+
// type: selectionSettings?.mode,
|
|
400
|
+
type: mode,
|
|
401
|
+
columnWidth: columnWidth ?? 50,
|
|
397
402
|
onChange: onSelectChange,
|
|
398
403
|
// selectedRowKeys: mode === 'checkbox' && type === 'single' ? selectedRowKeys : undefined,
|
|
399
404
|
selectedRowKeys: mergedSelectedKeys,
|
|
400
|
-
defaultSelectedRowKeys: selectionSettings?.defaultSelectedRowKeys,
|
|
405
|
+
// defaultSelectedRowKeys: selectionSettings?.defaultSelectedRowKeys,
|
|
406
|
+
defaultSelectedRowKeys: defaultSelectedRowKeys,
|
|
401
407
|
preserveSelectedRowKeys: true,
|
|
402
|
-
|
|
403
|
-
// checkStrictly: false,
|
|
404
|
-
|
|
405
|
-
hideSelectAll: !type || type === 'single' || selectionSettings?.mode === 'radio' ? true : hideSelectAll ?? type !== 'multiple'
|
|
408
|
+
hideSelectAll: !type || type === 'single' || mode === 'radio' ? true : hideSelectAll ?? type !== 'multiple'
|
|
406
409
|
}
|
|
407
410
|
|
|
408
411
|
// onScroll={() => {
|
|
@@ -419,7 +422,7 @@ const TableGrid = props => {
|
|
|
419
422
|
}
|
|
420
423
|
return /*#__PURE__*/_react.default.createElement(_rcMasterUi.Table.Summary, {
|
|
421
424
|
fixed: true
|
|
422
|
-
}, /*#__PURE__*/_react.default.createElement(_rcMasterUi.Table.Summary.Row, null, (0, _columns.flatColumns)([_rcMasterUi.Table.SELECTION_COLUMN, ...columns]).filter(col => col.hidden !== true).map((col, index) => {
|
|
425
|
+
}, /*#__PURE__*/_react.default.createElement(_rcMasterUi.Table.Summary.Row, null, (0, _columns.flatColumns)(!!mode ? [_rcMasterUi.Table.SELECTION_COLUMN, ...columns] : [...columns]).filter(col => col.hidden !== true).map((col, index) => {
|
|
423
426
|
const thousandSeparator = col.format?.thousandSeparator ? col.format?.thousandSeparator : format?.thousandSeparator;
|
|
424
427
|
const decimalSeparator = col.format?.decimalSeparator ? col.format?.decimalSeparator : format?.decimalSeparator;
|
|
425
428
|
const dec = col.format?.decimalScale || col.format?.decimalScale === 0 ? col.format?.decimalScale : format?.decimalScale;
|
|
@@ -443,7 +446,7 @@ const TableGrid = props => {
|
|
|
443
446
|
}, col.summaryTemplate ? col.summaryTemplate(cellValue, col.key) : (0, _reactNumericComponent.numericFormatter)(cellValue, numericFormatProps));
|
|
444
447
|
})));
|
|
445
448
|
},
|
|
446
|
-
pagination: !pagination || pagination && pagination
|
|
449
|
+
pagination: !pagination || pagination && pagination?.onChange ? false : {
|
|
447
450
|
showTotal: (total, range) => `${range[0]}-${range[1]} / ${total} items`,
|
|
448
451
|
...pagination
|
|
449
452
|
},
|
|
@@ -87,7 +87,8 @@ const getValueCell = (column, value, format) => {
|
|
|
87
87
|
|
|
88
88
|
// const contentNumber = !isEmpty(value) ? ((dec || dec === 0) ? parseFloat(Number(value).toFixed(dec)).toString() : value.toString()) : '0'
|
|
89
89
|
|
|
90
|
-
const
|
|
90
|
+
const tmpval = typeof value === 'string' ? Number(value) : value;
|
|
91
|
+
const contentNumber = !(0, _utils.isEmpty)(value) ? dec || dec === 0 ? parseFloat(tmpval.toFixed(dec)).toString() : tmpval.toString() : '0';
|
|
91
92
|
const numericFormatProps = {
|
|
92
93
|
thousandSeparator: (0, _utils.checkThousandSeparator)(thousandSeparator, decimalSeparator),
|
|
93
94
|
decimalSeparator: (0, _utils.checkDecimalSeparator)(thousandSeparator, decimalSeparator),
|
|
@@ -165,8 +165,8 @@ const useColumns = config => {
|
|
|
165
165
|
const transformColumns = (0, _react.useCallback)(columns => {
|
|
166
166
|
// >>>>>>>>>>> Support selection
|
|
167
167
|
const cloneColumns = [...columns];
|
|
168
|
-
const firstNonGroupColumn = (0, _columns.flatColumns2)(cloneColumns).find(col => col.field && col.field !== '#' &&
|
|
169
|
-
const nonGroupColumns = (0, _columns.flatColumns2)(cloneColumns).filter(col => col.field && col.field !== '#' &&
|
|
168
|
+
const firstNonGroupColumn = (0, _columns.flatColumns2)(cloneColumns).find(col => col.field && col.field !== '#' && !groupColumns?.includes(col.field) && col.hidden !== true);
|
|
169
|
+
const nonGroupColumns = (0, _columns.flatColumns2)(cloneColumns).filter(col => col.field && col.field !== '#' && !groupColumns?.includes(col.field) && col.hidden !== true);
|
|
170
170
|
|
|
171
171
|
// ===================== Render =====================
|
|
172
172
|
|
|
@@ -202,19 +202,18 @@ const useColumns = config => {
|
|
|
202
202
|
children: convertColumns(transformedColumn.children)
|
|
203
203
|
};
|
|
204
204
|
}
|
|
205
|
-
if (
|
|
205
|
+
if (transformedColumn.field === '#') {
|
|
206
206
|
return {
|
|
207
207
|
...transformedColumn,
|
|
208
208
|
onCell: () => ({
|
|
209
209
|
className: 'cell-number'
|
|
210
210
|
}),
|
|
211
211
|
render: (val, record) => {
|
|
212
|
-
// return rowIndex + 1
|
|
213
212
|
return (0, _utils.findItemPath)(dataSource, record, rowKey);
|
|
214
213
|
}
|
|
215
214
|
};
|
|
216
215
|
}
|
|
217
|
-
if (
|
|
216
|
+
if (transformedColumn.field === 'command') {
|
|
218
217
|
return {
|
|
219
218
|
...transformedColumn,
|
|
220
219
|
onCell: () => ({
|
|
@@ -300,6 +299,9 @@ const useColumns = config => {
|
|
|
300
299
|
}
|
|
301
300
|
if (col.field === firstNonGroupColumn?.field && record.children) {
|
|
302
301
|
const currentGroupColumn = (0, _columns.flatColumns2)(cols).find(it => it.field === record.field);
|
|
302
|
+
if (currentGroupColumn?.template) {
|
|
303
|
+
return (0, _columns.renderContent)(currentGroupColumn, record[record.field], record, rowIndex, format);
|
|
304
|
+
}
|
|
303
305
|
return /*#__PURE__*/React.createElement("span", null, currentGroupColumn?.headerText, ": ", (0, _columns.renderContent)(currentGroupColumn, record[record.field], record, rowIndex, format));
|
|
304
306
|
}
|
|
305
307
|
return (0, _columns.renderContent)(col, value, record, rowIndex, format);
|
|
@@ -62,6 +62,13 @@ export declare function addRows8(arr: any, n: number): {
|
|
|
62
62
|
combined: any[];
|
|
63
63
|
addedRows: any[];
|
|
64
64
|
};
|
|
65
|
+
export declare function addRowsUp(array: any, n: number): {
|
|
66
|
+
combined: any;
|
|
67
|
+
addedRows: any[];
|
|
68
|
+
} | {
|
|
69
|
+
combined: any[];
|
|
70
|
+
addedRows: any[];
|
|
71
|
+
};
|
|
65
72
|
export declare const transformColumns: <RecordType>(cols: ColumnsTable<RecordType>, convertColumns: any[], t?: any) => ColumnsTable<RecordType>;
|
|
66
73
|
export declare const transformColumns1: <RecordType>(cols: ColumnsTable<RecordType>, sortMultiple?: boolean) => ColumnsTable<RecordType>;
|
|
67
74
|
export declare const removeColumns: <RecordType>(columns: ColumnTable<RecordType>[], groupColumns: string[]) => ColumnsTable<RecordType>;
|
|
@@ -76,6 +83,8 @@ export declare const filterDataByColumns: (data: any[], queries: any) => any[];
|
|
|
76
83
|
export declare const filterDataByColumns2: (data: any[], queries: any) => any[];
|
|
77
84
|
export declare const removeFieldRecursive: (data: any[], field: string) => any[];
|
|
78
85
|
export declare const filterDataByColumns3: (data: any[], queries: any[]) => any[];
|
|
86
|
+
export declare const shouldInclude: (item: any, queries: any[]) => any;
|
|
87
|
+
export declare function filterDataByColumns4(data: any[], queries: any[]): any[];
|
|
79
88
|
export declare function isDateString(str: any): boolean;
|
|
80
89
|
export declare function compareDates(date1: any, date2: any): boolean;
|
|
81
90
|
export declare function compareDate(itemValue: any, value: any): boolean;
|
|
@@ -93,3 +102,17 @@ export declare function isRightMostInRegion(rowIndex: number, colIndex: number,
|
|
|
93
102
|
export declare function isEqualSet(setA: any, setB: any): boolean;
|
|
94
103
|
export declare function isBottomMostInRanges(rowIndex: number, colIndex: number, regions: any[]): boolean;
|
|
95
104
|
export declare const mergedSets: (arr: any[]) => Set<unknown>;
|
|
105
|
+
export declare const sortedSetASC: (setValue: any) => Set<unknown>;
|
|
106
|
+
export declare const sortedSetDSC: (setValue: any) => Set<unknown>;
|
|
107
|
+
export declare function getBottomRowCells(cellSet: any): any[];
|
|
108
|
+
export declare function getCellsByPosition(cellSet: any, position?: string): any[];
|
|
109
|
+
export declare const addBorderClass: (selectedCells: any, type: string, className: string, id?: string) => void;
|
|
110
|
+
export declare const removeBorderClass: (selectedCells: any, type: string, className: string, id?: string) => void;
|
|
111
|
+
export declare const onAddClassBgSelectedCell: (selectedCells: any, id?: string) => void;
|
|
112
|
+
export declare const onRemoveClassSelectedCell: (selectedCells: any, id?: string, rowsSelected?: any) => void;
|
|
113
|
+
export declare const addClassBorderPasteCell: (pasteCells: any, type: 'up' | 'down', id?: string) => void;
|
|
114
|
+
export declare const removeClassBorderPasteCell: (pasteCells: any, type: 'up' | 'down', id?: string) => void;
|
|
115
|
+
export declare const addClassCellIndexSelected: (rowsSelected: any, id?: string) => void;
|
|
116
|
+
export declare const removeClassCellIndexSelected: (rowsSelected: any, id?: string) => void;
|
|
117
|
+
export declare const showDraggingPoint: (selectedCells: any, id?: any) => void;
|
|
118
|
+
export declare const hideDraggingPoint: (selectedCells: any, id?: any) => void;
|