es-grid-template 1.9.62 → 1.9.63

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.
Files changed (16) hide show
  1. package/es/ali-table/Grid.js +1 -1
  2. package/es/ali-table/InternalTable.js +1 -0
  3. package/es/ali-table/base-table/styles.js +1 -1
  4. package/es/ali-table/pipeline/features/columnCustom.d.ts +1 -0
  5. package/es/ali-table/pipeline/features/columnCustom.js +63 -57
  6. package/es/ali-table/utils/utility.d.ts +1 -0
  7. package/es/ali-table/utils/utility.js +43 -1
  8. package/es/group-component/hook/utils.d.ts +3 -3
  9. package/lib/ali-table/Grid.js +1 -1
  10. package/lib/ali-table/InternalTable.js +1 -0
  11. package/lib/ali-table/base-table/styles.js +1 -1
  12. package/lib/ali-table/pipeline/features/columnCustom.d.ts +1 -0
  13. package/lib/ali-table/pipeline/features/columnCustom.js +63 -57
  14. package/lib/ali-table/utils/utility.d.ts +1 -0
  15. package/lib/ali-table/utils/utility.js +45 -1
  16. package/package.json +1 -1
package/es/ali-table/Grid.js CHANGED
@@ -368,7 +368,7 @@ const Grid = /*#__PURE__*/React.forwardRef((props, ref) => {
368
368
  theme: theme,
369
369
  dataRowIds: dataRowIds,
370
370
  footerDataSource: footerDataSource
371
- })), (bottom || pagination && !infiniteScroll) && /*#__PURE__*/React.createElement("div", {
371
+ })), (bottom || toolbarItemsBottom && toolbarItemsBottom.length > 0 || pagination && !infiniteScroll) && /*#__PURE__*/React.createElement("div", {
372
372
  className: classNames(`${prefix}-grid-bottom`, {})
373
373
  }, bottom, toolbarItemsBottom && toolbarItemsBottom.length > 0 && /*#__PURE__*/React.createElement("div", {
374
374
  className: classNames('ui-rc-toolbar-bottom', {
package/es/ali-table/InternalTable.js CHANGED
@@ -443,6 +443,7 @@ const InternalTable = props => {
443
443
  handleSubmit,
444
444
  onSubmit,
445
445
  triggerPaste,
446
+ headerEditAble,
446
447
  handleCellChange,
447
448
  handleHeaderCellChange,
448
449
  headerData
package/es/ali-table/base-table/styles.js CHANGED
@@ -60,7 +60,7 @@ const outerBorderStyleMixin = css(["border-top:var(--cell-border-horizontal);bor
60
60
  export const StyleTableContainer = styled.div.withConfig({
61
61
  displayName: "StyleTableContainer",
62
62
  componentId: "es-grid-template__sc-ipj1ht-0"
63
- })(["--row-height:34px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:34px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--border-color-select:#eb4619;--cell-border:1px solid var(--border-color);--cell-border-select:1px solid var(--border-color-select);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{border-left:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),0px 0 0 0 var(--border-color);}}}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{&.use-outer-border{border-bottom:var(--header-cell-border);}.", "{border-top:0;td,th{border-bottom:0;border-top:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td,th{border:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.auto-height{.ui-rc-grid-bottom{border-top:0;}}.ui-rc-grid-bottom{border-top:var(--cell-border-horizontal);}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
63
+ })(["--row-height:34px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:34px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--border-color-select:#eb4619;--cell-border:1px solid var(--border-color);--cell-border-select:1px solid var(--border-color-select);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{border-left:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),0px 0 0 0 var(--border-color);}}}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{&.use-outer-border{border-bottom:var(--header-cell-border);}.", "{border-top:0;td,th{border-bottom:0;border-top:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td,th{border:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.auto-height{.ui-rc-grid-bottom{border-top:0;}}.ui-rc-grid-bottom{border-top:var(--cell-border-horizontal);}.ui-rc-toolbar-bottom{.be-toolbar-item{.ui-rc-btn{font-size:12px;line-height:1.5}.toolbar-dropdown-button{font-size:12px;.ui-rc-btn.ui-rc-btn-default.ui-rc-btn-variant-outlined.ui-rc-btn-compact-item.ui-rc-btn-compact-first-item{border-color:#28c76f;}.ui-rc-btn.ui-rc-btn-default.ui-rc-btn-variant-outlined.ui-rc-btn-compact-item.ui-rc-btn-compact-last-item{border-color:#28c76f;.ui-rc-btn-icon{color:#28c76f;}}}}}.ui-rc-toolbar-bottom{position:relative;padding:.15rem 0.5rem;background-color:#ffffff;.toolbar-button{border-radius:3px;}.ui-rc-btn{border-radius:3px;height:28px;&.ui-rc-btn-compact-item.ui-rc-btn-compact-last-item{border-start-start-radius:0;border-end-start-radius:0;}&.ui-rc-btn-compact-item.ui-rc-btn-compact-first-item{border-start-end-radius:0;border-end-end-radius:0;}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
64
64
  export const StyledArtTableWrapper = styled.div.withConfig({
65
65
  displayName: "StyledArtTableWrapper",
66
66
  componentId: "es-grid-template__sc-ipj1ht-1"
package/es/ali-table/pipeline/features/columnCustom.d.ts CHANGED
@@ -72,6 +72,7 @@ export interface ColumnFeatureOptions {
72
72
  handleHeaderCellChange?: any;
73
73
  dataErrors?: any[];
74
74
  headerData?: any;
75
+ headerEditAble?: boolean;
75
76
  }
76
77
  export declare function columnCustom(opts: ColumnFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
77
78
  export {};
package/es/ali-table/pipeline/features/columnCustom.js CHANGED
@@ -61,7 +61,8 @@ export function columnCustom(opts) {
61
61
  handleCellChange,
62
62
  handleHeaderCellChange,
63
63
  dataErrors,
64
- headerData
64
+ headerData,
65
+ headerEditAble
65
66
  // originData
66
67
 
67
68
  // currentPage = 1,
@@ -448,7 +449,7 @@ export function columnCustom(opts) {
448
449
  pastedRows.push(newData[targetRow]);
449
450
  });
450
451
  }
451
- const rsFilterData = updateOrInsert(flattenArray([...dataSource]), newData);
452
+ const rsFilterData = updateOrInsert(flattenArray(dataSource), newData);
452
453
  const rs = unFlattenData(rsFilterData);
453
454
  triggerPaste?.(pastedRows, colPasteds, rs, copyRows);
454
455
  pipeline.setStateAtKey(stateKeyEndCell, endPasteCell);
@@ -507,7 +508,7 @@ export function columnCustom(opts) {
507
508
  // Lưu dòng được paste
508
509
  pastedRows.push(newData[targetRow]);
509
510
  });
510
- const rsFilterData = updateOrInsert(flattenArray([...dataSource]), newData);
511
+ const rsFilterData = updateOrInsert(flattenArray(dataSource), newData);
511
512
  const rs = unFlattenData(rsFilterData);
512
513
  triggerPaste?.(pastedRows, colPasteds, rs, copyRows);
513
514
  };
@@ -1269,7 +1270,7 @@ export function columnCustom(opts) {
1269
1270
  [`${prefix}-grid-cell-text-center`]: (col?.headerTextAlign ?? col?.textAlign) === 'center',
1270
1271
  [`${prefix}-grid-cell-text-right`]: (col?.headerTextAlign ?? col.textAlign) === 'right'
1271
1272
  })
1272
- }, col.headerEditEnable && cellHeaderEditing ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(HeaderEditCell, {
1273
+ }, headerEditAble && col.headerEditEnable && cellHeaderEditing ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(HeaderEditCell, {
1273
1274
  column: col,
1274
1275
  editType: headerEditType ?? 'text',
1275
1276
  record: headerRecord,
@@ -1293,7 +1294,7 @@ export function columnCustom(opts) {
1293
1294
  startCell: startCell,
1294
1295
  handleSubmit: handleSubmit,
1295
1296
  onSubmit: onSubmit
1296
- })) : col.headerEditEnable ? /*#__PURE__*/React.createElement(React.Fragment, null, headerValue) : col.headerTemplate ? /*#__PURE__*/React.createElement(React.Fragment, null, typeof col.headerTemplate === 'function' ? col.headerTemplate(col) : col.headerTemplate) : /*#__PURE__*/React.createElement(React.Fragment, null, prevTitle))), !col.headerEditEnable && (!nonActionColumn.includes(col.field) && !col?.children || col?.children && col?.children.length < 1) && /*#__PURE__*/React.createElement("span", {
1297
+ })) : headerEditAble && col.headerEditEnable ? /*#__PURE__*/React.createElement(React.Fragment, null, headerValue) : col.headerTemplate ? /*#__PURE__*/React.createElement(React.Fragment, null, typeof col.headerTemplate === 'function' ? col.headerTemplate(col) : col.headerTemplate) : /*#__PURE__*/React.createElement(React.Fragment, null, prevTitle))), !col.headerEditEnable && (!nonActionColumn.includes(col.field) && !col?.children || col?.children && col?.children.length < 1) && /*#__PURE__*/React.createElement("span", {
1297
1298
  className: "ui-rc-header-trigger d-flex gap-50"
1298
1299
  }, canSort && /*#__PURE__*/React.createElement("div", {
1299
1300
  style: {
@@ -1376,84 +1377,89 @@ export function columnCustom(opts) {
1376
1377
  onDoubleClick: e => {
1377
1378
  // prevCellProps?.onDoubleClick?.(e)
1378
1379
 
1379
- if (!col.headerEditEnable) {
1380
- e.stopPropagation();
1381
- e.preventDefault();
1382
- return;
1383
- }
1384
- if (headerRowId === focusedCell.rowId && col.field === focusedCell.colId && col.headerEditEnable) {
1385
- handleEdit(e, headerRecord, col, headerEditType ?? 'text', false, true);
1380
+ if (headerEditAble) {
1381
+ if (!col.headerEditEnable) {
1382
+ e.stopPropagation();
1383
+ e.preventDefault();
1384
+ return;
1385
+ }
1386
+ if (headerRowId === focusedCell.rowId && col.field === focusedCell.colId && col.headerEditEnable) {
1387
+ handleEdit(e, headerRecord, col, headerEditType ?? 'text', false, true);
1388
+ }
1386
1389
  }
1387
1390
  },
1388
1391
  onKeyDown: e => {
1389
1392
  // prevCellProps?.onKeyDown?.(e)
1390
1393
  // chưa editing
1391
- if (!isEditing) {
1392
- handleHeaderKeyDown(e, headerRowId, col.field, headerRowIndex, col, headerRecord, headerEditType ?? 'text');
1393
- } else {
1394
- if (e.shiftKey && e.key === 'Enter') {
1395
- e.preventDefault();
1396
- e.stopPropagation();
1394
+
1395
+ if (headerEditAble) {
1396
+ if (!isEditing) {
1397
+ handleHeaderKeyDown(e, headerRowId, col.field, headerRowIndex, col, headerRecord, headerEditType ?? 'text');
1397
1398
  } else {
1398
- if (e.key === 'Enter') {
1399
+ if (e.shiftKey && e.key === 'Enter') {
1399
1400
  e.preventDefault();
1400
1401
  e.stopPropagation();
1402
+ } else {
1403
+ if (e.key === 'Enter') {
1404
+ e.preventDefault();
1405
+ e.stopPropagation();
1401
1406
 
1402
- // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1403
- // const nextRow = allRows[currentRowIndex + 1];
1407
+ // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1408
+ // const nextRow = allRows[currentRowIndex + 1];
1404
1409
 
1405
- // if (nextRow) {
1406
- // const nextCellPosition = { rowId: nextRow.rowId, colId: col.field }
1410
+ // if (nextRow) {
1411
+ // const nextCellPosition = { rowId: nextRow.rowId, colId: col.field }
1407
1412
 
1408
- // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1409
- // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1410
- // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1413
+ // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1414
+ // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1415
+ // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1411
1416
 
1412
- handleHeaderChange(headerRecord, col, startIndex);
1413
- pipeline.setStateAtKey(stateKeyIsEditing, false);
1417
+ handleHeaderChange(headerRecord, col, startIndex);
1418
+ pipeline.setStateAtKey(stateKeyIsEditing, false);
1414
1419
 
1415
- // }
1416
- }
1417
- if (e.key === 'Tab') {
1418
- e.preventDefault();
1420
+ // }
1421
+ }
1422
+ if (e.key === 'Tab') {
1423
+ e.preventDefault();
1419
1424
 
1420
- // const nextCol = getNextColumn(allCols, col.field)
1425
+ // const nextCol = getNextColumn(allCols, col.field)
1421
1426
 
1422
- if (nextHeaderCol?.column?.field && !nextHeaderCol?.isWrapped) {
1423
- const nextCellPosition = {
1424
- rowId: headerRowId,
1425
- colId: nextHeaderCol.column.field
1426
- };
1427
- pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition);
1428
- pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition);
1429
- pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition);
1427
+ if (nextHeaderCol?.column?.field && !nextHeaderCol?.isWrapped) {
1428
+ const nextCellPosition = {
1429
+ rowId: headerRowId,
1430
+ colId: nextHeaderCol.column.field
1431
+ };
1432
+ pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition);
1433
+ pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition);
1434
+ pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition);
1430
1435
 
1431
- // columnVirtualizer.scrollToIndex(nextCol.getIndex(), { align: 'center' })
1432
- } else {
1433
- // Nếu là cột cuối cùng, có thể nhảy xuống dòng tiếp theo
1436
+ // columnVirtualizer.scrollToIndex(nextCol.getIndex(), { align: 'center' })
1437
+ } else {
1438
+ // Nếu là cột cuối cùng, có thể nhảy xuống dòng tiếp theo
1434
1439
 
1435
- // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1436
- // const nextRow = allRows[currentRowIndex + 1];
1440
+ // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1441
+ // const nextRow = allRows[currentRowIndex + 1];
1437
1442
 
1438
- // const firstCol = nextCol.column
1443
+ // const firstCol = nextCol.column
1439
1444
 
1440
- // if (nextRow) {
1445
+ // if (nextRow) {
1441
1446
 
1442
- // const nextCellPosition = { rowId: nextRow.rowId, colId: firstCol.field }
1447
+ // const nextCellPosition = { rowId: nextRow.rowId, colId: firstCol.field }
1443
1448
 
1444
- // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1449
+ // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1445
1450
 
1446
- // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1447
- // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1451
+ // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1452
+ // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1448
1453
 
1449
- // // columnVirtualizer.scrollToIndex(nextRowCol.getIndex())
1454
+ // // columnVirtualizer.scrollToIndex(nextRowCol.getIndex())
1450
1455
 
1451
- // // rowVirtualizer.scrollToIndex(nextRow.index, { align: 'auto' })
1456
+ // // rowVirtualizer.scrollToIndex(nextRow.index, { align: 'auto' })
1452
1457
 
1453
- // }
1458
+ // }
1459
+ }
1460
+ handleHeaderChange(headerRecord, col, startIndex);
1461
+ pipeline.setStateAtKey(stateKeyIsEditing, false);
1454
1462
  }
1455
- handleHeaderChange(headerRecord, col, startIndex);
1456
- pipeline.setStateAtKey(stateKeyIsEditing, false);
1457
1463
  }
1458
1464
  }
1459
1465
  }
package/es/ali-table/utils/utility.d.ts CHANGED
@@ -9,4 +9,5 @@ export declare function sortData1(data: any[], sorter: Sorter[]): any[];
9
9
  export declare function sortData(data: any[], sorter: Sorter[]): any[];
10
10
  export declare function filterDataByColumns1(data: any[], queries: FilterItem[] | undefined, sorter: Sorter[] | undefined, keysFilter: string[] | undefined, ignoreAccents?: boolean): any[];
11
11
  export declare const getMaxDepth: (data: any[]) => number;
12
+ export declare const addRowIdArray: (inputArray: any[]) => any[];
12
13
  export {};
package/es/ali-table/utils/utility.js CHANGED
@@ -1,4 +1,4 @@
1
- import { compareDates, compareValues, convertFomatedDateToDate, getSortValue, isDate, isDateString, isDateValue, parseToDate, removeVietnameseTones } from "../../table-component/hook/utils";
1
+ import { compareDates, compareValues, convertFomatedDateToDate, getSortValue, isDate, isDateString, isDateValue, newGuid, parseToDate, removeVietnameseTones } from "../../table-component/hook/utils";
2
2
  const prepareFilters = (queries, ignoreAccents = true) => {
3
3
  return queries.map(query => {
4
4
  const {
@@ -252,4 +252,46 @@ export const getMaxDepth = data => {
252
252
  }
253
253
  }
254
254
  return maxDepth;
255
+ };
256
+ export const addRowIdArray = inputArray => {
257
+ if (!inputArray || inputArray.length === 0) return [];
258
+ const result = new Array(inputArray.length);
259
+ const pending = [];
260
+ for (let index = inputArray.length - 1; index >= 0; index -= 1) {
261
+ pending.push({
262
+ source: inputArray[index],
263
+ target: result,
264
+ index
265
+ });
266
+ }
267
+ while (pending.length > 0) {
268
+ const {
269
+ source,
270
+ target,
271
+ index,
272
+ parentId
273
+ } = pending.pop();
274
+ const rowId = source.id ?? source.rowId ?? newGuid();
275
+ const node = {
276
+ ...source,
277
+ rowId,
278
+ ...(parentId !== undefined && source.parentId == null ? {
279
+ parentId
280
+ } : {})
281
+ };
282
+ target[index] = node;
283
+ if (Array.isArray(source.children) && source.children.length > 0) {
284
+ const children = new Array(source.children.length);
285
+ node.children = children;
286
+ for (let childIndex = source.children.length - 1; childIndex >= 0; childIndex -= 1) {
287
+ pending.push({
288
+ source: source.children[childIndex],
289
+ target: children,
290
+ index: childIndex,
291
+ parentId: rowId
292
+ });
293
+ }
294
+ }
295
+ }
296
+ return result;
255
297
  };
package/es/group-component/hook/utils.d.ts CHANGED
@@ -196,10 +196,10 @@ export declare const fixColumnsLeft: <RecordType>(columns: ColumnTable<RecordTyp
196
196
  value: any;
197
197
  rowData: RecordType;
198
198
  }) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | import("react").ReactNode);
199
- onCellStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
200
- onCellHeaderStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
199
+ onCellStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Cell<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
200
+ onCellHeaderStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
201
201
  onCell?: (rowData: RecordType, index: number) => import("react").TdHTMLAttributes<HTMLTableCellElement>;
202
- onCellFooterStyles?: Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "width" | "minWidth" | "left" | "right" | "position" | "display">);
202
+ onCellFooterStyles?: Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width"> | ((cellValue: any, cell: import("@tanstack/react-table").Header<RecordType, unknown>) => Omit<CSSProperties, "left" | "right" | "position" | "display" | "minWidth" | "width">);
203
203
  getValue?: (row: any, rowIndex: number) => any;
204
204
  getCellProps?: (value: any, row: any, rowIndex: number) => import("./../../grid-component/type").CellProps;
205
205
  headerCellProps?: import("./../../grid-component/type").CellProps;
package/lib/ali-table/Grid.js CHANGED
@@ -378,7 +378,7 @@ const Grid = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
378
378
  theme: theme,
379
379
  dataRowIds: dataRowIds,
380
380
  footerDataSource: footerDataSource
381
- })), (bottom || pagination && !infiniteScroll) && /*#__PURE__*/_react.default.createElement("div", {
381
+ })), (bottom || toolbarItemsBottom && toolbarItemsBottom.length > 0 || pagination && !infiniteScroll) && /*#__PURE__*/_react.default.createElement("div", {
382
382
  className: (0, _classnames.default)(`${prefix}-grid-bottom`, {})
383
383
  }, bottom, toolbarItemsBottom && toolbarItemsBottom.length > 0 && /*#__PURE__*/_react.default.createElement("div", {
384
384
  className: (0, _classnames.default)('ui-rc-toolbar-bottom', {
package/lib/ali-table/InternalTable.js CHANGED
@@ -448,6 +448,7 @@ const InternalTable = props => {
448
448
  handleSubmit,
449
449
  onSubmit,
450
450
  triggerPaste,
451
+ headerEditAble,
451
452
  handleCellChange,
452
453
  handleHeaderCellChange,
453
454
  headerData
package/lib/ali-table/base-table/styles.js CHANGED
@@ -68,7 +68,7 @@ const outerBorderStyleMixin = (0, _styledComponents.css)(["border-top:var(--cell
68
68
  const StyleTableContainer = exports.StyleTableContainer = _styledComponents.default.div.withConfig({
69
69
  displayName: "StyleTableContainer",
70
70
  componentId: "es-grid-template__sc-ipj1ht-0"
71
- })(["--row-height:34px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:34px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--border-color-select:#eb4619;--cell-border:1px solid var(--border-color);--cell-border-select:1px solid var(--border-color-select);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{border-left:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),0px 0 0 0 var(--border-color);}}}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{&.use-outer-border{border-bottom:var(--header-cell-border);}.", "{border-top:0;td,th{border-bottom:0;border-top:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td,th{border:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.auto-height{.ui-rc-grid-bottom{border-top:0;}}.ui-rc-grid-bottom{border-top:var(--cell-border-horizontal);}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
71
+ })(["--row-height:34px;--color:#333;--bgcolor:white;--body-hover-bgcolor:#f5f5f5;--body-hover-color:#333;--hover-bgcolor:var(--body-hover-bgcolor,#f5f5f5);--hover-color:var(--body-hover-color);--highlight-bgcolor:#eee;--header-row-height:34px;--header-color:#000000de;--header-bgcolor:#ffffff;--header-hover-bgcolor:#ddd;--header-highlight-bgcolor:#e4e8ed;--cell-padding:7px 8px;--font-size:13px;--line-height:1.28571;--lock-shadow:rgba(152,152,152,0.5) 0 0 6px 2px;--border-color:#dfe3e8;--border-color-select:#eb4619;--cell-border:1px solid var(--border-color);--cell-border-select:1px solid var(--border-color-select);--cell-border-horizontal:var(--cell-border);--cell-border-vertical:var(--cell-border);--header-cell-border:1px solid var(--border-color);--header-cell-border-horizontal:var(--header-cell-border);--header-cell-border-vertical:var(--header-cell-border);--footer-bgcolor:#fafafa;&.", "{--bgcolor:#343e59;--footer-bgcolor:#2e3342;--header-bgcolor:#343e59;--hover-bgcolor:#232b43;--header-hover-bgcolor:#606164;--highlight-bgcolor:#eff2f5;--header-highlight-bgcolor:#191a1b;--hover-color:#dadde1;--color:#dadde1;--header-color:#dadde1;--lock-shadow:rgb(37 37 37 / 0.5) 0 0 6px 2px;--border-color:#4f5266;background-color:var(--bgcolor);}&.use-outer-border{", ";}&.", "{.", "{border-left:0;border-right:0;td,th{border-right:0;}td.first,th.first{border-left:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}tr{td{&.lock-left,&.lock-right{border-bottom-width:0;box-shadow:0 -1px 0 0 var(--border-color),0 0px 0 0 var(--border-color),0px 0 0 0 var(--border-color);}}}&.has-footer tfoot tr.last td{}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{&.use-outer-border{border-bottom:var(--header-cell-border);}.", "{border-top:0;td,th{border-bottom:0;border-top:0;}td.lock-left{box-shadow:none;}td.first,th.first{}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{}}}&.", "{.", "{border:0;td,th{border-right:0;border-bottom:0;}td.lock-left{box-shadow:none;}td,th{border:0;}td.last,th.last{}thead tr.first th,tbody tr.first td{}&.has-footer tfoot tr td{border-bottom:0;border-top:0;}&.has-footer tbody tr.last td{}&.has-footer tfoot tr td{}&:not(.has-footer) tbody tr.last td{}&:has(.", ") thead tr.first th{border-top:0;border:0;}}}.", "{padding:8px;}&.ui-rc-grid .ui-rc-pagination{background-color:var(--bgcolor);color:var(--color);padding:10px;background-color:var(--bgcolor);.ui-rc-pagination-prev{.anticon.anticon-left{color:var(--color);}}.ui-rc-pagination-disabled{.anticon.anticon-left{color:#7d7a7a;}}.ui-rc-pagination-next{.anticon.anticon-right{color:var(--color);}&.ui-rc-pagination-disabled{.anticon.anticon-right{color:#7d7a7a;}}}}&.auto-height{.ui-rc-grid-bottom{border-top:0;}}.ui-rc-grid-bottom{border-top:var(--cell-border-horizontal);}.ui-rc-toolbar-bottom{.be-toolbar-item{.ui-rc-btn{font-size:12px;line-height:1.5}.toolbar-dropdown-button{font-size:12px;.ui-rc-btn.ui-rc-btn-default.ui-rc-btn-variant-outlined.ui-rc-btn-compact-item.ui-rc-btn-compact-first-item{border-color:#28c76f;}.ui-rc-btn.ui-rc-btn-default.ui-rc-btn-variant-outlined.ui-rc-btn-compact-item.ui-rc-btn-compact-last-item{border-color:#28c76f;.ui-rc-btn-icon{color:#28c76f;}}}}}.ui-rc-toolbar-bottom{position:relative;padding:.15rem 0.5rem;background-color:#ffffff;.toolbar-button{border-radius:3px;}.ui-rc-btn{border-radius:3px;height:28px;&.ui-rc-btn-compact-item.ui-rc-btn-compact-last-item{border-start-start-radius:0;border-end-start-radius:0;}&.ui-rc-btn-compact-item.ui-rc-btn-compact-first-item{border-start-end-radius:0;border-end-end-radius:0;}}}&.", "{&.ui-rc-grid{.ui-rc-toolbar-bottom{background-color:var(--footer-bgcolor);color:#ffffff;}}.ui-rc-grid-top-toolbar{border-color:var(--border-color);color:#ffffff;}.ui-rc-toolbar{.ui-rc-toolbar-selection-item{background-color:var(--footer-bgcolor);color:#ffffff;}}}"], Classes.tableThemeDark, outerBorderStyleMixin, Classes.gridHorizontal, Classes.tableWrapper, Classes.tableTop, Classes.gridVertical, Classes.tableWrapper, Classes.tableTop, Classes.gridNone, Classes.tableWrapper, Classes.tableTop, Classes.tableTop, Classes.tableThemeDark);
72
72
  const StyledArtTableWrapper = exports.StyledArtTableWrapper = _styledComponents.default.div.withConfig({
73
73
  displayName: "StyledArtTableWrapper",
74
74
  componentId: "es-grid-template__sc-ipj1ht-1"
package/lib/ali-table/pipeline/features/columnCustom.d.ts CHANGED
@@ -72,6 +72,7 @@ export interface ColumnFeatureOptions {
72
72
  handleHeaderCellChange?: any;
73
73
  dataErrors?: any[];
74
74
  headerData?: any;
75
+ headerEditAble?: boolean;
75
76
  }
76
77
  export declare function columnCustom(opts: ColumnFeatureOptions): (pipeline: TablePipeline) => TablePipeline;
77
78
  export {};
package/lib/ali-table/pipeline/features/columnCustom.js CHANGED
@@ -64,7 +64,8 @@ function columnCustom(opts) {
64
64
  handleCellChange,
65
65
  handleHeaderCellChange,
66
66
  dataErrors,
67
- headerData
67
+ headerData,
68
+ headerEditAble
68
69
  // originData
69
70
 
70
71
  // currentPage = 1,
@@ -451,7 +452,7 @@ function columnCustom(opts) {
451
452
  pastedRows.push(newData[targetRow]);
452
453
  });
453
454
  }
454
- const rsFilterData = (0, _utils2.updateOrInsert)((0, _utils2.flattenArray)([...dataSource]), newData);
455
+ const rsFilterData = (0, _utils2.updateOrInsert)((0, _utils2.flattenArray)(dataSource), newData);
455
456
  const rs = (0, _utils2.unFlattenData)(rsFilterData);
456
457
  triggerPaste?.(pastedRows, colPasteds, rs, copyRows);
457
458
  pipeline.setStateAtKey(_constants.stateKeyEndCell, endPasteCell);
@@ -510,7 +511,7 @@ function columnCustom(opts) {
510
511
  // Lưu dòng được paste
511
512
  pastedRows.push(newData[targetRow]);
512
513
  });
513
- const rsFilterData = (0, _utils2.updateOrInsert)((0, _utils2.flattenArray)([...dataSource]), newData);
514
+ const rsFilterData = (0, _utils2.updateOrInsert)((0, _utils2.flattenArray)(dataSource), newData);
514
515
  const rs = (0, _utils2.unFlattenData)(rsFilterData);
515
516
  triggerPaste?.(pastedRows, colPasteds, rs, copyRows);
516
517
  };
@@ -1272,7 +1273,7 @@ function columnCustom(opts) {
1272
1273
  [`${prefix}-grid-cell-text-center`]: (col?.headerTextAlign ?? col?.textAlign) === 'center',
1273
1274
  [`${prefix}-grid-cell-text-right`]: (col?.headerTextAlign ?? col.textAlign) === 'right'
1274
1275
  })
1275
- }, col.headerEditEnable && cellHeaderEditing ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_HeaderEditCell.default, {
1276
+ }, headerEditAble && col.headerEditEnable && cellHeaderEditing ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_HeaderEditCell.default, {
1276
1277
  column: col,
1277
1278
  editType: headerEditType ?? 'text',
1278
1279
  record: headerRecord,
@@ -1296,7 +1297,7 @@ function columnCustom(opts) {
1296
1297
  startCell: startCell,
1297
1298
  handleSubmit: handleSubmit,
1298
1299
  onSubmit: onSubmit
1299
- })) : col.headerEditEnable ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, headerValue) : col.headerTemplate ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, typeof col.headerTemplate === 'function' ? col.headerTemplate(col) : col.headerTemplate) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, prevTitle))), !col.headerEditEnable && (!_hooks.nonActionColumn.includes(col.field) && !col?.children || col?.children && col?.children.length < 1) && /*#__PURE__*/_react.default.createElement("span", {
1300
+ })) : headerEditAble && col.headerEditEnable ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, headerValue) : col.headerTemplate ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, typeof col.headerTemplate === 'function' ? col.headerTemplate(col) : col.headerTemplate) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, prevTitle))), !col.headerEditEnable && (!_hooks.nonActionColumn.includes(col.field) && !col?.children || col?.children && col?.children.length < 1) && /*#__PURE__*/_react.default.createElement("span", {
1300
1301
  className: "ui-rc-header-trigger d-flex gap-50"
1301
1302
  }, canSort && /*#__PURE__*/_react.default.createElement("div", {
1302
1303
  style: {
@@ -1379,84 +1380,89 @@ function columnCustom(opts) {
1379
1380
  onDoubleClick: e => {
1380
1381
  // prevCellProps?.onDoubleClick?.(e)
1381
1382
 
1382
- if (!col.headerEditEnable) {
1383
- e.stopPropagation();
1384
- e.preventDefault();
1385
- return;
1386
- }
1387
- if (headerRowId === focusedCell.rowId && col.field === focusedCell.colId && col.headerEditEnable) {
1388
- handleEdit(e, headerRecord, col, headerEditType ?? 'text', false, true);
1383
+ if (headerEditAble) {
1384
+ if (!col.headerEditEnable) {
1385
+ e.stopPropagation();
1386
+ e.preventDefault();
1387
+ return;
1388
+ }
1389
+ if (headerRowId === focusedCell.rowId && col.field === focusedCell.colId && col.headerEditEnable) {
1390
+ handleEdit(e, headerRecord, col, headerEditType ?? 'text', false, true);
1391
+ }
1389
1392
  }
1390
1393
  },
1391
1394
  onKeyDown: e => {
1392
1395
  // prevCellProps?.onKeyDown?.(e)
1393
1396
  // chưa editing
1394
- if (!isEditing) {
1395
- handleHeaderKeyDown(e, headerRowId, col.field, headerRowIndex, col, headerRecord, headerEditType ?? 'text');
1396
- } else {
1397
- if (e.shiftKey && e.key === 'Enter') {
1398
- e.preventDefault();
1399
- e.stopPropagation();
1397
+
1398
+ if (headerEditAble) {
1399
+ if (!isEditing) {
1400
+ handleHeaderKeyDown(e, headerRowId, col.field, headerRowIndex, col, headerRecord, headerEditType ?? 'text');
1400
1401
  } else {
1401
- if (e.key === 'Enter') {
1402
+ if (e.shiftKey && e.key === 'Enter') {
1402
1403
  e.preventDefault();
1403
1404
  e.stopPropagation();
1405
+ } else {
1406
+ if (e.key === 'Enter') {
1407
+ e.preventDefault();
1408
+ e.stopPropagation();
1404
1409
 
1405
- // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1406
- // const nextRow = allRows[currentRowIndex + 1];
1410
+ // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1411
+ // const nextRow = allRows[currentRowIndex + 1];
1407
1412
 
1408
- // if (nextRow) {
1409
- // const nextCellPosition = { rowId: nextRow.rowId, colId: col.field }
1413
+ // if (nextRow) {
1414
+ // const nextCellPosition = { rowId: nextRow.rowId, colId: col.field }
1410
1415
 
1411
- // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1412
- // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1413
- // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1416
+ // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1417
+ // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1418
+ // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1414
1419
 
1415
- handleHeaderChange(headerRecord, col, startIndex);
1416
- pipeline.setStateAtKey(_constants.stateKeyIsEditing, false);
1420
+ handleHeaderChange(headerRecord, col, startIndex);
1421
+ pipeline.setStateAtKey(_constants.stateKeyIsEditing, false);
1417
1422
 
1418
- // }
1419
- }
1420
- if (e.key === 'Tab') {
1421
- e.preventDefault();
1423
+ // }
1424
+ }
1425
+ if (e.key === 'Tab') {
1426
+ e.preventDefault();
1422
1427
 
1423
- // const nextCol = getNextColumn(allCols, col.field)
1428
+ // const nextCol = getNextColumn(allCols, col.field)
1424
1429
 
1425
- if (nextHeaderCol?.column?.field && !nextHeaderCol?.isWrapped) {
1426
- const nextCellPosition = {
1427
- rowId: headerRowId,
1428
- colId: nextHeaderCol.column.field
1429
- };
1430
- pipeline.setStateAtKey(_constants.stateKeyFocusedCell, nextCellPosition);
1431
- pipeline.setStateAtKey(_constants.stateKeyStartCell, nextCellPosition);
1432
- pipeline.setStateAtKey(_constants.stateKeyEndCell, nextCellPosition);
1430
+ if (nextHeaderCol?.column?.field && !nextHeaderCol?.isWrapped) {
1431
+ const nextCellPosition = {
1432
+ rowId: headerRowId,
1433
+ colId: nextHeaderCol.column.field
1434
+ };
1435
+ pipeline.setStateAtKey(_constants.stateKeyFocusedCell, nextCellPosition);
1436
+ pipeline.setStateAtKey(_constants.stateKeyStartCell, nextCellPosition);
1437
+ pipeline.setStateAtKey(_constants.stateKeyEndCell, nextCellPosition);
1433
1438
 
1434
- // columnVirtualizer.scrollToIndex(nextCol.getIndex(), { align: 'center' })
1435
- } else {
1436
- // Nếu là cột cuối cùng, có thể nhảy xuống dòng tiếp theo
1439
+ // columnVirtualizer.scrollToIndex(nextCol.getIndex(), { align: 'center' })
1440
+ } else {
1441
+ // Nếu là cột cuối cùng, có thể nhảy xuống dòng tiếp theo
1437
1442
 
1438
- // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1439
- // const nextRow = allRows[currentRowIndex + 1];
1443
+ // const currentRowIndex = allRows.findIndex(r => r.rowId === headerRowId);
1444
+ // const nextRow = allRows[currentRowIndex + 1];
1440
1445
 
1441
- // const firstCol = nextCol.column
1446
+ // const firstCol = nextCol.column
1442
1447
 
1443
- // if (nextRow) {
1448
+ // if (nextRow) {
1444
1449
 
1445
- // const nextCellPosition = { rowId: nextRow.rowId, colId: firstCol.field }
1450
+ // const nextCellPosition = { rowId: nextRow.rowId, colId: firstCol.field }
1446
1451
 
1447
- // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1452
+ // pipeline.setStateAtKey(stateKeyFocusedCell, nextCellPosition)
1448
1453
 
1449
- // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1450
- // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1454
+ // pipeline.setStateAtKey(stateKeyStartCell, nextCellPosition)
1455
+ // pipeline.setStateAtKey(stateKeyEndCell, nextCellPosition)
1451
1456
 
1452
- // // columnVirtualizer.scrollToIndex(nextRowCol.getIndex())
1457
+ // // columnVirtualizer.scrollToIndex(nextRowCol.getIndex())
1453
1458
 
1454
- // // rowVirtualizer.scrollToIndex(nextRow.index, { align: 'auto' })
1459
+ // // rowVirtualizer.scrollToIndex(nextRow.index, { align: 'auto' })
1455
1460
 
1456
- // }
1461
+ // }
1462
+ }
1463
+ handleHeaderChange(headerRecord, col, startIndex);
1464
+ pipeline.setStateAtKey(_constants.stateKeyIsEditing, false);
1457
1465
  }
1458
- handleHeaderChange(headerRecord, col, startIndex);
1459
- pipeline.setStateAtKey(_constants.stateKeyIsEditing, false);
1460
1466
  }
1461
1467
  }
1462
1468
  }
package/lib/ali-table/utils/utility.d.ts CHANGED
@@ -9,4 +9,5 @@ export declare function sortData1(data: any[], sorter: Sorter[]): any[];
9
9
  export declare function sortData(data: any[], sorter: Sorter[]): any[];
10
10
  export declare function filterDataByColumns1(data: any[], queries: FilterItem[] | undefined, sorter: Sorter[] | undefined, keysFilter: string[] | undefined, ignoreAccents?: boolean): any[];
11
11
  export declare const getMaxDepth: (data: any[]) => number;
12
+ export declare const addRowIdArray: (inputArray: any[]) => any[];
12
13
  export {};
package/lib/ali-table/utils/utility.js CHANGED
@@ -3,6 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
+ exports.addRowIdArray = void 0;
6
7
  exports.filterDataByColumns1 = filterDataByColumns1;
7
8
  exports.shouldIncludeOptimized = exports.getMaxDepth = void 0;
8
9
  exports.sortData = sortData;
@@ -263,4 +264,47 @@ const getMaxDepth = data => {
263
264
  }
264
265
  return maxDepth;
265
266
  };
266
- exports.getMaxDepth = getMaxDepth;
267
+ exports.getMaxDepth = getMaxDepth;
268
+ const addRowIdArray = inputArray => {
269
+ if (!inputArray || inputArray.length === 0) return [];
270
+ const result = new Array(inputArray.length);
271
+ const pending = [];
272
+ for (let index = inputArray.length - 1; index >= 0; index -= 1) {
273
+ pending.push({
274
+ source: inputArray[index],
275
+ target: result,
276
+ index
277
+ });
278
+ }
279
+ while (pending.length > 0) {
280
+ const {
281
+ source,
282
+ target,
283
+ index,
284
+ parentId
285
+ } = pending.pop();
286
+ const rowId = source.id ?? source.rowId ?? (0, _utils.newGuid)();
287
+ const node = {
288
+ ...source,
289
+ rowId,
290
+ ...(parentId !== undefined && source.parentId == null ? {
291
+ parentId
292
+ } : {})
293
+ };
294
+ target[index] = node;
295
+ if (Array.isArray(source.children) && source.children.length > 0) {
296
+ const children = new Array(source.children.length);
297
+ node.children = children;
298
+ for (let childIndex = source.children.length - 1; childIndex >= 0; childIndex -= 1) {
299
+ pending.push({
300
+ source: source.children[childIndex],
301
+ target: children,
302
+ index: childIndex,
303
+ parentId: rowId
304
+ });
305
+ }
306
+ }
307
+ }
308
+ return result;
309
+ };
310
+ exports.addRowIdArray = addRowIdArray;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "es-grid-template",
3
- "version": "1.9.62",
3
+ "version": "1.9.63",
4
4
  "description": "es-grid-template",
5
5
  "keywords": [
6
6
  "react",