@visactor/vtable
Version:
canvas table width high performance
264 lines (254 loc) • 22.3 kB
JavaScript
import { getCellMergeInfo } from "../utils/get-cell-merge";
export function updateAllSelectComponent(scene) {
scene.customSelectedRangeComponents.forEach(((selectComp, key) => {
updateComponent(selectComp, key, scene);
})), scene.selectingRangeComponents.forEach(((selectComp, key) => {
updateComponent(selectComp, key, scene);
})), scene.selectedRangeComponents.forEach(((selectComp, key) => {
updateComponent(selectComp, key, scene);
}));
}
function updateComponent(selectComp, key, scene) {
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
const table = scene.table, [startColStr, startRowStr, endColStr, endRowStr] = key.split("-"), startCol = parseInt(startColStr, 10), startRow = parseInt(startRowStr, 10), endCol = parseInt(endColStr, 10), endRow = parseInt(endRowStr, 10);
let visibleCellRange, computeRectCellRangeStartCol = startCol, computeRectCellRangeStartRow = startRow, computeRectCellRangeEndCol = endCol, computeRectCellRangeEndRow = endRow;
switch (selectComp.role) {
case "rowHeader":
visibleCellRange = table.getBodyVisibleRowRange(), visibleCellRange && (computeRectCellRangeStartRow = Math.max(startRow, visibleCellRange.rowStart - 1),
computeRectCellRangeEndRow = Math.min(endRow, visibleCellRange.rowEnd + 1));
break;
case "columnHeader":
case "bottomFrozen":
visibleCellRange = table.getBodyVisibleCellRange(), visibleCellRange && (computeRectCellRangeStartCol = Math.max(startCol, visibleCellRange.colStart - 1),
computeRectCellRangeEndCol = Math.min(endCol, visibleCellRange.colEnd + 1));
break;
case "cornerHeader":
case "rightTopCorner":
case "leftBottomCorner":
case "rightBottomCorner":
break;
case "rightFrozen":
visibleCellRange = table.getBodyVisibleCellRange(), visibleCellRange && (computeRectCellRangeStartRow = Math.max(startRow, visibleCellRange.rowStart - 1),
computeRectCellRangeEndRow = Math.min(endRow, visibleCellRange.rowEnd + 1));
break;
default:
visibleCellRange = table.getBodyVisibleCellRange(), visibleCellRange && (computeRectCellRangeStartRow = Math.max(startRow, visibleCellRange.rowStart - 1),
computeRectCellRangeEndRow = Math.min(endRow, visibleCellRange.rowEnd + 1), computeRectCellRangeStartCol = Math.max(startCol, visibleCellRange.colStart - 1),
computeRectCellRangeEndCol = Math.min(endCol, visibleCellRange.colEnd + 1));
}
const colsWidth = table.getColsWidth(computeRectCellRangeStartCol, computeRectCellRangeEndCol), rowsHeight = table.getRowsHeight(computeRectCellRangeStartRow, computeRectCellRangeEndRow), firstCellBound = scene.highPerformanceGetCell(computeRectCellRangeStartCol, computeRectCellRangeStartRow).globalAABBBounds;
if (selectComp.rect.setAttributes({
x: firstCellBound.x1 - scene.tableGroup.attribute.x,
y: firstCellBound.y1 - scene.tableGroup.attribute.y,
width: colsWidth,
height: rowsHeight,
visible: !0
}), selectComp.fillhandle) {
const fillHandle = null === (_a = scene.table.options.excelOptions) || void 0 === _a ? void 0 : _a.fillHandle;
let lastCellBound, visible = !0;
"function" == typeof fillHandle && (visible = fillHandle({
selectRanges: scene.table.stateManager.select.ranges,
table: scene.table
})), lastCellBound = computeRectCellRangeEndCol < table.colCount - 1 ? scene.highPerformanceGetCell(computeRectCellRangeEndCol, computeRectCellRangeEndRow).globalAABBBounds : scene.highPerformanceGetCell(computeRectCellRangeStartCol - 1, computeRectCellRangeEndRow).globalAABBBounds;
const handlerX = lastCellBound.x2 - scene.tableGroup.attribute.x - 3;
lastCellBound = computeRectCellRangeEndRow < table.rowCount - 1 ? scene.highPerformanceGetCell(computeRectCellRangeEndCol, computeRectCellRangeEndRow).globalAABBBounds : scene.highPerformanceGetCell(computeRectCellRangeEndCol, computeRectCellRangeStartRow - 1).globalAABBBounds;
const handlerY = lastCellBound.y2 - scene.tableGroup.attribute.y - 3;
null === (_b = selectComp.fillhandle) || void 0 === _b || _b.setAttributes({
x: handlerX,
y: handlerY,
width: 6,
height: 6,
visible: visible
});
}
let isNearRowHeader = !!table.frozenColCount && startCol === table.frozenColCount;
if (!isNearRowHeader && table.frozenColCount && table.scrollLeft > 0 && startCol >= table.frozenColCount) {
table.getColsWidth(0, startCol - 1) - table.scrollLeft < table.getFrozenColsWidth() && (isNearRowHeader = !0);
}
let isNearRightRowHeader = !!table.rightFrozenColCount && (table.rightFrozenColCount > 0 && endCol === table.colCount - table.rightFrozenColCount - 1);
if (!isNearRightRowHeader && table.rightFrozenColCount && endCol < table.colCount - table.rightFrozenColCount) {
table.getColsWidth(0, endCol) - table.scrollLeft > table.tableNoFrameWidth - table.getRightFrozenColsWidth() && (isNearRightRowHeader = !0);
}
let isNearColHeader = !table.frozenRowCount || startRow === table.frozenRowCount;
if (!isNearColHeader && table.frozenRowCount && table.scrollTop > 0 && startRow >= table.frozenRowCount) {
table.getRowsHeight(0, startRow - 1) - table.scrollTop < table.getFrozenRowsHeight() && (isNearColHeader = !0);
}
let isNearBottomColHeader = !!table.bottomFrozenRowCount && endRow === table.rowCount - table.bottomFrozenRowCount - 1;
if (!isNearBottomColHeader && table.bottomFrozenRowCount && endRow < table.rowCount - table.bottomFrozenRowCount) {
table.getRowsHeight(0, endRow) - table.scrollTop > table.tableNoFrameHeight - table.getBottomFrozenRowsHeight() && (isNearBottomColHeader = !0);
}
if (isNearRowHeader && selectComp.rect.attribute.stroke[3] || isNearRightRowHeader && selectComp.rect.attribute.stroke[1] || isNearColHeader && selectComp.rect.attribute.stroke[0] || isNearBottomColHeader && selectComp.rect.attribute.stroke[2]) {
if (isNearRowHeader && selectComp.rect.attribute.stroke[3] && scene.tableGroup.insertAfter(selectComp.rect, "columnHeader" === selectComp.role ? scene.cornerHeaderGroup : "bottomFrozen" === selectComp.role ? scene.leftBottomCornerGroup : scene.rowHeaderGroup),
isNearBottomColHeader && selectComp.rect.attribute.stroke[2] && scene.tableGroup.insertAfter(selectComp.rect, "rowHeader" === selectComp.role ? scene.leftBottomCornerGroup : "rightFrozen" === selectComp.role ? scene.rightBottomCornerGroup : scene.bottomFrozenGroup),
isNearColHeader && selectComp.rect.attribute.stroke[0] && scene.tableGroup.insertAfter(selectComp.rect, "rowHeader" === selectComp.role ? scene.cornerHeaderGroup : "rightFrozen" === selectComp.role ? scene.rightTopCornerGroup : scene.colHeaderGroup),
isNearRightRowHeader && selectComp.rect.attribute.stroke[1] && scene.tableGroup.insertAfter(selectComp.rect, "columnHeader" === selectComp.role ? scene.rightTopCornerGroup : "bottomFrozen" === selectComp.role ? scene.rightBottomCornerGroup : scene.rightFrozenGroup),
selectComp.rect.attribute.x < table.getFrozenColsWidth() && table.scrollLeft > 0 && ("body" === selectComp.role || "columnHeader" === selectComp.role || "bottomFrozen" === selectComp.role)) {
const width = selectComp.rect.attribute.width - (table.getFrozenColsWidth() - selectComp.rect.attribute.x);
selectComp.rect.setAttributes({
x: selectComp.rect.attribute.x + (table.getFrozenColsWidth() - selectComp.rect.attribute.x),
width: width > 0 ? width : 0
}), null === (_c = selectComp.fillhandle) || void 0 === _c || _c.setAttributes({
visible: width > 0
});
}
if (table.getRightFrozenColsWidth() > 0 && scene.rightFrozenGroup.attribute.height > 0 && selectComp.rect.attribute.x + selectComp.rect.attribute.width > scene.rightFrozenGroup.attribute.x && ("body" === selectComp.role || "columnHeader" === selectComp.role || "bottomFrozen" === selectComp.role)) {
const width = scene.rightFrozenGroup.attribute.x - selectComp.rect.attribute.x;
selectComp.rect.setAttributes({
x: selectComp.rect.attribute.x,
width: width > 0 ? width : 0
}), null === (_d = selectComp.fillhandle) || void 0 === _d || _d.setAttributes({
visible: width - colsWidth > 0
});
}
if (selectComp.rect.attribute.y < scene.colHeaderGroup.attribute.height && table.scrollTop > 0 && ("body" === selectComp.role || "rowHeader" === selectComp.role || "rightFrozen" === selectComp.role)) {
const height = selectComp.rect.attribute.height - (scene.colHeaderGroup.attribute.height - selectComp.rect.attribute.y);
selectComp.rect.setAttributes({
y: selectComp.rect.attribute.y + (scene.colHeaderGroup.attribute.height - selectComp.rect.attribute.y),
height: height > 0 ? height : 0
}), null === (_e = selectComp.fillhandle) || void 0 === _e || _e.setAttributes({
visible: height > 0
});
}
if (scene.bottomFrozenGroup.attribute.width > 0 && scene.bottomFrozenGroup.attribute.height > 0 && selectComp.rect.attribute.y + selectComp.rect.attribute.height > scene.bottomFrozenGroup.attribute.y && ("body" === selectComp.role || "rowHeader" === selectComp.role || "rightFrozen" === selectComp.role)) {
const height = scene.bottomFrozenGroup.attribute.y - selectComp.rect.attribute.y;
selectComp.rect.setAttributes({
y: selectComp.rect.attribute.y,
height: height > 0 ? height : 0
}), null === (_f = selectComp.fillhandle) || void 0 === _f || _f.setAttributes({
visible: height - rowsHeight > 0
});
}
} else scene.tableGroup.insertAfter(selectComp.rect, "body" === selectComp.role ? scene.bodyGroup : "columnHeader" === selectComp.role ? scene.colHeaderGroup : "rowHeader" === selectComp.role ? scene.rowHeaderGroup : "cornerHeader" === selectComp.role ? scene.cornerHeaderGroup : "rightTopCorner" === selectComp.role ? scene.rightTopCornerGroup : "rightFrozen" === selectComp.role ? scene.rightFrozenGroup : "leftBottomCorner" === selectComp.role ? scene.leftBottomCornerGroup : "bottomFrozen" === selectComp.role ? scene.bottomFrozenGroup : scene.rightBottomCornerGroup);
let diffSize = 0;
"number" == typeof selectComp.rect.attribute.lineWidth && (diffSize = Math.ceil(selectComp.rect.attribute.lineWidth / 2)),
endCol === table.colCount - 1 && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_g = selectComp.rect.attribute.lineWidth[1]) && void 0 !== _g ? _g : 0) / 2)),
selectComp.rect.setAttributes({
width: selectComp.rect.attribute.width - diffSize
})), 0 === startCol && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_h = selectComp.rect.attribute.lineWidth[3]) && void 0 !== _h ? _h : 0) / 2)),
selectComp.rect.setAttributes({
x: selectComp.rect.attribute.x + diffSize,
width: selectComp.rect.attribute.width - diffSize
})), endRow === table.rowCount - 1 && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_j = selectComp.rect.attribute.lineWidth[2]) && void 0 !== _j ? _j : 0) / 2)),
selectComp.rect.setAttributes({
height: selectComp.rect.attribute.height - diffSize
})), 0 === startRow && (Array.isArray(selectComp.rect.attribute.lineWidth) && (diffSize = Math.ceil((null !== (_k = selectComp.rect.attribute.lineWidth[0]) && void 0 !== _k ? _k : 0) / 2)),
selectComp.rect.setAttributes({
y: selectComp.rect.attribute.y + diffSize,
height: selectComp.rect.attribute.height - diffSize
}));
}
export function updateCellSelectBorder(scene, selectRange, ifExtendSelectRange = !0) {
const table = scene.table, newStartCol = selectRange.start.col, newStartRow = selectRange.start.row, newEndCol = selectRange.end.col, newEndRow = selectRange.end.row, skipBodyMerge = selectRange.skipBodyMerge;
let startCol = Math.max(Math.min(newEndCol, newStartCol), 0), startRow = Math.max(Math.min(newEndRow, newStartRow), 0), endCol = Math.min(Math.max(newEndCol, newStartCol), table.colCount - 1), endRow = Math.min(Math.max(newEndRow, newStartRow), table.rowCount - 1);
const extendSelectRange = () => {
let isExtend = !1;
for (let col = startCol; col <= endCol; col++) {
if (col === startCol) for (let row = startRow; row <= endRow; row++) {
if (!table.isHeader(col, row) && skipBodyMerge) continue;
const mergeInfo = getCellMergeInfo(table, col, row);
if (mergeInfo && mergeInfo.start.col < startCol) {
startCol = mergeInfo.start.col, isExtend = !0;
break;
}
}
if (!isExtend && col === endCol) for (let row = startRow; row <= endRow; row++) {
if (!table.isHeader(col, row) && skipBodyMerge) continue;
const mergeInfo = getCellMergeInfo(table, col, row);
if (mergeInfo && Math.min(mergeInfo.end.col, table.colCount - 1) > endCol) {
endCol = mergeInfo.end.col, isExtend = !0;
break;
}
}
if (isExtend) break;
}
if (!isExtend) for (let row = startRow; row <= endRow; row++) {
if (row === startRow) for (let col = startCol; col <= endCol; col++) {
if (!table.isHeader(col, row) && skipBodyMerge) continue;
const mergeInfo = getCellMergeInfo(table, col, row);
if (mergeInfo && mergeInfo.start.row < startRow) {
startRow = mergeInfo.start.row, isExtend = !0;
break;
}
}
if (!isExtend && row === endRow) for (let col = startCol; col <= endCol; col++) {
if (!table.isHeader(col, row) && skipBodyMerge) continue;
const mergeInfo = getCellMergeInfo(table, col, row);
if (mergeInfo && Math.min(mergeInfo.end.row, table.rowCount - 1) > endRow) {
endRow = mergeInfo.end.row, isExtend = !0;
break;
}
}
if (isExtend) break;
}
isExtend && extendSelectRange();
};
ifExtendSelectRange && (extendSelectRange(), selectRange.start.col > selectRange.end.col ? (selectRange.start.col = Math.max(startCol, endCol),
selectRange.end.col = Math.min(startCol, endCol)) : (selectRange.start.col = Math.min(startCol, endCol),
selectRange.end.col = Math.max(startCol, endCol)), selectRange.start.row > selectRange.end.row ? (selectRange.start.row = Math.max(startRow, endRow),
selectRange.end.row = Math.min(startRow, endRow)) : (selectRange.start.row = Math.min(startRow, endRow),
selectRange.end.row = Math.max(startRow, endRow))), scene.selectingRangeComponents.forEach(((selectComp, key) => {
var _a;
selectComp.rect.delete(), null === (_a = selectComp.fillhandle) || void 0 === _a || _a.delete();
})), scene.selectingRangeComponents = new Map;
let needRowHeader = !1, needRightRowHeader = !1, needColumnHeader = !1, needBottomColumnHeader = !1, needBody = !1, needCornerHeader = !1, needRightTopCornerHeader = !1, needRightBottomCornerHeader = !1, needLeftBottomCornerHeader = !1;
if (startCol <= table.frozenColCount - 1 && startRow <= table.frozenRowCount - 1 && (needCornerHeader = !0),
endCol >= table.colCount - table.rightFrozenColCount && startRow <= table.frozenRowCount - 1 && (needRightTopCornerHeader = !0),
startCol <= table.frozenColCount - 1 && endRow >= table.rowCount - table.bottomFrozenRowCount && (needLeftBottomCornerHeader = !0),
endCol >= table.colCount - table.rightFrozenColCount && endRow >= table.rowCount - table.bottomFrozenRowCount && (needRightBottomCornerHeader = !0),
startCol <= table.frozenColCount - 1 && endRow >= table.frozenRowCount && startRow <= table.rowCount - table.bottomFrozenRowCount - 1 && (needRowHeader = !0),
endCol >= table.colCount - table.rightFrozenColCount && endRow >= table.frozenRowCount && startRow <= table.rowCount - table.bottomFrozenRowCount - 1 && (needRightRowHeader = !0),
startRow <= table.frozenRowCount - 1 && endCol >= table.frozenColCount && startCol <= table.colCount - table.rightFrozenColCount - 1 && (needColumnHeader = !0),
endRow >= table.rowCount - table.bottomFrozenRowCount && endCol >= table.frozenColCount && startCol <= table.colCount - table.rightFrozenColCount - 1 && (needBottomColumnHeader = !0),
startCol <= table.colCount - table.rightFrozenColCount - 1 && endCol >= table.frozenColCount && startRow <= table.rowCount - table.bottomFrozenRowCount - 1 && endRow >= table.frozenRowCount && (needBody = !0),
needCornerHeader) {
const cornerEndCol = Math.min(endCol, table.frozenColCount - 1), cornerEndRow = Math.min(endRow, table.frozenRowCount - 1), strokeArray = [ !0, !needColumnHeader, !needRowHeader, !0 ];
scene.createCellSelectBorder(startCol, startRow, cornerEndCol, cornerEndRow, "cornerHeader", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needRightTopCornerHeader) {
const cornerStartCol = Math.max(startCol, table.colCount - table.rightFrozenColCount), cornerEndRow = Math.min(endRow, table.frozenRowCount - 1), strokeArray = [ !0, !0, !needRightRowHeader, !needColumnHeader ];
scene.createCellSelectBorder(cornerStartCol, startRow, endCol, cornerEndRow, "rightTopCorner", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needLeftBottomCornerHeader) {
const cornerEndCol = Math.min(endCol, table.frozenColCount - 1), cornerStartRow = Math.max(startRow, table.rowCount - table.bottomFrozenRowCount), strokeArray = [ !needRowHeader, !needBottomColumnHeader, !0, !0 ];
scene.createCellSelectBorder(startCol, cornerStartRow, cornerEndCol, endRow, "leftBottomCorner", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needRightBottomCornerHeader) {
const cornerStartCol = Math.max(startCol, table.colCount - table.rightFrozenColCount), cornerStartRow = Math.max(startRow, table.rowCount - table.bottomFrozenRowCount), strokeArray = [ !needRightRowHeader, !0, !0, !needBottomColumnHeader ];
scene.createCellSelectBorder(cornerStartCol, cornerStartRow, endCol, endRow, "rightBottomCorner", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needColumnHeader) {
const columnHeaderStartCol = Math.max(startCol, table.frozenColCount), columnHeaderEndCol = Math.min(endCol, table.colCount - table.rightFrozenColCount - 1), columnHeaderEndRow = Math.min(endRow, table.frozenRowCount - 1), strokeArray = [ !0, !needRightTopCornerHeader, !needBody, !needCornerHeader ];
scene.createCellSelectBorder(columnHeaderStartCol, startRow, columnHeaderEndCol, columnHeaderEndRow, "columnHeader", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needBottomColumnHeader) {
const columnHeaderStartCol = Math.max(startCol, table.frozenColCount), columnHeaderEndCol = Math.min(endCol, table.colCount - table.rightFrozenColCount - 1), columnHeaderStartRow = Math.max(startRow, table.rowCount - table.bottomFrozenRowCount), strokeArray = [ !needBody, !needRightBottomCornerHeader, !0, !needLeftBottomCornerHeader ];
scene.createCellSelectBorder(columnHeaderStartCol, columnHeaderStartRow, columnHeaderEndCol, endRow, "bottomFrozen", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needRowHeader) {
const columnHeaderStartRow = Math.max(startRow, table.frozenRowCount), columnHeaderEndRow = Math.min(endRow, table.rowCount - table.bottomFrozenRowCount - 1), columnHeaderEndCol = Math.min(endCol, table.frozenColCount - 1), strokeArray = [ !needCornerHeader, !needBody, !needLeftBottomCornerHeader, !0 ];
scene.createCellSelectBorder(startCol, columnHeaderStartRow, columnHeaderEndCol, columnHeaderEndRow, "rowHeader", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needRightRowHeader) {
const columnHeaderStartRow = Math.max(startRow, table.frozenRowCount), columnHeaderEndRow = Math.min(endRow, table.rowCount - table.bottomFrozenRowCount - 1), columnHeaderStartCol = Math.max(startCol, table.colCount - table.rightFrozenColCount), strokeArray = [ !needRightTopCornerHeader, !0, !needRightBottomCornerHeader, !needBody ];
scene.createCellSelectBorder(columnHeaderStartCol, columnHeaderStartRow, endCol, columnHeaderEndRow, "rightFrozen", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
if (needBody) {
const columnHeaderStartCol = Math.max(startCol, table.frozenColCount), columnHeaderStartRow = Math.max(startRow, table.frozenRowCount), columnHeaderEndCol = Math.min(endCol, table.colCount - table.rightFrozenColCount - 1), columnHeaderEndRow = Math.min(endRow, table.rowCount - table.bottomFrozenRowCount - 1), strokeArray = [ !needColumnHeader, !needRightRowHeader, !needBottomColumnHeader, !needRowHeader ];
scene.createCellSelectBorder(columnHeaderStartCol, columnHeaderStartRow, columnHeaderEndCol, columnHeaderEndRow, "body", `${startCol}${startRow}${endCol}${endRow}`, strokeArray);
}
}
export function hideCellSelectBorder(scene) {
scene.selectingRangeComponents.forEach(((selectComp, key) => {
selectComp.rect.setAttribute("opacity", 0);
})), scene.selectedRangeComponents.forEach(((selectComp, key) => {
selectComp.rect.setAttribute("opacity", 0);
}));
}
export function restoreCellSelectBorder(scene) {
scene.selectingRangeComponents.forEach(((selectComp, key) => {
selectComp.rect.setAttribute("opacity", 1);
})), scene.selectedRangeComponents.forEach(((selectComp, key) => {
selectComp.rect.setAttribute("opacity", 1);
}));
}
//# sourceMappingURL=update-select-border.js.map