vxe-table 4.15.0-beta.14 → 4.15.0-beta.16

package/es/table/module/custom/hook.js

@@ -1,6 +1,7 @@
 import { nextTick } from 'vue';
 import { VxeUI } from '../../../ui';
 import XEUtils from 'xe-utils';
+import { getColumnList } from '../../src/util';
 const tableCustomMethodKeys = ['openCustom', 'closeCustom', 'toggleCustom', 'saveCustom', 'cancelCustom', 'resetCustom', 'toggleCustomAllCheckbox', 'setCustomAllCheckbox'];
 VxeUI.hooks.add('tableCustomModule', {
     setupTable($xeTable) {
@@ -101,23 +102,22 @@ VxeUI.hooks.add('tableCustomModule', {
                 }
             });
             reactData.isCustomStatus = true;
-            return $xeTable.saveCustomStore('confirm').then(() => {
-                if (allowGroup && !!$xeTable.handlePivotTableAggregateData) {
-                    if (rowGroupList.length !== aggHandleFields.length || rowGroupList.some((conf, i) => conf.field !== aggHandleFields[i])) {
-                        // 更新数据分组
-                        if (aggHandleFields.length) {
-                            $xeTable.setRowGroups(aggHandleFields);
-                        }
-                        else {
-                            $xeTable.clearRowGroups();
-                        }
+            if (allowGroup && !!$xeTable.handlePivotTableAggregateData) {
+                if (rowGroupList.length !== aggHandleFields.length || rowGroupList.some((conf, i) => conf.field !== aggHandleFields[i])) {
+                    // 更新数据分组
+                    if (aggHandleFields.length) {
+                        $xeTable.setRowGroups(aggHandleFields);
                     }
-                    else if (allowValues) {
-                        // 更新聚合函数
-                        $xeTable.handleUpdateAggData();
+                    else {
+                        $xeTable.clearRowGroups();
                     }
                 }
-            });
+                else if (allowValues) {
+                    // 更新聚合函数
+                    $xeTable.handleUpdateAggData();
+                }
+            }
+            return $xeTable.saveCustomStore('confirm');
         };
         const cancelCustom = () => {
             const { customColumnList, customStore } = reactData;
@@ -202,6 +202,7 @@ VxeUI.hooks.add('tableCustomModule', {
                     sort: options === true,
                     aggFunc: options === true
                 }, options);
+                const allCols = [];
                 XEUtils.eachTree(collectColumn, (column) => {
                     if (opts.resizable) {
                         column.resizeWidth = 0;
@@ -211,6 +212,7 @@ VxeUI.hooks.add('tableCustomModule', {
                     }
                     if (opts.sort) {
                         column.renderSortNumber = column.sortNumber;
+                        column.parentId = column.defaultParentId;
                     }
                     if (!checkMethod || checkMethod({ $table: $xeTable, column })) {
                         column.visible = column.defaultVisible;
@@ -220,9 +222,14 @@ VxeUI.hooks.add('tableCustomModule', {
                         column.renderAggFn = column.defaultAggFunc;
                     }
                     column.renderResizeWidth = column.renderWidth;
+                    allCols.push(column);
                 });
+                if (opts.sort) {
+                    const newCollectCols = XEUtils.toArrayTree(XEUtils.orderBy(allCols, 'renderSortNumber'), { key: 'id', parentKey: 'parentId', children: 'children' });
+                    internalData.collectColumn = newCollectCols;
+                    internalData.tableFullColumn = getColumnList(newCollectCols);
+                }
                 reactData.isCustomStatus = false;
-                $xeTable.saveCustomStore('reset');
                 return $xeTable.handleCustom().then(() => {
                     if (opts.aggFunc && $xeTable.handlePivotTableAggregateData) {
                         const rowGroupFields = computeRowGroupFields.value;
@@ -238,6 +245,7 @@ VxeUI.hooks.add('tableCustomModule', {
                             $xeTable.handleUpdateAggData();
                         }
                     }
+                    $xeTable.saveCustomStore('reset');
                 });
             },
             toggleCustomAllCheckbox() {

package/es/table/src/columnInfo.js

@@ -112,9 +112,11 @@ export class ColumnInfo {
             parentId: null,
             visible,
             // 内部属性（一旦被使用，将导致不可升级版本）
+            defaultParentId: null,
             halfVisible: false,
             defaultVisible: visible,
             defaultFixed: _vm.fixed,
+            defaultAggGroup: _vm.aggGroup,
             defaultAggFunc: _vm.aggFunc,
             checked: false,
             halfChecked: false,

package/es/table/src/table.js

@@ -4,7 +4,7 @@ import XEUtils from 'xe-utils';
 import { initTpImg, getTpImg, isPx, isScale, hasClass, addClass, removeClass, getEventTargetNode, getPaddingTopBottomSize, setScrollTop, setScrollLeft, toCssUnit, hasControlKey } from '../../ui/src/dom';
 import { getLastZIndex, nextZIndex, hasChildrenList, getFuncText, isEnableConf, formatText, eqEmptyValue } from '../../ui/src/utils';
 import { VxeUI } from '../../ui';
-import { getRowUniqueId, clearTableAllStatus, toFilters, hasDeepKey, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getRefElem, getColReMinWidth, createHandleUpdateRowId, createHandleGetRowId, getCalcHeight, getCellRestHeight } from './util';
+import { getRowUniqueId, clearTableAllStatus, getColumnList, toFilters, hasDeepKey, getRowkey, getRowid, rowToVisible, colToVisible, getCellValue, setCellValue, handleRowidOrRow, handleFieldOrColumn, toTreePathSeq, restoreScrollLocation, getRootColumn, getRefElem, getColReMinWidth, createHandleUpdateRowId, createHandleGetRowId, getCalcHeight, getCellRestHeight } from './util';
 import { getSlotVNs } from '../../ui/src/vn';
 import { moveRowAnimateToTb, clearRowAnimate, moveColAnimateToLr, clearColAnimate } from './anime';
 import { warnLog, errLog } from '../../ui/src/log';
@@ -1416,35 +1416,88 @@ export default defineVxeComponent({
             return num;
         };
         const handleCustomRestore = (storeData) => {
-            let { collectColumn } = internalData;
-            const { resizableData, sortData, visibleData, fixedData } = storeData;
-            let hasCustomSort = false;
+            const { aggregateConfig, rowGroupConfig } = props;
+            const { collectColumn } = internalData;
+            const customOpts = computeCustomOpts.value;
+            const { storage, storeOptions } = customOpts;
+            const isAllCustom = storage === true;
+            const storageOpts = isAllCustom ? {} : Object.assign({}, storage || {}, storeOptions);
+            const isCustomResizable = hangleStorageDefaultValue(storageOpts.resizable, isAllCustom);
+            const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom);
+            const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom);
+            const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom);
+            const isCustomAggGroup = hangleStorageDefaultValue(storageOpts.aggGroup, isAllCustom);
+            const isCustomAggFunc = hangleStorageDefaultValue(storageOpts.aggFunc, isAllCustom);
+            let { resizableData, sortData, visibleData, fixedData, aggGroupData, aggFuncData } = storeData;
             // 处理还原
-            if (resizableData || sortData || visibleData || fixedData) {
+            if ((isCustomResizable && resizableData) || (isCustomSort && sortData) || (isCustomVisible && visibleData) || (isCustomFixed && fixedData) || (isCustomAggGroup && aggGroupData) || (isCustomAggFunc && aggFuncData)) {
+                const sortColMaps = {};
+                if (isCustomSort && sortData) {
+                    // 转换兼容老版本数据，即将废弃兼容
+                    if (!XEUtils.isArray(sortData)) {
+                        const sortRests = [];
+                        XEUtils.each(sortData, (index, colKey) => {
+                            sortRests.push({ key: colKey, index });
+                        });
+                        sortData = XEUtils.orderBy(sortRests, { field: 'index', order: 'asc' }).map(item => ({ k: item.key }));
+                    }
+                    let colNum = 1;
+                    XEUtils.eachTree(sortData, (sObj, index, sOjs, path, pSObj) => {
+                        sortColMaps[sObj.k] = {
+                            key: sObj.k,
+                            sNum: colNum++,
+                            pKey: pSObj ? pSObj.k : null
+                        };
+                    }, { children: 'c' });
+                }
+                const colKeyMaps = {};
+                const allCols = [];
+                const aggGroupConfs = [];
                 XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
                     const colKey = column.getKey();
                     // 支持一级
                     if (!parentColumn) {
-                        if (fixedData && fixedData[colKey] !== undefined) {
+                        if (isCustomFixed && fixedData && fixedData[colKey] !== undefined) {
                             column.fixed = fixedData[colKey];
                         }
-                        if (sortData && XEUtils.isNumber(sortData[colKey])) {
-                            hasCustomSort = true;
-                            column.renderSortNumber = sortData[colKey];
-                        }
                     }
-                    if (resizableData && XEUtils.isNumber(resizableData[colKey])) {
+                    if (isCustomResizable && resizableData && XEUtils.isNumber(resizableData[colKey])) {
                         column.resizeWidth = resizableData[colKey];
                     }
-                    if (visibleData && XEUtils.isBoolean(visibleData[colKey])) {
+                    if (isCustomVisible && visibleData && XEUtils.isBoolean(visibleData[colKey])) {
                         column.visible = visibleData[colKey];
                     }
+                    if (isCustomAggFunc && aggFuncData && (aggregateConfig || rowGroupConfig) && aggFuncData[colKey]) {
+                        column.aggFunc = aggFuncData[colKey];
+                    }
+                    if (isCustomAggGroup && aggGroupData && aggGroupData[colKey]) {
+                        aggGroupConfs.push({ field: column.field });
+                    }
+                    colKeyMaps[colKey] = column;
+                    allCols.push(column);
                 });
+                if ((aggregateConfig || rowGroupConfig) && aggGroupConfs.length) {
+                    const groupRest = handleGroupData(internalData.tableFullData, aggGroupConfs);
+                    internalData.tableFullTreeData = [];
+                    internalData.tableFullGroupData = groupRest.treeData;
+                    reactData.isRowGroupStatus = true;
+                    reactData.rowGroupList = aggGroupConfs;
+                    $xeTable.cacheRowMap(false);
+                }
                 // 如果自定义了顺序
-                if (hasCustomSort) {
-                    collectColumn = XEUtils.orderBy(collectColumn, 'renderSortNumber');
-                    internalData.collectColumn = collectColumn;
-                    internalData.tableFullColumn = getColumnList(collectColumn);
+                if (isCustomSort && sortData) {
+                    allCols.forEach(column => {
+                        const colKey = column.getKey();
+                        const scItem = sortColMaps[colKey];
+                        if (scItem) {
+                            const parentColumn = scItem.pKey ? colKeyMaps[scItem.pKey] : null;
+                            column.parentId = parentColumn ? parentColumn.id : null;
+                            column.renderSortNumber = scItem.sNum;
+                        }
+                    });
+                    const newCollectCols = XEUtils.toArrayTree(XEUtils.orderBy(allCols, 'renderSortNumber'), { key: 'id', parentKey: 'parentId', children: 'children' });
+                    internalData.collectColumn = newCollectCols;
+                    internalData.tableFullColumn = getColumnList(newCollectCols);
                 }
                 reactData.isCustomStatus = true;
             }
@@ -1466,8 +1519,9 @@ export default defineVxeComponent({
             const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom);
             const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom);
             const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom);
+            const isCustomAggGroup = hangleStorageDefaultValue(storageOpts.aggGroup, isAllCustom);
             const isCustomAggFunc = hangleStorageDefaultValue(storageOpts.aggFunc, isAllCustom);
-            if (storage && (customConfig ? isEnableConf(customOpts) : customOpts.enabled) && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomSort || isCustomAggFunc)) {
+            if (storage && (customConfig ? isEnableConf(customOpts) : customOpts.enabled) && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomSort || isCustomAggGroup || isCustomAggFunc)) {
                 if (!tableId) {
                     errLog('vxe.error.reqProp', ['id']);
                     return;
@@ -3102,18 +3156,18 @@ export default defineVxeComponent({
             reactData.aggHandleAggColumns = aggCols;
         };
         const handleUpdateRowGroup = (groupFields) => {
-            const aggFields = [];
-            const aggConfs = [];
+            const aggGroupFields = [];
+            const aggGroupConfs = [];
             if (groupFields) {
                 (XEUtils.isArray(groupFields) ? groupFields : [groupFields]).forEach(field => {
-                    aggFields.push(field);
-                    aggConfs.push({
+                    aggGroupFields.push(field);
+                    aggGroupConfs.push({
                         field
                     });
                 });
             }
-            reactData.rowGroupList = aggConfs;
-            reactData.aggHandleFields = aggFields;
+            reactData.rowGroupList = aggGroupConfs;
+            reactData.aggHandleFields = aggGroupFields;
             handleUpdateAggValues();
         };
         const handleeGroupSummary = (aggList) => {
@@ -3476,14 +3530,6 @@ export default defineVxeComponent({
             }
             $xeTable.closeTooltip();
         };
-        // 获取所有的列，排除分组
-        const getColumnList = (columns) => {
-            const result = [];
-            columns.forEach((column) => {
-                result.push(...(column.children && column.children.length ? getColumnList(column.children) : [column]));
-            });
-            return result;
-        };
         const parseColumns = (isReset) => {
             // const { showOverflow } = props
             // const rowOpts = computeRowOpts.value
@@ -3503,7 +3549,7 @@ export default defineVxeComponent({
                     if (parentColumn && parentColumn.fixed) {
                         column.fixed = parentColumn.fixed;
                     }
-                    if (parentColumn && column.fixed !== parentColumn.fixed) {
+                    if (parentColumn && (column.fixed || '') !== (parentColumn.fixed || '')) {
                         errLog('vxe.error.groupFixed');
                     }
                     if (isColGroup) {
@@ -3614,21 +3660,25 @@ export default defineVxeComponent({
             }
             return $xeTable.updateFooter();
         };
-        const initColumnSort = () => {
+        const initColumnHierarchy = () => {
             const { collectColumn } = internalData;
-            collectColumn.forEach((column, index) => {
-                const sortIndex = index + 1;
+            let sortIndex = 1;
+            XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
+                const parentId = parentColumn ? parentColumn.id : null;
+                column.parentId = parentId;
+                column.defaultParentId = parentId;
                 column.sortNumber = sortIndex;
                 column.renderSortNumber = sortIndex;
+                sortIndex++;
             });
         };
-        const handleColumn = (collectColumn) => {
+        const handleInitColumn = (collectColumn) => {
             const expandOpts = computeExpandOpts.value;
             internalData.collectColumn = collectColumn;
             const tableFullColumn = getColumnList(collectColumn);
             internalData.tableFullColumn = tableFullColumn;
             reactData.isColLoading = true;
-            initColumnSort();
+            initColumnHierarchy();
             return Promise.resolve(restoreCustomStorage()).then(() => {
                 const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
                 cacheColumnMap();
@@ -4351,7 +4401,7 @@ export default defineVxeComponent({
             loadColumn(columns) {
                 const { lastScrollLeft, lastScrollTop } = internalData;
                 const collectColumn = XEUtils.mapTree(columns, column => reactive(Cell.createColumn($xeTable, column)));
-                return handleColumn(collectColumn).then(() => {
+                return handleInitColumn(collectColumn).then(() => {
                     let targetScrollLeft = lastScrollLeft;
                     let targetScrollTop = lastScrollTop;
                     const virtualXOpts = computeVirtualXOpts.value;
@@ -6768,7 +6818,8 @@ export default defineVxeComponent({
             getCustomStoreData() {
                 const { id } = props;
                 const customOpts = computeCustomOpts.value;
-                const { collectColumn } = internalData;
+                const { isRowGroupStatus, rowGroupList } = reactData;
+                const { fullColumnFieldData, collectColumn } = internalData;
                 const { storage, checkMethod, storeOptions } = customOpts;
                 const isAllCustom = storage === true;
                 const storageOpts = isAllCustom ? {} : Object.assign({}, storage || {}, storeOptions);
@@ -6776,17 +6827,20 @@ export default defineVxeComponent({
                 const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom);
                 const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom);
                 const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom);
+                const isCustomAggGroup = hangleStorageDefaultValue(storageOpts.aggGroup, isAllCustom);
                 const isCustomAggFunc = hangleStorageDefaultValue(storageOpts.aggFunc, isAllCustom);
                 const resizableData = {};
-                const sortData = {};
+                const sortData = [];
                 const visibleData = {};
                 const fixedData = {};
+                const aggGroupData = {};
                 const aggFuncData = {};
                 const storeData = {
                     resizableData: undefined,
                     sortData: undefined,
                     visibleData: undefined,
                     fixedData: undefined,
+                    aggGroupData: undefined,
                     aggFuncData: undefined
                 };
                 if (!id) {
@@ -6800,19 +6854,37 @@ export default defineVxeComponent({
                 let hasFixed = 0;
                 let hasVisible = 0;
                 let hasAggFunc = 0;
+                const sortMaps = {};
                 XEUtils.eachTree(collectColumn, (column, index, items, path, parentColumn) => {
                     const colKey = column.getKey();
                     if (!colKey) {
                         errLog('vxe.error.reqProp', [`${column.getTitle() || column.type || ''} -> column.field=?`]);
                         return;
                     }
-                    // 只支持一级
-                    if (!parentColumn) {
+                    if (parentColumn) {
                         if (isCustomSort) {
+                            const pColKey = parentColumn.getKey();
+                            const psObj = sortMaps[pColKey];
                             hasSort = 1;
-                            sortData[colKey] = column.renderSortNumber;
+                            if (psObj) {
+                                const sObj = { k: colKey };
+                                sortMaps[colKey] = sObj;
+                                if (!psObj.c) {
+                                    psObj.c = [];
+                                }
+                                psObj.c.push(sObj);
+                            }
                         }
-                        if (isCustomFixed && column.fixed !== column.defaultFixed) {
+                    }
+                    else {
+                        if (isCustomSort) {
+                            hasSort = 1;
+                            const sObj = { k: colKey };
+                            sortMaps[colKey] = sObj;
+                            sortData.push(sObj);
+                        }
+                        // 只支持一级
+                        if (isCustomFixed && (column.fixed || '') !== (column.defaultFixed || '')) {
                             hasFixed = 1;
                             fixedData[colKey] = column.fixed;
                         }
@@ -6831,7 +6903,7 @@ export default defineVxeComponent({
                             visibleData[colKey] = true;
                         }
                     }
-                    if (isCustomAggFunc && column.aggFunc !== column.defaultAggFunc) {
+                    if (isCustomAggFunc && (column.aggFunc || '') !== (column.defaultAggFunc || '')) {
                         hasAggFunc = 1;
                         aggFuncData[colKey] = column.aggFunc;
                     }
@@ -6848,6 +6920,15 @@ export default defineVxeComponent({
                 if (hasVisible) {
                     storeData.visibleData = visibleData;
                 }
+                if (isCustomAggGroup && isRowGroupStatus) {
+                    rowGroupList.forEach(aggConf => {
+                        const colRest = fullColumnFieldData[aggConf.field];
+                        if (colRest) {
+                            aggGroupData[colRest.column.getKey()] = true;
+                        }
+                    });
+                    storeData.aggGroupData = aggGroupData;
+                }
                 if (hasAggFunc) {
                     storeData.aggFuncData = aggFuncData;
                 }
@@ -8297,12 +8378,13 @@ export default defineVxeComponent({
                 const isCustomVisible = hangleStorageDefaultValue(storageOpts.visible, isAllCustom);
                 const isCustomFixed = hangleStorageDefaultValue(storageOpts.fixed, isAllCustom);
                 const isCustomSort = hangleStorageDefaultValue(storageOpts.sort, isAllCustom);
+                const isCustomAggGroup = hangleStorageDefaultValue(storageOpts.aggGroup, isAllCustom);
                 const isCustomAggFunc = hangleStorageDefaultValue(storageOpts.aggFunc, isAllCustom);
                 if (type !== 'reset') {
                     // fix：修复拖动列宽，重置按钮无法点击的问题
                     reactData.isCustomStatus = true;
                 }
-                if (storage && (customConfig ? isEnableConf(customOpts) : customOpts.enabled) && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomSort || isCustomAggFunc)) {
+                if (storage && (customConfig ? isEnableConf(customOpts) : customOpts.enabled) && (isCustomResizable || isCustomVisible || isCustomFixed || isCustomSort || isCustomAggGroup || isCustomAggFunc)) {
                     if (!tableId) {
                         errLog('vxe.error.reqProp', ['id']);
                         return nextTick();
@@ -8310,9 +8392,11 @@ export default defineVxeComponent({
                     const storeData = type === 'reset'
                         ? {
                             resizableData: {},
-                            sortData: {},
+                            sortData: [],
                             visibleData: {},
-                            fixedData: {}
+                            fixedData: {},
+                            aggGroupData: {},
+                            aggFuncData: {}
                         }
                         : tableMethods.getCustomStoreData();
                     if (updateStore) {
@@ -11585,7 +11669,7 @@ export default defineVxeComponent({
             staticColumnFlag.value++;
         });
         watch(staticColumnFlag, () => {
-            handleColumn(XEUtils.clone(reactData.staticColumns));
+            nextTick(() => handleInitColumn(XEUtils.clone(reactData.staticColumns)));
         });
         const tableColumnFlag = ref(0);
         watch(() => reactData.tableColumn.length, () => {

package/es/table/src/util.js

@@ -291,6 +291,14 @@ export function getColReMinWidth(params) {
 export function isColumnInfo(column) {
     return column && (column.constructor === ColumnInfo || column instanceof ColumnInfo);
 }
+// 获取所有的列，排除分组
+export function getColumnList(columns) {
+    const result = [];
+    columns.forEach((column) => {
+        result.push(...(column.children && column.children.length ? getColumnList(column.children) : [column]));
+    });
+    return result;
+}
 export function createColumn($xeTable, options, renderOptions) {
     return isColumnInfo(options) ? options : reactive(new ColumnInfo($xeTable, options, renderOptions));
 }
@@ -317,6 +325,7 @@ export function assembleColumn($xeTable, elem, column, colgroup) {
     const parentColumn = colgroup ? colgroup.columnConfig : null;
     const parentCols = parentColumn ? parentColumn.children : staticColumns;
     if (parentElem && parentCols) {
+        column.defaultParentId = parentColumn ? parentColumn.id : null;
         parentCols.splice(XEUtils.arrayIndexOf(parentElem.children, elem), 0, column);
         reactData.staticColumns = staticColumns.slice(0);
     }

package/es/ui/index.js

@@ -1,6 +1,6 @@
 import { VxeUI } from '@vxe-ui/core';
 import { getFuncText } from './src/utils';
-export const version = "4.15.0-beta.14";
+export const version = "4.15.0-beta.16";
 VxeUI.version = version;
 VxeUI.tableVersion = version;
 VxeUI.setConfig({

package/es/ui/src/log.js

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