@visactor/vtable
Version:
canvas table width high performance
142 lines (130 loc) • 10.4 kB
JavaScript
import { Group } from "../graphic/group";
import { getProp, getRawProp } from "../utils/get-prop";
import { createCell, dealWithMergeCellSize } from "./cell-helper";
import { getCellCornerRadius, getStyleTheme } from "../../core/tableHelper";
import { isPromise } from "../../tools/helper";
import { dealPromiseData } from "../utils/deal-promise-data";
import { dealWithCustom } from "../component/custom";
export function createComplexColumn(columnGroup, col, colWidth, rowStart, rowEnd, mergeMap, defaultRowHeight, table, rowLimit) {
var _a, _b;
let padding, textAlign, textBaseline, y = 0;
columnGroup.lastChild && columnGroup.lastChild.row === rowStart - 1 ? y = columnGroup.lastChild.attribute.y + columnGroup.lastChild.attribute.height : columnGroup.colHeight && (y = columnGroup.colHeight);
for (let j = rowStart; j <= rowEnd; j++) {
const row = j;
let range, isMerge, customStyle, customResult, cellLocation = table.getCellLocation(col, row), value = table.getCellValue(col, row), cellWidth = colWidth, cellHeight = table.getRowHeight(row), isCustomMerge = !1;
if (table.internalProps.customMergeCell) {
const customMerge = table.getCustomMerge(col, row);
if (customMerge) {
const {range: customMergeRange, text: customMergeText, style: customMergeStyle, customLayout: customLayout, customRender: customRender} = customMerge;
if (range = customMergeRange, isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row,
isMerge) {
const mergeSize = dealMerge(range, mergeMap, table, rowStart > range.start.row);
cellWidth = mergeSize.cellWidth, cellHeight = mergeSize.cellHeight;
}
value = customMergeText, customStyle = customMergeStyle, (customLayout || customRender) && (customResult = dealWithCustom(customLayout, customRender, customMergeRange.start.col, customMergeRange.start.row, table.getColsWidth(customMergeRange.start.col, customMergeRange.end.col), table.getRowsHeight(customMergeRange.start.row, customMergeRange.end.row), !1, table.isAutoRowHeight(row), [ 0, 0, 0, 0 ], range, table)),
isCustomMerge = !0;
}
}
let define, colForDefine = col, rowForDefine = row;
range && (colForDefine = range.start.col, rowForDefine = range.start.row), !table.isPivotTable() && ("columnHeader" === cellLocation || "cornerHeader" === cellLocation) && row >= table.columnHeaderLevelCount && (cellLocation = "body"),
define = !table.isPivotTable() && table.isSeriesNumberInBody(col, row) ? table.getBodyColumnDefine(colForDefine, rowForDefine) : "body" !== cellLocation ? table.getHeaderDefine(colForDefine, rowForDefine) : table.getBodyColumnDefine(colForDefine, rowForDefine);
let mayHaveIcon = "body" !== cellLocation || ((null == define ? void 0 : define.dragOrder) || !!(null == define ? void 0 : define.icon) || !!(null == define ? void 0 : define.tree));
if (!range && (table.internalProps.enableTreeNodeMerge || "body" !== cellLocation || (null == define ? void 0 : define.mergeCell)) && (range = table.getCellRange(col, row),
isMerge = range.start.col !== range.end.col || range.start.row !== range.end.row,
isMerge)) {
const mergeSize = dealMerge(range, mergeMap, table, rowStart > range.start.row);
cellWidth = mergeSize.cellWidth, cellHeight = mergeSize.cellHeight;
}
let isVtableMerge = !1;
if (table.internalProps.enableTreeNodeMerge && isMerge) {
const rawRecord = table.getCellRawRecord(range.start.col, range.start.row), {vtableMergeName: vtableMergeName, vtableMerge: vtableMerge} = null != rawRecord ? rawRecord : {};
isVtableMerge = vtableMerge, vtableMerge && (mayHaveIcon = !0, table.options.groupTitleCustomLayout && (customResult = dealWithCustom(table.options.groupTitleCustomLayout, void 0, range.start.col, range.start.row, table.getColsWidth(range.start.col, range.end.col), table.getRowsHeight(range.start.row, range.end.row), !1, table.isAutoRowHeight(row), [ 0, 0, 0, 0 ], range, table)),
table.options.groupTitleFieldFormat ? value = table.options.groupTitleFieldFormat(rawRecord, col, row, table) : vtableMergeName && (value = vtableMergeName));
}
const type = isVtableMerge || isCustomMerge ? "text" : null !== (_b = table.isHeader(col, row) ? null !== (_a = table._getHeaderLayoutMap(col, row).headerType) && void 0 !== _a ? _a : "text" : table.getBodyColumnType(col, row)) && void 0 !== _b ? _b : "text";
if (isPromise(value)) {
createEmptyCellGroup(col, row, 0, y, cellWidth, cellHeight, columnGroup), dealPromiseData(value, table, callCreateCellForPromiseValue.bind(null, {
type: type,
value: value,
define: define,
table: table,
col: col,
row: row,
colWidth: colWidth,
cellWidth: cellWidth,
cellHeight: cellHeight,
columnGroup: columnGroup,
y: y,
customStyle: customStyle,
mayHaveIcon: mayHaveIcon,
cellLocation: cellLocation,
range: range,
customResult: customResult,
defaultRowHeight: defaultRowHeight
})), columnGroup.updateColumnRowNumber(row);
const height = table.getRowHeight(row);
columnGroup.updateColumnHeight(height), y += height;
} else {
const cellStyle = customStyle || table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row), cellTheme = getStyleTheme(cellStyle, table, range ? range.start.col : col, range ? range.start.row : row, getProp).theme;
cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table), cellTheme.group.width = colWidth,
cellTheme.group.height = Array.isArray(defaultRowHeight) ? defaultRowHeight[row] : defaultRowHeight,
cellTheme._vtable.padding && (padding = cellTheme._vtable.padding), cellTheme.text.textAlign && (textAlign = cellTheme.text.textAlign),
cellTheme.text.textBaseline && (textBaseline = cellTheme.text.textBaseline), "body" === cellLocation || cellTheme.group.fill || (cellTheme.group.fill = "#fff");
const cellGroup = createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult);
if (columnGroup.updateColumnRowNumber(row), isMerge) {
const rangeHeight = table.getRowHeight(row), {width: contentWidth} = (table.getColWidth(col),
cellGroup.attribute), {height: contentHeight} = cellGroup.attribute;
cellGroup.contentWidth = contentWidth, cellGroup.contentHeight = contentHeight,
dealWithMergeCellSize(range, contentWidth, contentHeight, padding, textAlign, textBaseline, table),
columnGroup.updateColumnHeight(rangeHeight), y += rangeHeight;
} else columnGroup.updateColumnHeight(cellHeight), y += cellHeight;
}
if (rowLimit && row > rowLimit) break;
}
return columnGroup.setAttribute("width", colWidth), {
width: colWidth,
height: y
};
}
export function getColumnGroupTheme(col, colWidth, table) {
const style = table._getCellStyle(col, table.columnHeaderLevelCount), {theme: columnTheme, hasFunctionPros: hasFunctionPros} = getStyleTheme(style, table, col, table.columnHeaderLevelCount, getRawProp);
return columnTheme.group.width = colWidth, columnTheme.group.height = 0, {
theme: columnTheme,
hasFunctionPros: hasFunctionPros
};
}
function callCreateCellForPromiseValue(createCellArgs) {
let padding, textAlign, textBaseline;
const {type: type, value: value, define: define, table: table, col: col, row: row, colWidth: colWidth, cellWidth: cellWidth, cellHeight: cellHeight, columnGroup: columnGroup, y: y, cellLocation: cellLocation, mayHaveIcon: mayHaveIcon, customStyle: customStyle, range: range, customResult: customResult, defaultRowHeight: defaultRowHeight} = createCellArgs, cellStyle = customStyle || table._getCellStyle(range ? range.start.col : col, range ? range.start.row : row), cellTheme = getStyleTheme(cellStyle, table, range ? range.start.col : col, range ? range.start.row : row, getProp).theme;
cellTheme.group.cornerRadius = getCellCornerRadius(col, row, table), cellTheme.group.width = colWidth,
cellTheme.group.height = Array.isArray(defaultRowHeight) ? defaultRowHeight[row] : defaultRowHeight,
cellTheme._vtable.padding && (padding = cellTheme._vtable.padding), cellTheme.text.textAlign && (textAlign = cellTheme.text.textAlign),
cellTheme.text.textBaseline && (textBaseline = cellTheme.text.textBaseline), "body" === cellLocation || cellTheme.group.fill || (cellTheme.group.fill = "#fff"),
createCell(type, value, define, table, col, row, colWidth, cellWidth, cellHeight, columnGroup, y, padding, textAlign, textBaseline, mayHaveIcon, cellTheme, range, customResult);
}
function dealMerge(range, mergeMap, table, forceUpdate) {
let cellWidth = 0, cellHeight = 0;
const mergeResult = mergeMap.get(`${range.start.col},${range.start.row};${range.end.col},${range.end.row}`);
if (!mergeResult || forceUpdate) {
for (let col = range.start.col; col <= range.end.col; col++) cellWidth += table.getColWidth(col);
for (let i = range.start.row; i <= range.end.row; i++) cellHeight += table.getRowHeight(i);
mergeMap.set(`${range.start.col},${range.start.row};${range.end.col},${range.end.row}`, {
cellWidth: cellWidth,
cellHeight: cellHeight
});
} else cellWidth = mergeResult.cellWidth, cellHeight = mergeResult.cellHeight;
return {
cellWidth: cellWidth,
cellHeight: cellHeight
};
}
function createEmptyCellGroup(col, row, x, y, width, height, columnGroup) {
const cellGroup = new Group({
x: x,
y: y,
width: width,
height: height
});
cellGroup.role = "cell", cellGroup.col = col, cellGroup.row = row, columnGroup.addChild(cellGroup);
}
//# sourceMappingURL=column-helper.js.map