es-grid-template 1.4.5 → 1.4.6

package/lib/grid-component/EditableCell.js

@@ -69,7 +69,8 @@ const EditableCell = props => {
   const dateTimePickerRef = _react.default.useRef(null);
   // const timePickerRef = React.useRef(null);
 
-  const cellFormat = column?.format ? typeof column?.format === 'function' ? column?.format?.(record) : column?.format : format;
+  const colFormat = typeof column?.format === 'function' ? column?.format(record) : column?.format;
+  const cellFormat = (0, _hooks.getFormat)(colFormat, format);
   const inputNode = (value, onChange) => {
     const dateFormat = (0, _hooks.getDatepickerFormat)(editType, cellFormat);
     const date = !(0, _hooks.isEmpty)(value) ? (0, _hooks.convertDateToDayjs)(new Date(value), dateFormat) : null;

package/lib/grid-component/hooks/utils.d.ts

@@ -121,8 +121,11 @@ export declare const sortedSetASC: (setValue: any) => Set<unknown>;
 export declare const sortedSetDSC: (setValue: any) => Set<unknown>;
 export declare function getBottomRowCells(cellSet: any): any[];
 export declare function getCellsByPosition(cellSet: any, position?: string): any[];
+export declare function getCellsByPosition2(cellSet: any, position?: string): any[];
 export declare const addBorderClass: (selectedCells: any, type: string, className: string, id?: string, nextCellRight?: boolean) => void;
 export declare const removeBorderClass: (selectedCells: any, type: string, className: string, id?: string) => void;
+export declare const addBorderPasteClass: (selectedCells: any, type: string, className: string, id?: string, nextCellRight?: boolean) => void;
+export declare const removeBorderPasteClass: (selectedCells: any, type: string, className: string, id?: string) => void;
 export declare const removeBorderClass2: (className: string, id?: string) => void;
 export declare const onAddBgSelectedCell: (selectedCells: any, id?: string, isFocusCellIndex?: boolean) => void;
 export declare const onRemoveBgSelectedCell: (selectedCells: any, id?: string, rowsSelected?: any) => void;

package/lib/grid-component/hooks/utils.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.addRowIdArray = exports.addClassCellIndexSelected = exports.addClassBorderPasteCell = exports.addBorderClass = void 0;
+exports.addRowIdArray = exports.addClassCellIndexSelected = exports.addClassBorderPasteCell = exports.addBorderPasteClass = exports.addBorderClass = void 0;
 exports.addRows8 = addRows8;
 exports.addRowsUp = addRowsUp;
 exports.checkThousandSeparator = exports.checkFieldKey = exports.checkDecimalSeparator = exports.checkChild = exports.buildConnectedRegions = void 0;
@@ -16,6 +16,7 @@ exports.findAllChildrenKeys = findAllChildrenKeys;
 exports.getAllVisibleKeys = exports.genPresets = exports.flattenData = exports.flattenArray = exports.findItemPath = exports.findItemByKey = void 0;
 exports.getBottomRowCells = getBottomRowCells;
 exports.getCellsByPosition = getCellsByPosition;
+exports.getCellsByPosition2 = getCellsByPosition2;
 exports.getFormat = exports.getFirstSelectCell = exports.getEditType = exports.getDefaultValue = exports.getDatepickerFormat = exports.getDateString = exports.getColumnsVisible = void 0;
 exports.getHiddenParentKeys = getHiddenParentKeys;
 exports.hideDraggingPoint = exports.getVisibleColumnKeys = exports.getTypeFilter = exports.getTemplate = exports.getRowsPasteIndex = exports.getRowNumber = exports.getLastSelectCell = void 0;
@@ -28,7 +29,7 @@ exports.isEmpty = exports.isEditable = exports.isDisable = void 0;
 exports.isEqualSet = isEqualSet;
 exports.isRangeCell = exports.isObjEmpty = exports.isNullOrUndefined = exports.isNameColor = void 0;
 exports.isRightMostInRegion = isRightMostInRegion;
-exports.updateData = exports.updateColumnsByGroup = exports.updateColumns = exports.updateArrayByKey = exports.transformColumns1 = exports.transformColumns = exports.totalFixedWidth = exports.sumDataByField = exports.sortedSetDSC = exports.sortedSetASC = exports.showDraggingPoint = exports.shouldInclude = exports.removeFieldRecursive = exports.removeColumns = exports.removeClassCellIndexSelected = exports.removeClassBorderPasteCell = exports.removeBorderClass2 = exports.removeBorderClass = exports.parseCells = exports.parseBooleanToValue = exports.onRemoveBorderSelectedCell = exports.onRemoveBgSelectedCell = exports.onRemoveBgCellIndex = exports.onAddBorderSelectedCell = exports.onAddBgSelectedCell = exports.onAddBgCellIndex = exports.newGuid = exports.mergedSets = exports.isTopMostInRegion = exports.isSelectedCell = void 0;
+exports.updateData = exports.updateColumnsByGroup = exports.updateColumns = exports.updateArrayByKey = exports.transformColumns1 = exports.transformColumns = exports.totalFixedWidth = exports.sumDataByField = exports.sortedSetDSC = exports.sortedSetASC = exports.showDraggingPoint = exports.shouldInclude = exports.removeFieldRecursive = exports.removeColumns = exports.removeClassCellIndexSelected = exports.removeClassBorderPasteCell = exports.removeBorderPasteClass = exports.removeBorderClass2 = exports.removeBorderClass = exports.parseCells = exports.parseBooleanToValue = exports.onRemoveBorderSelectedCell = exports.onRemoveBgSelectedCell = exports.onRemoveBgCellIndex = exports.onAddBorderSelectedCell = exports.onAddBgSelectedCell = exports.onAddBgCellIndex = exports.newGuid = exports.mergedSets = exports.isTopMostInRegion = exports.isSelectedCell = void 0;
 var _dayjs = _interopRequireDefault(require("dayjs"));
 var _moment = _interopRequireDefault(require("moment/moment"));
 var _uuid = require("uuid");
@@ -1619,6 +1620,61 @@ function getCellsByPosition(cellSet, position = "bottom") {
       return [];
   }
 }
+function getCellsByPosition2(cellSet, position = "bottom") {
+  const cells = Array.from(cellSet).map(key => {
+    const [row, col] = key.split("-").map(Number);
+    return {
+      row,
+      col,
+      key
+    };
+  });
+  switch (position) {
+    case "top":
+      {
+        // const minRow = Math.min(...cells.map(c => c.row));
+        // return cells.filter(c => c.row === minRow).map(c => c.key);
+
+        // const rows = cells.map(c => c.row).filter(r => r > 0);
+        // if (rows.length === 0) return [];
+        // const minRow = Math.min(...rows);
+        // return cells.filter(c => c.row === minRow).map(c => c.key);
+
+        const minRow = Math.min(...cells.map(c => c.row));
+        if (minRow === 0) return []; // Bỏ qua nếu rowIndex = 0
+
+        return cells.filter(c => c.row === minRow).map(c => `${c.row - 1}-${c.col}`);
+      }
+    case "bottom":
+      {
+        const maxRow = Math.max(...cells.map(c => c.row));
+        return cells.filter(c => c.row === maxRow).map(c => c.key);
+      }
+    case "left":
+      {
+        // const minCol = Math.min(...cells.map(c => c.col));
+        // return cells.filter(c => c.col === minCol).map(c => c.key);
+
+        // const cols = cells.map(c => c.col).filter(c => c > 0);
+        // if (cols.length === 0) return [];
+        // const minCol = Math.min(...cols);
+        // return cells.filter(c => c.col === minCol).map(c => c.key);
+
+        const minCol = Math.min(...cells.map(c => c.col));
+        if (minCol === 0) return []; // Bỏ qua nếu colIndex = 0
+
+        // Trả về các ô cùng row, nhưng ở cột bên trái
+        return cells.filter(c => c.col === minCol).map(c => `${c.row}-${c.col - 1}`);
+      }
+    case "right":
+      {
+        const maxCol = Math.max(...cells.map(c => c.col));
+        return cells.filter(c => c.col === maxCol).map(c => c.key);
+      }
+    default:
+      return [];
+  }
+}
 const addBorderClass = (selectedCells, type, className, id, nextCellRight) => {
   const table = document.querySelector(`#${id}`);
   const typeCells = getCellsByPosition(selectedCells, type);
@@ -1662,7 +1718,7 @@ const addBorderClass = (selectedCells, type, className, id, nextCellRight) => {
 exports.addBorderClass = addBorderClass;
 const removeBorderClass = (selectedCells, type, className, id) => {
   const table = document.querySelector(`#${id}`);
-  const typeCells = getCellsByPosition(selectedCells, type);
+  const typeCells = getCellsByPosition2(selectedCells, type);
   const selectorsCells = typeCells.map(pos => {
     const [row, col] = pos.split('-');
     return `[data-row-index="${row}"][data-col-index="${col}"]`;
@@ -1675,6 +1731,62 @@ const removeBorderClass = (selectedCells, type, className, id) => {
   }
 };
 exports.removeBorderClass = removeBorderClass;
+const addBorderPasteClass = (selectedCells, type, className, id, nextCellRight) => {
+  const table = document.querySelector(`#${id}`);
+  const typeCells = getCellsByPosition2(selectedCells, type);
+  const selectorsCells = typeCells.map(pos => {
+    const [row, col] = pos.split('-');
+    return `[data-row-index="${row}"][data-col-index="${col}"]`;
+  });
+  const cellsFilter = typeCells.length > 0 ? table?.querySelectorAll(selectorsCells.join(',')) : null;
+  if (cellsFilter && cellsFilter.length > 0) {
+    cellsFilter.forEach(cell => {
+      cell.classList.add(className);
+      if (nextCellRight) {
+        cell.style.zIndex = 1;
+      }
+    });
+  }
+
+  // ui-rc-table-tbody-virtual-scrollbar ui-rc-table-tbody-virtual-scrollbar-horizontal ui-rc-table-tbody-virtual-scrollbar-visible
+
+  // if (type === 'left') {
+  //
+  //   const selectorsCells2 = typeCells.map((pos: any) => {
+  //     const [row, col] = pos.split('-');
+  //     return `[data-row-index="${row}"][data-col-index="${Number(col) + 1}"]`;
+  //   });
+  //
+  //   const fullSelector = selectorsCells2.map(s => `.ui-rc-table-cell-fix-right-first${s}`).join(', ');
+  //
+  //   const cellsFilter2 = typeCells.length > 0 ? table?.querySelectorAll(fullSelector) : null
+  //
+  //   if (cellsFilter2 && cellsFilter2.length > 0) {
+  //
+  //     cellsFilter2.forEach(cell => {
+  //       // cell.classList.add('has-before');
+  //       cell.classList.add('cell-border-left');
+  //     });
+  //   }
+  //
+  // }
+};
+exports.addBorderPasteClass = addBorderPasteClass;
+const removeBorderPasteClass = (selectedCells, type, className, id) => {
+  const table = document.querySelector(`#${id}`);
+  const typeCells = getCellsByPosition(selectedCells, type);
+  const selectorsCells = typeCells.map(pos => {
+    const [row, col] = pos.split('-');
+    return `[data-row-index="${row}"][data-col-index="${col}"]`;
+  });
+  const cellsFilter = typeCells.length > 0 ? table?.querySelectorAll(selectorsCells.join(',')) : null;
+  if (cellsFilter && cellsFilter.length > 0) {
+    cellsFilter.forEach(cell => {
+      cell.classList.remove(className);
+    });
+  }
+};
+exports.removeBorderPasteClass = removeBorderPasteClass;
 const removeBorderClass2 = (className, id) => {
   const table = document.querySelector(`#${id}`);
   const cellsFilter = table ? table?.querySelectorAll(`.ui-rc-table-cell.${className}`) : null;
@@ -1855,13 +1967,13 @@ exports.onRemoveBorderSelectedCell = onRemoveBorderSelectedCell;
 const addClassBorderPasteCell = (pasteCells, type, id) => {
   //  thêm class border
 
-  addBorderClass(pasteCells, 'right', 'cell-paste-border-right', id);
-  addBorderClass(pasteCells, 'left', 'cell-paste-border-left', id);
+  addBorderPasteClass(pasteCells, 'right', 'cell-paste-border-right', id);
+  addBorderPasteClass(pasteCells, 'left', 'cell-paste-border-left', id);
   if (type === 'up') {
-    addBorderClass(pasteCells, 'top', 'cell-paste-border-top', id);
+    addBorderPasteClass(pasteCells, 'top', 'cell-paste-border-top', id);
   }
   if (type === 'down') {
-    addBorderClass(pasteCells, 'bottom', 'cell-paste-border-bottom', id);
+    addBorderPasteClass(pasteCells, 'bottom', 'cell-paste-border-bottom', id);
   }
 };
 exports.addClassBorderPasteCell = addClassBorderPasteCell;