e-virt-table 0.1.6 → 0.1.8

package/dist/index.es.js

@@ -917,6 +917,18 @@ class ii {
     const i = this.rowKeyMap.get(t);
     i.expand = e, this.clearBufferData(), this.ctx.emit("draw");
   }
+  setExpandRowKeys(t, e = !0) {
+    t.forEach((i) => {
+      const s = this.rowKeyMap.get(i);
+      s.expand = e;
+    }), this.clearBufferData(), this.ctx.emit("draw");
+  }
+  getExpandRowKeys() {
+    let t = [];
+    return this.rowKeyMap.forEach((e, i) => {
+      e.expand && t.push(i);
+    }), t;
+  }
   expandAll(t) {
     this.rowKeyMap.forEach((e) => {
       e.expand = t;
@@ -1051,27 +1063,36 @@ class ii {
       };
     a[e] !== null && typeof a[e] == "object" && (l = JSON.parse(JSON.stringify(a[e])));
     const c = `${t}​_${e}`;
-    if (this.originalDataMap.has(c) || this.originalDataMap.set(c, l), this.changedDataMap.set(c, i), a[e] = i, o) {
-      const f = this.ctx.database.getRowDataItemForRowKey(t), d = {
+    this.originalDataMap.has(c) || this.originalDataMap.set(c, l);
+    const f = this.originalDataMap.get(c), { BEFORE_VALUE_CHANGE_METHOD: d } = this.ctx.config;
+    let x = i;
+    if (typeof d == "function" && (x = d({
+      rowKey: t,
+      key: e,
+      oldValue: l,
+      value: i,
+      originalValue: f
+    })), this.changedDataMap.set(c, x), a[e] = x, o) {
+      const u = this.ctx.database.getRowDataItemForRowKey(t), g = {
         rowKey: t,
         key: e,
-        value: i,
-        row: f
+        value: x,
+        row: u
       };
-      this.ctx.emit("change", [d], [f]), this.ctx.emit("editChange", {
+      this.ctx.emit("change", [g], [u]), this.ctx.emit("editChange", {
         rowKey: t,
         key: e,
         oldValue: l,
-        value: i,
-        originalValue: this.originalDataMap.get(c),
-        row: f
+        value: x,
+        originalValue: f,
+        row: u
       });
     }
     return this.ctx.hasEvent("iterationChange") && this.ctx.emit("iterationChange", {
       rowKey: t,
       key: e,
       oldValue: l,
-      value: i,
+      value: x,
       originalValue: this.originalDataMap.get(c),
       row: this.ctx.database.getRowDataItemForRowKey(t)
     }), s && this.ctx.history.pushState({
@@ -1083,12 +1104,12 @@ class ii {
           rowKey: t,
           key: e,
           oldValue: l,
-          newValue: i
+          newValue: x
         }
       ]
     }), this.getValidator(t, e), r && this.ctx.emit("draw"), {
       oldValue: l,
-      newValue: i
+      newValue: x
     };
   }
   /**
@@ -1275,7 +1296,7 @@ class ii {
     return t ? (this.headerMap.set(t, e), !0) : !1;
   }
   getReadonly(t, e) {
-    const i = this.rowKeyMap.get(t), s = this.headerMap.get(e), r = i == null ? void 0 : i.readonly, o = s == null ? void 0 : s.readonly, { CELL_READONLY_METHOD: a } = this.ctx.config;
+    const i = this.rowKeyMap.get(t), s = this.headerMap.get(e), r = i == null ? void 0 : i.readonly, o = s == null ? void 0 : s.readonly, { BODY_CELL_READONLY_METHOD: a } = this.ctx.config;
     if (typeof a == "function") {
       const c = a({
         row: i.item,
@@ -1294,7 +1315,7 @@ class ii {
   }
   getValidator(t, e) {
     return new Promise((i) => {
-      const s = this.rowKeyMap.get(t), r = this.headerMap.get(e), { CELL_RULES_METHOD: o } = this.ctx.config, a = r.column;
+      const s = this.rowKeyMap.get(t), r = this.headerMap.get(e), { BODY_CELL_RULES_METHOD: o } = this.ctx.config, a = r.column;
       let l = a.rules;
       if (typeof o == "function") {
         const f = o({
@@ -1767,16 +1788,17 @@ class Wt {
     h(this, "HEADER_CELL_STYLE_METHOD");
     h(this, "BODY_CELL_STYLE_METHOD");
     h(this, "FOOTER_CELL_STYLE_METHOD");
-    h(this, "CELL_READONLY_METHOD");
-    h(this, "CELL_FORMATTER_METHOD");
-    h(this, "CELL_RULES_METHOD");
-    h(this, "CELL_TYPE_METHOD");
-    h(this, "CELL_EDITOR_TYPE_METHOD");
-    h(this, "CELL_RENDER_METHOD");
-    h(this, "CELL_HOVER_ICON_METHOD");
+    h(this, "BODY_CELL_READONLY_METHOD");
+    h(this, "BODY_CELL_FORMATTER_METHOD");
+    h(this, "BODY_CELL_RULES_METHOD");
+    h(this, "BODY_CELL_TYPE_METHOD");
+    h(this, "BODY_CELL_EDITOR_TYPE_METHOD");
+    h(this, "BODY_CELL_RENDER_METHOD");
+    h(this, "BODY_CELL_HOVER_ICON_METHOD");
     h(this, "SPAN_METHOD");
     h(this, "SELECTABLE_METHOD");
     h(this, "EXPAND_LAZY_METHOD");
+    h(this, "BEFORE_VALUE_CHANGE_METHOD");
     Object.assign(this, t);
   }
   init(t) {
@@ -1943,6 +1965,7 @@ class ee extends te {
   constructor(e, i, s, r, o, a, l, c, f, d = "body") {
     super(e, r, o, a, l, c.fixed, d);
     h(this, "formatter");
+    h(this, "formatterFooter");
     h(this, "hoverIconName", "");
     h(this, "operation", !1);
     h(this, "align");
@@ -1970,6 +1993,7 @@ class ee extends te {
     h(this, "displayText", "");
     h(this, "visibleWidth", 0);
     h(this, "visibleHeight", 0);
+    h(this, "isHasChanged", !1);
     h(this, "drawX", 0);
     h(this, "drawY", 0);
     h(this, "drawCellBgColor", "");
@@ -1989,7 +2013,7 @@ class ee extends te {
     h(this, "overflowTooltipShow", !0);
     h(this, "overflowTooltipMaxWidth", 500);
     h(this, "overflowTooltipPlacement", "top");
-    this.visibleWidth = this.width, this.visibleHeight = this.height, this.colIndex = s, this.rowIndex = i, this.key = c.key, this.type = c.type || "text", this.editorType = c.editorType || "text", this.cellType = d, this.align = c.align || "center", this.verticalAlign = c.verticalAlign || "middle", this.fixed = c.fixed, this.level = c.level, this.operation = c.operation || !1, this.column = c, this.rules = c.rules, this.row = f, this.rowKey = this.cellType === "body" ? this.ctx.database.getRowKeyForRowIndex(i) : `${this.cellType}_${this.rowIndex}`, this.value = this.getValue(), this.render = c.render, this.overflowTooltipShow = c.overflowTooltipShow !== !1, this.overflowTooltipMaxWidth = c.overflowTooltipMaxWidth || 500, this.overflowTooltipPlacement = c.overflowTooltipPlacement || "top", this.renderFooter = c.renderFooter, this.hoverIconName = c.hoverIconName, this.formatter = c.formatter, this.update();
+    this.visibleWidth = this.width, this.visibleHeight = this.height, this.colIndex = s, this.rowIndex = i, this.key = c.key, this.type = c.type || "text", this.editorType = c.editorType || "text", this.cellType = d, this.align = c.align || "center", this.verticalAlign = c.verticalAlign || "middle", this.fixed = c.fixed, this.level = c.level, this.operation = c.operation || !1, this.column = c, this.rules = c.rules, this.row = f, this.rowKey = this.cellType === "body" ? this.ctx.database.getRowKeyForRowIndex(i) : `${this.cellType}_${this.rowIndex}`, this.value = this.getValue(), this.render = c.render, this.overflowTooltipShow = c.overflowTooltipShow !== !1, this.overflowTooltipMaxWidth = c.overflowTooltipMaxWidth || 500, this.overflowTooltipPlacement = c.overflowTooltipPlacement || "top", this.renderFooter = c.renderFooter, this.hoverIconName = c.hoverIconName, this.formatter = c.formatter, this.formatterFooter = c.formatterFooter, this.update();
   }
   getValidationMessage() {
     const e = this.ctx.database.getValidationError(this.rowKey, this.key);
@@ -2000,7 +2024,7 @@ class ee extends te {
     return this.message;
   }
   update() {
-    this.drawX = this.getDrawX(), this.drawY = this.getDrawY(), this.drawTextX = this.drawX, this.drawTextY = this.drawY, this.updateSpan(), this.updateStyle(), this.updateType(), this.updateHoverIcon(), this.updateSelection(), this.updateTree(), this.updateEditorType(), this.updateRender(), this.getValidationMessage(), this.updateContainer(), this.text = this.getText(), this.displayText = this.getDisplayText();
+    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.updateStyle(), this.updateType(), this.updateHoverIcon(), this.updateSelection(), this.updateTree(), this.updateEditorType(), this.updateRender(), this.getValidationMessage(), this.updateContainer(), this.text = this.getText(), this.displayText = this.getDisplayText();
   }
   updateSpan() {
     if (this.cellType === "footer")
@@ -2023,7 +2047,7 @@ class ee extends te {
     }
   }
   updateType() {
-    const { CELL_TYPE_METHOD: e } = this.ctx.config;
+    const { BODY_CELL_TYPE_METHOD: e } = this.ctx.config;
     if (typeof e == "function") {
       const s = e({
         row: this.row,
@@ -2036,7 +2060,7 @@ class ee extends te {
     }
   }
   updateEditorType() {
-    const { CELL_EDITOR_TYPE_METHOD: e } = this.ctx.config;
+    const { BODY_CELL_EDITOR_TYPE_METHOD: e } = this.ctx.config;
     if (typeof e == "function") {
       const s = e({
         row: this.row,
@@ -2049,7 +2073,7 @@ class ee extends te {
     }
   }
   updateRender() {
-    const { CELL_RENDER_METHOD: e } = this.ctx.config;
+    const { BODY_CELL_RENDER_METHOD: e } = this.ctx.config;
     if (typeof e == "function") {
       const s = e({
         row: this.row,
@@ -2140,6 +2164,7 @@ class ee extends te {
         rowIndex: this.rowIndex,
         colIndex: this.colIndex,
         column: this.column,
+        isHasChanged: this.isHasChanged,
         value: this.getValue()
       }) || {};
       b && (w = b), m && (y = m);
@@ -2155,7 +2180,7 @@ class ee extends te {
     }
   }
   updateHoverIcon() {
-    const { CELL_HOVER_ICON_METHOD: e, CELL_HOVER_ICON_SIZE: i, CELL_PADDING: s } = this.ctx.config;
+    const { BODY_CELL_HOVER_ICON_METHOD: e, CELL_HOVER_ICON_SIZE: i, CELL_PADDING: s } = this.ctx.config;
     if (typeof e == "function") {
       const l = e({
         row: this.row,
@@ -2185,7 +2210,13 @@ class ee extends te {
    */
   getText() {
     if (this.cellType === "footer")
-      return this.row[this.key];
+      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,
@@ -2194,7 +2225,7 @@ class ee extends te {
         column: this.column,
         value: this.getValue()
       });
-    const { CELL_FORMATTER_METHOD: e } = this.ctx.config;
+    const { BODY_CELL_FORMATTER_METHOD: e } = this.ctx.config;
     return typeof e == "function" ? e({
       row: this.row,
       rowIndex: this.rowIndex,
@@ -2580,13 +2611,13 @@ class hi {
           column: t.column,
           value: t.getValue()
         }).then((l) => {
-          this.ctx.database.setExpandChildren(t.rowKey, l), this.ctx.database.expandLoading(t.rowKey, !1);
+          this.ctx.database.setExpandChildren(t.rowKey, l), this.ctx.database.expandLoading(t.rowKey, !1), this.ctx.emit("expandChange", this.ctx.database.getExpandRowKeys());
         }).catch((l) => {
           this.ctx.database.expandLoading(t.rowKey, !1), console.error(l);
         }));
       else {
         const a = this.ctx.database.getIsExpand(t.rowKey);
-        this.ctx.database.expandItem(t.rowKey, !a), this.ctx.emit("expandChange");
+        this.ctx.database.expandItem(t.rowKey, !a), this.ctx.emit("expandChange", this.ctx.database.getExpandRowKeys());
       }
     }
   }
@@ -3912,10 +3943,12 @@ class ui {
     if (!i || i.height > l.visibleHeight || i.width > l.visibleWidth - r - s)
       return;
     let u = 0;
-    if (x && (u = a.visibleHeight), i.fixed || !(i.drawX < r || i.drawX + i.width > e - s || i.drawY < this.ctx.header.height || i.drawY + i.height > t - u - d))
+    x && (u = a.visibleHeight);
+    const g = i.drawX < r, w = i.drawX + i.width > e - s, y = i.drawY < o.height, p = i.drawY + i.height > t - u - d;
+    if (i.fixed && !(y || p) || !(g || w || y || p))
       return;
-    const g = r - i.drawX + 1, w = i.drawX + i.width - (e - s) + 1, y = o.height - i.drawY, p = i.drawY + i.height - (t - u - d);
-    w > 0 && !i.fixed ? this.ctx.setScrollX(c + w) : g > 0 && !i.fixed && this.ctx.setScrollX(c - g), y > 0 ? this.ctx.setScrollY(f - y) : p > 0 && this.ctx.setScrollY(f + p), this.ctx.emit("adjustBoundaryPosition", i);
+    const b = r - i.drawX + 1, m = i.drawX + i.width - (e - s) + 1, E = o.height - i.drawY, C = i.drawY + i.height - (t - u - d);
+    m > 0 && !i.fixed ? this.ctx.setScrollX(c + m) : b > 0 && !i.fixed && this.ctx.setScrollX(c - b), E > 0 ? this.ctx.setScrollY(f - E) : C > 0 && this.ctx.setScrollY(f + C), this.ctx.emit("adjustBoundaryPosition", i);
   }
   destroy() {
     this.timerX && (clearTimeout(this.timerX), this.timerX = 0), this.timerY && (clearTimeout(this.timerY), this.timerY = 0);
@@ -5073,8 +5106,6 @@ class qi {
     }), this.ctx.on("cellClick", (t) => {
       var e, i;
       t.rowKey === ((e = this.cellTarget) == null ? void 0 : e.rowKey) && t.key === ((i = this.cellTarget) == null ? void 0 : i.key) ? this.startEdit() : (this.doneEdit(), this.cellTarget = t, this.ctx.config.ENABLE_EDIT_SINGLE_CLICK && this.startEdit());
-    }), this.ctx.on("adjustBoundaryPosition", (t) => {
-      this.cellTarget = t;
     });
   }
   initTextEditor() {
@@ -5617,6 +5648,9 @@ class Qi {
   scrollYTo(t) {
     this.ctx.setScrollY(t);
   }
+  setExpandRowKeys(t, e = !0) {
+    this.ctx.database.setExpandRowKeys(t, e);
+  }
   clearSelection() {
     this.ctx.database.clearSelection(), this.ctx.emit("draw");
   }