vxe-table 4.11.0-beta.1 → 4.11.0-beta.11

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

@@ -1078,24 +1078,28 @@ hooks.add('tableExportModule', {
              * @param {Object} options 参数
              */
             exportData(options) {
-                const { treeConfig } = props;
-                const { isGroup, tableGroupColumn } = reactData;
+                const { treeConfig, showHeader, showFooter } = props;
+                const { mergeList, mergeFooterList, isGroup, tableGroupColumn } = reactData;
                 const { tableFullColumn, afterFullData } = internalData;
                 const exportOpts = computeExportOpts.value;
                 const treeOpts = computeTreeOpts.value;
+                const proxyOpts = $xeGrid ? $xeGrid.getComputeMaps().computeProxyOpts.value : {};
+                const hasMerge = !!(mergeList.length || mergeFooterList.length);
                 const opts = Object.assign({
+                    message: true,
+                    isHeader: showHeader,
+                    isFooter: showFooter,
+                    isColgroup: isGroup,
+                    isMerge: hasMerge,
+                    useStyle: true,
+                    current: 'current',
+                    modes: ['current', 'selected'].concat(proxyOpts.ajax && proxyOpts.ajax.queryAll ? ['all'] : []),
+                    download: true,
+                    type: 'csv'
                     // filename: '',
                     // sheetName: '',
                     // original: false,
-                    // message: false,
-                    isHeader: true,
-                    isFooter: true,
-                    isColgroup: true,
-                    // isMerge: false,
                     // isAllExpand: false,
-                    download: true,
-                    type: 'csv',
-                    mode: 'current'
                     // data: null,
                     // remote: false,
                     // dataFilterMethod: null,
@@ -1107,7 +1111,22 @@ hooks.add('tableExportModule', {
                 }, exportOpts, options);
                 const { filename, sheetName, type, mode, columns, original, columnFilterMethod, beforeExportMethod, includeFields, excludeFields } = opts;
                 let groups = [];
-                const customCols = columns && columns.length ? columns : null;
+                const customCols = columns && columns.length
+                    ? columns
+                    : XEUtils.searchTree(tableGroupColumn, column => {
+                        const isColGroup = column.children && column.children.length;
+                        let isChecked = false;
+                        if (columns && columns.length) {
+                            isChecked = handleFilterColumns(opts, column, columns);
+                        }
+                        else if (excludeFields || includeFields) {
+                            isChecked = handleFilterFields(opts, column, includeFields, excludeFields);
+                        }
+                        else {
+                            isChecked = column.visible && (isColGroup || defaultFilterExportColumn(column));
+                        }
+                        return isChecked;
+                    }, { children: 'children', mapChildren: 'childNodes', original: true });
                 const handleOptions = Object.assign({}, opts, { filename: '', sheetName: '' });
                 // 如果设置源数据，则默认导出设置了字段的列
                 if (!customCols && !columnFilterMethod) {

package/es/table/render/index.js

@@ -700,6 +700,11 @@ renderer.mixin({
         tableFilterDefaultMethod: handleFilterMethod,
         tableExportMethod: handleExportSelectMethod
     },
+    formatOption: {
+        renderTableDefault(renderOpts, params) {
+            return getCellLabelVNs(renderOpts, params, getSelectCellValue(renderOpts, params));
+        }
+    },
     VxeTreeSelect: {
         tableAutoFocus: 'input',
         renderTableEdit: defaultTableOrTreeSelectEditRender,
@@ -708,6 +713,11 @@ renderer.mixin({
         },
         tableExportMethod: handleExportTreeSelectMethod
     },
+    formatTree: {
+        renderTableDefault(renderOpts, params) {
+            return getCellLabelVNs(renderOpts, params, getTreeSelectCellValue(renderOpts, params));
+        }
+    },
     VxeTableSelect: {
         tableAutoFocus: 'input',
         renderTableEdit: defaultTableOrTreeSelectEditRender,

package/es/table/src/body.js

@@ -563,7 +563,7 @@ export default defineComponent({
             const { slots } = tableContext;
             const { fixedColumn, fixedType, tableColumn } = props;
             const { spanMethod, footerSpanMethod, mouseConfig } = tableProps;
-            const { isGroup, tableData, isRowLoading, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, isDragRowMove, expandColumn, dragRow, dragCol } = tableReactData;
+            const { isGroup, tableData, isRowLoading, isColLoading, overflowX, scrollXLoad, scrollYLoad, isAllOverflow, isDragRowMove, expandColumn, dragRow, dragCol } = tableReactData;
             const { visibleColumn, fullAllDataRowIdData, fullColumnIdData } = tableInternalData;
             const rowOpts = computeRowOpts.value;
             const emptyOpts = computeEmptyOpts.value;
@@ -582,8 +582,10 @@ export default defineComponent({
                     isOptimizeMode = true;
                 }
             }
-            if (fixedType) {
+            if (fixedType || !overflowX) {
                 renderColumnList = visibleColumn;
+            }
+            if (fixedType) {
                 if (isOptimizeMode) {
                     renderColumnList = fixedColumn || [];
                 }

package/es/table/src/cell.js

@@ -735,6 +735,9 @@ export const Cell = {
                     class: ['vxe-table--expanded', {
                             'is--active': isActive
                         }],
+                    onMousedown(evnt) {
+                        evnt.stopPropagation();
+                    },
                     onClick(evnt) {
                         $table.triggerRowExpandEvent(evnt, params);
                     }

package/es/table/src/footer.js

@@ -245,7 +245,7 @@ export default defineComponent({
             const { fixedType, fixedColumn, tableColumn } = props;
             const { spanMethod, footerSpanMethod, showFooterOverflow: allColumnFooterOverflow } = tableProps;
             const { visibleColumn, fullColumnIdData } = tableInternalData;
-            const { isGroup, scrollXLoad, scrollYLoad, dragCol } = tableReactData;
+            const { isGroup, overflowX, scrollXLoad, scrollYLoad, dragCol } = tableReactData;
             let renderColumnList = tableColumn;
             let isOptimizeMode = false;
             // 如果是使用优化模式
@@ -257,8 +257,10 @@ export default defineComponent({
                     isOptimizeMode = true;
                 }
             }
-            if (fixedType) {
+            if (fixedType || !overflowX) {
                 renderColumnList = visibleColumn;
+            }
+            if (fixedType) {
                 if (isOptimizeMode) {
                     renderColumnList = fixedColumn || [];
                 }

package/es/table/src/header.js

@@ -127,8 +127,8 @@ export default defineComponent({
                             'is--sortable': column.sortable,
                             'col--filter': !!filters,
                             'is--filter-active': hasFilter,
-                            'is--drag-active': !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
-                            'is--drag-disabled': isDisabledDrag,
+                            'is--drag-active': columnOpts.drag && !column.fixed && !isDisabledDrag && (isCrossDrag || isPeerDrag || !column.parentId),
+                            'is--drag-disabled': columnOpts.drag && isDisabledDrag,
                             'col--current': currentColumn === column
                         },
                         headerClassName ? (XEUtils.isFunction(headerClassName) ? headerClassName(cellParams) : headerClassName) : '',
@@ -199,7 +199,7 @@ export default defineComponent({
         const renderVN = () => {
             const { fixedType, fixedColumn, tableColumn } = props;
             const { mouseConfig, showHeaderOverflow: allColumnHeaderOverflow, spanMethod, footerSpanMethod } = tableProps;
-            const { isGroup, scrollXLoad, scrollYLoad, dragCol } = tableReactData;
+            const { isGroup, overflowX, scrollXLoad, scrollYLoad, dragCol } = tableReactData;
             const { visibleColumn, fullColumnIdData } = tableInternalData;
             const mouseOpts = computeMouseOpts.value;
             let renderHeaderList = headerColumn.value;
@@ -218,8 +218,10 @@ export default defineComponent({
                         isOptimizeMode = true;
                     }
                 }
-                if (fixedType) {
+                if (fixedType || !overflowX) {
                     renderColumnList = visibleColumn;
+                }
+                if (fixedType) {
                     // 如果是使用优化模式
                     if (isOptimizeMode) {
                         renderColumnList = fixedColumn || [];

package/es/table/src/table.js

@@ -1142,6 +1142,7 @@ export default defineComponent({
             const fullColumnIdData = internalData.fullColumnIdData = {};
             const fullColumnFieldData = internalData.fullColumnFieldData = {};
             const mouseOpts = computeMouseOpts.value;
+            const expandOpts = computeExpandOpts.value;
             const columnOpts = computeColumnOpts.value;
             const columnDragOpts = computeColumnDragOpts.value;
             const { isCrossDrag, isSelfToChildDrag } = columnDragOpts;
@@ -1231,10 +1232,8 @@ export default defineComponent({
             else {
                 tableFullColumn.forEach(handleFunc);
             }
-            if (process.env.NODE_ENV === 'development') {
-                if (expandColumn && mouseOpts.area) {
-                    errLog('vxe.error.errConflicts', ['mouse-config.area', 'column.type=expand']);
-                }
+            if ((expandColumn && expandOpts.mode !== 'fixed') && mouseOpts.area) {
+                errLog('vxe.error.errConflicts', ['mouse-config.area', 'column.type=expand']);
             }
             if (process.env.NODE_ENV === 'development') {
                 if (htmlColumn) {
@@ -1475,6 +1474,7 @@ export default defineComponent({
             };
         };
         const updateAfterListIndex = () => {
+            const { treeConfig } = props;
             const { afterFullData, fullDataRowIdData, fullAllDataRowIdData } = internalData;
             const fullMaps = {};
             afterFullData.forEach((row, index) => {
@@ -1482,7 +1482,9 @@ export default defineComponent({
                 const rowRest = fullAllDataRowIdData[rowid];
                 const seq = index + 1;
                 if (rowRest) {
-                    rowRest.seq = seq;
+                    if (!treeConfig) {
+                        rowRest.seq = seq;
+                    }
                     rowRest._index = index;
                 }
                 else {
@@ -2472,7 +2474,10 @@ export default defineComponent({
                             delete rExpandLazyLoadedMaps[rowid];
                         }
                         reactData.rowExpandLazyLoadedMaps = rExpandLazyLoadedMaps;
-                        nextTick().then(() => tableMethods.recalculate()).then(() => resolve());
+                        nextTick()
+                            .then(() => $xeTable.recalculate())
+                            .then(() => $xeTable.updateCellAreas())
+                            .then(() => resolve());
                     });
                 }
                 else {
@@ -2950,6 +2955,7 @@ export default defineComponent({
             });
         };
         const handleColumn = (collectColumn) => {
+            const expandOpts = computeExpandOpts.value;
             internalData.collectColumn = collectColumn;
             const tableFullColumn = getColumnList(collectColumn);
             internalData.tableFullColumn = tableFullColumn;
@@ -2957,6 +2963,7 @@ export default defineComponent({
             reactData.isDragColMove = false;
             initColumnSort();
             return Promise.resolve(restoreCustomStorage()).then(() => {
+                const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
                 cacheColumnMap();
                 parseColumns(true).then(() => {
                     if (reactData.scrollXLoad) {
@@ -2966,11 +2973,9 @@ export default defineComponent({
                 $xeTable.clearMergeCells();
                 $xeTable.clearMergeFooterItems();
                 $xeTable.handleTableData(true);
-                // if (process.env.NODE_ENV === 'development') {
-                //   if ((reactData.scrollXLoad || reactData.scrollYLoad) && reactData.expandColumn) {
-                //     warnLog('vxe.error.scrollErrProp', ['column.type=expand'])
-                //   }
-                // }
+                if ((scrollXLoad || scrollYLoad) && (expandColumn && expandOpts.mode !== 'fixed')) {
+                    warnLog('vxe.error.scrollErrProp', ['column.type=expand']);
+                }
                 return nextTick().then(() => {
                     if ($xeToolbar) {
                         $xeToolbar.syncUpdate({
@@ -3342,6 +3347,14 @@ export default defineComponent({
                 }
             }
         };
+        const handleRowExpandScroll = () => {
+            const { elemStore } = internalData;
+            const rowExpandEl = refRowExpandElem.value;
+            const bodyScrollElem = getRefElem(elemStore['main-body-scroll']);
+            if (rowExpandEl && bodyScrollElem) {
+                rowExpandEl.scrollTop = bodyScrollElem.scrollTop;
+            }
+        };
         tableMethods = {
             dispatchEvent,
             /**
@@ -5076,14 +5089,14 @@ export default defineComponent({
              * @param {Boolean} expanded 是否展开
              */
             setRowExpand(rows, expanded) {
-                const { rowExpandedMaps, rowExpandLazyLoadedMaps, expandColumn: column } = reactData;
+                const { rowExpandedMaps, rowExpandLazyLoadedMaps, expandColumn } = reactData;
                 const { fullAllDataRowIdData } = internalData;
                 let rExpandedMaps = Object.assign({}, rowExpandedMaps);
                 const expandOpts = computeExpandOpts.value;
                 const { reserve, lazy, accordion, toggleMethod } = expandOpts;
                 const lazyRests = [];
-                const columnIndex = tableMethods.getColumnIndex(column);
-                const $columnIndex = tableMethods.getVMColumnIndex(column);
+                const columnIndex = $xeTable.getColumnIndex(expandColumn);
+                const $columnIndex = $xeTable.getVMColumnIndex(expandColumn);
                 if (rows) {
                     if (!XEUtils.isArray(rows)) {
                         rows = [rows];
@@ -5093,7 +5106,7 @@ export default defineComponent({
                         rExpandedMaps = {};
                         rows = rows.slice(rows.length - 1, rows.length);
                     }
-                    const validRows = toggleMethod ? rows.filter((row) => toggleMethod({ $table: $xeTable, expanded, column, columnIndex, $columnIndex, row, rowIndex: tableMethods.getRowIndex(row), $rowIndex: tableMethods.getVMRowIndex(row) })) : rows;
+                    const validRows = toggleMethod ? rows.filter((row) => toggleMethod({ $table: $xeTable, expanded, column: expandColumn, columnIndex, $columnIndex, row, rowIndex: tableMethods.getRowIndex(row), $rowIndex: tableMethods.getVMRowIndex(row) })) : rows;
                     if (expanded) {
                         validRows.forEach((row) => {
                             const rowid = getRowid($xeTable, row);
@@ -5122,7 +5135,15 @@ export default defineComponent({
                     }
                 }
                 reactData.rowExpandedMaps = rExpandedMaps;
-                return Promise.all(lazyRests).then(() => tableMethods.recalculate());
+                return Promise.all(lazyRests)
+                    .then(() => $xeTable.recalculate())
+                    .then(() => {
+                    if (expandColumn) {
+                        updateRowExpandStyle();
+                        handleRowExpandScroll();
+                    }
+                    return $xeTable.updateCellAreas();
+                });
             },
             /**
              * 判断行是否为展开状态
@@ -5156,7 +5177,7 @@ export default defineComponent({
                     if (expList.length) {
                         tableMethods.recalculate();
                     }
-                });
+                }).then(() => $xeTable.updateCellAreas());
             },
             clearRowExpandReserve() {
                 internalData.rowExpandedReserveRowMap = {};
@@ -5576,8 +5597,8 @@ export default defineComponent({
             updateCellAreas() {
                 const { mouseConfig } = props;
                 const mouseOpts = computeMouseOpts.value;
-                if (mouseConfig && mouseOpts.area && $xeTable.handleRecalculateCellAreas) {
-                    return $xeTable.handleRecalculateCellAreas();
+                if (mouseConfig && mouseOpts.area && $xeTable.handleRecalculateCellAreaEvent) {
+                    return $xeTable.handleRecalculateCellAreaEvent();
                 }
                 return nextTick();
             },
@@ -7204,7 +7225,7 @@ export default defineComponent({
                         const isSelected = sLen >= vLen;
                         const halfSelect = !isSelected && (sLen >= 1 || hLen >= 1);
                         if (checkField) {
-                            XEUtils.get(row, checkField, isSelected);
+                            XEUtils.set(row, checkField, isSelected);
                         }
                         if (isSelected) {
                             if (!checkField) {
@@ -7277,7 +7298,7 @@ export default defineComponent({
                         }
                         vLen++;
                     });
-                const isSelected = vLen > 0 ? sLen >= vLen : sLen >= rootList.length;
+                const isSelected = rootList.length > 0 ? (vLen > 0 ? (sLen >= vLen) : (sLen >= rootList.length)) : false;
                 const halfSelect = !isSelected && (sLen >= 1 || hLen >= 1);
                 reactData.isAllSelected = isSelected;
                 reactData.isIndeterminate = halfSelect;
@@ -8926,7 +8947,7 @@ export default defineComponent({
             updateScrollYStatus,
             // 更新横向 X 可视渲染上下剩余空间大小
             updateScrollXSpace() {
-                const { isGroup, scrollXLoad } = reactData;
+                const { isGroup, scrollXLoad, overflowX } = reactData;
                 const { visibleColumn, scrollXStore, elemStore, tableWidth } = internalData;
                 const tableHeader = refTableHeader.value;
                 const tableBody = refTableBody.value;
@@ -8940,7 +8961,7 @@ export default defineComponent({
                     const footerElem = tableFooterElem ? tableFooterElem.querySelector('.vxe-table--footer') : null;
                     const leftSpaceWidth = visibleColumn.slice(0, scrollXStore.startIndex).reduce((previous, column) => previous + column.renderWidth, 0);
                     let marginLeft = '';
-                    if (scrollXLoad) {
+                    if (scrollXLoad && overflowX) {
                         marginLeft = `${leftSpaceWidth}px`;
                     }
                     if (headerElem) {
@@ -9749,7 +9770,8 @@ export default defineComponent({
                 warnLog('vxe.error.errLargeData', ['loadData(data), reloadData(data)']);
             }
             loadTableData(value, true).then(() => {
-                // const { scrollXLoad, scrollYLoad, expandColumn } = reactData
+                const { scrollXLoad, scrollYLoad, expandColumn } = reactData;
+                const expandOpts = computeExpandOpts.value;
                 internalData.inited = true;
                 internalData.initStatus = true;
                 if (!initStatus) {
@@ -9760,9 +9782,9 @@ export default defineComponent({
                 // if (checkboxColumn && internalData.tableFullData.length > 300 && !checkboxOpts.checkField) {
                 //   warnLog('vxe.error.checkProp', ['checkbox-config.checkField'])
                 // }
-                // if ((scrollXLoad || scrollYLoad) && expandColumn) {
-                //   warnLog('vxe.error.scrollErrProp', ['column.type=expand'])
-                // }
+                if ((scrollXLoad || scrollYLoad) && (expandColumn && expandOpts.mode !== 'fixed')) {
+                    warnLog('vxe.error.scrollErrProp', ['column.type=expand']);
+                }
                 return tableMethods.recalculate();
             });
         });
@@ -9806,6 +9828,12 @@ export default defineComponent({
         watch(() => props.showFooter, () => {
             reScrollFlag.value++;
         });
+        watch(() => reactData.overflowX, () => {
+            reScrollFlag.value++;
+        });
+        watch(() => reactData.overflowY, () => {
+            reScrollFlag.value++;
+        });
         watch(reScrollFlag, () => {
             nextTick(() => {
                 tableMethods.recalculate(true).then(() => tableMethods.refreshScroll());

package/es/table/style.css

@@ -1940,7 +1940,7 @@
   display: none;
   position: absolute;
   pointer-events: none;
-  z-index: 1;
+  z-index: 6;
 }
 
 .vxe-table--header-wrapper .vxe-table--cell-col-status-area {