@visactor/vtable 0.15.5-alpha.4 → 0.16.0

package/es/ListTable.d.ts

@@ -23,7 +23,7 @@ export declare class ListTable extends BaseTable implements ListTableAPI {
     getCellValue(col: number, row: number): FieldData;
     getCellOriginValue(col: number, row: number): FieldData;
     getCellRawValue(col: number, row: number): FieldData;
-    getRecordIndexByCell(col: number, row: number): number;
+    getRecordShowIndexByCell(col: number, row: number): number;
     getTableIndexByRecordIndex(recordIndex: number): number;
     getTableIndexByField(field: FieldDef): number;
     getCellAddrByFieldRecord(field: FieldDef, recordIndex: number): CellAddress;
@@ -44,7 +44,7 @@ export declare class ListTable extends BaseTable implements ListTableAPI {
     _refreshHierarchyState(col: number, row: number): void;
     _hasHierarchyTreeHeader(): boolean;
     getMenuInfo(col: number, row: number, type: string): DropDownMenuEventInfo;
-    protected _getSortFuncFromHeaderOption(columns: ColumnsDefine | undefined, field: FieldDef, fieldKey?: FieldKeyDef): ((v1: any, v2: any, order: SortOrder) => 0 | 1 | -1) | undefined;
+    _getSortFuncFromHeaderOption(columns: ColumnsDefine | undefined, field: FieldDef, fieldKey?: FieldKeyDef): ((v1: any, v2: any, order: SortOrder) => 0 | 1 | -1) | undefined;
     updateSortState(sortState: SortState[] | SortState | null, executeSort?: boolean): void;
     getCheckboxState(field?: string | number): boolean[] | Record<string | number, boolean>[];
     getCellCheckboxState(col: number, row: number): boolean;
@@ -54,4 +54,7 @@ export declare class ListTable extends BaseTable implements ListTableAPI {
     completeEditCell(): void;
     getEditor(col: number, row: number): IEditor;
     changeCellValue(col: number, row: number, value: string | number | null): void;
+    addRecord(record: any, recordIndex?: number): void;
+    addRecords(records: any[], recordIndex?: number): void;
+    deleteRecords(recordIndexs: number[]): void;
 }

package/es/ListTable.js

@@ -4,7 +4,7 @@ import { SimpleHeaderLayoutMap } from "./layout";
 
 import { isValid } from "@visactor/vutils";
 
-import { _setDataSource, _setRecords } from "./core/tableHelper";
+import { _setDataSource, _setRecords, sortRecords } from "./core/tableHelper";
 
 import { BaseTable } from "./core";
 
@@ -66,7 +66,8 @@ export class ListTable extends BaseTable {
             colDefine.editor && (this.internalProps.columns[index].editor = colDefine.editor);
         })), this.options.columns = columns, this.refreshHeader(), this.scenegraph.clearCells(), 
         this.headerStyleCache = new Map, this.bodyStyleCache = new Map, this.scenegraph.createSceneGraph(), 
-        this.stateManager.updateHoverPos(oldHoverState.col, oldHoverState.row), this.renderAsync();
+        this.stateManager.updateHoverPos(oldHoverState.col, oldHoverState.row), this.renderAsync(), 
+        this.eventManager.updateEventBinder();
     }
     get header() {
         return this.internalProps.columns;
@@ -116,7 +117,7 @@ export class ListTable extends BaseTable {
         const {field: field} = table.internalProps.layoutMap.getBody(col, row);
         return table.getRawFieldData(field, col, row);
     }
-    getRecordIndexByCell(col, row) {
+    getRecordShowIndexByCell(col, row) {
         const {layoutMap: layoutMap} = this.internalProps;
         return layoutMap.getRecordIndexByCell(col, row);
     }
@@ -137,11 +138,11 @@ export class ListTable extends BaseTable {
         };
     }
     getCellOriginRecord(col, row) {
-        const table = this, index = table.getRecordIndexByCell(col, row);
+        const table = this, index = table.getRecordShowIndexByCell(col, row);
         if (index > -1) return table.dataSource.get(index);
     }
     getCellRawRecord(col, row) {
-        const table = this, index = table.getRecordIndexByCell(col, row);
+        const table = this, index = table.getRecordShowIndexByCell(col, row);
         if (index > -1) return table.dataSource.getRaw(index);
     }
     _canResizeColumn(col, row) {
@@ -187,29 +188,30 @@ export class ListTable extends BaseTable {
         this.refreshRowColCount();
     }
     refreshRowColCount() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t;
         const table = this, {layoutMap: layoutMap} = table.internalProps;
         layoutMap && (layoutMap.recordsCount = null !== (_b = null === (_a = table.internalProps.dataSource) || void 0 === _a ? void 0 : _a.length) && void 0 !== _b ? _b : 0, 
         table.transpose ? (table.rowCount = null !== (_c = layoutMap.rowCount) && void 0 !== _c ? _c : 0, 
         table.colCount = (null !== (_e = null === (_d = table.internalProps.dataSource) || void 0 === _d ? void 0 : _d.length) && void 0 !== _e ? _e : 0) * layoutMap.bodyRowSpanCount + layoutMap.headerLevelCount, 
         table.frozenRowCount = 0, this.internalProps.frozenColCount = null !== (_f = layoutMap.headerLevelCount) && void 0 !== _f ? _f : 0, 
-        table.rightFrozenColCount = null !== (_g = this.options.rightFrozenColCount) && void 0 !== _g ? _g : 0) : (table.colCount = null !== (_h = layoutMap.colCount) && void 0 !== _h ? _h : 0, 
-        table.rowCount = (null !== (_k = null === (_j = table.internalProps.dataSource) || void 0 === _j ? void 0 : _j.length) && void 0 !== _k ? _k : 0) * layoutMap.bodyRowSpanCount + layoutMap.headerLevelCount, 
-        this.internalProps.frozenColCount = null !== (_l = this.options.frozenColCount) && void 0 !== _l ? _l : 0, 
-        table.frozenRowCount = layoutMap.headerLevelCount, table.bottomFrozenRowCount = null !== (_m = this.options.bottomFrozenRowCount) && void 0 !== _m ? _m : 0, 
-        table.rightFrozenColCount = null !== (_o = this.options.rightFrozenColCount) && void 0 !== _o ? _o : 0), 
+        table.bottomFrozenRowCount !== (null !== (_g = this.options.bottomFrozenRowCount) && void 0 !== _g ? _g : 0) && (table.bottomFrozenRowCount = null !== (_h = this.options.bottomFrozenRowCount) && void 0 !== _h ? _h : 0), 
+        table.rightFrozenColCount !== (null !== (_j = this.options.rightFrozenColCount) && void 0 !== _j ? _j : 0) && (table.rightFrozenColCount = null !== (_k = this.options.rightFrozenColCount) && void 0 !== _k ? _k : 0)) : (table.colCount = null !== (_l = layoutMap.colCount) && void 0 !== _l ? _l : 0, 
+        table.rowCount = (null !== (_o = null === (_m = table.internalProps.dataSource) || void 0 === _m ? void 0 : _m.length) && void 0 !== _o ? _o : 0) * layoutMap.bodyRowSpanCount + layoutMap.headerLevelCount, 
+        this.internalProps.frozenColCount = null !== (_p = this.options.frozenColCount) && void 0 !== _p ? _p : 0, 
+        table.frozenRowCount = layoutMap.headerLevelCount, table.bottomFrozenRowCount !== (null !== (_q = this.options.bottomFrozenRowCount) && void 0 !== _q ? _q : 0) && (table.bottomFrozenRowCount = null !== (_r = this.options.bottomFrozenRowCount) && void 0 !== _r ? _r : 0), 
+        table.rightFrozenColCount !== (null !== (_s = this.options.rightFrozenColCount) && void 0 !== _s ? _s : 0) && (table.rightFrozenColCount = null !== (_t = this.options.rightFrozenColCount) && void 0 !== _t ? _t : 0)), 
         this.stateManager.setFrozenCol(this.internalProps.frozenColCount));
     }
     getFieldData(field, col, row) {
         if (null === field) return null;
         if (this.internalProps.layoutMap.isHeader(col, row)) return null;
-        const index = this.getRecordIndexByCell(col, row);
+        const index = this.getRecordShowIndexByCell(col, row);
         return this.internalProps.dataSource.getField(index, field, col, row, this);
     }
     getRawFieldData(field, col, row) {
         if (null === field) return null;
         if (this.internalProps.layoutMap.isHeader(col, row)) return null;
-        const index = this.getRecordIndexByCell(col, row);
+        const index = this.getRecordShowIndexByCell(col, row);
         return this.internalProps.dataSource.getRawField(index, field, col, row, this);
     }
     moveHeaderPosition(source, target) {
@@ -286,7 +288,7 @@ export class ListTable extends BaseTable {
     }
     getHierarchyState(col, row) {
         if (!this.getBodyColumnDefine(col, row).tree) return HierarchyState.none;
-        const index = this.getRecordIndexByCell(col, row);
+        const index = this.getRecordShowIndexByCell(col, row);
         return this.dataSource.getHierarchyState(index);
     }
     toggleHierarchyState(col, row) {
@@ -307,7 +309,7 @@ export class ListTable extends BaseTable {
         }
     }
     _refreshHierarchyState(col, row) {
-        const index = this.getRecordIndexByCell(col, row), diffDataIndices = this.dataSource.toggleHierarchyState(index), diffPositions = this.internalProps.layoutMap.toggleHierarchyState(diffDataIndices);
+        const index = this.getRecordShowIndexByCell(col, row), diffDataIndices = this.dataSource.toggleHierarchyState(index), diffPositions = this.internalProps.layoutMap.toggleHierarchyState(diffDataIndices);
         this.refreshRowColCount(), this.clearCellStyleCache(), this.scenegraph.updateHierarchyIcon(col, row), 
         this.scenegraph.updateRow(diffPositions.removeCellPositions, diffPositions.addCellPositions);
     }
@@ -355,7 +357,7 @@ export class ListTable extends BaseTable {
     getCellCheckboxState(col, row) {
         const define = this.getBodyColumnDefine(col, row), field = null == define ? void 0 : define.field, cellType = null == define ? void 0 : define.cellType;
         if (isValid(field) && "checkbox" === cellType) {
-            const dataIndex = this.dataSource.getIndexKey(this.getRecordIndexByCell(col, row));
+            const dataIndex = this.dataSource.getIndexKey(this.getRecordShowIndexByCell(col, row));
             return this.stateManager.checkedState[dataIndex][field];
         }
     }
@@ -387,7 +389,7 @@ export class ListTable extends BaseTable {
     setRecordChildren(records, col, row) {
         const record = this.getCellOriginRecord(col, row);
         record.children = records;
-        const index = this.getRecordIndexByCell(col, row);
+        const index = this.getRecordShowIndexByCell(col, row);
         this.dataSource.setRecord(record, index), this._refreshHierarchyState(col, row);
     }
     startEditCell(col, row) {
@@ -416,7 +418,7 @@ export class ListTable extends BaseTable {
         return "string" == typeof editorDefine ? editors.get(editorDefine) : editorDefine;
     }
     changeCellValue(col, row, value) {
-        const recordIndex = this.getRecordIndexByCell(col, row), {field: field} = this.internalProps.layoutMap.getBody(col, row);
+        const recordIndex = this.getRecordShowIndexByCell(col, row), {field: field} = this.internalProps.layoutMap.getBody(col, row);
         if (this.dataSource.changeFieldValue(value, recordIndex, field, col, row, this), 
         this.scenegraph.updateCellContent(col, row), "adaptive" === this.widthMode || this.autoFillWidth && this.getAllColsWidth() <= this.tableNoFrameWidth) 0 === this.internalProps._widthResizedColMap.size && this.scenegraph.recalculateColWidths(); else if (!this.internalProps._widthResizedColMap.has(col)) {
             const oldWidth = this.getColWidth(col), newWidth = computeColWidth(col, 0, this.rowCount - 1, this, !1);
@@ -433,4 +435,147 @@ export class ListTable extends BaseTable {
             changedValue: this.getCellOriginValue(col, row)
         }), this.scenegraph.updateNextFrame();
     }
+    addRecord(record, recordIndex) {
+        if (this.sortState) this.dataSource.addRecordForSorted(record), sortRecords(this), 
+        this.refreshRowColCount(), this.scenegraph.clearCells(), this.scenegraph.createSceneGraph(); else {
+            (void 0 === recordIndex || recordIndex > this.dataSource.sourceLength) && (recordIndex = this.dataSource.sourceLength);
+            const headerCount = this.transpose ? this.rowHeaderLevelCount : this.columnHeaderLevelCount;
+            this.dataSource.addRecord(record, recordIndex);
+            const oldRowCount = this.rowCount;
+            this.refreshRowColCount();
+            const newRowCount = this.transpose ? this.colCount : this.rowCount;
+            if (this.pagination) {
+                const {perPageCount: perPageCount, currentPage: currentPage} = this.pagination, endIndex = perPageCount * (currentPage || 0) + perPageCount;
+                if (recordIndex < endIndex) if (recordIndex < endIndex - perPageCount) this.scenegraph.clearCells(), 
+                this.scenegraph.createSceneGraph(); else {
+                    const rowNum = recordIndex - (endIndex - perPageCount) + headerCount;
+                    if (oldRowCount - headerCount === this.pagination.perPageCount) {
+                        const updateRows = [];
+                        for (let row = rowNum; row < newRowCount; row++) this.transpose ? updateRows.push({
+                            col: row,
+                            row: 0
+                        }) : updateRows.push({
+                            col: 0,
+                            row: row
+                        });
+                        this.transpose ? this.scenegraph.updateCol([], [], updateRows) : this.scenegraph.updateRow([], [], updateRows);
+                    } else {
+                        const addRows = [];
+                        for (let row = rowNum; row < Math.min(newRowCount, rowNum + 1); row++) this.transpose ? addRows.push({
+                            col: row,
+                            row: 0
+                        }) : addRows.push({
+                            col: 0,
+                            row: row
+                        });
+                        this.transpose ? this.scenegraph.updateCol([], addRows, []) : this.scenegraph.updateRow([], addRows, []);
+                    }
+                }
+            } else {
+                const addRows = [];
+                for (let row = recordIndex + headerCount; row < recordIndex + headerCount + 1; row++) this.transpose ? addRows.push({
+                    col: row,
+                    row: 0
+                }) : addRows.push({
+                    col: 0,
+                    row: row
+                });
+                this.transpose ? this.scenegraph.updateCol([], addRows, []) : this.scenegraph.updateRow([], addRows, []);
+            }
+        }
+    }
+    addRecords(records, recordIndex) {
+        if (this.sortState) this.dataSource.addRecordsForSorted(records), sortRecords(this), 
+        this.refreshRowColCount(), this.scenegraph.clearCells(), this.scenegraph.createSceneGraph(); else {
+            void 0 === recordIndex || recordIndex > this.dataSource.sourceLength ? recordIndex = this.dataSource.sourceLength : recordIndex < 0 && (recordIndex = 0);
+            const headerCount = this.transpose ? this.rowHeaderLevelCount : this.columnHeaderLevelCount;
+            this.dataSource.addRecords(records, recordIndex);
+            const oldRowCount = this.transpose ? this.colCount : this.rowCount;
+            this.refreshRowColCount();
+            const newRowCount = this.transpose ? this.colCount : this.rowCount;
+            if (this.pagination) {
+                const {perPageCount: perPageCount, currentPage: currentPage} = this.pagination, endIndex = perPageCount * (currentPage || 0) + perPageCount;
+                if (recordIndex < endIndex) if (recordIndex < endIndex - perPageCount) this.scenegraph.clearCells(), 
+                this.scenegraph.createSceneGraph(); else {
+                    const rowNum = recordIndex - (endIndex - perPageCount) + headerCount;
+                    if (oldRowCount - headerCount === this.pagination.perPageCount) {
+                        const updateRows = [];
+                        for (let row = rowNum; row < newRowCount; row++) this.transpose ? updateRows.push({
+                            col: row,
+                            row: 0
+                        }) : updateRows.push({
+                            col: 0,
+                            row: row
+                        });
+                        this.transpose ? this.scenegraph.updateCol([], [], updateRows) : this.scenegraph.updateRow([], [], updateRows);
+                    } else {
+                        const addRows = [];
+                        for (let row = rowNum; row < Math.min(newRowCount, rowNum + (Array.isArray(records) ? records.length : 1)); row++) this.transpose ? addRows.push({
+                            col: row,
+                            row: 0
+                        }) : addRows.push({
+                            col: 0,
+                            row: row
+                        });
+                        this.transpose ? this.scenegraph.updateCol([], addRows, []) : this.scenegraph.updateRow([], addRows, []);
+                    }
+                }
+            } else {
+                const addRows = [];
+                for (let row = recordIndex + headerCount; row < recordIndex + headerCount + (Array.isArray(records) ? records.length : 1); row++) this.transpose ? addRows.push({
+                    col: row,
+                    row: 0
+                }) : addRows.push({
+                    col: 0,
+                    row: row
+                });
+                this.transpose ? this.scenegraph.updateCol([], addRows, []) : this.scenegraph.updateRow([], addRows, []);
+            }
+        }
+    }
+    deleteRecords(recordIndexs) {
+        if ((null == recordIndexs ? void 0 : recordIndexs.length) > 0) if (this.sortState) this.dataSource.deleteRecordsForSorted(recordIndexs), 
+        sortRecords(this), this.refreshRowColCount(), this.scenegraph.clearCells(), this.scenegraph.createSceneGraph(); else {
+            const deletedRecordIndexs = this.dataSource.deleteRecords(recordIndexs);
+            if (0 === deletedRecordIndexs.length) return;
+            const oldRowCount = this.transpose ? this.colCount : this.rowCount;
+            this.refreshRowColCount();
+            const newRowCount = this.transpose ? this.colCount : this.rowCount, recordIndexsMinToMax = deletedRecordIndexs.sort(((a, b) => a - b)), minRecordIndex = recordIndexsMinToMax[0];
+            if (this.pagination) {
+                const {perPageCount: perPageCount, currentPage: currentPage} = this.pagination, endIndex = perPageCount * (currentPage || 0) + perPageCount;
+                if (minRecordIndex < endIndex) if (minRecordIndex < endIndex - perPageCount) this.scenegraph.clearCells(), 
+                this.scenegraph.createSceneGraph(); else {
+                    const updateRows = [], delRows = [];
+                    for (let row = minRecordIndex - (endIndex - perPageCount) + (this.transpose ? this.rowHeaderLevelCount : this.columnHeaderLevelCount); row < newRowCount; row++) this.transpose ? updateRows.push({
+                        col: row,
+                        row: 0
+                    }) : updateRows.push({
+                        col: 0,
+                        row: row
+                    });
+                    if (newRowCount < oldRowCount) for (let row = newRowCount; row < oldRowCount; row++) this.transpose ? delRows.push({
+                        col: row,
+                        row: 0
+                    }) : delRows.push({
+                        col: 0,
+                        row: row
+                    });
+                    this.transpose ? this.scenegraph.updateCol(delRows, [], updateRows) : this.scenegraph.updateRow(delRows, [], updateRows);
+                }
+            } else {
+                const delRows = [];
+                for (let index = 0; index < recordIndexsMinToMax.length; index++) {
+                    const rowNum = recordIndexsMinToMax[index] + (this.transpose ? this.rowHeaderLevelCount : this.columnHeaderLevelCount);
+                    this.transpose ? delRows.push({
+                        col: rowNum,
+                        row: 0
+                    }) : delRows.push({
+                        col: 0,
+                        row: rowNum
+                    });
+                }
+                this.transpose ? this.scenegraph.updateCol(delRows, [], []) : this.scenegraph.updateRow(delRows, [], []);
+            }
+        }
+    }
 }