@visactor/vrender-components
Version:
components library for dp visualization
545 lines (534 loc) • 33.6 kB
JavaScript
import { generateColField } from "./tools";
import { merge } from "@visactor/vutils";
import { AbstractComponent } from "../core/base";
import { SeriesNumberCellStateValue, SeriesNumberEvent } from "./type";
import { TableSeriesNumberEventManager } from "./event-manager";
import { parsePadding } from "@visactor/vrender-core";
import { loadTableSeriesNumberComponent } from "./register";
const cornerSvg = '<svg t="1716726614852" class="icon" viewBox="0 0 1194 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2621" width="200" height="200"><path d="M1038.694079 367.237067c13.265507 23.342857-16.633865-40.004445-63.05621-40.004446H219.018794c-26.558738 0-46.46393 13.334815-63.05621 40.004446S0.006238 607.277601 0.006238 650.608819V940.647979a82.351494 82.351494 0 0 0 82.961402 83.349526H1111.702885a82.337632 82.337632 0 0 0 82.975264-83.349526V650.608819c0-43.331218-155.970208-283.371753-155.970208-283.371752zM730.066575 667.284269a136.328386 136.328386 0 0 1-132.738243 133.33429 133.417459 133.417459 0 0 1-132.738243-133.33429v-6.681269a40.6698 40.6698 0 0 0-36.497473-26.66963H73.015044l119.458874-220.02445s23.231965-40.004445 53.103614-40.004446h713.481918c26.544876 0 29.871649 10.008042 46.436207 40.004446L1128.33675 633.947231H769.904682c-26.184476 0-39.838107 7.623855-39.838107 33.337038zM338.505391 210.559919l-89.601086-86.69016a22.178487 22.178487 0 0 1 0-33.26773 21.984425 21.984425 0 0 1 33.170699 0l89.601087 86.676299a22.317102 22.317102 0 0 1 0 33.26773 24.950798 24.950798 0 0 1-33.1707 0z m252.197118-40.059891a25.532983 25.532983 0 0 1-6.639685-16.633865l-3.326773-126.694606A28.263709 28.263709 0 0 1 603.995739 0.515788c13.251646-3.326773 23.204242 10.021904 26.544877 23.342858V153.866163a28.249847 28.249847 0 0 1-23.259688 26.66963c-6.611961-3.312911-13.279369-3.312911-16.578419-10.035765z m235.646421 33.337038a22.372548 22.372548 0 0 1 0-33.337038l86.288175-90.030795a22.039871 22.039871 0 0 1 33.170699 0 22.289379 22.289379 0 0 1 0 33.364761l-82.961401 90.003072a25.962691 25.962691 0 0 1-36.483611 0z" fill="#8a8a8a" p-id="2622"></path></svg>';
loadTableSeriesNumberComponent();
export class TableSeriesNumber extends AbstractComponent {
constructor(attributes, options) {
if (super((null == options ? void 0 : options.skipDefault) ? attributes : merge({}, TableSeriesNumber.defaultAttributes, attributes)),
this.name = "tableSeriesNumber", this._firstRowSeriesNumberIndex = 0, this._firstColSeriesNumberIndex = 0,
this._maxTextWidth = 0, this._changeRowSeriesNumberWidthTimer = null, this.interactionState = {
selectIndexs: new Set,
_lastHoverItem: null,
_lastClickItem: null
}, this._parsedRowSeriesNumberCellPadding = [ 0, 0, 0, 0 ], this._parsedColSeriesNumberCellPadding = [ 0, 0, 0, 0 ],
this.initRenderAll = !1, this.initRenderAll = (null == options ? void 0 : options.initRenderAll) || !1,
this._skipRenderAttributes.push("frozenTopRow"), this._skipRenderAttributes.push("frozenLeftCol"),
this._skipRenderAttributes.push("frozenRightCol"), this._skipRenderAttributes.push("frozenBottomRow"),
this._skipRenderAttributes.push("rowCount"), this._skipRenderAttributes.push("colCount"),
this._skipRenderAttributes.push("hover"), this._skipRenderAttributes.push("select"),
this.attribute.rowSeriesNumberCellStyle.text.padding) {
const padding = parsePadding(this.attribute.rowSeriesNumberCellStyle.text.padding);
this._parsedRowSeriesNumberCellPadding = "number" == typeof padding ? [ padding, padding, padding, padding ] : padding;
}
if (this.attribute.colSeriesNumberCellStyle.text.padding) {
const padding = parsePadding(this.attribute.colSeriesNumberCellStyle.text.padding);
this._parsedColSeriesNumberCellPadding = "number" == typeof padding ? [ padding, padding, padding, padding ] : padding;
}
this._eventManager = new TableSeriesNumberEventManager(this);
}
get rowSeriesNumberWidth() {
const {rowSeriesNumberWidth: rowSeriesNumberWidth} = this.attribute;
return this._maxTextWidth ? Math.max(this._maxTextWidth + this._parsedRowSeriesNumberCellPadding[3] + this._parsedRowSeriesNumberCellPadding[1], "number" == typeof rowSeriesNumberWidth ? rowSeriesNumberWidth : 40) : "number" == typeof rowSeriesNumberWidth ? rowSeriesNumberWidth : 40;
}
get colSeriesNumberHeight() {
const {colSeriesNumberHeight: colSeriesNumberHeight} = this.attribute;
return "number" == typeof colSeriesNumberHeight ? colSeriesNumberHeight : 20;
}
get rowCount() {
const {rowCount: rowCount} = this.attribute;
return rowCount;
}
get colCount() {
const {colCount: colCount} = this.attribute;
return colCount;
}
bindEvents() {
this._eventManager.bindEvents();
}
dispatchTableSeriesNumberEvent(event, ...args) {
this._dispatchEvent(event, ...args);
}
render() {
const {rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, innerView = this.createOrUpdateChild("tableSeriesNumberContainer", {
x: 0,
y: 0,
fill: "rgba(1,1,1,0)",
width: this.rowSeriesNumberWidth + colCount * ("number" == typeof colWidth ? colWidth : 20),
height: this.colSeriesNumberHeight + rowCount * ("number" == typeof rowHeight ? rowHeight : 20),
pickable: !1,
childrenPickable: !0
}, "group");
this._tableSeriesNumberContainer = innerView, this._renderContent();
}
_renderContent() {
if (this._renderRowSeriesNumber(), this._renderColSeriesNumber(), this._renderFrozenTopRowSeriesNumber(),
this._renderFrozenLeftColSeriesNumber(), this._renderCorner(), this.initRenderAll) {
this.recreateCellsToRowSeriesNumberGroup(0, this.attribute.rowCount - 1), this.recreateCellsToColSeriesNumberGroup(0, this.attribute.colCount - 1);
let y = 0;
for (let i = 0; i < this.attribute.rowCount; i++) this.setRowSeriesNumberCellAttributes(i, {
y: y,
height: "number" == typeof this.attribute.rowHeight ? this.attribute.rowHeight : 20
}), y += "number" == typeof this.attribute.rowHeight ? this.attribute.rowHeight : 20;
let x = 0;
for (let i = 0; i < this.attribute.colCount; i++) this.setColSeriesNumberCellAttributes(i, {
x: x,
width: "number" == typeof this.attribute.colWidth ? this.attribute.colWidth : 20
}), x += "number" == typeof this.attribute.colWidth ? this.attribute.colWidth : 20;
}
}
_renderCorner() {
const {rowCount: rowCount, colCount: colCount, cornerCellStyle: cornerSeriesNumberCellStyle, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, cornerGroup = this._tableSeriesNumberContainer.createOrUpdateChild("cornerSeriesNumberCell", {
x: 0,
y: 0,
fill: cornerSeriesNumberCellStyle.bgColor,
stroke: cornerSeriesNumberCellStyle.borderLine.stroke,
lineWidth: cornerSeriesNumberCellStyle.borderLine.lineWidth,
pickable: !0,
width: this.rowSeriesNumberWidth,
height: this.colSeriesNumberHeight
}, "group");
cornerGroup.id = "0,0", cornerGroup.states = cornerSeriesNumberCellStyle.states,
this._cornerGroup = cornerGroup;
}
_renderRowSeriesNumber() {
const {frozenRowCount: frozenRowCount, rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, rowSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("rowSeriesNumberCellGroup", {
x: 0,
y: this.colSeriesNumberHeight,
pickable: !0,
fill: rowSeriesNumberCellStyle.bgColor,
width: this.rowSeriesNumberWidth,
height: rowCount * ("number" == typeof rowHeight ? rowHeight : 20)
}, "group");
this._rowSeriesNumberGroup = rowSeriesNumberGroup;
}
_renderColSeriesNumber() {
const {frozenColCount: frozenColCount, rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, colSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("colSeriesNumberCellGroup", {
x: this.rowSeriesNumberWidth + frozenColCount * ("number" == typeof colWidth ? colWidth : 20),
y: 0,
pickable: !0,
fill: colSeriesNumberCellStyle.bgColor,
width: colCount * ("number" == typeof colWidth ? colWidth : 20),
height: this.colSeriesNumberHeight
}, "group");
this._colSeriesNumberGroup = colSeriesNumberGroup;
}
_renderFrozenTopRowSeriesNumber() {
const {frozenRowCount: frozenRowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, frozenTopSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("frozenTopSeriesNumberGroup", {
x: 0,
y: this.colSeriesNumberHeight,
width: this.rowSeriesNumberWidth,
height: frozenRowCount * ("number" == typeof rowHeight ? rowHeight : 20)
}, "group");
this._frozenTopRowSeriesNumberGroup = frozenTopSeriesNumberGroup;
}
_renderFrozenLeftColSeriesNumber() {
const {frozenColCount: frozenColCount, rowCount: rowCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute, frozenLeftSeriesNumberGroup = this._tableSeriesNumberContainer.createOrUpdateChild("frozenLeftSeriesNumberGroup", {
x: this.rowSeriesNumberWidth,
y: 0,
height: this.colSeriesNumberHeight,
width: frozenColCount * ("number" == typeof colWidth ? colWidth : 20)
}, "group");
this._frozenLeftColSeriesNumberGroup = frozenLeftSeriesNumberGroup;
}
recreateCellsToRowSeriesNumberGroup(startIndex, endIndex) {
var _a, _b;
const {frozenRowCount: frozenRowCount, rowCount: rowCount, colCount: colCount, rowSeriesNumberWidth: rowSeriesNumberWidth, colSeriesNumberHeight: colSeriesNumberHeight, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle, rowHeight: rowHeight, colWidth: colWidth} = this.attribute;
this._frozenTopRowSeriesNumberGroup.removeAllChild(), this._rowSeriesNumberGroup.removeAllChild();
let y = 0;
const height = ("number" == typeof rowHeight ? rowHeight : 20) - this._parsedRowSeriesNumberCellPadding[0] - this._parsedRowSeriesNumberCellPadding[2];
let x;
y = "middle" === rowSeriesNumberCellStyle.text.textBaseline ? this._parsedRowSeriesNumberCellPadding[0] + (height - rowSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === rowSeriesNumberCellStyle.text.textBaseline ? this._parsedRowSeriesNumberCellPadding[0] + height - rowSeriesNumberCellStyle.text.fontSize : this._parsedRowSeriesNumberCellPadding[0];
const width = this.rowSeriesNumberWidth - this._parsedRowSeriesNumberCellPadding[3] - this._parsedRowSeriesNumberCellPadding[1], textAlign = this.attribute.rowSeriesNumberCellStyle.text.textAlign, padding = this._parsedRowSeriesNumberCellPadding;
x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3];
for (let i = 0; i < frozenRowCount; i++) {
const cellGroup = this._frozenTopRowSeriesNumberGroup.createOrUpdateChild(`rowSeriesNumberCell-${i}`, {
x: 0,
y: 0,
pickable: !0,
fill: rowSeriesNumberCellStyle.bgColor,
stroke: rowSeriesNumberCellStyle.borderLine.stroke,
lineWidth: rowSeriesNumberCellStyle.borderLine.lineWidth,
width: this.rowSeriesNumberWidth,
height: "number" == typeof rowHeight ? rowHeight : 20
}, "group");
cellGroup.id = i, cellGroup.states = rowSeriesNumberCellStyle.states, (null === (_a = this.interactionState.selectIndexs) || void 0 === _a ? void 0 : _a.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
cellGroup.createOrUpdateChild(`rowSeriesNumberCellText-${i}`, Object.assign(Object.assign({
x: x,
y: y,
text: `${i + 1}`,
pickable: !1,
dx: 0
}, rowSeriesNumberCellStyle.text), {
textBaseline: "top"
}), "text");
}
this._firstRowSeriesNumberIndex = Math.max(startIndex, frozenRowCount) - frozenRowCount;
let thisTextMaxWidth = 0;
for (let i = this._firstRowSeriesNumberIndex; i <= endIndex - frozenRowCount; i++) {
const cellGroup = this._rowSeriesNumberGroup.createOrUpdateChild(`rowSeriesNumberCell-${i + frozenRowCount}`, {
x: 0,
y: 0,
pickable: !0,
fill: rowSeriesNumberCellStyle.bgColor,
stroke: rowSeriesNumberCellStyle.borderLine.stroke,
lineWidth: rowSeriesNumberCellStyle.borderLine.lineWidth,
width: this.rowSeriesNumberWidth,
height: "number" == typeof rowHeight ? rowHeight : 20
}, "group");
cellGroup.id = i + frozenRowCount, cellGroup.states = rowSeriesNumberCellStyle.states,
(null === (_b = this.interactionState.selectIndexs) || void 0 === _b ? void 0 : _b.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
const text = cellGroup.createOrUpdateChild(`rowSeriesNumberCellText-${i + frozenRowCount}`, Object.assign(Object.assign({
x: x,
y: y,
text: `${i + 1 + frozenRowCount}`,
pickable: !1,
dx: 0
}, rowSeriesNumberCellStyle.text), {
textBaseline: "top"
}), "text");
i === endIndex - frozenRowCount && (thisTextMaxWidth = text.clipedWidth);
}
clearTimeout(this._changeRowSeriesNumberWidthTimer), this._changeRowSeriesNumberWidthTimer = setTimeout((() => {
if (Math.abs(thisTextMaxWidth - this._maxTextWidth) >= 6) {
const oldWidth = this._maxTextWidth;
this._maxTextWidth = thisTextMaxWidth, this.changeRowSeriesNumberWidth(Math.max(this.rowSeriesNumberWidth, 20)),
this._dispatchEvent(SeriesNumberEvent.rowSeriesNumberWidthChange, {
newWidth: this.rowSeriesNumberWidth,
oldWidth: oldWidth
});
}
}), 100);
}
recreateCellsToColSeriesNumberGroup(startIndex, endIndex) {
var _a, _b, _c, _d;
const {colCount: colCount, colSeriesNumberCellStyle: colSeriesNumberCellStyle, frozenColCount: frozenColCount, colWidth: colWidth} = this.attribute, oldFrozenLeftColSeriesNumberGroupCellsWidth = new Map;
null === (_b = null === (_a = this._frozenLeftColSeriesNumberGroup) || void 0 === _a ? void 0 : _a.forEachChildren) || void 0 === _b || _b.call(_a, ((child, index) => {
oldFrozenLeftColSeriesNumberGroupCellsWidth.set(index, child.getAttributes().width);
})), this._frozenLeftColSeriesNumberGroup.removeAllChild(), this._colSeriesNumberGroup.removeAllChild();
let y = 0;
const height = this.colSeriesNumberHeight - this._parsedColSeriesNumberCellPadding[0] - this._parsedColSeriesNumberCellPadding[2];
let x;
y = "middle" === colSeriesNumberCellStyle.text.textBaseline ? this._parsedColSeriesNumberCellPadding[0] + (height - colSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === colSeriesNumberCellStyle.text.textBaseline ? this._parsedColSeriesNumberCellPadding[0] + height - colSeriesNumberCellStyle.text.fontSize : this._parsedColSeriesNumberCellPadding[0];
const width = ("number" == typeof colWidth ? colWidth : 20) - this._parsedColSeriesNumberCellPadding[3] - this._parsedColSeriesNumberCellPadding[1], textAlign = this.attribute.colSeriesNumberCellStyle.text.textAlign, padding = this._parsedColSeriesNumberCellPadding;
x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3];
for (let i = 0; i < frozenColCount; i++) {
const cellGroup = this._frozenLeftColSeriesNumberGroup.createOrUpdateChild(`colSeriesNumberCell-${i}`, {
x: 0,
y: 0,
pickable: !0,
fill: colSeriesNumberCellStyle.bgColor,
stroke: colSeriesNumberCellStyle.borderLine.stroke,
lineWidth: colSeriesNumberCellStyle.borderLine.lineWidth,
width: oldFrozenLeftColSeriesNumberGroupCellsWidth.get(i) || ("number" == typeof colWidth ? colWidth : 20),
height: this.colSeriesNumberHeight
}, "group");
cellGroup.id = i, cellGroup.states = colSeriesNumberCellStyle.states, (null === (_c = this.interactionState.selectIndexs) || void 0 === _c ? void 0 : _c.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
cellGroup.createOrUpdateChild(`colSeriesNumberCellText-${i}`, Object.assign(Object.assign({
x: x,
y: y,
dx: 0,
text: generateColField(i),
pickable: !1
}, colSeriesNumberCellStyle.text), {
textBaseline: "top"
}), "text");
}
this._firstColSeriesNumberIndex = Math.max(startIndex, frozenColCount) - frozenColCount;
for (let i = this._firstColSeriesNumberIndex; i <= endIndex - frozenColCount; i++) {
const cellGroup = this._colSeriesNumberGroup.createOrUpdateChild(`colSeriesNumberCell-${i + frozenColCount}`, {
x: 0,
y: 0,
pickable: !0,
fill: colSeriesNumberCellStyle.bgColor,
stroke: colSeriesNumberCellStyle.borderLine.stroke,
lineWidth: colSeriesNumberCellStyle.borderLine.lineWidth,
width: "number" == typeof colWidth ? colWidth : 20,
height: this.colSeriesNumberHeight
}, "group");
cellGroup.id = i + frozenColCount, cellGroup.states = colSeriesNumberCellStyle.states,
(null === (_d = this.interactionState.selectIndexs) || void 0 === _d ? void 0 : _d.has(cellGroup.name)) && cellGroup.useStates([ SeriesNumberCellStateValue.select ]);
cellGroup.createOrUpdateChild(`colSeriesNumberCellText-${i + frozenColCount}`, Object.assign(Object.assign({
x: x,
y: y,
dx: 0,
text: generateColField(i + frozenColCount),
pickable: !1
}, colSeriesNumberCellStyle.text), {
textBaseline: "top"
}), "text");
}
}
changeRowSeriesNumberWidth(newWidth) {
const {rowHeight: rowHeight, rowCount: oldRowCount, frozenRowCount: frozenRowCount, frozenColCount: frozenLeftCol, rowSeriesNumberCellStyle: rowSeriesNumberCellStyle} = this.attribute;
this._cornerGroup.setAttributes({
width: newWidth
}), this._frozenTopRowSeriesNumberGroup.setAttributes({
width: newWidth
});
for (let i = 0; i < this._frozenTopRowSeriesNumberGroup.children.length; i++) this.setRowSeriesNumberCellAttributes(i, {
width: newWidth
});
this._rowSeriesNumberGroup.setAttributes({
width: newWidth
});
for (let i = 0; i < this._rowSeriesNumberGroup.children.length; i++) this.setRowSeriesNumberCellAttributes(i + this._firstRowSeriesNumberIndex + frozenRowCount, {
width: newWidth
});
this._frozenLeftColSeriesNumberGroup.setAttributes({
x: newWidth
}), this._colSeriesNumberGroup.setAttributes({
x: newWidth + this._frozenLeftColSeriesNumberGroup.getAttributes().width
});
}
getRowSeriesNumberCellGroup(index) {
const {frozenRowCount: frozenRowCount} = this.getAttributes();
if (index >= 0 && index < frozenRowCount) return this._frozenTopRowSeriesNumberGroup.children[index];
return this._rowSeriesNumberGroup.children[index - frozenRowCount - this._firstRowSeriesNumberIndex];
}
getColSeriesNumberCellGroup(index) {
const {frozenColCount: frozenColCount} = this.getAttributes();
if (index >= 0 && index < frozenColCount) return this._frozenLeftColSeriesNumberGroup.children[index];
return this._colSeriesNumberGroup.children[index - frozenColCount - this._firstColSeriesNumberIndex];
}
getRowSeriesNumberCellAttributes(index) {
const {frozenRowCount: frozenRowCount} = this.getAttributes();
if (index >= 0 && index < frozenRowCount) return this._frozenTopRowSeriesNumberGroup.children[index].attribute;
return this._rowSeriesNumberGroup.children[index - frozenRowCount - this._firstRowSeriesNumberIndex].attribute;
}
getColSeriesNumberCellAttributes(index) {
const {frozenColCount: frozenColCount} = this.getAttributes();
if (index >= 0 && index < frozenColCount) return this._frozenLeftColSeriesNumberGroup.children[index].attribute;
return this._colSeriesNumberGroup.children[index - frozenColCount - this._firstColSeriesNumberIndex].attribute;
}
setRowSeriesNumberCellAttributes(index, attributes) {
const {frozenRowCount: frozenRowCount} = this.getAttributes();
let targetCellGroup;
if (index >= 0 && index < frozenRowCount) {
const {height: oldHeight, width: oldWidth, y: y} = this._frozenTopRowSeriesNumberGroup.getAttributes();
targetCellGroup = this._frozenTopRowSeriesNumberGroup.children[index], targetCellGroup.setAttributes(attributes),
attributes.height && this._frozenTopRowSeriesNumberGroup.setAttributes({
height: this._frozenTopRowSeriesNumberGroup.getAttributes().height + (attributes.height - oldHeight)
}), attributes.width && this._frozenTopRowSeriesNumberGroup.setAttributes({
width: this._frozenTopRowSeriesNumberGroup.getAttributes().width + (attributes.width - oldWidth)
}), attributes.height && this._rowSeriesNumberGroup.setAttributes({
y: this._frozenTopRowSeriesNumberGroup.getAttributes().height + this._frozenTopRowSeriesNumberGroup.getAttributes().y
});
} else {
targetCellGroup = this._rowSeriesNumberGroup.children[index - frozenRowCount - this._firstRowSeriesNumberIndex],
targetCellGroup.setAttributes(attributes);
}
if (attributes.width) {
let x;
const width = attributes.width - this._parsedRowSeriesNumberCellPadding[3] - this._parsedRowSeriesNumberCellPadding[1], textAlign = this.attribute.rowSeriesNumberCellStyle.text.textAlign, padding = this._parsedRowSeriesNumberCellPadding;
x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3],
targetCellGroup.children[0].setAttributes({
x: x
});
}
if (attributes.height) {
const height = attributes.height - this._parsedRowSeriesNumberCellPadding[0] - this._parsedRowSeriesNumberCellPadding[2], textBaseline = this.attribute.rowSeriesNumberCellStyle.text.textBaseline, padding = this._parsedRowSeriesNumberCellPadding;
let y;
y = "middle" === textBaseline ? padding[0] + (height - this.attribute.rowSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === textBaseline ? padding[0] + height - this.attribute.rowSeriesNumberCellStyle.text.fontSize : padding[0],
targetCellGroup.children[0].setAttributes({
y: y
});
}
}
setColSeriesNumberCellAttributes(index, attributes) {
const {frozenColCount: frozenColCount} = this.getAttributes();
let targetCellGroup;
if (index >= 0 && index < frozenColCount) {
targetCellGroup = this._frozenLeftColSeriesNumberGroup.children[index];
const {height: oldHeight, width: oldWidth} = targetCellGroup.getAttributes();
targetCellGroup.setAttributes(attributes), attributes.height && this._frozenLeftColSeriesNumberGroup.setAttributes({
height: this._frozenLeftColSeriesNumberGroup.getAttributes().height + (attributes.height - oldHeight)
}), attributes.width && this._frozenLeftColSeriesNumberGroup.setAttributes({
width: this._frozenLeftColSeriesNumberGroup.getAttributes().width + (attributes.width - oldWidth)
}), attributes.width && this._colSeriesNumberGroup.setAttributes({
x: this._frozenLeftColSeriesNumberGroup.getAttributes().width + this._frozenLeftColSeriesNumberGroup.getAttributes().x
});
} else {
targetCellGroup = this._colSeriesNumberGroup.children[index - frozenColCount - this._firstColSeriesNumberIndex],
targetCellGroup.setAttributes(attributes);
}
if (attributes.width) {
let x;
const width = attributes.width - this._parsedColSeriesNumberCellPadding[3] - this._parsedColSeriesNumberCellPadding[1], textAlign = this.attribute.colSeriesNumberCellStyle.text.textAlign, padding = this._parsedColSeriesNumberCellPadding;
x = "center" === textAlign ? padding[3] + +width / 2 : "right" === textAlign ? padding[3] + width : padding[3],
targetCellGroup.children[0].setAttributes({
x: x
});
}
if (attributes.height) {
const height = attributes.height - this._parsedColSeriesNumberCellPadding[0] - this._parsedColSeriesNumberCellPadding[2], textBaseline = this.attribute.colSeriesNumberCellStyle.text.textBaseline, padding = this._parsedColSeriesNumberCellPadding;
let y;
y = "middle" === textBaseline ? padding[0] + (height - this.attribute.colSeriesNumberCellStyle.text.fontSize) / 2 : "bottom" === textBaseline ? padding[0] + height - this.attribute.colSeriesNumberCellStyle.text.fontSize : padding[0],
targetCellGroup.children[0].setAttributes({
y: y
});
}
}
setRowSeriesNumberGroupAttributes(attributes) {
this._rowSeriesNumberGroup.setAttributes(attributes);
}
setColSeriesNumberGroupAttributes(attributes) {
this._colSeriesNumberGroup.setAttributes(attributes);
}
addSelectedIndex(isRow, index) {
let name;
name = isRow ? `rowSeriesNumberCell-${index}` : `colSeriesNumberCell-${index}`,
this.interactionState.selectIndexs.add(name);
}
addRowSelectedRanges(ranges) {
performance.now();
for (let i = 0; i < ranges.length; i++) {
const {startIndex: startIndex, endIndex: endIndex} = ranges[i];
for (let j = startIndex; j <= endIndex; j++) {
const name = `rowSeriesNumberCell-${j}`;
this.interactionState.selectIndexs.add(name);
}
}
performance.now();
}
addColSelectedRanges(ranges) {
for (let i = 0; i < ranges.length; i++) {
const {startIndex: startIndex, endIndex: endIndex} = ranges[i];
for (let j = startIndex; j <= endIndex; j++) {
const name = `colSeriesNumberCell-${j}`;
this.interactionState.selectIndexs.add(name);
}
}
}
addCornderSelected() {
this.interactionState.selectIndexs.add(this._cornerGroup.name);
}
resetAllSelectedIndexs({rowIndexs: rowIndexs, colIndexs: colIndexs}) {
if (this.interactionState.selectIndexs = new Set, rowIndexs) for (let i = 0; i < rowIndexs.length; i++) {
const name = `rowSeriesNumberCell-${rowIndexs[i]}`;
this.interactionState.selectIndexs.add(name);
}
if (colIndexs) for (let i = 0; i < colIndexs.length; i++) {
const name = `colSeriesNumberCell-${colIndexs[i]}`;
this.interactionState.selectIndexs.add(name);
}
}
removeSelectedIndex(isRow, index) {
let name;
name = isRow ? `rowSeriesNumberLeftCell-${index}` : `colSeriesNumberCell-${index}`,
this.interactionState.selectIndexs.delete(name);
}
removeAllSelectedIndexs() {
var _a, _b;
for (const name of this.interactionState.selectIndexs) {
const isRow = name.startsWith("row"), isCol = name.startsWith("col"), index = Number(name.split("-")[1]);
isRow ? null === (_a = this.getRowSeriesNumberCellGroup(index)) || void 0 === _a || _a.removeState(SeriesNumberCellStateValue.select) : isCol ? null === (_b = this.getColSeriesNumberCellGroup(index)) || void 0 === _b || _b.removeState(SeriesNumberCellStateValue.select) : this._cornerGroup.removeState(SeriesNumberCellStateValue.select);
}
this.interactionState.selectIndexs.clear();
}
removeOneGroupSelected(group) {
this.interactionState.selectIndexs.delete(group.name), group.removeState(SeriesNumberCellStateValue.select);
}
addOneGroupSelected(group) {
this.interactionState.selectIndexs.add(group.name), group.useStates([ SeriesNumberCellStateValue.select ]);
}
renderSelectedIndexsState() {
var _a, _b;
const {rowSeriesNumberCellStyle: rowSeriesNumberCellStyle, colSeriesNumberCellStyle: colSeriesNumberCellStyle} = this.attribute;
for (const name of this.interactionState.selectIndexs) {
const isRow = name.startsWith("row"), isCol = name.startsWith("col"), index = Number(name.split("-")[1]);
isRow ? null === (_a = this.getRowSeriesNumberCellGroup(index)) || void 0 === _a || _a.useStates([ SeriesNumberCellStateValue.select ]) : isCol ? null === (_b = this.getColSeriesNumberCellGroup(index)) || void 0 === _b || _b.useStates([ SeriesNumberCellStateValue.select ]) : this._cornerGroup.useStates([ SeriesNumberCellStateValue.select ]);
}
this.stage.render();
}
}
TableSeriesNumber.defaultAttributes = {
frozenRowCount: 0,
frozenColCount: 0,
rightFrozenColCount: 0,
bottomFrozenRowCount: 0,
pickable: !1,
rowCount: 100,
colCount: 100,
rowHeight: 20,
colWidth: 50,
rowSeriesNumberWidth: 30,
colSeriesNumberHeight: 30,
rowSeriesNumberCellStyle: {
text: {
fontSize: 14,
fill: "#7A7A7A",
pickable: !1,
textAlign: "left",
textBaseline: "middle",
padding: [ 2, 4, 2, 4 ]
},
borderLine: {
stroke: "#D9D9D9",
lineWidth: 1,
pickable: !1
},
bgColor: "#F9F9F9",
states: {
hover: {
fill: "#98C8A5",
opacity: .7
},
select: {
fill: "yellow",
opacity: .7
}
}
},
colSeriesNumberCellStyle: {
text: {
fontSize: 14,
fill: "#7A7A7A",
pickable: !1,
textAlign: "left",
textBaseline: "middle",
padding: [ 2, 4, 2, 4 ]
},
borderLine: {
stroke: "#D9D9D9",
lineWidth: 1,
pickable: !1
},
bgColor: "#F9F9F9",
states: {
hover: {
fill: "#98C8A5",
opacity: .7
},
select: {
fill: "orange",
opacity: .7
}
}
},
cornerCellStyle: {
borderLine: {
stroke: "#D9D9D9",
lineWidth: 1,
pickable: !1
},
bgColor: "#F9F9F9",
states: {
hover: {
fill: "#98C8A5",
opacity: .7
},
select: {
fill: "#98C8A5",
opacity: .7
}
}
},
hover: !0,
select: !0
};
//# sourceMappingURL=table-series-number.js.map