vxe-table 4.10.11 → 4.10.13

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

@@ -85,7 +85,9 @@ hooks.add('tableValidatorModule', {
         const beginValidate = (rows, cols, cb, isFull) => {
             const validRest = {};
             const { editRules, treeConfig } = props;
+            const { editStore, pendingRowMaps } = reactData;
             const { afterFullData } = internalData;
+            const { removeMaps } = editStore;
             const treeOpts = computeTreeOpts.value;
             const childrenField = treeOpts.children || treeOpts.childrenField;
             const validOpts = computeValidOpts.value;
@@ -117,6 +119,15 @@ hooks.add('tableValidatorModule', {
             if (editRules) {
                 const columns = cols && cols.length ? cols : $xeTable.getColumns();
                 const handleVaild = (row) => {
+                    const rowid = getRowid($xeTable, row);
+                    // 是否删除
+                    if (removeMaps[rowid]) {
+                        return;
+                    }
+                    // 是否标记删除
+                    if (pendingRowMaps[rowid]) {
+                        return;
+                    }
                     if (isFull || !validRuleErr) {
                         const colVailds = [];
                         columns.forEach((column) => {

package/es/table/render/index.js

@@ -93,10 +93,11 @@ function getCellLabelVNs(renderOpts, params, cellLabel) {
  * @param modelFunc
  * @param changeFunc
  */
-function getNativeElementOns(renderOpts, params, modelFunc, changeFunc) {
+function getNativeElementOns(renderOpts, params, eFns) {
     const { events } = renderOpts;
     const modelEvent = getModelEvent(renderOpts);
     const changeEvent = getChangeEvent(renderOpts);
+    const { model: modelFunc, change: changeFunc, blur: blurFunc } = eFns || {};
     const isSameEvent = changeEvent === modelEvent;
     const ons = {};
     if (events) {
@@ -118,15 +119,24 @@ function getNativeElementOns(renderOpts, params, modelFunc, changeFunc) {
         };
     }
     if (!isSameEvent && changeFunc) {
-        ons[getOnName(changeEvent)] = function (...args) {
-            changeFunc(...args);
+        ons[getOnName(changeEvent)] = function (evnt) {
+            changeFunc(evnt);
             if (events && events[changeEvent]) {
-                events[changeEvent](params, ...args);
+                events[changeEvent](params, evnt);
+            }
+        };
+    }
+    if (blurFunc) {
+        ons[getOnName(blurEvent)] = function (evnt) {
+            blurFunc(evnt);
+            if (events && events[blurEvent]) {
+                events[blurEvent](params, evnt);
             }
         };
     }
     return ons;
 }
+const blurEvent = 'blur';
 /**
  * 组件事件处理
  * @param renderOpts
@@ -134,10 +144,11 @@ function getNativeElementOns(renderOpts, params, modelFunc, changeFunc) {
  * @param modelFunc
  * @param changeFunc
  */
-function getComponentOns(renderOpts, params, modelFunc, changeFunc) {
+function getComponentOns(renderOpts, params, eFns) {
     const { events } = renderOpts;
     const modelEvent = getModelEvent(renderOpts);
     const changeEvent = getChangeEvent(renderOpts);
+    const { model: modelFunc, change: changeFunc, blur: blurFunc } = eFns || {};
     const ons = {};
     XEUtils.objectEach(events, (func, key) => {
         ons[getOnName(key)] = function (...args) {
@@ -165,6 +176,14 @@ function getComponentOns(renderOpts, params, modelFunc, changeFunc) {
             }
         };
     }
+    if (blurFunc) {
+        ons[getOnName(blurEvent)] = function (...args) {
+            blurFunc(...args);
+            if (events && events[blurEvent]) {
+                events[blurEvent](params, ...args);
+            }
+        };
+    }
     return ons;
 }
 function getEditOns(renderOpts, params) {
@@ -172,59 +191,101 @@ function getEditOns(renderOpts, params) {
     const { name } = renderOpts;
     const { model } = column;
     const isImmediate = isImmediateCell(renderOpts, params);
-    return getComponentOns(renderOpts, params, (cellValue) => {
-        // 处理 model 值双向绑定
-        model.update = true;
-        model.value = cellValue;
-        if (isImmediate) {
-            setCellValue(row, column, cellValue);
-        }
-    }, (eventParams) => {
-        // 处理 change 事件相关逻辑
-        if (!isImmediate && (['VxeInput', 'VxeNumberInput', 'VxeTextarea', '$input', '$textarea'].includes(name))) {
-            const cellValue = eventParams.value;
+    return getComponentOns(renderOpts, params, {
+        model(cellValue) {
+            // 处理 model 值双向绑定
             model.update = true;
             model.value = cellValue;
-            $table.updateStatus(params, cellValue);
-        }
-        else {
-            $table.updateStatus(params);
+            if (isImmediate) {
+                setCellValue(row, column, cellValue);
+            }
+        },
+        change(eventParams) {
+            // 处理 change 事件相关逻辑
+            if (!isImmediate && name && (['VxeInput', 'VxeNumberInput', 'VxeTextarea', '$input', '$textarea'].includes(name))) {
+                const cellValue = eventParams.value;
+                model.update = true;
+                model.value = cellValue;
+                $table.updateStatus(params, cellValue);
+            }
+            else {
+                $table.updateStatus(params);
+            }
+        },
+        blur() {
+            if (isImmediate) {
+                $table.handleCellRuleUpdateStatus('blur', params);
+            }
+            else {
+                $table.handleCellRuleUpdateStatus('blur', params, model.value);
+            }
         }
     });
 }
 function getFilterOns(renderOpts, params, option) {
-    return getComponentOns(renderOpts, params, (value) => {
-        // 处理 model 值双向绑定
-        option.data = value;
-    }, () => {
-        handleConfirmFilter(params, !XEUtils.eqNull(option.data), option);
+    return getComponentOns(renderOpts, params, {
+        model(value) {
+            // 处理 model 值双向绑定
+            option.data = value;
+        },
+        change() {
+            handleConfirmFilter(params, !XEUtils.eqNull(option.data), option);
+        },
+        blur() {
+            handleConfirmFilter(params, !XEUtils.eqNull(option.data), option);
+        }
     });
 }
 function getNativeEditOns(renderOpts, params) {
     const { $table, row, column } = params;
     const { model } = column;
-    return getNativeElementOns(renderOpts, params, (evnt) => {
-        // 处理 model 值双向绑定
-        const cellValue = evnt.target.value;
-        if (isImmediateCell(renderOpts, params)) {
-            setCellValue(row, column, cellValue);
-        }
-        else {
-            model.update = true;
-            model.value = cellValue;
+    return getNativeElementOns(renderOpts, params, {
+        model(evnt) {
+            // 处理 model 值双向绑定
+            const targetEl = evnt.target;
+            if (targetEl) {
+                const cellValue = targetEl.value;
+                if (isImmediateCell(renderOpts, params)) {
+                    setCellValue(row, column, cellValue);
+                }
+                else {
+                    model.update = true;
+                    model.value = cellValue;
+                }
+            }
+        },
+        change(evnt) {
+            // 处理 change 事件相关逻辑
+            const targetEl = evnt.target;
+            if (targetEl) {
+                const cellValue = targetEl.value;
+                $table.updateStatus(params, cellValue);
+            }
+        },
+        blur(evnt) {
+            const targetEl = evnt.target;
+            if (targetEl) {
+                const cellValue = targetEl.value;
+                $table.updateStatus(params, cellValue);
+            }
         }
-    }, (evnt) => {
-        // 处理 change 事件相关逻辑
-        const cellValue = evnt.target.value;
-        $table.updateStatus(params, cellValue);
     });
 }
 function getNativeFilterOns(renderOpts, params, option) {
-    return getNativeElementOns(renderOpts, params, (evnt) => {
-        // 处理 model 值双向绑定
-        option.data = evnt.target.value;
-    }, () => {
-        handleConfirmFilter(params, !XEUtils.eqNull(option.data), option);
+    return getNativeElementOns(renderOpts, params, {
+        model(evnt) {
+            // 处理 model 值双向绑定
+            const targetEl = evnt.target;
+            if (targetEl) {
+                option.data = targetEl.value;
+            }
+        },
+        change() {
+            handleConfirmFilter(params, !XEUtils.eqNull(option.data), option);
+        },
+        blur() {
+            handleConfirmFilter(params, !XEUtils.eqNull(option.data), option);
+        }
     });
 }
 /**

package/es/table/src/body.js

@@ -364,6 +364,7 @@ export default defineComponent({
                         'fixed--width': !isAutoCellWidth,
                         'fixed--hidden': fixedHiddenColumn,
                         'is--padding': isCellPadding,
+                        'is--progress': (fixedHiddenColumn && isAllOverflow) || isVNPreEmptyStatus,
                         'is--drag-cell': isRowDragCell && (isCrossDrag || isPeerDrag || !rowLevel),
                         'is--drag-disabled': isDisabledDrag,
                         'col--dirty': isDirty,

package/es/table/src/table.js

@@ -1540,12 +1540,12 @@ export default defineComponent({
             const sortOpts = computeSortOpts.value;
             const treeOpts = computeTreeOpts.value;
             const childrenField = treeOpts.children || treeOpts.childrenField;
-            const { transform } = treeOpts;
+            const { transform, rowField, parentField, mapChildrenField } = treeOpts;
             const { remote: allRemoteFilter, filterMethod: allFilterMethod } = filterOpts;
             const { remote: allRemoteSort, sortMethod: allSortMethod, multiple: sortMultiple, chronological } = sortOpts;
             let tableData = [];
             let tableTree = [];
-            // 处理列
+            // 处理数据
             if (!allRemoteFilter || !allRemoteSort) {
                 const filterColumns = [];
                 let orderColumns = [];
@@ -1601,7 +1601,7 @@ export default defineComponent({
                         tableTree = XEUtils.searchTree(tableFullTreeData, handleFilter, {
                             original: true,
                             isEvery: true,
-                            children: treeOpts.mapChildrenField,
+                            children: mapChildrenField,
                             mapChildren: childrenField
                         });
                         tableData = tableTree;
@@ -1617,7 +1617,7 @@ export default defineComponent({
                         tableTree = XEUtils.searchTree(tableFullTreeData, () => true, {
                             original: true,
                             isEvery: true,
-                            children: treeOpts.mapChildrenField,
+                            children: mapChildrenField,
                             mapChildren: childrenField
                         });
                         tableData = tableTree;
@@ -1637,7 +1637,15 @@ export default defineComponent({
                             tableTree = XEUtils.isArray(sortRests) ? sortRests : tableTree;
                         }
                         else {
-                            tableTree = XEUtils.orderBy(tableTree, orderColumns.map(({ column, order }) => [getOrderField(column), order]));
+                            const treeList = XEUtils.toTreeArray(tableTree, {
+                                children: mapChildrenField
+                            });
+                            tableTree = XEUtils.toArrayTree(XEUtils.orderBy(treeList, orderColumns.map(({ column, order }) => [getOrderField(column), order])), {
+                                key: rowField,
+                                parentKey: parentField,
+                                children: childrenField,
+                                mapChildren: mapChildrenField
+                            });
                         }
                         tableData = tableTree;
                     }
@@ -5375,34 +5383,10 @@ export default defineComponent({
              * 如果单元格配置了校验规则，则会进行校验
              */
             updateStatus(slotParams, cellValue) {
-                const customVal = !XEUtils.isUndefined(cellValue);
                 return nextTick().then(() => {
                     const { editRules } = props;
-                    const { validStore } = reactData;
-                    const tableBody = refTableBody.value;
-                    if (slotParams && tableBody && editRules) {
-                        const { row, column } = slotParams;
-                        const type = 'change';
-                        if ($xeTable.hasCellRules) {
-                            if ($xeTable.hasCellRules(type, row, column)) {
-                                const cell = tableMethods.getCellElement(row, column);
-                                if (cell) {
-                                    return $xeTable.validCellRules(type, row, column, cellValue)
-                                        .then(() => {
-                                        if (customVal && validStore.visible) {
-                                            setCellValue(row, column, cellValue);
-                                        }
-                                        $xeTable.clearValidate(row, column);
-                                    })
-                                        .catch(({ rule }) => {
-                                        if (customVal) {
-                                            setCellValue(row, column, cellValue);
-                                        }
-                                        $xeTable.showValidTooltip({ rule, row, column, cell });
-                                    });
-                                }
-                            }
-                        }
+                    if (slotParams && editRules) {
+                        return $xeTable.handleCellRuleUpdateStatus('change', slotParams, cellValue);
                     }
                 });
             },
@@ -7741,6 +7725,32 @@ export default defineComponent({
                     $xeTable.handleColumnSortEvent(evnt, column);
                 }
             },
+            handleCellRuleUpdateStatus(type, cellParams, cellValue) {
+                const { validStore } = reactData;
+                const { row, column } = cellParams;
+                if ($xeTable.hasCellRules) {
+                    if ($xeTable.hasCellRules(type, row, column)) {
+                        const cell = $xeTable.getCellElement(row, column);
+                        if (cell) {
+                            const customVal = !XEUtils.isUndefined(cellValue);
+                            return $xeTable.validCellRules(type, row, column, cellValue)
+                                .then(() => {
+                                if (customVal && validStore.visible) {
+                                    setCellValue(row, column, cellValue);
+                                }
+                                $xeTable.clearValidate(row, column);
+                            })
+                                .catch(({ rule }) => {
+                                if (customVal) {
+                                    setCellValue(row, column, cellValue);
+                                }
+                                $xeTable.showValidTooltip({ rule, row, column, cell });
+                            });
+                        }
+                    }
+                }
+                return nextTick();
+            },
             /**
              * 表头单元格按下事件
              */

package/es/table/style.css

@@ -2661,6 +2661,9 @@
 .vxe-table--render-default.size--medium .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
   margin-top: 3px;
 }
+.vxe-table--render-default.size--medium .vxe-cell--valid-error-tip {
+  padding: 0 var(--vxe-ui-table-cell-padding-medium);
+}
 .vxe-table--render-default.size--small {
   font-size: var(--vxe-ui-font-size-small);
 }
@@ -2686,6 +2689,9 @@
 .vxe-table--render-default.size--small .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
   margin-top: 2px;
 }
+.vxe-table--render-default.size--small .vxe-cell--valid-error-tip {
+  padding: 0 var(--vxe-ui-table-cell-padding-small);
+}
 .vxe-table--render-default.size--mini {
   font-size: var(--vxe-ui-font-size-mini);
 }
@@ -2711,6 +2717,9 @@
 .vxe-table--render-default.size--mini .vxe-cell .vxe-default-input[type=date]::-webkit-inner-spin-button {
   margin-top: 1px;
 }
+.vxe-table--render-default.size--mini .vxe-cell--valid-error-tip {
+  padding: 0 var(--vxe-ui-table-cell-padding-mini);
+}
 .vxe-table--render-default .vxe-header--column.is--padding .vxe-cell,
 .vxe-table--render-default .vxe-body--column.is--padding .vxe-cell,
 .vxe-table--render-default .vxe-footer--column.is--padding .vxe-cell {
@@ -3288,8 +3297,7 @@
   transform: translateX(-50%);
   text-align: left;
   z-index: 4;
-  padding-left: var(--vxe-ui-table-cell-padding-left);
-  padding-right: var(--vxe-ui-table-cell-padding-right);
+  padding: 0 var(--vxe-ui-table-cell-padding-default);
 }
 .vxe-table--render-default .vxe-body--column .vxe-cell--valid-error-wrapper {
   display: inline-block;