vxe-table 4.5.0-beta.11 → 4.5.0-beta.13

package/es/table/src/body.js

@@ -44,7 +44,7 @@ export default defineComponent({
         var $xetable = inject('$xetable', {});
         var xesize = inject('xesize', null);
         var xID = $xetable.xID, tableProps = $xetable.props, tableContext = $xetable.context, tableReactData = $xetable.reactData, tableInternalData = $xetable.internalData;
-        var _a = $xetable.getRefMaps(), refTableHeader = _a.refTableHeader, refTableBody = _a.refTableBody, refTableFooter = _a.refTableFooter, refTableLeftBody = _a.refTableLeftBody, refTableRightBody = _a.refTableRightBody;
+        var _a = $xetable.getRefMaps(), refTableHeader = _a.refTableHeader, refTableBody = _a.refTableBody, refTableFooter = _a.refTableFooter, refTableLeftBody = _a.refTableLeftBody, refTableRightBody = _a.refTableRightBody, refValidTooltip = _a.refValidTooltip;
         var _b = $xetable.getComputeMaps(), computeEditOpts = _b.computeEditOpts, computeMouseOpts = _b.computeMouseOpts, computeSYOpts = _b.computeSYOpts, computeEmptyOpts = _b.computeEmptyOpts, computeKeyboardOpts = _b.computeKeyboardOpts, computeTooltipOpts = _b.computeTooltipOpts, computeRadioOpts = _b.computeRadioOpts, computeExpandOpts = _b.computeExpandOpts, computeTreeOpts = _b.computeTreeOpts, computeCheckboxOpts = _b.computeCheckboxOpts, computeValidOpts = _b.computeValidOpts, computeRowOpts = _b.computeRowOpts, computeColumnOpts = _b.computeColumnOpts;
         var refElem = ref();
         var refBodyTable = ref();
@@ -130,7 +130,7 @@ export default defineComponent({
          */
         var renderColumn = function (seq, rowid, fixedType, rowLevel, row, rowIndex, $rowIndex, _rowIndex, column, $columnIndex, columns, items) {
             var _a;
-            var columnKey = tableProps.columnKey, allColumnOverflow = tableProps.showOverflow, allCellClassName = tableProps.cellClassName, cellStyle = tableProps.cellStyle, allAlign = tableProps.align, spanMethod = tableProps.spanMethod, mouseConfig = tableProps.mouseConfig, editConfig = tableProps.editConfig, editRules = tableProps.editRules, tooltipConfig = tableProps.tooltipConfig;
+            var columnKey = tableProps.columnKey, height = tableProps.height, allColumnOverflow = tableProps.showOverflow, allCellClassName = tableProps.cellClassName, cellStyle = tableProps.cellStyle, allAlign = tableProps.align, spanMethod = tableProps.spanMethod, mouseConfig = tableProps.mouseConfig, editConfig = tableProps.editConfig, editRules = tableProps.editRules, tooltipConfig = tableProps.tooltipConfig;
             var tableData = tableReactData.tableData, overflowX = tableReactData.overflowX, scrollYLoad = tableReactData.scrollYLoad, currentColumn = tableReactData.currentColumn, mergeList = tableReactData.mergeList, editStore = tableReactData.editStore, isAllOverflow = tableReactData.isAllOverflow, validErrorMaps = tableReactData.validErrorMaps;
             var afterFullData = tableInternalData.afterFullData;
             var validOpts = computeValidOpts.value;
@@ -162,7 +162,7 @@ export default defineComponent({
             var tdOns = {};
             var cellAlign = align || allAlign;
             var errorValidItem = validErrorMaps["".concat(rowid, ":").concat(column.id)];
-            var showValidTip = editRules && validOpts.showMessage;
+            var showValidTip = editRules && validOpts.showMessage && (validOpts.message === 'default' ? (height || tableData.length > 1) : validOpts.message === 'inline');
             var attrs = { colid: column.id };
             var params = { $table: $xetable, $grid: $xetable.xegrid, seq: seq, rowid: rowid, row: row, rowIndex: rowIndex, $rowIndex: $rowIndex, _rowIndex: _rowIndex, column: column, columnIndex: columnIndex, $columnIndex: $columnIndex, _columnIndex: _columnIndex, fixed: fixedType, type: renderType, isHidden: fixedHiddenColumn, level: rowLevel, visibleData: afterFullData, data: tableData, items: items };
             // 虚拟滚动不支持动态高度
@@ -486,6 +486,7 @@ export default defineComponent({
             var tableFooter = refTableFooter.value;
             var leftBody = refTableLeftBody.value;
             var rightBody = refTableRightBody.value;
+            var validTip = refValidTooltip.value;
             var scrollBodyElem = refElem.value;
             var headerElem = tableHeader ? tableHeader.$el : null;
             var footerElem = tableFooter ? tableFooter.$el : null;
@@ -538,6 +539,9 @@ export default defineComponent({
             if (scrollYLoad && isRollY) {
                 $xetable.triggerScrollYEvent(evnt);
             }
+            if (isRollX && validTip && validTip.reactData.visible) {
+                validTip.updatePlacement();
+            }
             $xetable.dispatchEvent('scroll', {
                 type: renderType,
                 fixed: fixedType,

package/es/table/src/table.js

@@ -316,6 +316,7 @@ export default defineComponent({
         var refElem = ref();
         var refTooltip = ref();
         var refCommTooltip = ref();
+        var refValidTooltip = ref();
         var refTableFilter = ref();
         var refTableMenu = ref();
         var refTableHeader = ref();
@@ -380,6 +381,10 @@ export default defineComponent({
             var tooltipOpts = computeTooltipOpts.value;
             return __assign(__assign({}, tooltipOpts), tooltipStore.currOpts);
         });
+        var computeValidTipOpts = computed(function () {
+            var tooltipOpts = computeTooltipOpts.value;
+            return Object.assign({ isArrow: false }, tooltipOpts);
+        });
         var computeEditOpts = computed(function () {
             return Object.assign({}, GlobalConfig.table.editConfig, props.editConfig);
         });
@@ -519,6 +524,7 @@ export default defineComponent({
         var refMaps = {
             refElem: refElem,
             refTooltip: refTooltip,
+            refValidTooltip: refValidTooltip,
             refTableFilter: refTableFilter,
             refTableMenu: refTableMenu,
             refTableHeader: refTableHeader,
@@ -4126,14 +4132,14 @@ export default defineComponent({
              * 如果组件值 v-model 发生 change 时，调用改函数用于更新某一列编辑状态
              * 如果单元格配置了校验规则，则会进行校验
              */
-            updateStatus: function (scope, cellValue) {
+            updateStatus: function (slotParams, cellValue) {
                 var customVal = !XEUtils.isUndefined(cellValue);
                 return nextTick().then(function () {
                     var editRules = props.editRules;
                     var validStore = reactData.validStore;
                     var tableBody = refTableBody.value;
-                    if (scope && tableBody && editRules) {
-                        var row_1 = scope.row, column_3 = scope.column;
+                    if (slotParams && tableBody && editRules) {
+                        var row_1 = slotParams.row, column_3 = slotParams.column;
                         var type = 'change';
                         if ($xetable.hasCellRules) {
                             if ($xetable.hasCellRules(type, row_1, column_3)) {
@@ -4263,10 +4269,12 @@ export default defineComponent({
          */
         var handleGlobalMousedownEvent = function (evnt) {
             var editStore = reactData.editStore, ctxMenuStore = reactData.ctxMenuStore, filterStore = reactData.filterStore;
-            var mouseConfig = props.mouseConfig;
+            var mouseConfig = props.mouseConfig, editRules = props.editRules;
             var el = refElem.value;
             var editOpts = computeEditOpts.value;
+            var validOpts = computeValidOpts.value;
             var actived = editStore.actived;
+            var $validTooltip = refValidTooltip.value;
             var tableFilter = refTableFilter.value;
             var tableMenu = refTableMenu.value;
             if (tableFilter) {
@@ -4288,7 +4296,10 @@ export default defineComponent({
                     // 如果是激活状态，点击了单元格之外
                     var cell = actived.args.cell;
                     if ((!cell || !getEventTargetNode(evnt, cell).flag)) {
-                        if (!internalData._lastCallTime || internalData._lastCallTime + 50 < Date.now()) {
+                        if ($validTooltip && getEventTargetNode(evnt, $validTooltip.$el).flag) {
+                            // 如果是激活状态，且点击了校验提示框
+                        }
+                        else if (!internalData._lastCallTime || internalData._lastCallTime + 50 < Date.now()) {
                             // 如果是激活状态，点击了单元格之外
                             if (!getEventTargetNode(evnt, document.body, 'vxe-table--ignore-clear').flag) {
                                 // 如果手动调用了激活单元格，避免触发源被移除后导致重复关闭
@@ -4349,8 +4360,13 @@ export default defineComponent({
                     $xetable.closeMenu();
                 }
             }
+            var isActivated = getEventTargetNode(evnt, $xegrid ? $xegrid.getRefMaps().refElem.value : el).flag;
+            // 如果存在校验，点击了表格之外则清除
+            if (!isActivated && editRules && validOpts.autoClear) {
+                reactData.validErrorMaps = {};
+            }
             // 最后激活的表格
-            internalData.isActivated = getEventTargetNode(evnt, $xegrid ? $xegrid.getRefMaps().refElem.value : el).flag;
+            internalData.isActivated = isActivated;
         };
         /**
          * 窗口失焦事件处理
@@ -6298,23 +6314,26 @@ export default defineComponent({
         });
         var renderVN = function () {
             var _a;
-            var loading = props.loading, stripe = props.stripe, showHeader = props.showHeader, treeConfig = props.treeConfig, mouseConfig = props.mouseConfig, showFooter = props.showFooter, highlightCell = props.highlightCell, highlightHoverRow = props.highlightHoverRow, highlightHoverColumn = props.highlightHoverColumn, editConfig = props.editConfig;
+            var loading = props.loading, stripe = props.stripe, showHeader = props.showHeader, height = props.height, treeConfig = props.treeConfig, mouseConfig = props.mouseConfig, showFooter = props.showFooter, highlightCell = props.highlightCell, highlightHoverRow = props.highlightHoverRow, highlightHoverColumn = props.highlightHoverColumn, editConfig = props.editConfig, editRules = props.editRules;
             var isGroup = reactData.isGroup, overflowX = reactData.overflowX, overflowY = reactData.overflowY, scrollXLoad = reactData.scrollXLoad, scrollYLoad = reactData.scrollYLoad, scrollbarHeight = reactData.scrollbarHeight, tableData = reactData.tableData, tableColumn = reactData.tableColumn, tableGroupColumn = reactData.tableGroupColumn, footerTableData = reactData.footerTableData, initStore = reactData.initStore, columnStore = reactData.columnStore, filterStore = reactData.filterStore;
             var leftList = columnStore.leftList, rightList = columnStore.rightList;
             var loadingSlot = slots.loading;
             var tipConfig = computeTipConfig.value;
+            var validOpts = computeValidOpts.value;
             var treeOpts = computeTreeOpts.value;
             var rowOpts = computeRowOpts.value;
             var columnOpts = computeColumnOpts.value;
             var vSize = computeSize.value;
             var tableBorder = computeTableBorder.value;
             var mouseOpts = computeMouseOpts.value;
+            var validTipOpts = computeValidTipOpts.value;
             var loadingOpts = computeLoadingOpts.value;
             var isMenu = computeIsMenu.value;
             return h('div', {
                 ref: refElem,
                 class: ['vxe-table', 'vxe-table--render-default', "tid_".concat(xID), "border--".concat(tableBorder), (_a = {},
                         _a["size--".concat(vSize)] = vSize,
+                        _a["vaild-msg--".concat(validOpts.msgMode)] = !!editRules,
                         _a['vxe-editable'] = !!editConfig,
                         _a['cell--highlight'] = highlightCell,
                         _a['cell--selected'] = mouseConfig && mouseOpts.selected,
@@ -6463,6 +6482,10 @@ export default defineComponent({
                     isArrow: false,
                     enterable: false
                 }) : createCommentVNode(),
+                /**
+                 * 校验提示
+                 */
+                hasUseTooltip && props.editRules && validOpts.showMessage && (validOpts.message === 'default' ? !height : validOpts.message === 'tooltip') ? h(resolveComponent('vxe-tooltip'), __assign({ ref: refValidTooltip, class: 'vxe-table--valid-error' }, (validOpts.message === 'tooltip' || tableData.length === 1 ? validTipOpts : {}))) : createCommentVNode(),
                 /**
                  * 工具提示
                  */

package/es/table/style.css

@@ -1238,6 +1238,7 @@
   display: inline-block;
   border-radius: var(--vxe-border-radius);
   color: var(--vxe-table-validate-error-color);
+  background-color: var(--vxe-table-validate-error-background-color);
   pointer-events: auto;
 }
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-default-input,
@@ -1248,7 +1249,10 @@
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-input > .vxe-input--inner {
   border-color: var(--vxe-table-validate-error-color);
 }
-.vxe-table--render-default .vxe-body--row:last-child .vxe-cell--valid {
+.vxe-table--render-default.vaild-msg--single .vxe-body--row:last-child .vxe-cell--valid {
+  bottom: 100%;
+}
+.vxe-table--render-default.vaild-msg--full .vxe-body--row:last-child .vxe-cell--valid {
   top: calc(100% - 1.3em);
 }
 .vxe-table--render-default .vxe-body--row.row--new > .vxe-body--column {
@@ -1256,8 +1260,8 @@
 }
 .vxe-table--render-default .vxe-body--row.row--new > .vxe-body--column:before {
   content: "";
-  top: var(--vxe-table-cell-dirty-width);
-  left: var(--vxe-table-cell-dirty-width);
+  top: calc(var(--vxe-table-cell-dirty-width) * -1);
+  left: calc(var(--vxe-table-cell-dirty-width) * -1);
   position: absolute;
   border-width: var(--vxe-table-cell-dirty-width);
   border-style: solid;
@@ -1308,6 +1312,13 @@
   padding: 0;
 }
 
+/*valid error*/
+div.vxe-table--tooltip-wrapper.vxe-table--valid-error {
+  padding: 0;
+  color: var(--vxe-table-validate-error-color);
+  background-color: var(--vxe-table-validate-error-background-color);
+}
+
 /*footer*/
 .vxe-table--footer-wrapper {
   color: var(--vxe-table-footer-font-color);

package/es/textarea/src/textarea.js

@@ -13,7 +13,10 @@ export default defineComponent({
         name: String,
         readonly: Boolean,
         disabled: Boolean,
-        placeholder: String,
+        placeholder: {
+            type: String,
+            default: function () { return XEUtils.eqNull(GlobalConfig.textarea.placeholder) ? GlobalConfig.i18n('vxe.base.pleaseInput') : GlobalConfig.textarea.placeholder; }
+        },
         maxlength: [String, Number],
         rows: { type: [String, Number], default: 2 },
         cols: { type: [String, Number], default: null },

package/es/tools/log.js

@@ -1,6 +1,6 @@
 import GlobalConfig from '../v-x-e-table/src/conf';
 export function getLog(message, params) {
-    return "[vxe-table v".concat("4.5.0-beta.10", "] ").concat(GlobalConfig.i18n(message, params));
+    return "[vxe-table v".concat("4.5.0-beta.13", "] ").concat(GlobalConfig.i18n(message, params));
 }
 function outLog(type) {
     return function (message, params) {

package/es/tooltip/style.css

@@ -126,10 +126,4 @@
 }
 .vxe-table--tooltip-wrapper.theme--dark.placement--bottom .vxe-table--tooltip-arrow:before {
   border-bottom-color: var(--vxe-tooltip-dark-background-color);
-}
-
-/*valid error*/
-.vxe-table--tooltip-wrapper.vxe-table--valid-error {
-  background-color: var(--vxe-tooltip-validate-error-background-color);
-  color: var(--vxe-tooltip-validate-error-color);
 }

package/es/v-x-e-table/index.js

@@ -5,6 +5,7 @@ import { renderer } from './src/renderer';
 import { commands } from './src/commands';
 import { menus } from './src/menus';
 import { formats } from './src/formats';
+import { validators } from './src/validators';
 import { hooks } from './src/hooks';
 import { setup } from './src/setup';
 import { getLastZIndex, nextZIndex } from '../tools/utils';
@@ -83,12 +84,13 @@ export var config = new VXETableConfig();
 export var v = 'v4';
 export var VXETable = {
     v: v,
-    version: "4.5.0-beta.10",
+    version: "4.5.0-beta.13",
     setup: setup,
     interceptor: interceptor,
     renderer: renderer,
     commands: commands,
     formats: formats,
+    validators: validators,
     menus: menus,
     hooks: hooks,
     config: config,
@@ -101,6 +103,7 @@ export * from './src/renderer';
 export * from './src/commands';
 export * from './src/menus';
 export * from './src/formats';
+export * from './src/validators';
 export * from './src/hooks';
 export * from './src/setup';
 export default VXETable;

package/es/v-x-e-table/src/conf.js

@@ -44,7 +44,10 @@ var GlobalConfig = {
             enterable: true
         },
         validConfig: {
-            showMessage: true
+            showMessage: true,
+            autoClear: true,
+            message: 'default',
+            msgMode: 'single'
         },
         columnConfig: {
             maxFixedSize: 4

package/es/v-x-e-table/src/menus.js

@@ -1,5 +1,51 @@
-import VXEStore from './store';
-export var menus = new VXEStore();
+import XEUtils from 'xe-utils';
+import { warnLog } from '../../tools/log';
+var VXEMenusStore = /** @class */ (function () {
+    function VXEMenusStore() {
+        this.store = {};
+    }
+    VXEMenusStore.prototype.mixin = function (options) {
+        var _this = this;
+        XEUtils.each(options, function (item, key) {
+            _this.add(key, item);
+        });
+        return this;
+    };
+    VXEMenusStore.prototype.has = function (name) {
+        return !!this.get(name);
+    };
+    VXEMenusStore.prototype.get = function (name) {
+        return this.store[name];
+    };
+    VXEMenusStore.prototype.add = function (name, render) {
+        var conf = this.store[name];
+        // 兼容
+        if (XEUtils.isFunction(render)) {
+            render = {
+                menuMethod: render
+            };
+        }
+        // 检测是否覆盖
+        if (process.env.NODE_ENV === 'development') {
+            var confKeys_1 = XEUtils.keys(conf);
+            XEUtils.each(render, function (item, key) {
+                if (confKeys_1.includes(key)) {
+                    warnLog('vxe.error.coverProp', [name, key]);
+                }
+            });
+        }
+        this.store[name] = conf ? XEUtils.merge(conf, render) : render;
+        return this;
+    };
+    VXEMenusStore.prototype.delete = function (name) {
+        delete this.store[name];
+    };
+    VXEMenusStore.prototype.forEach = function (callback) {
+        XEUtils.objectEach(this.store, callback);
+    };
+    return VXEMenusStore;
+}());
+export var menus = new VXEMenusStore();
 if (process.env.NODE_ENV === 'development') {
     Object.assign(menus, { _name: 'Menus' });
 }

package/es/v-x-e-table/src/store.js

@@ -8,7 +8,10 @@ var Store = /** @class */ (function () {
         this.store = {};
     }
     Store.prototype.mixin = function (options) {
-        Object.assign(this.store, options);
+        var _this = this;
+        XEUtils.each(options, function (item, key) {
+            _this.add(key, item);
+        });
         return this;
     };
     Store.prototype.has = function (name) {

package/es/v-x-e-table/src/validators.js

@@ -0,0 +1,5 @@
+import VXEStore from './store';
+export var validators = new VXEStore();
+if (process.env.NODE_ENV === 'development') {
+    Object.assign(validators, { _name: 'Validators' });
+}

package/es/validator/src/hook.js

@@ -12,8 +12,10 @@ var __assign = (this && this.__assign) || function () {
 import { nextTick } from 'vue';
 import GlobalConfig from '../../v-x-e-table/src/conf';
 import XEUtils from 'xe-utils';
+import { VXETable } from '../../v-x-e-table';
 import { getFuncText, eqEmptyValue } from '../../tools/utils';
 import { scrollToView } from '../../tools/dom';
+import { errLog, warnLog } from '../../tools/log';
 import { handleFieldOrColumn, getRowid } from '../../table/src/util';
 /**
  * 校验规则
@@ -56,6 +58,7 @@ var tableValidatorMethodKeys = ['fullValidate', 'validate', 'clearValidate'];
 var validatorHook = {
     setupTable: function ($xetable) {
         var props = $xetable.props, reactData = $xetable.reactData, internalData = $xetable.internalData;
+        var refValidTooltip = $xetable.getRefMaps().refValidTooltip;
         var _a = $xetable.getComputeMaps(), computeValidOpts = _a.computeValidOpts, computeTreeOpts = _a.computeTreeOpts, computeEditOpts = _a.computeEditOpts;
         var validatorMethods = {};
         var validatorPrivateMethods = {};
@@ -77,6 +80,19 @@ var validatorHook = {
                 }
             });
         };
+        var handleErrMsgMode = function (validErrMaps) {
+            var validOpts = computeValidOpts.value;
+            if (validOpts.msgMode === 'single') {
+                var keys = Object.keys(validErrMaps);
+                var resMaps = validErrMaps;
+                if (keys.length) {
+                    var firstKey = keys[0];
+                    resMaps[firstKey] = validErrMaps[firstKey];
+                }
+                return resMaps;
+            }
+            return validErrMaps;
+        };
         /**
          * 对表格数据进行校验
          * 如果不指定数据，则默认只校验临时变动的数据，例如新增或修改
@@ -165,7 +181,7 @@ var validatorHook = {
                 }
                 return Promise.all(rowValids).then(function () {
                     var ruleProps = Object.keys(validRest);
-                    reactData.validErrorMaps = validErrMaps;
+                    reactData.validErrorMaps = handleErrMsgMode(validErrMaps);
                     return nextTick().then(function () {
                         if (ruleProps.length) {
                             return Promise.reject(validRest[ruleProps[0]][0]);
@@ -206,7 +222,6 @@ var validatorHook = {
                         var row = firstErrParams.row;
                         var rowIndex = afterFullData.indexOf(row);
                         var locatRow = rowIndex > 0 ? afterFullData[rowIndex - 1] : row;
-                        reactData.validErrorMaps = validErrMaps;
                         if (validOpts.autoPos === false) {
                             finish();
                         }
@@ -221,7 +236,9 @@ var validatorHook = {
                     });
                 });
             }
-            // reactData.validErrorMaps = validErrMaps
+            else {
+                reactData.validErrorMaps = {};
+            }
             return nextTick().then(function () {
                 if (cb) {
                     cb();
@@ -242,11 +259,22 @@ var validatorHook = {
                 return beginValidate(rows, cb);
             },
             clearValidate: function (rows, fieldOrColumn) {
+                var validErrorMaps = reactData.validErrorMaps;
+                var validTip = refValidTooltip.value;
+                var validOpts = computeValidOpts.value;
                 var rowList = XEUtils.isArray(rows) ? rows : (rows ? [rows] : []);
                 var colList = (XEUtils.isArray(fieldOrColumn) ? fieldOrColumn : (fieldOrColumn ? [fieldOrColumn] : []).map(function (column) { return handleFieldOrColumn($xetable, column); }));
                 var validErrMaps = {};
+                if (validTip && validTip.reactData.visible) {
+                    validTip.close();
+                }
+                // 如果是单个提示模式
+                if (validOpts.msgMode === 'single') {
+                    reactData.validErrorMaps = {};
+                    return nextTick();
+                }
                 if (rowList.length && colList.length) {
-                    validErrMaps = Object.assign({}, reactData.validErrorMaps);
+                    validErrMaps = Object.assign({}, validErrorMaps);
                     rowList.forEach(function (row) {
                         colList.forEach(function (column) {
                             var vaildKey = "".concat(getRowid($xetable, row), ":").concat(column.id);
@@ -258,7 +286,7 @@ var validatorHook = {
                 }
                 else if (rowList.length) {
                     var rowidList_1 = rowList.map(function (row) { return "".concat(getRowid($xetable, row)); });
-                    XEUtils.each(reactData.validErrorMaps, function (item, key) {
+                    XEUtils.each(validErrorMaps, function (item, key) {
                         if (rowidList_1.indexOf(key.split(':')[0]) > -1) {
                             validErrMaps[key] = item;
                         }
@@ -266,7 +294,7 @@ var validatorHook = {
                 }
                 else if (colList.length) {
                     var colidList_1 = colList.map(function (column) { return "".concat(column.id); });
-                    XEUtils.each(reactData.validErrorMaps, function (item, key) {
+                    XEUtils.each(validErrorMaps, function (item, key) {
                         if (colidList_1.indexOf(key.split(':')[1]) > -1) {
                             validErrMaps[key] = item;
                         }
@@ -323,10 +351,10 @@ var validatorHook = {
                     if (rules_1) {
                         var cellValue_1 = XEUtils.isUndefined(val) ? XEUtils.get(row, field) : val;
                         rules_1.forEach(function (rule) {
-                            var type = rule.type, trigger = rule.trigger, required = rule.required;
+                            var type = rule.type, trigger = rule.trigger, required = rule.required, validator = rule.validator;
                             if (validType === 'all' || !trigger || validType === trigger) {
-                                if (XEUtils.isFunction(rule.validator)) {
-                                    var customValid = rule.validator({
+                                if (validator) {
+                                    var validParams = {
                                         cellValue: cellValue_1,
                                         rule: rule,
                                         rules: rules_1,
@@ -334,9 +362,32 @@ var validatorHook = {
                                         rowIndex: $xetable.getRowIndex(row),
                                         column: column,
                                         columnIndex: $xetable.getColumnIndex(column),
-                                        field: column.property,
-                                        $table: $xetable
-                                    });
+                                        field: column.field,
+                                        $table: $xetable,
+                                        $grid: $xetable.xegrid
+                                    };
+                                    var customValid = void 0;
+                                    if (XEUtils.isString(validator)) {
+                                        var gvItem = VXETable.validators.get(validator);
+                                        if (gvItem) {
+                                            if (gvItem.cellValidatorMethod) {
+                                                customValid = gvItem.cellValidatorMethod(validParams);
+                                            }
+                                            else {
+                                                if (process.env.NODE_ENV === 'development') {
+                                                    warnLog('vxe.error.notValidators', [validator]);
+                                                }
+                                            }
+                                        }
+                                        else {
+                                            if (process.env.NODE_ENV === 'development') {
+                                                errLog('vxe.error.notValidators', [validator]);
+                                            }
+                                        }
+                                    }
+                                    else {
+                                        customValid = validator(validParams);
+                                    }
                                     if (customValid) {
                                         if (XEUtils.isError(customValid)) {
                                             validRuleErr = true;
@@ -397,6 +448,12 @@ var validatorHook = {
                 var editStore = reactData.editStore;
                 var actived = editStore.actived;
                 var editOpts = computeEditOpts.value;
+                var validOpts = computeValidOpts.value;
+                // 检查清除校验消息
+                if (editRules && validOpts.msgMode === 'single') {
+                    reactData.validErrorMaps = {};
+                }
+                // 校验单元格
                 if (editConfig && editRules && actived.row) {
                     var _a = actived.args, row_1 = _a.row, column_1 = _a.column, cell_1 = _a.cell;
                     if (validatorPrivateMethods.hasCellRules(type, row_1, column_1)) {
@@ -422,18 +479,39 @@ var validatorHook = {
              * 弹出校验错误提示
              */
             showValidTooltip: function (params) {
-                var _a;
-                var validStore = reactData.validStore;
+                var _a, _b;
+                var height = props.height;
+                var tableData = reactData.tableData, validStore = reactData.validStore, validErrorMaps = reactData.validErrorMaps;
+                var validOpts = computeValidOpts.value;
+                var validTip = refValidTooltip.value;
                 validStore.visible = true;
-                reactData.validErrorMaps = Object.assign({}, reactData.validErrorMaps, (_a = {},
-                    _a["".concat(getRowid($xetable, params.row), ":").concat(params.column.id)] = {
-                        column: params.column,
-                        row: params.row,
-                        rule: params.rule,
-                        content: params.rule.content
-                    },
-                    _a));
+                if (validOpts.msgMode === 'single') {
+                    reactData.validErrorMaps = (_a = {},
+                        _a["".concat(getRowid($xetable, params.row), ":").concat(params.column.id)] = {
+                            column: params.column,
+                            row: params.row,
+                            rule: params.rule,
+                            content: params.rule.content
+                        },
+                        _a);
+                }
+                else {
+                    reactData.validErrorMaps = Object.assign({}, validErrorMaps, (_b = {},
+                        _b["".concat(getRowid($xetable, params.row), ":").concat(params.column.id)] = {
+                            column: params.column,
+                            row: params.row,
+                            rule: params.rule,
+                            content: params.rule.content
+                        },
+                        _b));
+                }
                 $xetable.dispatchEvent('valid-error', params, null);
+                if (validTip) {
+                    var cell = params.cell;
+                    if (validTip && (validOpts.message === 'tooltip' || (validOpts.message === 'default' && !height && tableData.length < 2))) {
+                        return validTip.open(cell, params.rule.content);
+                    }
+                }
                 return nextTick();
             }
         };

package/es/vxe-table/style.css

@@ -1238,6 +1238,7 @@
   display: inline-block;
   border-radius: var(--vxe-border-radius);
   color: var(--vxe-table-validate-error-color);
+  background-color: var(--vxe-table-validate-error-background-color);
   pointer-events: auto;
 }
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-default-input,
@@ -1248,7 +1249,10 @@
 .vxe-table--render-default .vxe-body--column.col--valid-error .vxe-input > .vxe-input--inner {
   border-color: var(--vxe-table-validate-error-color);
 }
-.vxe-table--render-default .vxe-body--row:last-child .vxe-cell--valid {
+.vxe-table--render-default.vaild-msg--single .vxe-body--row:last-child .vxe-cell--valid {
+  bottom: 100%;
+}
+.vxe-table--render-default.vaild-msg--full .vxe-body--row:last-child .vxe-cell--valid {
   top: calc(100% - 1.3em);
 }
 .vxe-table--render-default .vxe-body--row.row--new > .vxe-body--column {
@@ -1256,8 +1260,8 @@
 }
 .vxe-table--render-default .vxe-body--row.row--new > .vxe-body--column:before {
   content: "";
-  top: var(--vxe-table-cell-dirty-width);
-  left: var(--vxe-table-cell-dirty-width);
+  top: calc(var(--vxe-table-cell-dirty-width) * -1);
+  left: calc(var(--vxe-table-cell-dirty-width) * -1);
   position: absolute;
   border-width: var(--vxe-table-cell-dirty-width);
   border-style: solid;
@@ -1308,6 +1312,13 @@
   padding: 0;
 }
 
+/*valid error*/
+div.vxe-table--tooltip-wrapper.vxe-table--valid-error {
+  padding: 0;
+  color: var(--vxe-table-validate-error-color);
+  background-color: var(--vxe-table-validate-error-background-color);
+}
+
 /*footer*/
 .vxe-table--footer-wrapper {
   color: var(--vxe-table-footer-font-color);

package/es/vxe-tooltip/style.css

@@ -126,10 +126,4 @@
 }
 .vxe-table--tooltip-wrapper.theme--dark.placement--bottom .vxe-table--tooltip-arrow:before {
   border-bottom-color: var(--vxe-tooltip-dark-background-color);
-}
-
-/*valid error*/
-.vxe-table--tooltip-wrapper.vxe-table--valid-error {
-  background-color: var(--vxe-tooltip-validate-error-background-color);
-  color: var(--vxe-tooltip-validate-error-color);
 }