vxe-table 3.16.0-beta.0 → 3.16.0-beta.2

package/es/table/module/keyboard/mixin.js

@@ -352,8 +352,8 @@ export default {
         handleCellMousedownEvent(evnt, params) {
             const $xeTable = this;
             const { editConfig, editOpts, handleSelected, checkboxConfig, checkboxOpts, mouseConfig, mouseOpts } = this;
-            if (mouseConfig && mouseOpts.area && $xeTable.triggerCellAreaMousedownEvent) {
-                return $xeTable.triggerCellAreaMousedownEvent(evnt, params);
+            if (mouseConfig && mouseOpts.area && $xeTable.triggerCellAreaMousednEvent) {
+                return $xeTable.triggerCellAreaMousednEvent(evnt, params);
             }
             else {
                 if (checkboxConfig && checkboxOpts.range) {

package/es/table/src/anime.js

@@ -0,0 +1,46 @@
+import XEUtils from 'xe-utils';
+import { addClass, removeClass } from '../../ui/src/dom';
+const rowMoveCls = 'row--drag-move';
+const colMoveClass = 'col--drag-move';
+/**
+ * 上下拖拽
+ */
+export function moveRowAnimateToTb(elemList, offsetTop) {
+    XEUtils.arrayEach(elemList, trEl => {
+        trEl.style.transform = `translateY(${offsetTop}px)`;
+    });
+    requestAnimationFrame(() => {
+        XEUtils.arrayEach(elemList, trEl => {
+            addClass(trEl, rowMoveCls);
+            trEl.style.transform = '';
+        });
+    });
+}
+export function clearRowAnimate(elem) {
+    setTimeout(() => {
+        if (elem) {
+            XEUtils.arrayEach(elem.querySelectorAll(`.vxe-body--row.${rowMoveCls}`), elem => removeClass(elem, rowMoveCls));
+        }
+    }, 500);
+}
+/**
+ * 左右拖拽
+ */
+export function moveColAnimateToLr(elemList, offsetLeft) {
+    XEUtils.arrayEach(elemList, trEl => {
+        trEl.style.transform = `translateX(${offsetLeft}px)`;
+    });
+    requestAnimationFrame(() => {
+        XEUtils.arrayEach(elemList, trEl => {
+            addClass(trEl, colMoveClass);
+            trEl.style.transform = '';
+        });
+    });
+}
+export function clearColAnimate(elem) {
+    setTimeout(() => {
+        if (elem) {
+            XEUtils.arrayEach(elem.querySelectorAll(`.vxe-table--column.${colMoveClass}`), elem => removeClass(elem, colMoveClass));
+        }
+    }, 500);
+}

package/es/table/src/body.js

@@ -379,7 +379,7 @@ function renderTdColumn(h, $xeTable, seq, rowid, fixedType, isOptimizeMode, rowL
     }
     return h('td', {
         class: [
-            'vxe-body--column',
+            'vxe-table--column vxe-body--column',
             colid,
             cellVerticalAlign ? `col--vertical-${cellVerticalAlign}` : '',
             cellAlign ? `col--${cellAlign}` : '',
@@ -421,7 +421,7 @@ function renderRows(h, _vm, fixedType, isOptimizeMode, tableData, tableColumn) {
     const tableInternalData = $xeTable;
     const $xeGrid = $xeTable.$xeGrid;
     const { stripe, rowKey, highlightHoverRow, rowClassName, rowStyle, editConfig, treeConfig } = tableProps;
-    const { hasFixedColumn, treeExpandedFlag, isColLoading, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedFlag, expandColumn, selectRadioRow, pendingRowFlag, isDragColMove, rowExpandHeightFlag, isRowGroupStatus } = tableReactData;
+    const { hasFixedColumn, treeExpandedFlag, scrollXLoad, scrollYLoad, isAllOverflow, rowExpandedFlag, expandColumn, selectRadioRow, pendingRowFlag, rowExpandHeightFlag, isRowGroupStatus } = tableReactData;
     const { fullAllDataRowIdData, fullColumnIdData, treeExpandedMaps, pendingRowMaps, rowExpandedMaps } = tableInternalData;
     const checkboxOpts = $xeTable.computeCheckboxOpts;
     const radioOpts = $xeTable.computeRadioOpts;
@@ -429,7 +429,6 @@ function renderRows(h, _vm, fixedType, isOptimizeMode, tableData, tableColumn) {
     const editOpts = $xeTable.computeEditOpts;
     const rowOpts = $xeTable.computeRowOpts;
     const columnOpts = $xeTable.computeColumnOpts;
-    const columnDragOpts = $xeTable.computeColumnDragOpts;
     const { transform, seqMode } = treeOpts;
     const childrenField = treeOpts.children || treeOpts.childrenField;
     const rows = [];
@@ -510,29 +509,15 @@ function renderRows(h, _vm, fixedType, isOptimizeMode, tableData, tableColumn) {
         const tdVNs = tableColumn.map((column, $columnIndex) => {
             return renderTdColumn(h, $xeTable, seq, rowid, fixedType, isOptimizeMode, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, tableColumn, tableData);
         });
-        rows.push(!isColLoading && (columnOpts.drag && columnDragOpts.animation)
-            ? h('transition-group', {
-                props: {
-                    tag: 'tr',
-                    name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`
-                },
-                class: trClass,
-                attrs: {
-                    rowid
-                },
-                style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : undefined,
-                key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex,
-                nativeOn: trOn
-            }, tdVNs)
-            : h('tr', {
-                class: trClass,
-                attrs: {
-                    rowid
-                },
-                style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : undefined,
-                key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex,
-                on: trOn
-            }, tdVNs));
+        rows.push(h('tr', {
+            class: trClass,
+            attrs: {
+                rowid
+            },
+            style: rowStyle ? (XEUtils.isFunction(rowStyle) ? rowStyle(params) : rowStyle) : undefined,
+            key: rowKey || scrollXLoad || scrollYLoad || rowOpts.useKey || rowOpts.drag || columnOpts.drag || isRowGroupStatus || treeConfig ? rowid : $rowIndex,
+            on: trOn
+        }, tdVNs));
         // 如果行被展开了
         if (isExpandRow) {
             const expandOpts = $xeTable.computeExpandOpts;
@@ -687,12 +672,10 @@ export default {
         const { xID } = $xeTable;
         const { fixedColumn, fixedType, tableColumn } = props;
         const { spanMethod, footerSpanMethod, mouseConfig } = tableProps;
-        const { isGroup, tableData, isRowLoading, isColLoading, overflowX, scrollXLoad, scrollYLoad, isAllOverflow, isDragRowMove, expandColumn, dragRow, dragCol } = tableReactData;
+        const { isGroup, tableData, isColLoading, overflowX, scrollXLoad, scrollYLoad, isAllOverflow, expandColumn, dragRow, dragCol } = tableReactData;
         const { visibleColumn, fullAllDataRowIdData, fullColumnIdData } = tableInternalData;
-        const rowOpts = $xeTable.computeRowOpts;
         const emptyOpts = $xeTable.computeEmptyOpts;
         const mouseOpts = $xeTable.computeMouseOpts;
-        const rowDragOpts = $xeTable.computeRowDragOpts;
         const expandOpts = $xeTable.computeExpandOpts;
         let renderDataList = tableData;
         let renderColumnList = tableColumn;
@@ -835,17 +818,9 @@ export default {
                     /**
                      * 内容
                      */
-                    !(isRowLoading || isColLoading) && (rowOpts.drag && rowDragOpts.animation)
-                        ? h('transition-group', {
-                            ref: 'refBodyTBody',
-                            props: {
-                                tag: 'tbody',
-                                name: `vxe-body--row-list${isDragRowMove ? '' : '-disabled'}`
-                            }
-                        }, renderRows(h, this, fixedType, isOptimizeMode, renderDataList, renderColumnList))
-                        : h('tbody', {
-                            ref: 'refBodyTBody'
-                        }, renderRows(h, this, fixedType, isOptimizeMode, renderDataList, renderColumnList))
+                    h('tbody', {
+                        ref: 'refBodyTBody'
+                    }, renderRows(h, this, fixedType, isOptimizeMode, renderDataList, renderColumnList))
                 ]),
                 h('div', {
                     class: 'vxe-table--checkbox-range'

package/es/table/src/columnInfo.js

@@ -9,7 +9,7 @@ export class ColumnInfo {
     constructor($xeTable, _vm, { renderHeader, renderCell, renderFooter, renderData } = {}) {
         const tableProps = $xeTable;
         const $xeGrid = $xeTable.$xeGrid;
-        const proxyOpts = $xeGrid ? $xeGrid.proxyOpts : null;
+        const proxyOpts = $xeGrid ? $xeGrid.computeProxyOpts : null;
         const formatter = _vm.formatter;
         const visible = XEUtils.isBoolean(_vm.visible) ? _vm.visible : true;
         const types = ['seq', 'checkbox', 'radio', 'expand', 'html'];
@@ -48,6 +48,11 @@ export class ColumnInfo {
                 }
             }
         }
+        if (_vm.aggFunc) {
+            if (!$xeTable.handlePivotTableAggregateData && _vm.aggFunc !== true) {
+                errLog('vxe.error.errProp', [`column.agg-func=${_vm.aggFunc}`, 'column.agg-func=true']);
+            }
+        }
         Object.assign(this, {
             // 基本属性
             type: _vm.type,

package/es/table/src/footer.js

@@ -135,7 +135,7 @@ function renderRows(h, _vm, isOptimizeMode, tableColumn, footerTableData, row, $
             tcStyle.minHeight = `${currCellHeight}px`;
         }
         return h('td', {
-            class: ['vxe-footer--column', column.id, {
+            class: ['vxe-table--column vxe-footer--column', column.id, {
                     [`col--${footAlign}`]: footAlign,
                     [`col--${type}`]: type,
                     'col--last': isLastColumn,
@@ -188,29 +188,11 @@ function renderHeads(h, _vm, isOptimizeMode, renderColumnList) {
     const props = _vm;
     const $xeTable = _vm.$parent;
     const tableProps = $xeTable;
-    const tableReactData = $xeTable;
     const { fixedType, footerTableData } = props;
     const { footerRowClassName, footerRowStyle } = tableProps;
-    const { isColLoading, isDragColMove } = tableReactData;
-    const columnOpts = $xeTable.computeColumnOpts;
-    const columnDragOpts = $xeTable.computeColumnDragOpts;
     return footerTableData.map((row, $rowIndex) => {
         const _rowIndex = $rowIndex;
         const rowParams = { $table: $xeTable, row, _rowIndex, $rowIndex, fixed: fixedType, type: renderType };
-        if (!isColLoading && columnOpts.drag && columnDragOpts.animation) {
-            return h('transition-group', {
-                key: $rowIndex,
-                props: {
-                    tag: 'tr',
-                    name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
-                    class: [
-                        'vxe-footer--row',
-                        footerRowClassName ? XEUtils.isFunction(footerRowClassName) ? footerRowClassName(rowParams) : footerRowClassName : ''
-                    ],
-                    style: footerRowStyle ? (XEUtils.isFunction(footerRowStyle) ? footerRowStyle(rowParams) : footerRowStyle) : undefined
-                }
-            }, renderRows(h, _vm, isOptimizeMode, renderColumnList, footerTableData, row, $rowIndex, _rowIndex));
-        }
         return h('tr', {
             key: $rowIndex,
             class: [

package/es/table/src/header.js

@@ -107,7 +107,7 @@ const renderRows = (h, _vm, isGroup, isOptimizeMode, cols, $rowIndex) => {
             tcStyle.minHeight = `${currCellHeight}px`;
         }
         return h('th', {
-            class: ['vxe-header--column', colid, {
+            class: ['vxe-table--column vxe-header--column', colid, {
                     [`col--${headAlign}`]: headAlign,
                     [`col--${type}`]: type,
                     'col--last': isLastColumn,
@@ -165,28 +165,10 @@ function renderHeads(h, _vm, isGroup, isOptimizeMode, headerGroups) {
     const props = _vm;
     const $xeTable = _vm.$parent;
     const tableProps = $xeTable;
-    const tableReactData = $xeTable;
     const { fixedType } = props;
-    const columnOpts = $xeTable.computeColumnOpts;
-    const columnDragOpts = $xeTable.computeColumnDragOpts;
     const { headerRowClassName, headerRowStyle } = tableProps;
-    const { isColLoading, isDragColMove } = tableReactData;
     return headerGroups.map((cols, $rowIndex) => {
         const params = { $table: $xeTable, $rowIndex, fixed: fixedType, type: cellType };
-        if (!isColLoading && columnOpts.drag && columnDragOpts.animation) {
-            return h('transition-group', {
-                key: $rowIndex,
-                props: {
-                    tag: 'tr',
-                    name: `vxe-header--col-list${isDragColMove ? '' : '-disabled'}`,
-                    class: [
-                        'vxe-header--row',
-                        headerRowClassName ? XEUtils.isFunction(headerRowClassName) ? headerRowClassName(params) : headerRowClassName : ''
-                    ],
-                    style: headerRowStyle ? (XEUtils.isFunction(headerRowStyle) ? headerRowStyle(params) : headerRowStyle) : null
-                }
-            }, renderRows(h, _vm, isGroup, isOptimizeMode, cols, $rowIndex));
-        }
         return h('tr', {
             key: $rowIndex,
             class: [