vxe-table 3.14.0-beta.9 → 3.14.1

package/es/table/src/props.js

@@ -161,6 +161,8 @@ export default {
     resizeConfig: Object,
     // 列配置信息
     columnConfig: Object,
+    // 当前列配置信息
+    currentColumnConfig: Object,
     // 单元格配置信息
     cellConfig: Object,
     // 表头单元格配置信息
@@ -169,6 +171,8 @@ export default {
     footerCellConfig: Object,
     // 行配置信息
     rowConfig: Object,
+    // 当前行配置信息
+    currentRowConfig: Object,
     // 已废弃，被 rowDragConfig 替换
     dragConfig: Object,
     // 行拖拽排序配置项

package/es/table/src/table.js

@@ -1,7 +1,7 @@
 import XEUtils from 'xe-utils';
 import { getFuncText, isEnableConf } from '../../ui/src/utils';
 import { initTpImg } from '../../ui/src/dom';
-import { getRowid } from './util';
+import { createHandleGetRowId } from './util';
 import { VxeUI } from '../../ui';
 import methods from './methods';
 import TableBodyComponent from './body';
@@ -27,14 +27,14 @@ const { getConfig, getIcon, getI18n, renderer, globalResize, globalEvents, globa
  * 渲染浮固定列
  * 分别渲染左边固定列和右边固定列
  * 如果宽度足够情况下，则不需要渲染固定列
- * @param {Function} h 创建 VNode 函数
- * @param {Object} $xetable 表格实例
- * @param {String} fixedType 固定列类型
  */
-function renderFixed(h, $xetable, fixedType) {
-    const { _e, tableData, tableColumn, tableGroupColumn, vSize, showHeader, showFooter, columnStore, footerTableData } = $xetable;
+function renderFixed(h, $xeTable, fixedType) {
+    const props = $xeTable;
+    const reactData = $xeTable;
+    const { showHeader, showFooter } = props;
+    const { tableData, tableColumn, tableGroupColumn, columnStore, footerTableData } = reactData;
     const isFixedLeft = fixedType === 'left';
-    const fixedColumn = columnStore[`${fixedType}List`];
+    const fixedColumn = isFixedLeft ? columnStore.leftList : columnStore.rightList;
     return h('div', {
         ref: isFixedLeft ? 'refLeftContainer' : 'refRightContainer',
         class: `vxe-table--fixed-${fixedType}-wrapper`
@@ -46,19 +46,17 @@ function renderFixed(h, $xetable, fixedType) {
                     tableData,
                     tableColumn,
                     tableGroupColumn,
-                    size: vSize,
                     fixedColumn
                 },
                 ref: `${fixedType}Header`
             })
-            : _e(),
+            : renderEmptyElement($xeTable),
         h(TableBodyComponent, {
             props: {
                 fixedType,
                 tableData,
                 tableColumn,
-                fixedColumn,
-                size: vSize
+                fixedColumn
             },
             ref: `${fixedType}Body`
         }),
@@ -68,12 +66,11 @@ function renderFixed(h, $xetable, fixedType) {
                     footerTableData,
                     tableColumn,
                     fixedColumn,
-                    fixedType,
-                    size: vSize
+                    fixedType
                 },
                 ref: `${fixedType}Footer`
             })
-            : _e()
+            : renderEmptyElement($xeTable)
     ]);
 }
 function renderEmptyBody(h, _vm) {
@@ -193,6 +190,7 @@ function renderRowExpandedVNs(h, $xeTable) {
         })
     ];
     if (expandColumn) {
+        const { handleGetRowId } = createHandleGetRowId($xeTable);
         tableRowExpandedList.forEach((row) => {
             const expandOpts = $xeTable.computeExpandOpts;
             const { height: expandHeight, padding } = expandOpts;
@@ -200,7 +198,7 @@ function renderRowExpandedVNs(h, $xeTable) {
             const treeOpts = $xeTable.computeTreeOpts;
             const { transform, seqMode } = treeOpts;
             const cellStyle = {};
-            const rowid = getRowid($xeTable, row);
+            const rowid = handleGetRowId(row);
             const rest = fullAllDataRowIdData[rowid];
             let rowLevel = 0;
             let seq = -1;
@@ -394,7 +392,6 @@ export default {
     props: tableProps,
     provide() {
         return {
-            $xetable: this,
             $xeTable: this,
             xecolgroup: null
         };
@@ -405,9 +402,6 @@ export default {
         },
         $xeGrid: {
             default: null
-        },
-        $xegrid: {
-            default: null
         }
     },
     data() {
@@ -446,8 +440,6 @@ export default {
             isAllSelected: false,
             // 复选框属性，有选中且非全选状态
             isIndeterminate: false,
-            // 复选框属性，已选中的行集合
-            selectCheckboxMaps: {},
             // 当前行
             currentRow: null,
             // 单选框属性，选中列
@@ -461,16 +453,6 @@ export default {
             hasFixedColumn: false,
             // 树节点列信息
             treeNodeColumn: null,
-            // 已展开的行集合
-            rowExpandedMaps: {},
-            // 懒加载中的展开行的集合
-            rowExpandLazyLoadedMaps: {},
-            // 已展开树节点集合
-            treeExpandedMaps: {},
-            // 懒加载中的树节点的集合
-            treeExpandLazyLoadedMaps: {},
-            // 树节点不确定状态的集合
-            treeIndeterminateMaps: {},
             // 合并单元格的对象集
             mergeList: [],
             // 合并表尾数据的对象集
@@ -487,8 +469,6 @@ export default {
             upDataFlag: 0,
             // 刷新列标识，当列的特定属性被改变时，触发表格刷新列
             reColumnFlag: 0,
-            // 已标记的对象集
-            pendingRowMaps: {},
             // 自定义列相关的信息
             customStore: {
                 btnEl: null,
@@ -564,9 +544,7 @@ export default {
                 focused: {
                     row: null,
                     column: null
-                },
-                insertMaps: {},
-                removeMaps: {}
+                }
             },
             // 存放 tooltip 相关信息
             tooltipStore: {
@@ -623,6 +601,10 @@ export default {
                 isHeader: false,
                 isFooter: false
             },
+            rowExpandedFlag: 1,
+            treeExpandedFlag: 1,
+            updateCheckboxFlag: 1,
+            pendingRowFlag: 1,
             rowHeightStore: {
                 default: 48,
                 medium: 44,
@@ -639,6 +621,7 @@ export default {
             rowExpandHeightFlag: 1,
             calcCellHeightFlag: 1,
             resizeHeightFlag: 1,
+            resizeWidthFlag: 1,
             isCustomStatus: false,
             isDragRowMove: false,
             dragRow: null,
@@ -673,22 +656,22 @@ export default {
             return Object.assign({ message: 'default' }, getConfig().table.validConfig, this.validConfig);
         },
         sXOpts() {
-            return this.computeSXOpts;
+            return this.computeVirtualXOpts;
         },
         computeSXOpts() {
             return this.computeVirtualXOpts;
         },
         computeScrollXThreshold() {
             const $xeTable = this;
-            const sXOpts = $xeTable.computeSXOpts;
-            const { threshold } = sXOpts;
+            const virtualXOpts = $xeTable.computeVirtualXOpts;
+            const { threshold } = virtualXOpts;
             if (threshold) {
                 return XEUtils.toNumber(threshold);
             }
             return 0;
         },
         sYOpts() {
-            return this.computeSYOpts;
+            return this.computeVirtualYOpts;
         },
         computeSYOpts() {
             return this.computeVirtualYOpts;
@@ -720,8 +703,8 @@ export default {
         },
         computeScrollYThreshold() {
             const $xeTable = this;
-            const sYOpts = $xeTable.computeSYOpts;
-            const { threshold } = sYOpts;
+            const virtualYOpts = $xeTable.computeVirtualYOpts;
+            const { threshold } = virtualYOpts;
             if (threshold) {
                 return XEUtils.toNumber(threshold);
             }
@@ -745,28 +728,54 @@ export default {
             return this.computeColumnOpts;
         },
         computeColumnOpts() {
-            return Object.assign({}, getConfig().table.columnConfig, this.columnConfig);
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().table.columnConfig, props.columnConfig);
+        },
+        computeCurrentColumnOpts() {
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().table.currentColumnConfig, props.currentColumnConfig);
         },
         computeCellOpts() {
             const $xeTable = this;
             const props = $xeTable;
-            return Object.assign({}, getConfig().table.cellConfig, props.cellConfig);
+            const cellOpts = Object.assign({}, getConfig().table.cellConfig, props.cellConfig);
+            if (cellOpts.height) {
+                cellOpts.height = XEUtils.toNumber(cellOpts.height);
+            }
+            return cellOpts;
         },
         computeHeaderCellOpts() {
             const $xeTable = this;
             const props = $xeTable;
-            return Object.assign({}, getConfig().table.headerCellConfig, props.headerCellConfig);
+            const headerCellOpts = Object.assign({}, getConfig().table.headerCellConfig, props.headerCellConfig);
+            if (headerCellOpts.height) {
+                headerCellOpts.height = XEUtils.toNumber(headerCellOpts.height);
+            }
+            return headerCellOpts;
         },
         computeFooterCellOpts() {
             const $xeTable = this;
             const props = $xeTable;
-            return Object.assign({}, getConfig().table.footerCellConfig, props.footerCellConfig);
+            const footerCellOpts = Object.assign({}, getConfig().table.footerCellConfig, props.footerCellConfig);
+            if (footerCellOpts.height) {
+                footerCellOpts.height = XEUtils.toNumber(footerCellOpts.height);
+            }
+            return footerCellOpts;
         },
         rowOpts() {
             return this.computeRowOpts;
         },
         computeRowOpts() {
-            return Object.assign({}, getConfig().table.rowConfig, this.rowConfig);
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().table.rowConfig, props.rowConfig);
+        },
+        computeCurrentRowOpts() {
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().table.currentRowConfig, props.currentRowConfig);
         },
         computeRowDragOpts() {
             return Object.assign({}, getConfig().table.rowDragConfig, this.rowDragConfig);
@@ -790,25 +799,33 @@ export default {
             return this.computeSeqOpts;
         },
         computeSeqOpts() {
-            return Object.assign({ startIndex: 0 }, getConfig().table.seqConfig, this.seqConfig);
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({ startIndex: 0 }, getConfig().table.seqConfig, props.seqConfig);
         },
         radioOpts() {
             return this.computeRadioOpts;
         },
         computeRadioOpts() {
-            return Object.assign({}, getConfig().table.radioConfig, this.radioConfig);
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().table.radioConfig, props.radioConfig);
         },
         checkboxOpts() {
             return this.computeCheckboxOpts;
         },
         computeCheckboxOpts() {
-            return Object.assign({}, getConfig().table.checkboxConfig, this.checkboxConfig);
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().table.checkboxConfig, props.checkboxConfig);
         },
         tooltipOpts() {
             return this.computeTooltipOpts;
         },
         computeTooltipOpts() {
-            return Object.assign({}, getConfig().tooltip, getConfig().table.tooltipConfig, this.tooltipConfig);
+            const $xeTable = this;
+            const props = $xeTable;
+            return Object.assign({}, getConfig().tooltip, getConfig().table.tooltipConfig, props.tooltipConfig);
         },
         tipConfig() {
             return Object.assign({}, this.tooltipOpts);
@@ -1014,12 +1031,15 @@ export default {
         computeTableRowExpandedList() {
             const $xeTable = this;
             const reactData = $xeTable;
-            const { rowExpandedMaps, tableData, expandColumn } = reactData;
+            const internalData = $xeTable;
+            const { rowExpandedFlag, tableData, expandColumn } = reactData;
+            const { rowExpandedMaps } = internalData;
+            const { handleGetRowId } = createHandleGetRowId($xeTable);
             const expandList = [];
-            if (expandColumn) {
+            if (expandColumn && rowExpandedFlag) {
                 const rowKeys = {};
                 tableData.forEach(row => {
-                    rowKeys[getRowid($xeTable, row)] = true;
+                    rowKeys[handleGetRowId(row)] = true;
                 });
                 XEUtils.each(rowExpandedMaps, (row, rowid) => {
                     if (rowKeys[rowid]) {
@@ -1256,13 +1276,15 @@ export default {
             lastScrollTop: 0,
             // 单选框属性，已选中保留的行
             radioReserveRow: null,
-            // 复选框属性，已选中保留的行
+            // 复选框属性，已选中保留的行集合
             checkboxReserveRowMap: {},
-            // 行数据，已展开保留的行
+            // 行数据，已展开保留的行集合
             rowExpandedReserveRowMap: {},
-            // 树结构数据，已展开保留的行
+            // 树结构数据，已展开保留的行集合
             treeExpandedReserveRowMap: {},
-            // 完整数据、条件处理后
+            // 树结构数据，不确定状态的集合
+            treeIndeterminateRowMaps: {},
+            // 列表完整数据、条件处理后
             tableFullData: [],
             afterFullData: [],
             // 列表条件处理后数据集合
@@ -1273,20 +1295,35 @@ export default {
             tableFullColumn: [],
             // 渲染所有列
             visibleColumn: [],
-            // 缓存数据集
+            // 总的缓存数据集
             fullAllDataRowIdData: {},
-            fullDataRowMap: new Map(),
+            // 渲染中缓存数据
+            sourceDataRowIdData: {},
             fullDataRowIdData: {},
-            fullColumnMap: new Map(),
             fullColumnIdData: {},
             fullColumnFieldData: {},
+            // 已展开的行集合
+            rowExpandedMaps: {},
+            // 懒加载中的展开行的集合
+            rowExpandLazyLoadedMaps: {},
+            // 已展开树节点集合
+            treeExpandedMaps: {},
+            // 懒加载中的树节点的集合
+            treeExpandLazyLoadedMaps: {},
+            // 复选框属性，已选中的行集合
+            selectCheckboxMaps: {},
+            // 已标记的对象集
+            pendingRowMaps: {},
+            // 已新增的临时行
+            insertRowMaps: {},
+            // 已删除行
+            removeRowMaps: {},
             swYSize: 0,
             swYInterval: 0,
             swYTotal: 0
         });
         const { data, exportConfig, importConfig, treeConfig, showOverflow } = props;
         const { scrollXStore, scrollYStore } = internalData;
-        const sYOpts = $xeTable.computeSYOpts;
         const editOpts = $xeTable.computeEditOpts;
         const treeOpts = $xeTable.computeTreeOpts;
         const radioOpts = $xeTable.computeRadioOpts;
@@ -1446,8 +1483,7 @@ export default {
         Object.assign(scrollYStore, {
             startIndex: 0,
             endIndex: 1,
-            visibleSize: 0,
-            adaptive: sYOpts.adaptive !== false
+            visibleSize: 0
         });
         Object.assign(scrollXStore, {
             startIndex: 0,

package/es/table/src/util.js

@@ -97,27 +97,55 @@ export function getRowkey($xeTable) {
     return `${props.rowId || rowOpts.keyField || '_X_ROW_KEY'}`;
 }
 // 行主键 value
-export function getRowid($xetable, row) {
-    const rowid = XEUtils.get(row, getRowkey($xetable));
+export function getRowid($xeTable, row) {
+    const rowid = XEUtils.get(row, getRowkey($xeTable));
     return encodeRowid(rowid);
 }
+export function createHandleUpdateRowId($xeTable) {
+    const rowKey = getRowkey($xeTable);
+    const isDeepKey = rowKey.indexOf('.') > -1;
+    const updateRId = isDeepKey ? updateDeepRowKey : updateFastRowKey;
+    return {
+        rowKey,
+        handleUpdateRowId(row) {
+            return row ? updateRId(row, rowKey) : null;
+        }
+    };
+}
+export function createHandleGetRowId($xeTable) {
+    const rowKey = getRowkey($xeTable);
+    const isDeepKey = rowKey.indexOf('.') > -1;
+    const getRId = isDeepKey ? getDeepRowIdByKey : getFastRowIdByKey;
+    return {
+        rowKey,
+        handleGetRowId(row) {
+            return row ? getRId(row, rowKey) : null;
+        }
+    };
+}
 // 编码行主键
 export function encodeRowid(rowVal) {
     return XEUtils.eqNull(rowVal) ? '' : encodeURIComponent(rowVal);
 }
-export function updateDeepRowKey(row, rowkey) {
-    let rowid = XEUtils.get(row, rowkey);
+function getDeepRowIdByKey(row, rowKey) {
+    return XEUtils.get(row, rowKey);
+}
+export function updateDeepRowKey(row, rowKey) {
+    let rowid = getDeepRowIdByKey(row, rowKey);
     if (eqEmptyValue(rowid)) {
         rowid = getRowUniqueId();
-        XEUtils.set(row, rowkey, rowid);
+        XEUtils.set(row, rowKey, rowid);
     }
     return rowid;
 }
-export function updateFastRowKey(row, rowkey) {
-    let rowid = row[rowkey];
+function getFastRowIdByKey(row, rowKey) {
+    return row[rowKey];
+}
+export function updateFastRowKey(row, rowKey) {
+    let rowid = getFastRowIdByKey(row, rowKey);
     if (eqEmptyValue(rowid)) {
         rowid = getRowUniqueId();
-        row[rowkey] = rowid;
+        row[rowKey] = rowid;
     }
     return rowid;
 }
@@ -160,34 +188,41 @@ export const handleRowidOrRow = ($xeTable, rowidOrRow) => {
 };
 // 组装列配置
 export function assembleColumn(_vm) {
-    const { $el, $xetable, $xecolumn, columnConfig } = _vm;
-    const groupConfig = $xecolumn ? $xecolumn.columnConfig : null;
+    const $xeTable = _vm.$xeTable;
+    const reactData = $xeTable;
+    const { staticColumns } = reactData;
+    const { $el, $xeColumn, columnConfig } = _vm;
+    const groupConfig = $xeColumn ? $xeColumn.columnConfig : null;
     if (groupConfig) {
-        if ($xecolumn.$options._componentTag === 'vxe-table-column') {
-            errLog('vxe.error.groupTag', [`<vxe-table-colgroup title=${$xecolumn.title} ...>`, `<vxe-table-column title=${$xecolumn.title} ...>`]);
+        if ($xeColumn.$options._componentTag === 'vxe-table-column') {
+            errLog('vxe.error.groupTag', [`<vxe-table-colgroup title=${$xeColumn.title} ...>`, `<vxe-table-column title=${$xeColumn.title} ...>`]);
         }
-        else if ($xecolumn.$options._componentTag === 'vxe-column') {
-            warnLog('vxe.error.groupTag', [`<vxe-colgroup title=${$xecolumn.title} ...>`, `<vxe-column title=${$xecolumn.title} ...>`]);
+        else if ($xeColumn.$options._componentTag === 'vxe-column') {
+            warnLog('vxe.error.groupTag', [`<vxe-colgroup title=${$xeColumn.title} ...>`, `<vxe-column title=${$xeColumn.title} ...>`]);
         }
         if (!groupConfig.children) {
             groupConfig.children = [];
         }
-        groupConfig.children.splice(XEUtils.arrayIndexOf($xecolumn.$el.children, $el), 0, columnConfig);
+        groupConfig.children.splice(XEUtils.arrayIndexOf($xeColumn.$el.children, $el), 0, columnConfig);
     }
     else {
-        $xetable.staticColumns.splice(XEUtils.arrayIndexOf($xetable.$refs.hideColumn.children, $el), 0, columnConfig);
+        staticColumns.splice(XEUtils.arrayIndexOf($xeTable.$refs.hideColumn.children, $el), 0, columnConfig);
     }
 }
 // 销毁列
 export function destroyColumn(_vm) {
-    const { $xetable, columnConfig } = _vm;
-    const matchObj = XEUtils.findTree($xetable.staticColumns, column => column === columnConfig);
+    const $xeTable = _vm.$xeTable;
+    const reactData = $xeTable;
+    const { staticColumns } = reactData;
+    const { columnConfig } = _vm;
+    const matchObj = XEUtils.findTree(staticColumns, column => column === columnConfig);
     if (matchObj) {
         matchObj.items.splice(matchObj.index, 1);
     }
 }
-export function getRootColumn($xetable, column) {
-    const fullColumnIdData = $xetable.fullColumnIdData;
+export function getRootColumn($xeTable, column) {
+    const internalData = $xeTable;
+    const { fullColumnIdData } = internalData;
     if (!column) {
         return null;
     }

package/es/toolbar/src/toolbar.js

@@ -663,13 +663,13 @@ export default {
         $xeToolbar.$nextTick(() => {
             const { refresh } = props;
             const refreshOpts = $xeToolbar.computeRefreshOpts;
-            const $xetable = this.fintTable();
+            const $xeTable = this.fintTable();
             const queryMethod = refreshOpts.queryMethod || refreshOpts.query;
             if (refresh && !$xeGrid && !queryMethod) {
                 warnLog('vxe.error.notFunc', ['queryMethod']);
             }
-            if ($xetable) {
-                $xetable.connect(this);
+            if ($xeTable) {
+                $xeTable.connect(this);
             }
             const customOpts = $xeToolbar.computeCustomOpts;
             if (customOpts.isFooter) {

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "3.14.0-beta.9";
+export const version = "3.14.1";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({
@@ -124,6 +124,7 @@ VxeUI.setConfig({
             // remote: false,
             // filterMethod: null,
             // destroyOnClose: false,
+            // isEvery: false,
             showIcon: true
         },
         treeConfig: {

package/es/ui/src/log.js

@@ -1,5 +1,5 @@
 import { VxeUI } from '@vxe-ui/core';
 const { log } = VxeUI;
-const version = `table v${"3.14.0-beta.9"}`;
+const version = `table v${"3.14.1"}`;
 export const warnLog = log.create('warn', version);
 export const errLog = log.create('error', version);