e-virt-table
Version:
A powerful data table based on canvas. You can use it as data grid、Microsoft Excel or Google sheets. It supports virtual scroll、cell edit etc.
1,212 lines • 270 kB
JavaScript
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(":root{--evt-header-font: 12px normal Arial;--evt-body-font: 12px normal Arial;--evt-color-white: #fff;--evt-color-black: #000000;--evt-color-primary: rgb(82, 146, 247);--evt-text-color-primary: #333;--evt-text-color-regular: #666;--evt-text-color-secondary: #999;--evt-box-shadow: 0 2px 12px 0 #0000001a;--evt-editor-bg-color: #fff;--evt-editor-text-color: #333;--evt-border-color: #e1e6eb;--evt-stripe-color: #fafafa;--evt-placeholder-color: #cdd0dc;--evt-header-bg-color: #f8faff;--evt-body-bg-color: #fff;--evt-header-text-color: #1d2129;--evt-body-text-color: #4e5969;--evt-footer-text-color: #4e5969;--evt-loading-icon-color: #4e5969;--evt-expand-icon-color: #4e5969;--evt-shrink-icon-color: #4e5969;--evt-error-tip-icon-color: red;--evt-required-color: #F56C6C;--evt-cell-hover-icon-bg-color: #fff;--evt-cell-hover-icon-border-color: #dde0ea;--evt-scroller-color: #dee0e3;--evt-scroller-track-color: #fff;--evt-scroller-focus-color: #bbbec4;--evt-select-border-color: var(--evt-color-primary);--evt-select-area-color: rgba(82, 146, 247, .1);--evt-select-row-col-bg-color: transparent;--evt-autofill-point-border-color: #fff;--evt-edit-bg-color: #fcf6ed;--evt-checkbox-color: var(--evt-color-primary);--evt-checkbox-uncheck-color: #dde0ea;--evt-checkbox-disabled-color: #f1f2f4;--evt-checkbox-check-disabled-color: #dde0ea;--evt-icon-edit-color: #4e5969;--evt-icon-select-color: #4e5969;--evt-readonly-color: #fff;--evt-readonly-text-color: var(--evt-body-text-color);--evt-error-tip-color: #ed3f14;--evt-footer-bg-color: #fafafa;--evt-highlight-hover-row-color: rgba(186, 203, 231, .1);--evt-highlight-selected-row-color: rgba(82, 146, 247, .1);--evt-tooltip-bg-color: #303133;--evt-tooltip-text-color: #fff;--evt-resize-row-line-color: #e1e6eb;--evt-resize-column-line-color: #e1e6eb;--evt-tree-line-color: #e1e6eb;--evt-sort-icon-color: rgb(82, 146, 247)}.dark{--evt-border-color: #363637;--evt-header-bg-color: #141414;--evt-body-bg-color: #141414;--evt-header-text-color: #a3a6ad;--evt-scroller-color: #414243;--evt-scroller-track-color: #141414;--evt-scroller-focus-color: #a3a6ad;--evt-edit-bg-color: #141414;--evt-readonly-text-color: #cfd3dc;--evt-footer-bg-color: #262727;--evt-autofill-point-border-color: #fff;--evt-editor-bg-color: #434343;--evt-editor-text-color: #cfd3dc}.e-virt-table-container{position:relative;outline:none}.e-virt-table-stage{position:relative;overflow:hidden;outline:none;box-sizing:border-box;z-index:10;border-radius:8px;border:1px solid var(--evt-border-color)}.e-virt-table-canvas{position:absolute;left:0;top:0;box-sizing:border-box;border:none;outline:none;z-index:10}.e-virt-table-editor{position:absolute;top:-10000px;left:-10000px;text-align:left;height:auto;line-height:0;z-index:100;overflow:hidden;background-color:var(--evt-editor-bg-color);border:2px solid var(--evt-color-primary);box-sizing:border-box;box-shadow:var(--evt-box-shadow);display:flex;align-items:center}.e-virt-table-overlayer{position:absolute;left:0;top:0;overflow:hidden;z-index:100;pointer-events:none}.e-virt-table-editor-textarea{width:100%;box-sizing:border-box;outline:none;font-weight:400;padding:8px;font-size:12px;color:inherit;white-space:pre-wrap;word-wrap:break-word;word-break:break-all;line-height:1.5;margin:0;border:none;vertical-align:middle;background:var(--evt-editor-bg-color);color:var(--evt-editor-text-color);overflow-y:auto;resize:none}.e-virt-table-context-menu{position:absolute;font-size:14px;color:var(--evt-text-color-regular);background-color:var(--evt-color-white);border-radius:4px;border:1px solid #e4e7ed;box-shadow:var(--evt-box-shadow);width:fit-content;padding:6px 0;z-index:9999;left:-99999px;top:-99999px}.e-virt-table-context-menu-item{cursor:pointer;padding:8px 24px;color:var(--evt-text-color-regular)}.e-virt-table-context-menu-item:hover{color:var(--evt-color-primary);background-color:#f5f7fa}.e-virt-table-loading{display:none;position:absolute;left:0;top:0;right:0;bottom:0;width:100%;height:100%;z-index:2000;background-color:#fff6;display:flex;align-items:center;justify-content:center}.e-virt-table-loading-spinner{opacity:1;display:flex;flex-direction:column;align-items:center;justify-content:center}.e-virt-table-loading-spinner svg{color:var(--evt-text-color-regular);animation:rotate 1s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.e-virt-table-loading-text{margin:0;font-size:12px;color:var(--evt-text-color-regular)}")),document.head.appendChild(e)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
var oe = Object.defineProperty;
var re = (c, t, e) => t in c ? oe(c, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : c[t] = e;
var n = (c, t, e) => re(c, typeof t != "symbol" ? t + "" : t, e);
class ne {
constructor(t) {
n(this, "rules");
this.rules = t;
}
validate(t) {
const e = [], { column: i, row: s, key: o, rowKey: r, colIndex: a, rowIndex: l, value: h, field: d, fieldValue: f } = t;
Array.isArray(this.rules) || (this.rules = [this.rules]);
for (const u of this.rules) {
if (u.validator) {
const x = {
field: d,
fieldValue: f,
value: h,
column: i,
colIndex: a,
rowIndex: l,
row: s,
key: o,
rowKey: r,
...u
};
u.validator(x, h, (w) => {
w && e.push({
...x,
message: w
});
});
}
if (!u.required && (h == null || h === ""))
return e;
u.pattern && !u.pattern.test(h) && e.push({
value: h,
column: i,
row: s,
key: o,
rowKey: r,
colIndex: a,
rowIndex: l,
field: d,
fieldValue: f,
message: u.message || `${o} is pattern validation error`
}), u.required && (h == null || h === "") && e.push({
value: h,
column: i,
row: s,
key: o,
rowKey: r,
colIndex: a,
rowIndex: l,
field: d,
fieldValue: f,
message: u.message || `${o} is required`
});
}
return e;
}
}
function Dt() {
return "xxxxxxxxxxxxxxxxxx".replace(/[x]/g, function(c) {
const t = Math.random() * 16 | 0;
return (c === "x" ? t : t & 3 | 8).toString(16);
});
}
function Z(c, t) {
let e = 0, i;
return function(...s) {
const o = (/* @__PURE__ */ new Date()).getTime(), r = o - e, a = typeof t == "function" ? t() : t;
!e || r >= a ? (c.apply(this, s), e = o) : i || (i = setTimeout(() => {
c.apply(this, s), e = (/* @__PURE__ */ new Date()).getTime(), i = void 0;
}, a - r));
};
}
function Nt(c = []) {
return c.length ? c.map((t) => Nt(t.children) + 1).sort((t, e) => e - t)[0] : 0;
}
function ae(c = []) {
let t = [], e = [], i = [];
return c.forEach((s) => {
s.fixed === "left" ? t.push(s) : s.fixed === "right" ? i.push(s) : e.push(s);
}), [
...t.sort((s, o) => (s.sort ?? 0) - (o.sort ?? 0)),
...e.sort((s, o) => (s.sort ?? 0) - (o.sort ?? 0)),
...i.sort((s, o) => (s.sort ?? 0) - (o.sort ?? 0))
];
}
function kt(c = [], t = 1, e = 0) {
return c.map((i) => {
if (i.children) {
let s = 0, o = i.fixed;
i.children.forEach((a) => {
a.fixed = o;
});
const r = kt(i.children, t - 1, e + 1);
return r && r.forEach((a) => {
s += a.colspan ?? 0;
}), {
...i,
width: i.width,
level: e,
rowspan: 1,
colspan: s,
children: r
};
}
return {
...i,
level: e,
rowspan: t,
colspan: 1
};
});
}
function it(c = []) {
let t = [];
return c.forEach((e) => {
e.children ? t = t.concat(it(e.children)) : t.push(e);
}), t;
}
const Ct = /^(\r\n|\n\r|\r|\n)/, le = /^[^\t\r\n]+/, bt = /^\t/;
function he(c) {
let t = [[""]];
if (c.length === 0)
return t;
let e = 0, i = 0, s;
for (; c.length > 0 && s !== c.length; )
if (s = c.length, c.match(bt))
c = c.replace(bt, ""), e += 1, t[i][e] = "";
else if (c.match(Ct))
c = c.replace(Ct, ""), e = 0, i += 1, t[i] = [""];
else {
let o = "";
if (c.startsWith('"')) {
let r = 0, a = !0;
for (; a; ) {
const l = c.slice(0, 1);
l === '"' && (r += 1), o += l, c = c.slice(1), (c.length === 0 || c.match(/^[\t\r\n]/) && r % 2 === 0) && (a = !1);
}
o = o.replace(/^"/, "").replace(/"$/, "").replace(/["]*/g, (l) => new Array(Math.floor(l.length / 2)).fill('"').join(""));
} else {
const r = c.match(le);
o = r ? r[0] : "", c = c.slice(o.length);
}
t[i][e] = o;
}
return Array.isArray(t) && t.length > 1 && t[t.length - 1].length === 1 && t[t.length - 1][0] === "" && (t = t.slice(0, t.length - 1)), t;
}
function ce(c) {
let t, e, i, s, o = "", r;
for (t = 0, e = c.length; t < e; t += 1) {
for (s = c[t].length, i = 0; i < s; i += 1)
i > 0 && (o += " "), r = c[t][i], typeof r == "string" ? r.indexOf(`
`) > -1 ? o += `"${r.replace(/"/g, '""')}"` : o += r : r == null ? o += "" : o += r;
t !== e - 1 && (o += `
`);
}
return o;
}
function Xt(c, t, e = []) {
let i = 0;
const s = [];
return c.forEach((o, r) => {
if (r === 0)
s.push(1);
else {
const a = e.reduce((h, d) => `${h}${o[d] ?? ""}`, "") || o[t], l = e.reduce((h, d) => `${h}${c[r - 1][d] ?? ""}`, "") || c[r - 1][t];
a === l ? (s[i] += 1, s.push(0)) : (s.push(1), i = r);
}
}), s;
}
function Yt(c, t) {
let e = "", i = "";
const s = {};
return t.forEach((o, r) => {
r === 0 ? (e = o.key, i = o.key, s[o.key] = 1) : c[o.key] === c[e] ? (s[o.key] = 0, s[i] += 1) : (s[o.key] = 1, e = o.key, i = o.key);
}), s;
}
function de(c, t, e = []) {
const { visibleRows: i, rowIndex: s, headIndex: o } = c, r = Xt(i, t, e);
return r[s - o] === 0 ? {
rowspan: 0,
colspan: 0,
relationRowKeys: e,
mergeRow: !0
} : {
rowspan: r[s - o],
colspan: 1,
relationRowKeys: e,
mergeRow: !0
};
}
function fe(c, t = []) {
const { column: e, row: i, visibleLeafColumns: s } = c, o = s.filter((r) => t.includes(r.key));
if (t.includes(e.key)) {
const r = Yt(i, o);
return r[e.key] === 0 ? {
rowspan: 0,
colspan: 0,
relationColKeys: t,
mergeCol: !0
} : {
rowspan: 1,
colspan: r[e.key],
relationColKeys: t,
mergeCol: !0
};
}
}
function xe(c, t = document.documentElement) {
const e = c.startsWith("--") ? c : `--${c}`;
return getComputedStyle(t).getPropertyValue(e).trim();
}
function Rt(c) {
if (!c) return /* @__PURE__ */ new Date(0);
if (typeof c == "number")
return new Date(c);
const t = String(c).trim(), e = new Date(t);
if (!isNaN(e.getTime()))
return e;
const i = [
// YYYY-MM-DD
/^(\d{4})-(\d{1,2})-(\d{1,2})$/,
// YYYY/MM/DD
/^(\d{4})\/(\d{1,2})\/(\d{1,2})$/,
// YYYY.MM.DD
/^(\d{4})\.(\d{1,2})\.(\d{1,2})$/,
// DD-MM-YYYY
/^(\d{1,2})-(\d{1,2})-(\d{4})$/,
// DD/MM/YYYY
/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/,
// DD.MM.YYYY
/^(\d{1,2})\.(\d{1,2})\.(\d{4})$/,
// MM-DD-YYYY
/^(\d{1,2})-(\d{1,2})-(\d{4})$/,
// MM/DD/YYYY
/^(\d{1,2})\/(\d{1,2})\/(\d{4})$/,
// MM.DD.YYYY
/^(\d{1,2})\.(\d{1,2})\.(\d{4})$/,
// YYYYMMDD
/^(\d{4})(\d{2})(\d{2})$/,
// 带时间的格式 YYYY-MM-DD HH:mm:ss
/^(\d{4})-(\d{1,2})-(\d{1,2})\s+(\d{1,2}):(\d{1,2})(?::(\d{1,2}))?$/,
// 带时间的格式 YYYY/MM/DD HH:mm:ss
/^(\d{4})\/(\d{1,2})\/(\d{1,2})\s+(\d{1,2}):(\d{1,2})(?::(\d{1,2}))?$/
];
for (const s of i) {
const o = t.match(s);
if (o) {
const r = o.slice(1).map(Number);
if (s.source.includes("YYYY-MM-DD") || s.source.includes("YYYY/MM/DD") || s.source.includes("YYYY.MM.DD")) {
const [a, l, h, d = 0, f = 0, u = 0] = r;
return new Date(a, l - 1, h, d, f, u);
} else if (s.source.includes("DD-MM-YYYY") || s.source.includes("DD/MM/YYYY") || s.source.includes("DD.MM.YYYY")) {
const [a, l, h, d = 0, f = 0, u = 0] = r;
return new Date(h, l - 1, a, d, f, u);
} else if (s.source.includes("MM-DD-YYYY") || s.source.includes("MM/DD/YYYY") || s.source.includes("MM.DD.YYYY")) {
const [a, l, h, d = 0, f = 0, u = 0] = r;
return new Date(h, a - 1, l, d, f, u);
} else if (s.source.includes("YYYYMMDD")) {
const [a, l, h] = r;
return new Date(a, l - 1, h);
}
}
}
return /* @__PURE__ */ new Date(NaN);
}
function ue(c, t) {
const e = Rt(c), i = Rt(t);
return isNaN(e.getTime()) && isNaN(i.getTime()) ? 0 : isNaN(e.getTime()) ? -1 : isNaN(i.getTime()) ? 1 : e.getTime() - i.getTime();
}
class Bt {
constructor(t, e, i, s, o, r, a) {
n(this, "ctx");
n(this, "x", 0);
n(this, "y", 0);
n(this, "width", 0);
n(this, "height", 0);
n(this, "fixed");
n(this, "cellType");
this.ctx = t, this.x = e, this.y = i, this.width = s, this.height = o, this.fixed = a, this.cellType = r;
}
isHorizontalVisible() {
if (this.fixed)
return !0;
const { stageWidth: t, fixedLeftWidth: e, scrollX: i, fixedRightWidth: s } = this.ctx, o = t;
return !(this.x + this.width - e - i <= 0 || this.x - i >= o - s);
}
isVerticalVisible() {
const { stageHeight: t, scrollY: e } = this.ctx, i = t;
return !(this.y + this.height - e <= 0 || this.y - e >= i);
}
getDrawX() {
if (this.fixed === "left")
return this.x;
if (this.fixed === "right") {
const {
stageWidth: t,
config: { SCROLLER_TRACK_SIZE: e }
} = this.ctx;
return t - (this.ctx.header.width - this.x) - e;
}
return this.x - this.ctx.scrollX;
}
getDrawY() {
return this.cellType === "header" ? this.y : this.cellType === "footer" && this.ctx.config.FOOTER_FIXED ? this.y : this.y - this.ctx.scrollY;
}
getLeftFixedX() {
return this.x - this.ctx.scrollX;
}
/**
* RightFixed时相对StageX
* @returns
*/
getRightFixedX() {
}
}
class ut extends Bt {
constructor(e, i, s, o, r, a, l, h, d, f = "body") {
super(e, o, r, a, l, f, h.fixed);
n(this, "formatter");
n(this, "formatterFooter");
n(this, "hoverIconName", "");
n(this, "operation", !1);
n(this, "align");
n(this, "verticalAlign");
n(this, "fixed");
n(this, "type");
n(this, "editorType");
n(this, "editorProps");
n(this, "cellType");
n(this, "level");
n(this, "colspan", 1);
n(this, "rowspan", 1);
n(this, "mergeRow", !1);
n(this, "mergeCol", !1);
n(this, "relationRowKeys", []);
// 合并单元格关联key
n(this, "relationColKeys", []);
// 合并单元格关联key
n(this, "key");
n(this, "column");
n(this, "rowIndex");
n(this, "colIndex");
n(this, "rowKey");
n(this, "row");
n(this, "value");
n(this, "render");
n(this, "renderFooter");
n(this, "style", {});
n(this, "domDataset", {});
n(this, "rules", []);
n(this, "message", "");
n(this, "text", "");
n(this, "displayText", "");
n(this, "visibleWidth", 0);
n(this, "visibleHeight", 0);
n(this, "isHasChanged", !1);
n(this, "drawX", 0);
n(this, "drawY", 0);
n(this, "drawCellBgColor", "");
n(this, "drawCellSkyBgColor", "");
n(this, "drawTextColor", "");
n(this, "drawTextFont", "");
n(this, "drawTextX", 0);
n(this, "drawTextY", 0);
n(this, "drawTextWidth", 0);
n(this, "drawTextHeight", 0);
// 画tree图标
n(this, "drawTreeImageX", 0);
n(this, "drawTreeImageY", 0);
n(this, "drawTreeImageWidth", 0);
n(this, "drawTreeImageHeight", 0);
n(this, "drawTreeImageName", "");
n(this, "drawTreeImageSource");
// 画selection图标
n(this, "drawSelectionImageX", 0);
n(this, "drawSelectionImageY", 0);
n(this, "drawSelectionImageWidth", 0);
n(this, "drawSelectionImageHeight", 0);
n(this, "drawSelectionImageName", "");
n(this, "drawSelectionImageSource");
// 画hover图标
n(this, "drawHoverImageX", 0);
n(this, "drawHoverImageY", 0);
n(this, "drawHoverImageWidth", 0);
n(this, "drawHoverImageHeight", 0);
n(this, "drawHoverImageName", "");
n(this, "drawHoverImageSource");
n(this, "autoRowHeight", !1);
// 是否启用行高自适应
n(this, "calculatedHeight", 0);
// 计算出的自适应高度
n(this, "ellipsis", !1);
n(this, "rowExpand", !1);
n(this, "rowHasChildren", !1);
n(this, "overflowTooltipShow", !0);
n(this, "selectorCellValueType", "value");
n(this, "overflowTooltipMaxWidth", 500);
n(this, "overflowTooltipPlacement", "top");
n(this, "maxLineClamp", "auto");
this.visibleWidth = this.width, this.visibleHeight = this.height, this.colIndex = s, this.rowIndex = i, this.key = h.key, this.type = h.type || "", this.editorType = h.editorType || "text", this.selectorCellValueType = h.selectorCellValueType || this.ctx.config.SELECTOR_CELL_VALUE_TYPE || "value", this.editorProps = h.editorProps || {}, this.cellType = f, this.align = h.align || this.ctx.config.COLUMNS_ALIGN, this.verticalAlign = h.verticalAlign || this.ctx.config.COLUMNS_VERTICAL_ALIGN, this.fixed = h.fixed, this.level = h.level || 0, this.operation = h.operation || !1, this.column = h, this.rules = h.rules || [], this.row = d, this.rowKey = this.cellType === "body" ? this.ctx.database.getRowKeyForRowIndex(i) : `${this.cellType}_${this.rowIndex}`, this.value = this.getValue(), this.render = h.render, this.overflowTooltipShow = h.overflowTooltipShow !== !1, this.autoRowHeight = h.autoRowHeight !== void 0 ? h.autoRowHeight : this.ctx.config.AUTO_ROW_HEIGHT, this.overflowTooltipMaxWidth = h.overflowTooltipMaxWidth || 500, this.overflowTooltipPlacement = h.overflowTooltipPlacement || "top", this.renderFooter = h.renderFooter, this.hoverIconName = h.hoverIconName, this.formatter = h.formatter, this.formatterFooter = h.formatterFooter, this.maxLineClamp = h.maxLineClamp || "auto", this.update();
}
setWidthHeight(e, i) {
this.width = e, this.height = i;
}
getValidationMessage() {
const e = this.ctx.database.getValidationError(this.rowKey, this.key);
if (Array.isArray(e) && e.length) {
const [i] = e;
this.message = i.message || "";
}
return this.message;
}
update() {
this.drawX = this.getDrawX(), this.drawY = this.getDrawY(), this.drawTextX = this.drawX, this.drawTextY = this.drawY, this.isHasChanged = this.ctx.database.isHasChangedData(this.rowKey, this.key), this.updateSpan(), this.drawTextWidth = this.visibleWidth, this.drawTextHeight = this.visibleHeight, this.updateStyle(), this.updateType(), this.updateHoverIcon(), this.updateSelection(), this.updateTree(), this.updateEditor(), this.updateRender(), this.getValidationMessage(), this.updateContainer(), this.text = this.getText(), this.displayText = this.getDisplayText();
}
updateSpan() {
if (this.cellType === "footer")
return;
const { SPAN_METHOD: e } = this.ctx.config;
if (typeof e == "function") {
const i = e, {
colspan: s = 1,
rowspan: o = 1,
relationRowKeys: r,
relationColKeys: a,
mergeRow: l = !1,
mergeCol: h = !1
} = i({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue(),
headIndex: this.ctx.body.headIndex,
headPosition: this.ctx.database.getPositionForRowIndex(this.ctx.body.headIndex),
visibleRows: this.ctx.body.visibleRows,
visibleLeafColumns: this.ctx.header.visibleLeafColumns,
rows: this.ctx.body.data
}) || {};
Array.isArray(r) && r.length > 0 ? this.relationRowKeys = r : this.relationRowKeys = [this.key], Array.isArray(a) && a.length > 0 ? this.relationColKeys = a : this.relationColKeys = [this.key], this.mergeCol = h, this.mergeRow = l, this.colspan = s, this.rowspan = o, this.visibleWidth = this.getWidthByColIndexColSpan(this.colIndex, this.colspan), this.visibleHeight = this.ctx.database.getHeightByRowIndexRowSpan(this.rowIndex, this.rowspan);
}
}
updateSpanInfo() {
if (this.mergeRow || this.mergeCol) {
const e = this.getSpanInfo();
this.height = e.height, this.width = e.width, this.drawX = this.getDrawX(), this.drawY = this.getDrawY(), this.drawY -= e.offsetTop, this.drawX -= e.offsetLeft;
}
}
updateType() {
const { BODY_CELL_TYPE_METHOD: e } = this.ctx.config;
if (typeof e == "function") {
const s = e({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
});
s !== void 0 && (this.type = s);
}
}
updateEditor() {
const { BODY_CELL_EDITOR_METHOD: e } = this.ctx.config;
if (typeof e == "function") {
const s = e({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
});
if (s !== void 0) {
const { type: o, props: r = {} } = s;
this.editorType = o, this.editorProps = r;
}
}
}
updateRender() {
const { BODY_CELL_RENDER_METHOD: e } = this.ctx.config;
if (typeof e == "function") {
const s = e({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
});
s !== void 0 && (this.render = s);
}
}
validate() {
this.ctx.database.getValidator(this.rowKey, this.key).then(() => {
this.ctx.database.setValidationError(this.rowKey, this.key, []), this.message = "";
}).catch((e) => {
if (Array.isArray(e) && e.length) {
const [i] = e;
this.message = i.message, this.ctx.database.setValidationError(this.rowKey, this.key, e);
}
}).finally(() => {
this.ctx.emit("draw");
});
}
/**
* 更新样式
*/
updateStyle() {
this.autoRowHeight && (this.domDataset = {
"data-auto-height": !0,
"data-row-index": this.rowIndex,
"data-col-index": this.colIndex
}), this.style = this.getOverlayerViewsStyle();
}
updateTree() {
const { CELL_PADDING: e = 0 } = this.ctx.config, { rowKey: i, cellType: s } = this;
let o, r = 0, a = "";
if (!(["tree", "selection-tree", "tree-selection"].includes(this.type) && s === "body"))
return;
const l = this.ctx.database.getRowForRowKey(i), { expand: h = !1, hasChildren: d = !1, expandLoading: f = !1, level: u = 0 } = l || {};
this.rowExpand = h, this.rowHasChildren = d;
const { TREE_INDENT: x = 16, CHECKBOX_SIZE: w, TREE_ICON_SIZE: m } = this.ctx.config;
if (r = u * x, f) {
const I = this.ctx.icons.get("loading");
a = "loading", o = I;
} else if (d) {
const I = this.ctx.icons.get("expand"), _ = this.ctx.icons.get("shrink");
o = h ? _ : I, a = h ? "shrink" : "expand";
}
let g = m, E = m, y = this.drawX;
(this.align === "center" || this.align === "right") && (y = this.drawX + (this.visibleWidth - g - 2 * e) / 2, this.align = "left");
let p = y + r + e, b = this.drawY + (this.visibleHeight - E) / 2, C = r + this.drawX + g - 0.5;
this.type === "selection-tree" ? (p = r + this.drawSelectionImageX + this.drawSelectionImageWidth, C = p + g - e / 2) : this.type === "tree-selection" ? C = p + w + g - e / 2 : C = p + g - e / 2, this.drawTextX = C, this.drawTextWidth = this.drawX + this.visibleWidth - C, !(p + g + e > this.drawX + this.visibleWidth) && (b + E + e > this.drawY + this.visibleHeight || (this.drawTreeImageX = p, this.drawTreeImageY = b, this.drawTreeImageWidth = g, this.drawTreeImageHeight = E, o ? (this.drawTreeImageName = a, this.drawTreeImageSource = o) : (this.drawTreeImageName = "", this.drawTreeImageSource = void 0)));
}
drawTreeLine() {
const { TREE_LINE: e, TREE_INDENT: i = 16, TREE_ICON_SIZE: s = 16, TREE_LINE_COLOR: o = "#e1e6eb" } = this.ctx.config;
if (!e || this.cellType !== "body" || !["tree", "selection-tree", "tree-selection"].includes(this.type) || this.rowspan === 0 || this.colspan === 0) return;
const r = this.ctx.database.getRowForRowKey(this.rowKey) || {}, a = r.level ?? 0, l = this.drawTreeImageX + this.drawTreeImageWidth / 2, h = this.drawTreeImageY + this.drawTreeImageHeight / 2;
let d = this.drawTreeImageX - a * i;
const f = Array.isArray(r.parentRowKeys) ? r.parentRowKeys : [];
if (a > 0) {
for (let g = 0; g < a - 1; g += 1) {
const E = f[g + 1];
if (!!(E ? this.ctx.database.getRowForRowKey(E) || {} : {}).isLastChild) continue;
const b = Math.round(this.drawTreeImageX - (a - g) * i + s / 2);
this.ctx.paint.drawLine([b, this.drawY, b, this.drawY + this.visibleHeight], {
borderColor: o,
borderWidth: 1,
lineDash: [4, 4],
lineDashOffset: 0
});
}
const u = Math.round(this.drawTreeImageX - i + s / 2), w = !!r.isLastChild ? h : this.drawY + this.visibleHeight;
this.ctx.paint.drawLine([u, this.drawY, u, w], {
borderColor: o,
borderWidth: 1,
lineDash: [4, 4],
lineDashOffset: 0
});
const m = Math.round(d + (a - 1) * i + s / 2);
this.ctx.paint.drawLine([m, h, l, h], {
borderColor: o,
borderWidth: 1,
lineDash: [4, 4],
lineDashOffset: 0
});
}
if (r.hasChildren && r.expand) {
const u = this.drawTreeImageY + this.drawTreeImageHeight, x = this.drawY + this.visibleHeight;
this.ctx.paint.drawLine([l, u, l, x], {
borderColor: o,
borderWidth: 1,
lineDash: [4, 4],
lineDashOffset: 0
});
}
}
updateContainer() {
const {
BODY_BG_COLOR: e,
EDIT_BG_COLOR: i,
BODY_CELL_STYLE_METHOD: s,
FOOTER_CELL_STYLE_METHOD: o,
READONLY_TEXT_COLOR: r,
BODY_TEXT_COLOR: a,
FOOTER_TEXT_COLOR: l,
FOOTER_BG_COLOR: h,
HIGHLIGHT_SELECTED_ROW: d,
HIGHLIGHT_SELECTED_ROW_COLOR: f,
HIGHLIGHT_HOVER_ROW: u,
HIGHLIGHT_HOVER_ROW_COLOR: x,
STRIPE: w,
STRIPE_COLOR: m
} = this.ctx.config;
if (this.cellType === "footer") {
let _ = h, T = l;
if (typeof o == "function") {
const S = o, { backgroundColor: R, color: v, font: O } = S({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
}) || {};
R && (_ = R), v && (T = v), O && (this.drawTextFont = O);
}
this.drawCellSkyBgColor = "transparent", this.drawCellBgColor = _, this.drawTextColor = T;
return;
}
let g = "transparent";
const E = this.ctx.hoverCell, y = this.ctx.currentCell;
let p = this.rowIndex, b = this.rowIndex;
if (this.rowspan !== 1 && (u || d)) {
const _ = this.getSpanInfo(), { yArr: T } = _;
p = T[0], b = T[1];
}
u && E && (E.rowKey === this.rowKey && (g = x), E.rowIndex >= p && E.rowIndex <= b && (g = x)), d && y && (y.rowKey === this.rowKey && (g = f), y.rowIndex >= p && y.rowIndex <= b && (g = f)), this.drawCellSkyBgColor = g;
let C = e, I = a;
if (this.ctx.database.getReadonly(this.rowKey, this.key) || (C = i, I = r), w && (this.rowIndex % 2 ? C = m : C = e), typeof s == "function") {
const _ = s, { backgroundColor: T, color: S, font: R } = _({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
isHasChanged: this.isHasChanged,
value: this.getValue()
}) || {};
T && (C = T), S && (I = S), R && (this.drawTextFont = R);
}
this.drawCellBgColor = C, this.drawTextColor = I;
}
updateSelection() {
const { visibleWidth: e, visibleHeight: i, rowspan: s, colspan: o, cellType: r, type: a, rowIndex: l, rowKey: h } = this;
if (s === 0 || o === 0 || r === "footer" || !["index-selection", "selection", "selection-tree", "tree-selection"].includes(a))
return;
const d = this.ctx.database.getRowSelectable(h), { CHECKBOX_SIZE: f = 0, CELL_PADDING: u } = this.ctx.config;
let x = this.drawX + u;
(this.align === "center" || this.align === "right") && (x = this.drawX + (e - f) / 2);
let w = x, m = this.drawY + (i - f) / 2;
if (a !== "selection-tree") {
if (a === "tree-selection") {
const { TREE_INDENT: y = 16, TREE_ICON_SIZE: p } = this.ctx.config, b = this.ctx.database.getRowForRowKey(h), { level: C = 0 } = b || {}, I = C * y;
w = x + p + I;
}
}
let g = this.ctx.icons.get("checkbox-uncheck"), E = "checkbox-uncheck";
if (a === "selection-tree" || a === "tree-selection") {
const y = this.ctx.database.getTreeSelectionState(h);
y.indeterminate && d ? (g = this.ctx.icons.get("checkbox-indeterminate"), E = "checkbox-indeterminate") : y.checked && d ? (g = this.ctx.icons.get("checkbox-check"), E = "checkbox-check") : !y.checked && d ? (g = this.ctx.icons.get("checkbox-uncheck"), E = "checkbox-uncheck") : (g = this.ctx.icons.get("checkbox-disabled"), E = "checkbox-disabled");
} else {
const y = this.ctx.database.getRowSelection(h);
y && d ? (g = this.ctx.icons.get("checkbox-check"), E = "checkbox-check") : y && !d ? (g = this.ctx.icons.get("checkbox-check-disabled"), E = "checkbox-check-disabled") : !y && d ? (g = this.ctx.icons.get("checkbox-uncheck"), E = "checkbox-uncheck") : (g = this.ctx.icons.get("checkbox-disabled"), E = "checkbox-disabled");
}
w + f + u > this.drawX + this.visibleWidth || m + f + u > this.drawY + this.visibleHeight || (a === "index-selection" ? (this.ctx.hoverCell && this.ctx.hoverCell.rowIndex === l || ["checkbox-disabled", "checkbox-check"].includes(E)) && (this.drawSelectionImageX = w, this.drawSelectionImageY = m, this.drawSelectionImageWidth = f, this.drawSelectionImageHeight = f, this.drawSelectionImageName = E, this.drawSelectionImageSource = g) : (this.drawSelectionImageX = w, this.drawSelectionImageY = m, this.drawSelectionImageWidth = f, this.drawSelectionImageHeight = f, this.drawSelectionImageName = E, this.drawSelectionImageSource = g));
}
updateHoverIcon() {
if (this.ctx.database.getReadonly(this.rowKey, this.key))
return;
const { BODY_CELL_HOVER_ICON_METHOD: i, CELL_HOVER_ICON_SIZE: s, CELL_PADDING: o, ENABLE_MERGE_CELL_LINK: r } = this.ctx.config;
if (typeof i == "function") {
const h = i({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
});
h !== void 0 && (this.hoverIconName = h);
}
const { hoverCell: a } = this.ctx;
if (this.hoverIconName && !this.ctx.editing && a) {
let l = 0, h = 0;
if (a.rowKey === this.rowKey && (l = this.drawX + this.width - s - o, h = this.drawY + (this.height - s) / 2), this.rowspan !== 1 && r) {
const f = this.getSpanInfo(), { yArr: u } = f, x = u[0], w = u[1];
if (a.rowIndex >= x && a.rowIndex <= w) {
const { width: m, height: g, offsetTop: E, offsetLeft: y } = f;
l = this.drawX - y + m - s - o, h = this.drawY - E + (g - s) / 2;
}
}
const d = this.ctx.icons.get(this.hoverIconName);
this.drawHoverImageX = l, this.drawHoverImageY = h, this.drawHoverImageWidth = s, this.drawHoverImageHeight = s, this.drawHoverImageName = this.hoverIconName, this.drawHoverImageSource = d;
}
}
/**
* 获取自动高度
* @returns
*/
getAutoHeight() {
if (this.cellType !== "body" || !this.autoRowHeight || this.rowspan === 0)
return 0;
if (this.render) {
const a = this.ctx.database.getOverlayerAutoHeight(this.rowIndex, this.colIndex);
return this.rowspan > 1 ? a < this.visibleHeight ? 0 : Math.round(a - (this.visibleHeight - this.height)) : Math.round(a);
}
if (!(this.displayText && typeof this.displayText == "string"))
return 0;
const { BODY_FONT: e, CELL_PADDING: i, CELL_LINE_HEIGHT: s } = this.ctx.config, o = `${this.displayText}_${this.drawTextWidth}_${this.drawTextFont}`, r = this.ctx.paint.calculateTextHeight(this.displayText, this.drawTextWidth, {
font: this.drawTextFont || e,
padding: i,
align: this.align,
verticalAlign: this.verticalAlign,
color: this.drawTextColor,
autoRowHeight: this.autoRowHeight,
lineHeight: s,
maxLineClamp: this.maxLineClamp,
cacheTextKey: o
});
return this.rowspan > 1 ? r < this.visibleHeight ? 0 : Math.round(r - (this.visibleHeight - this.height)) : Math.round(r);
}
// 过去跨度配置
getSpanInfo() {
return this.ctx.database.getSpanInfo(this);
}
/**
* 获取显示文本
* @returns
*/
getDisplayText() {
return this.cellType === "footer" ? this.renderFooter || this.text === null || this.text === void 0 ? "" : this.text : this.rowspan === 0 || this.colspan === 0 || this.render || this.type === "index-selection" && (this.ctx.hoverCell && this.ctx.hoverCell.rowIndex === this.rowIndex || ["checkbox-disabled", "checkbox-check"].includes(this.drawSelectionImageName)) || this.text === null || this.text === void 0 ? "" : `${this.text}`;
}
/**
* 获取文本
* @returns
*/
getText() {
if (this.cellType === "footer")
return typeof this.formatterFooter == "function" ? this.formatterFooter({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.row[this.key]
}) : this.row[this.key];
if (typeof this.formatter == "function")
return this.formatter({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
});
const { BODY_CELL_FORMATTER_METHOD: e } = this.ctx.config;
return typeof e == "function" ? e({
row: this.row,
rowIndex: this.rowIndex,
colIndex: this.colIndex,
column: this.column,
value: this.getValue()
}) : ["index-selection", "index"].includes(this.type) ? `${this.rowIndex + 1}` : (this.value = this.ctx.database.getItemValue(this.rowKey, this.key), this.value);
}
getValue() {
return this.ctx.database.getItemValue(this.rowKey, this.key);
}
// 拓展格子可设置数据
setValue(e) {
this.ctx.setItemValueByEditor(this.rowKey, this.key, e);
}
/**
* 获取样式
*/
getOverlayerViewsStyle() {
let e = `${this.drawX - this.ctx.fixedLeftWidth}px`, i = `${this.drawY - this.ctx.body.y}px`;
return this.fixed === "left" ? e = `${this.drawX}px` : this.fixed === "right" && (e = `${this.drawX - (this.ctx.stageWidth - this.ctx.fixedRightWidth)}px`), this.cellType === "footer" && this.ctx.config.FOOTER_FIXED && (i = `${this.drawY - this.ctx.footer.y}px`), this.autoRowHeight && this.ctx.database.getOverlayerAutoHeight(this.rowIndex, this.colIndex) === 0 && (e = "-99999px", i = "-99999px"), {
position: "absolute",
overflow: "hidden",
left: e,
top: i,
width: `${this.visibleWidth}px`,
height: this.autoRowHeight ? "auto" : `${this.visibleHeight}px`,
// height: `${this.visibleHeight}px`,
// minHeight: `${this.visibleHeight}px`,
pointerEvents: "initial",
userSelect: "none"
};
}
drawContainer() {
const {
paint: e,
config: { BORDER_COLOR: i, BORDER: s }
} = this.ctx, { drawX: o, drawY: r } = this;
e.drawRect(o, r, this.visibleWidth, this.visibleHeight, {
borderColor: s ? i : "transparent",
fillColor: this.drawCellBgColor
}), e.drawRect(o, r, this.width, this.height, {
borderColor: "transparent",
fillColor: this.drawCellSkyBgColor
}), s || this.ctx.paint.drawLine(
[o, r + this.visibleHeight, o + this.visibleWidth, r + this.visibleHeight],
{
borderColor: i,
fillColor: i,
borderWidth: 1,
lineCap: "round",
lineJoin: "round"
}
);
}
drawAutofillPiont() {
if (this.cellType === "footer")
return;
const { SELECT_BORDER_COLOR: e, ENABLE_AUTOFILL: i, ENABLE_SELECTOR: s, AUTOFILL_POINT_BORDER_COLOR: o } = this.ctx.config;
if (!s || !i || this.ctx.editing)
return;
const { xArr: r, yArr: a } = this.ctx.selector, l = r[1], h = a[1], { colIndex: d, rowIndex: f, drawX: u, drawY: x } = this;
if (d === l && f === h) {
const m = d === this.ctx.maxColIndex || f === this.ctx.maxRowIndex || d === this.ctx.lastCenterColIndex ? 6 : 4;
this.ctx.paint.drawRect(u + this.width - m, x + this.height - m, 6, 6, {
borderColor: o,
fillColor: e
});
}
}
draw() {
this.drawTreeLine(), this.drawText(), this.drawImage(), this.drawSelector(), this.drawAutofillPiont(), this.drawErrorTip();
}
/**
* 根据列的索引获取列的宽度
* @param {Number} colIndex
*/
getWidthByColIndexColSpan(e, i) {
if (i === 0)
return 0;
let s = 0;
for (let o = e; o < e + i; o++) {
const r = this.ctx.header.leafCellHeaders[o];
s += r.width;
}
return s;
}
drawText() {
const { CELL_PADDING: e, BODY_FONT: i, PLACEHOLDER_COLOR: s, CELL_LINE_HEIGHT: o } = this.ctx.config, { placeholder: r } = this.column;
let a = this.displayText, l = this.drawTextColor;
if (!this.ctx.database.getReadonly(this.rowKey, this.key) && r && ["", null, void 0].includes(this.text) && this.cellType === "body" && !(this.rowspan === 0 || this.colspan === 0) && (a = r, l = s), ["", null, void 0].includes(a))
return !1;
typeof a != "string" && (a = `${a}`);
const d = `${a}_${this.drawTextWidth}_${this.drawTextFont}`;
return this.ellipsis = this.ctx.paint.drawText(
a,
this.drawTextX,
this.drawTextY,
this.drawTextWidth,
this.drawTextHeight,
{
font: this.drawTextFont || i,
padding: e,
align: this.align,
verticalAlign: this.verticalAlign,
color: l,
autoRowHeight: this.autoRowHeight,
lineHeight: o,
maxLineClamp: this.maxLineClamp,
cacheTextKey: d
}
), this.ellipsis;
}
drawImage() {
if (this.drawSelectionImageSource && this.ctx.paint.drawImage(
this.drawSelectionImageSource,
this.drawSelectionImageX,
this.drawSelectionImageY,
this.drawSelectionImageWidth,
this.drawSelectionImageHeight
), this.drawTreeImageSource && this.ctx.paint.drawImage(
this.drawTreeImageSource,
this.drawTreeImageX,
this.drawTreeImageY,
this.drawTreeImageWidth,
this.drawTreeImageHeight
), this.drawHoverImageSource) {
const { CELL_HOVER_ICON_BG_COLOR: e, CELL_HOVER_ICON_BORDER_COLOR: i } = this.ctx.config;
this.ctx.paint.drawRect(
this.drawHoverImageX - 2,
this.drawHoverImageY - 2,
this.drawHoverImageWidth + 4,
this.drawHoverImageHeight + 4,
{
borderColor: i,
radius: 4,
borderWidth: 1,
fillColor: e
}
), this.ctx.paint.drawImage(
this.drawHoverImageSource,
this.drawHoverImageX,
this.drawHoverImageY,
this.drawHoverImageWidth,
this.drawHoverImageHeight
);
}
}
drawSelector() {
if (this.cellType === "footer")
return;
const { ENABLE_SELECTOR: e } = this.ctx.config;
if (!e)
return;
const { xArr: i, yArr: s, xArrCopy: o, yArrCopy: r } = this.ctx.selector;
this.drawBorder({
xArr: o,
yArr: r,
borderColor: this.ctx.config.SELECT_BORDER_COLOR || "rgb(82,146,247)",
fillColor: "transparent",
borderWidth: 1,
lineDash: [4, 4]
}), this.drawBorder({
xArr: this.ctx.autofill.xArr,
yArr: this.ctx.autofill.yArr,
borderColor: this.ctx.config.SELECT_BORDER_COLOR || "rgb(82,146,247)",
fillColor: "transparent",
borderWidth: 1,
lineDash: [4, 4]
}), this.drawBorder({
xArr: i,
yArr: s,
borderColor: this.ctx.config.SELECT_BORDER_COLOR || "rgb(82,146,247)",
fillColor: "transparent",
borderWidth: 1
});
const [a, l] = i, [h, d] = s;
!(a === l && h === d) && this.colIndex >= a && this.colIndex <= l && this.rowIndex >= h && this.rowIndex <= d && this.ctx.paint.drawRect(this.drawX, this.drawY, this.width, this.height, {
borderColor: "transparent",
fillColor: this.ctx.config.SELECT_AREA_COLOR || "rgba(82,146,247,0.1)"
}), this.operation && this.rowIndex >= h && this.rowIndex <= d && this.ctx.paint.drawRect(this.drawX, this.drawY, this.visibleWidth, this.visibleHeight, {
borderColor: "transparent",
fillColor: this.ctx.config.SELECT_ROW_COL_BG_COLOR || "transparent"
});
}
drawErrorTip() {
if (this.cellType === "footer" || !this.message || this.rowspan === 0 || this.colspan === 0)
return;
const { ERROR_TIP_ICON_SIZE: e, ERROR_TIP_COLOR: i } = this.ctx.config, { width: s } = this, o = this.drawX, r = this.drawY, a = [
o + s - e - 0.5,
r,
o + s - 0.5,
r,
o + s - 0.5,
r + e
];
this.ctx.paint.drawLine(a, {
borderColor: i,
fillColor: i,
borderWidth: 1,
lineCap: "round",
lineJoin: "round"
});
}
drawBorder(e) {
const { drawX: i, drawY: s, rowIndex: o, colIndex: r, height: a, width: l } = this;
let h = i, d = s;
const { xArr: f, yArr: u, lineDash: x = [], borderWidth: w = 1, borderColor: m, fillColor: g } = e, E = f[0], y = f[1], p = u[0], b = u[1];
if (r >= E && r <= y && o === p) {
const C = r === y ? 1 : 0, I = r === E ? 1 : 0;
this.ctx.paint.drawLine([h + I, d + 1, h + l - C, d + 1], {
borderColor: m,
fillColor: g,
borderWidth: w,
lineCap: "round",
lineJoin: "round",
lineDash: x
});
}
if (r === y && o >= p && o <= b) {
const C = o === p ? 1 : 0, I = o === b ? 1 : 0;
this.ctx.paint.drawLine([h + l - 1, d + C, h + l - 1, d + a - I], {
borderColor: m,
fillColor: g,
borderWidth: w,
lineCap: "round",
lineJoin: "round",
lineDash: x
});
}
if (r >= E && r <= y && o === b) {
const C = r === y ? 1 : 0, I = r === E ? 1 : 0;
this.ctx.paint.drawLine([h + I, d + a - 1, h + l - C, d + a - 1], {
borderColor: m,
fillColor: g,
borderWidth: w,
lineCap: "round",
lineJoin: "round",
lineDash: x
});
}
if (r === E && o >= p && o <= b) {
const C = o === b ? 1 : 0, I = o === p ? 1 : 0;
this.ctx.paint.drawLine([h + 1, d + I, h + 1, d + a - C], {
borderColor: m,
fillColor: g,
borderWidth: w,
lineCap: "round",
lineJoin: "round",
lineDash: x
});
}
}
}
class ge {
constructor(t, e) {
n(this, "ctx");
n(this, "data");
n(this, "columns");
n(this, "footerData", []);
n(this, "rowKeyMap", /* @__PURE__ */ new Map());
n(this, "colIndexKeyMap", /* @__PURE__ */ new Map());
n(this, "headerMap", /* @__PURE__ */ new Map());
n(this, "rowIndexRowKeyMap", /* @__PURE__ */ new Map());
n(this, "rowKeyRowIndexMap", /* @__PURE__ */ new Map());
n(this, "checkboxKeyMap", /* @__PURE__ */ new Map());
n(this, "selectionMap", /* @__PURE__ */ new Map());
n(this, "expandMap", /* @__PURE__ */ new Map());
n(this, "originalDataMap", /* @__PURE__ */ new Map());
n(this, "changedDataMap", /* @__PURE__ */ new Map());
n(this, "validationErrorMap", /* @__PURE__ */ new Map());
n(this, "itemRowKeyMap", /* @__PURE__ */ new WeakMap());
n(this, "bufferData", []);
n(this, "overlayerAutoHeightMap", /* @__PURE__ */ new Map());
n(this, "bufferCheckState", {
buffer: !1,
check: !1,
indeterminate: !1,
selectable: !0
});
n(this, "sumHeight", 0);
n(this, "filterMethod");
n(this, "positions", []);
//虚拟滚动位置
n(this, "sortState", /* @__PURE__ */ new Map());
this.ctx = t;
const { data: i = [], columns: s = [], footerData: o = [] } = e;
this.data = i, this.footerData = o, this.columns = s, this.init();
}
// 初始化默认不忽略清空改变值和校验map
init(t = !0) {
this.ctx.paint.clearTextCache(), this.clearBufferData(), this.rowKeyMap.clear(), this.checkboxKeyMap.clear(), this.colIndexKeyMap.clear(), this.rowIndexRowKeyMap.clear(), this.rowKeyRowIndexMap.clear();
const e = this.getColumns(), i = it(e);
if (this.ctx.hasSelection = i.some((s) => s.type === "selection"), this.ctx.hasTree = i.some((s) => s.type === "tree"), t) {
this.originalDataMap.clear(), this.changedDataMap.clear(), this.validationErrorMap.clear();
const { ROW_KEY: s } = this.ctx.config;
s ? (this.ctx.hasSelection || this.selectionMap.clear(), this.ctx.hasTree || this.expandMap.clear()) : (this.selectionMap.clear(), this.expandMap.clear());
}
this.itemRowKeyMap = /* @__PURE__ */ new WeakMap(), this.initData(this.data), this.getData(), this.bufferCheckState.buffer = !1;
}
/**
* 清除缓存数据
*/
clearBufferData() {
this.bufferData = [];
}
/**
* 初始化数据
* @param dataList
* @param level
*/
initData(t, e = 0, i = []) {
const s = t.length;
t.forEach((o, r) => {
var y;
const { ROW_KEY: a = "", DEFAULT_EXPAND_ALL: l, CELL_HEIGHT: h, SELECTABLE_METHOD: d, CHECKBOX_KEY: f } = this.ctx.config, u = o[a], x = u != null ? `${u}` : Dt();
this.itemRowKeyMap.set(o, x);
const w = o._height || h, m = o._readonly;
let g = !0;
if (typeof d == "function" && (g = d), f) {
const p = o[f];
if (this.checkboxKeyMap.has(p)) {
const b = this.checkboxKeyMap.get(p) || [];
b.push(x), this.checkboxKeyMap.set(p, b);
} else
this.checkboxKeyMap.set(p, [x]);
}
this.selectionMap.set(x, {
key: f ? o[f] : x,
row: o,
check: ((y = this.selectionMap.get(x)) == null ? void 0 : y.check) || !1
});
const E = l || this.expandMap.get(x) || o._expand || !1;
this.expandMap.set(x, E), this.rowKeyMap.set(x, {
readonly: m,
index: r,
rowIndex: r,
level: e,
height: w,
calculatedHeight: -1,
check: !1,
selectable: g,
expand: E,
expandLazy: !1,
hasChildren: o._hasChildren || (Array.isArray(o.children) ? o.children.length > 0 : !1),
expandLoading: !1,
item: o,
parentRowKeys: i,
parentRowKey: i[i.length - 1] || "",
isLastChild: r === s - 1
}), Array.isArray(o.children) && o.children.length && this.initData(o.children, e + 1, [...i, x]);
});
}
/**
*
* @param rowKey 设置Row高度
* @param height
*/
setRowHeight(t, e) {
const i = this.rowIndexRowKeyMap.get(t);
if (i === void 0)
return;
const s = this.rowKeyMap.get(i);
s.height = e, s.item._height = e, this.clearBufferData();
}
// 批量设置行高度
setBatchRowHeight(t) {
t.forEach(({ rowIndex: e, height: i }) => {
const s = this.rowIndexRowKeyMap.get(e);
if (s) {
const o = this.rowKeyMap.get(s);
o.height = i, o.item._height = i;
}
}), this.clearBufferData();
}
// 批量设置计算行高度
setBatchCalculatedRowHeight(t) {
t.every(({ height: i, rowIndex: s }) => this.getPositionForRowIndex(s).calculatedHeight === i) || (t.forEach(({ rowIndex: i, height: s }) => {
const o = this.rowIndexRowKeyMap.get(i);
if (o) {
const r = this.rowKeyMap.get(o);
r.calculatedHeight = s;
}
}), this.clearBufferData(), this.getData(), this.ctx.emit("draw"));
}
/**
* 获取所有行数据(平铺)
* @returns 获取转化平铺数据
*/
getAllRowsData() {
let t = [];
const e = (i) => {
i.forEach((s) => {
t.push(s), Array.isArray(s.children) && e(s.children);
});
};
return e(this.data), t;
}
filterColumns(t) {
return t.reduce((e, i) => {
if (!(typeof i.hide == "function" ? i.hide() : i.hide)) {
const o = { ...i };
o.children && Array.isArray(o.children) && (o.children = this.filterColumns(o.children)), e.push(o);
}
return e;
}, []);
}
getColumns() {
return this.filterColumns(this.columns);
}
setColumns(t) {
this.columns = t, this.clearBufferData();
}
setData(t) {
this.data = t, this.init();
}
/**
* 统一转化数据,给画body使用,包括过滤树状等,统一入口
* @returns
*/
getData() {
if (this.bufferData.length > 0)
return {
data: this.bufferData,
sumHeight: this.sumHeight,
positions: this.positions
};
let t = [], e = 0;
this.sumHeight = 0, this.positions = [];
const i = (o) => {
o.forEach((r) => {
t.push(r);
const a = this.itemRowKeyMap.get(r), { expand: l, hasChildren: h, height: d, calculatedHeight: f } = this.rowKeyMap.get(a), u = this.sumHeight, x = Math.max(f, d);
this.sumHeight += x, this.rowIndexRowKeyMap.set(e, a), this.rowKeyRowIndexMap.set(a, e), this.positions.push({
top: u,
height: x,
bottom: this.sumHeight,
calculatedHeight: f
}), e += 1, l && h && i(r.children);
});
};
this.rowIndexRowKeyMap.clear(), this.rowKeyRowIndexMap.clear();
let s = this.data;
if (typeof this.filterMethod == "function" && (s = this.filterMethod(s)), this.sortState.size) {
const o = Array.from(this.sortState.entries()).sort((r, a) => r[1].timestamp - a[1].timestamp);
s = this.sortDataRecursive(s, o);
}
return i(s), this.bufferData = t, {
data: t,
sumHeight: this.sumHeight,
positions: this.positions
};
}
setFooterData(t) {
this.footerData = t;
}
getFooterData() {
return this.footerData;
}
/**
* 设置过滤方法
*/
setFilterMethod(t) {
this.filterMethod = t;
}
/**
* 清空