vxe-table 3.12.0-beta.8 → 3.12.0

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

@@ -148,7 +148,7 @@ export default {
          */
         beginValidate(rows, cols, cb, isFull) {
             const validRest = {};
-            const { editRules, afterFullData, visibleColumn, treeConfig, treeOpts } = this;
+            const { editRules, afterFullData, treeConfig, treeOpts } = this;
             const childrenField = treeOpts.children || treeOpts.childrenField;
             let validList;
             if (rows === true) {
@@ -262,11 +262,7 @@ export default {
                         else {
                             const row = firstErrParams.row;
                             const column = firstErrParams.column;
-                            const rowIndex = afterFullData.indexOf(row);
-                            const columnIndex = visibleColumn.indexOf(column);
-                            const targetRow = rowIndex > 0 ? afterFullData[rowIndex - 1] : row;
-                            const targetColumn = columnIndex > 0 ? visibleColumn[columnIndex - 1] : column;
-                            this.scrollToRow(targetRow, targetColumn).then(posAndFinish);
+                            this.scrollToRow(row, column).then(posAndFinish);
                         }
                     });
                 });

package/es/table/src/cell.js

@@ -77,12 +77,12 @@ function renderCellBaseVNs(h, params, content) {
     const { treeConfig, dragConfig } = tableProps;
     const rowOpts = $table.computeRowOpts;
     const rowDragOpts = $table.computeRowDragOpts;
-    const { showIcon, isCrossDrag, visibleMethod } = rowDragOpts;
+    const { showIcon, isPeerDrag, isCrossDrag, visibleMethod } = rowDragOpts;
     const rVisibleMethod = visibleMethod || (dragConfig ? dragConfig.rowVisibleMethod : null);
     const vns = XEUtils.isArray(content) ? content : [content];
     if (dragSort && rowOpts.drag && ((showIcon || (dragConfig ? dragConfig.showRowIcon : false)) && (!rVisibleMethod || rVisibleMethod(params)))) {
         if (treeConfig) {
-            if (isCrossDrag || !level) {
+            if (isPeerDrag || isCrossDrag || !level) {
                 vns.unshift(renderCellDragIcon(h, params));
             }
         }
@@ -96,9 +96,9 @@ function renderHeaderCellDragIcon(h, params) {
     const { $table, column } = params;
     const columnOpts = $table.computeColumnOpts;
     const columnDragOpts = $table.computeColumnDragOpts;
-    const { showIcon, icon, trigger, isCrossDrag, visibleMethod, disabledMethod } = columnDragOpts;
+    const { showIcon, icon, trigger, isPeerDrag, isCrossDrag, visibleMethod, disabledMethod } = columnDragOpts;
     if (columnOpts.drag && showIcon && (!visibleMethod || visibleMethod(params))) {
-        if (!column.fixed && (isCrossDrag || !column.parentId)) {
+        if (!column.fixed && (isPeerDrag || isCrossDrag || !column.parentId)) {
             const isDisabled = disabledMethod && disabledMethod(params);
             const ons = {};
             if (trigger !== 'cell') {
@@ -136,15 +136,18 @@ function renderHeaderCellBaseVNs(h, params, content) {
 function renderTitleContent(h, params, content) {
     const { $table, column } = params;
     const { type, showHeaderOverflow } = column;
-    const { showHeaderOverflow: allColumnHeaderOverflow, tooltipOpts } = $table;
-    const showAllTip = tooltipOpts.showAll || tooltipOpts.enabled;
+    const tableProps = $table;
+    const tableReactData = $table;
+    const { showHeaderOverflow: allColumnHeaderOverflow } = tableProps;
+    const tooltipOpts = $table.computeTooltipOpts;
+    const showAllTip = tooltipOpts.showAll;
     const headOverflow = XEUtils.isUndefined(showHeaderOverflow) || XEUtils.isNull(showHeaderOverflow) ? allColumnHeaderOverflow : showHeaderOverflow;
     const showTitle = headOverflow === 'title';
     const showTooltip = headOverflow === true || headOverflow === 'tooltip';
     const ons = {};
     if (showTitle || showTooltip || showAllTip) {
         ons.mouseenter = (evnt) => {
-            if ($table._isResize) {
+            if (tableReactData._isResize) {
                 return;
             }
             if (showTitle) {
@@ -157,7 +160,7 @@ function renderTitleContent(h, params, content) {
     }
     if (showTooltip || showAllTip) {
         ons.mouseleave = (evnt) => {
-            if ($table._isResize) {
+            if (tableReactData._isResize) {
                 return;
             }
             if (showTooltip || showAllTip) {
@@ -182,13 +185,13 @@ function renderTitleContent(h, params, content) {
 }
 function formatFooterLabel(footerFormatter, params) {
     if (XEUtils.isFunction(footerFormatter)) {
-        return footerFormatter(params);
+        return `${footerFormatter(params)}`;
     }
     const isArr = XEUtils.isArray(footerFormatter);
     const gFormatOpts = isArr ? formats.get(footerFormatter[0]) : formats.get(footerFormatter);
     const footerFormatMethod = gFormatOpts ? gFormatOpts.tableFooterCellFormatMethod : null;
     if (footerFormatMethod) {
-        return isArr ? footerFormatMethod(params, ...footerFormatter.slice(1)) : footerFormatMethod(params);
+        return `${isArr ? footerFormatMethod(params, ...footerFormatter.slice(1)) : footerFormatMethod(params)}`;
     }
     return '';
 }
@@ -362,7 +365,11 @@ export const Cell = {
      */
     renderTreeIcon(h, params, cellVNodes) {
         const { $table, isHidden } = params;
-        const { treeOpts, treeExpandedMaps, treeExpandLazyLoadedMaps, fullAllDataRowIdData } = $table;
+        const tableReactData = $table;
+        const tableInternalData = $table;
+        const { treeExpandedMaps, treeExpandLazyLoadedMaps } = tableReactData;
+        const { fullAllDataRowIdData } = tableInternalData;
+        const treeOpts = $table.computeTreeOpts;
         const { row, column, level } = params;
         const { slots } = column;
         const { indent, lazy, trigger, iconLoaded, showIcon, iconOpen, iconClose } = treeOpts;
@@ -370,17 +377,18 @@ export const Cell = {
         const hasChildField = treeOpts.hasChild || treeOpts.hasChildField;
         const rowChilds = row[childrenField];
         const hasChild = rowChilds && rowChilds.length;
+        const iconSlot = slots ? slots.icon : null;
         let hasLazyChilds = false;
-        let isAceived = false;
+        let isActive = false;
         let isLazyLoading = false;
         let isLazyLoaded = false;
-        const on = {};
-        if (slots && slots.icon) {
-            return $table.callSlot(slots.icon, params, h, cellVNodes);
+        const ons = {};
+        if (iconSlot) {
+            return $table.callSlot(iconSlot, params, h);
         }
         if (!isHidden) {
             const rowid = getRowid($table, row);
-            isAceived = !!treeExpandedMaps[rowid];
+            isActive = !!treeExpandedMaps[rowid];
             if (lazy) {
                 const rest = fullAllDataRowIdData[rowid];
                 isLazyLoading = !!treeExpandLazyLoadedMaps[rowid];
@@ -389,14 +397,14 @@ export const Cell = {
             }
         }
         if (!trigger || trigger === 'default') {
-            on.click = (evnt) => {
+            ons.click = (evnt) => {
                 $table.triggerTreeExpandEvent(evnt, params);
             };
         }
         return [
             h('div', {
                 class: ['vxe-cell--tree-node', {
-                        'is--active': isAceived
+                        'is--active': isActive
                     }],
                 style: {
                     paddingLeft: `${level * indent}px`
@@ -406,10 +414,10 @@ export const Cell = {
                     ? [
                         h('div', {
                             class: 'vxe-tree--btn-wrapper',
-                            on
+                            on: ons
                         }, [
                             h('i', {
-                                class: ['vxe-tree--node-btn', isLazyLoading ? (iconLoaded || getIcon().TABLE_TREE_LOADED) : (isAceived ? (iconOpen || getIcon().TABLE_TREE_OPEN) : (iconClose || getIcon().TABLE_TREE_CLOSE))]
+                                class: ['vxe-tree--node-btn', isLazyLoading ? (iconLoaded || getIcon().TABLE_TREE_LOADED) : (isActive ? (iconOpen || getIcon().TABLE_TREE_OPEN) : (iconClose || getIcon().TABLE_TREE_CLOSE))]
                             })
                         ])
                     ]
@@ -430,7 +438,9 @@ export const Cell = {
     },
     renderSeqCell(h, params) {
         const { $table, column } = params;
-        const { treeConfig, seqOpts } = $table;
+        const tableProps = $table;
+        const { treeConfig } = tableProps;
+        const seqOpts = $table.computeSeqOpts;
         const { slots } = column;
         if (slots && slots.default) {
             return renderCellBaseVNs(h, params, $table.callSlot(slots.default, params, h));
@@ -462,7 +472,9 @@ export const Cell = {
     },
     renderRadioCell(h, params) {
         const { $table, column, isHidden } = params;
-        const { radioOpts, selectRadioRow } = $table;
+        const tableReactData = $table;
+        const { selectRadioRow } = tableReactData;
+        const radioOpts = $table.computeRadioOpts;
         const { slots } = column;
         const { labelField, checkMethod, visibleMethod } = radioOpts;
         const { row } = params;
@@ -517,19 +529,19 @@ export const Cell = {
      */
     renderCheckboxHeader(h, params) {
         const { $table, column, isHidden } = params;
-        const { isAllSelected: isAllCheckboxSelected, isIndeterminate: isAllCheckboxIndeterminate, isAllCheckboxDisabled } = $table;
+        const tableReactData = $table;
+        const { isAllSelected: isAllCheckboxSelected, isIndeterminate: isAllCheckboxIndeterminate } = tableReactData;
+        const isAllCheckboxDisabled = $table.computeIsAllCheckboxDisabled;
         const { slots } = column;
         const headerSlot = slots ? slots.header : null;
         const titleSlot = slots ? slots.title : null;
-        const checkboxOpts = $table.checkboxOpts;
+        const checkboxOpts = $table.computeCheckboxOpts;
         const headerTitle = column.getTitle();
-        let on;
+        const ons = {};
         if (!isHidden) {
-            on = {
-                click(evnt) {
-                    if (!isAllCheckboxDisabled) {
-                        $table.triggerCheckAllEvent(evnt, !isAllCheckboxSelected);
-                    }
+            ons.click = (evnt) => {
+                if (!isAllCheckboxDisabled) {
+                    $table.triggerCheckAllEvent(evnt, !isAllCheckboxSelected);
                 }
             };
         }
@@ -554,7 +566,7 @@ export const Cell = {
                 attrs: {
                     title: getI18n('vxe.table.allTitle')
                 },
-                on
+                on: ons
             }, [
                 h('span', {
                     class: ['vxe-checkbox--icon', isAllCheckboxIndeterminate ? getIcon().TABLE_CHECKBOX_INDETERMINATE : (isAllCheckboxSelected ? getIcon().TABLE_CHECKBOX_CHECKED : getIcon().TABLE_CHECKBOX_UNCHECKED)]
@@ -570,8 +582,12 @@ export const Cell = {
     },
     renderCheckboxCell(h, params) {
         const { $table, row, column, isHidden } = params;
-        const { treeConfig, treeIndeterminateMaps, selectCheckboxMaps } = $table;
-        const { labelField, checkMethod, visibleMethod } = $table.checkboxOpts;
+        const tableProps = $table;
+        const tableReactData = $table;
+        const { treeConfig } = tableProps;
+        const { selectCheckboxMaps, treeIndeterminateMaps } = tableReactData;
+        const checkboxOpts = $table.computeCheckboxOpts;
+        const { labelField, checkMethod, visibleMethod } = checkboxOpts;
         const { slots } = column;
         const defaultSlot = slots ? slots.default : null;
         const checkboxSlot = slots ? slots.checkbox : null;
@@ -579,15 +595,13 @@ export const Cell = {
         let isChecked = false;
         const isVisible = !visibleMethod || visibleMethod({ row });
         let isDisabled = !!checkMethod;
-        let on;
+        const ons = {};
         if (!isHidden) {
             const rowid = getRowid($table, row);
             isChecked = !!selectCheckboxMaps[rowid];
-            on = {
-                click(evnt) {
-                    if (!isDisabled && isVisible) {
-                        $table.triggerCheckRowEvent(evnt, params, !isChecked);
-                    }
+            ons.click = (evnt) => {
+                if (!isDisabled && isVisible) {
+                    $table.triggerCheckRowEvent(evnt, params, !isChecked);
                 }
             };
             if (checkMethod) {
@@ -620,7 +634,7 @@ export const Cell = {
                         'is--indeterminate': indeterminate,
                         'is--hidden': !isVisible
                     }],
-                on
+                on: ons
             }, checkVNs)
         ]);
     },
@@ -629,7 +643,11 @@ export const Cell = {
     },
     renderCheckboxCellByProp(h, params) {
         const { $table, row, column, isHidden } = params;
-        const { treeConfig, treeIndeterminateMaps, checkboxOpts } = $table;
+        const tableProps = $table;
+        const tableReactData = $table;
+        const { treeConfig } = tableProps;
+        const { treeIndeterminateMaps } = tableReactData;
+        const checkboxOpts = $table.computeCheckboxOpts;
         const { labelField, checkField, checkMethod, visibleMethod } = checkboxOpts;
         const indeterminateField = checkboxOpts.indeterminateField || checkboxOpts.halfField;
         const { slots } = column;
@@ -639,15 +657,13 @@ export const Cell = {
         let isChecked = false;
         const isVisible = !visibleMethod || visibleMethod({ row });
         let isDisabled = !!checkMethod;
-        let on;
+        const ons = {};
         if (!isHidden) {
             const rowid = getRowid($table, row);
             isChecked = XEUtils.get(row, checkField);
-            on = {
-                click(evnt) {
-                    if (!isDisabled && isVisible) {
-                        $table.triggerCheckRowEvent(evnt, params, !isChecked);
-                    }
+            ons.click = (evnt) => {
+                if (!isDisabled && isVisible) {
+                    $table.triggerCheckRowEvent(evnt, params, !isChecked);
                 }
             };
             if (checkMethod) {
@@ -680,7 +696,7 @@ export const Cell = {
                         'is--indeterminate': indeterminateField && !isChecked ? row[indeterminateField] : isIndeterminate,
                         'is--hidden': !isVisible
                     }],
-                on
+                on: ons
             }, checkVNs)
         ]);
     },
@@ -692,18 +708,21 @@ export const Cell = {
      */
     renderExpandCell(h, params) {
         const { $table, isHidden, row, column } = params;
-        const { expandOpts, rowExpandedMaps, rowExpandLazyLoadedMaps } = $table;
+        const tableReactData = $table;
+        const { rowExpandedMaps, rowExpandLazyLoadedMaps } = tableReactData;
+        const expandOpts = $table.computeExpandOpts;
         const { lazy, labelField, iconLoaded, showIcon, iconOpen, iconClose, visibleMethod } = expandOpts;
         const { slots } = column;
         const defaultSlot = slots ? slots.default : null;
-        let isAceived = false;
+        const iconSlot = slots ? slots.icon : null;
+        let isActive = false;
         let isLazyLoading = false;
-        if (slots && slots.icon) {
-            return renderCellBaseVNs(h, params, $table.callSlot(slots.icon, params, h));
+        if (iconSlot) {
+            return renderCellBaseVNs(h, params, $table.callSlot(iconSlot, params, h));
         }
         if (!isHidden) {
             const rowid = getRowid($table, row);
-            isAceived = !!rowExpandedMaps[rowid];
+            isActive = !!rowExpandedMaps[rowid];
             if (lazy) {
                 isLazyLoading = !!rowExpandLazyLoadedMaps[rowid];
             }
@@ -712,7 +731,7 @@ export const Cell = {
             showIcon && (!visibleMethod || visibleMethod(params))
                 ? h('span', {
                     class: ['vxe-table--expanded', {
-                            'is--active': isAceived
+                            'is--active': isActive
                         }],
                     on: {
                         click(evnt) {
@@ -721,7 +740,7 @@ export const Cell = {
                     }
                 }, [
                     h('i', {
-                        class: ['vxe-table--expand-btn', isLazyLoading ? (iconLoaded || getIcon().TABLE_EXPAND_LOADED) : (isAceived ? (iconOpen || getIcon().TABLE_EXPAND_OPEN) : (iconClose || getIcon().TABLE_EXPAND_CLOSE))]
+                        class: ['vxe-table--expand-btn', isLazyLoading ? (iconLoaded || getIcon().TABLE_EXPAND_LOADED) : (isActive ? (iconOpen || getIcon().TABLE_EXPAND_OPEN) : (iconClose || getIcon().TABLE_EXPAND_CLOSE))]
                     })
                 ])
                 : renderEmptyElement($table),
@@ -828,7 +847,9 @@ export const Cell = {
     },
     renderFilterIcon(h, params) {
         const { $table, column, hasFilter } = params;
-        const { filterStore, filterOpts } = $table;
+        const tableReactData = $table;
+        const { filterStore } = tableReactData;
+        const filterOpts = $table.computeFilterOpts;
         const { showIcon, iconNone, iconMatch } = filterOpts;
         return showIcon
             ? [
@@ -859,8 +880,10 @@ export const Cell = {
      */
     renderEditHeader(h, params) {
         const { $table, column } = params;
-        const { editConfig, editRules, editOpts } = $table;
-        const { sortable, remoteSort, filters, editRender } = column;
+        const tableProps = $table;
+        const { editConfig, editRules } = tableProps;
+        const editOpts = $table.computeEditOpts;
+        const { sortable, filters, editRender } = column;
         let isRequired = false;
         if (editRules) {
             const columnRules = XEUtils.get(editRules, column.field);
@@ -884,14 +907,16 @@ export const Cell = {
             ];
         }
         return renderHeaderCellBaseVNs(h, params, editIconVNs.concat(Cell.renderHeaderTitle(h, params))
-            .concat(sortable || remoteSort ? Cell.renderSortIcon(h, params) : [])
+            .concat(sortable ? Cell.renderSortIcon(h, params) : [])
             .concat(filters ? Cell.renderFilterIcon(h, params) : []));
     },
     // 行格编辑模式
     renderRowEdit(h, params) {
         const { $table, column } = params;
+        const tableReactData = $table;
+        const { editStore } = tableReactData;
+        const { actived } = editStore;
         const { editRender } = column;
-        const { actived } = $table.editStore;
         return Cell.runRenderer(h, params, this, isEnableConf(editRender) && actived && actived.row === params.row);
     },
     renderTreeRowEdit(h, params) {
@@ -900,8 +925,10 @@ export const Cell = {
     // 单元格编辑模式
     renderCellEdit(h, params) {
         const { $table, column } = params;
+        const tableReactData = $table;
+        const { editStore } = tableReactData;
+        const { actived } = editStore;
         const { editRender } = column;
-        const { actived } = $table.editStore;
         return Cell.runRenderer(h, params, this, isEnableConf(editRender) && actived && actived.row === params.row && actived.column === params.column);
     },
     renderTreeCellEdit(h, params) {

package/es/table/src/column.js

@@ -108,7 +108,7 @@ Object.keys(columnProps).forEach(name => {
         }
     };
 });
-export default defineVxeComponent({
+export default {
     name: 'VxeColumn',
     props: columnProps,
     provide() {
@@ -140,4 +140,4 @@ export default defineVxeComponent({
         return h('div', this.$slots.default);
     },
     methods: Cell
-});
+};

package/es/table/src/group.js

@@ -2,7 +2,7 @@ import Cell from './cell';
 import { defineVxeComponent } from '../../ui/src/comp';
 import { assembleColumn, destroyColumn } from './util';
 import { columnProps, columnWatch } from './column';
-export default defineVxeComponent({
+export default {
     name: 'VxeColgroup',
     props: columnProps,
     provide() {
@@ -39,4 +39,4 @@ export default defineVxeComponent({
         return h('div', this.$slots.default);
     },
     methods: Cell
-});
+};