vxe-table 4.2.0-beta.1 → 4.2.0-beta.2

package/es/form/src/form-item.js

@@ -115,9 +115,9 @@ export default defineComponent({
             }
             var ons = showTooltip ? {
                 onMouseenter: function (evnt) {
-                    $xeform.triggerHeaderHelpEvent(evnt, params);
+                    $xeform.triggerTitleTipEvent(evnt, params);
                 },
-                onMouseleave: $xeform.handleTargetLeaveEvent
+                onMouseleave: $xeform.handleTitleTipLeaveEvent
             } : {};
             return h('div', {
                 ref: refElem,

package/es/form/src/form.js

@@ -119,7 +119,6 @@ export default defineComponent({
         });
         var internalData = reactive({
             tooltipTimeout: null,
-            tooltipActive: false,
             tooltipStore: {
                 item: null,
                 visible: false
@@ -131,22 +130,8 @@ export default defineComponent({
         var computeValidOpts = computed(function () {
             return Object.assign({}, GlobalConfig.form.validConfig, props.validConfig);
         });
-        var computeTooltipOpts = ref();
-        var handleTooltipLeaveMethod = function () {
-            var tooltipOpts = computeTooltipOpts.value;
-            setTimeout(function () {
-                if (!internalData.tooltipActive) {
-                    formMethods.closeTooltip();
-                }
-            }, tooltipOpts.leaveDelay);
-            return false;
-        };
-        computeTooltipOpts = computed(function () {
-            var opts = Object.assign({ leaveDelay: 300 }, GlobalConfig.form.tooltipConfig, props.tooltipConfig);
-            if (opts.enterable) {
-                opts.leaveMethod = handleTooltipLeaveMethod;
-            }
-            return opts;
+        var computeTooltipOpts = computed(function () {
+            return Object.assign({}, GlobalConfig.tooltip, GlobalConfig.form.tooltipConfig, props.tooltipConfig);
         });
         var refMaps = {
             refElem: refElem
@@ -443,7 +428,7 @@ export default defineComponent({
             }
             return nextTick();
         };
-        var triggerHeaderHelpEvent = function (evnt, params) {
+        var triggerTitleTipEvent = function (evnt, params) {
             var item = params.item;
             var tooltipStore = internalData.tooltipStore;
             var $tooltip = refTooltip.value;
@@ -451,8 +436,9 @@ export default defineComponent({
             var content = (overflowElem.textContent || '').trim();
             var isCellOverflow = overflowElem.scrollWidth > overflowElem.clientWidth;
             clearTimeout(internalData.tooltipTimeout);
-            internalData.tooltipActive = true;
-            closeTooltip();
+            if (tooltipStore.item !== item) {
+                closeTooltip();
+            }
             if (content && isCellOverflow) {
                 Object.assign(tooltipStore, {
                     item: item,
@@ -463,10 +449,9 @@ export default defineComponent({
                 }
             }
         };
-        var handleTargetLeaveEvent = function () {
+        var handleTitleTipLeaveEvent = function () {
             var tooltipOpts = computeTooltipOpts.value;
             var $tooltip = refTooltip.value;
-            internalData.tooltipActive = false;
             if ($tooltip) {
                 $tooltip.setActived(false);
             }
@@ -508,7 +493,7 @@ export default defineComponent({
             var data = props.data, rules = props.rules, allTitleOverflow = props.titleOverflow;
             var collapseAll = reactData.collapseAll;
             var validOpts = computeValidOpts.value;
-            return itemList.map(function (item, index) {
+            return itemList.map(function (item) {
                 var slots = item.slots, title = item.title, visible = item.visible, folding = item.folding, visibleMethod = item.visibleMethod, field = item.field, collapseNode = item.collapseNode, itemRender = item.itemRender, showError = item.showError, errRule = item.errRule, className = item.className, titleOverflow = item.titleOverflow, children = item.children;
                 var compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null;
                 var defaultSlot = slots ? slots.default : null;
@@ -578,9 +563,9 @@ export default defineComponent({
                 }
                 var ons = showTooltip ? {
                     onMouseenter: function (evnt) {
-                        triggerHeaderHelpEvent(evnt, params);
+                        triggerTitleTipEvent(evnt, params);
                     },
-                    onMouseleave: handleTargetLeaveEvent
+                    onMouseleave: handleTitleTipLeaveEvent
                 } : {};
                 return h('div', {
                     class: ['vxe-form--item', item.id, span ? "vxe-col--" + span + " is--span" : '', className ? (XEUtils.isFunction(className) ? className(params) : className) : '', {
@@ -590,7 +575,7 @@ export default defineComponent({
                             'is--active': !itemVisibleMethod || itemVisibleMethod(params),
                             'is--error': showError
                         }],
-                    key: index
+                    key: item.id
                 }, [
                     h('div', {
                         class: 'vxe-form--item-inner'
@@ -624,8 +609,8 @@ export default defineComponent({
         var formPrivateMethods = {
             callSlot: callSlot,
             toggleCollapseEvent: toggleCollapseEvent,
-            triggerHeaderHelpEvent: triggerHeaderHelpEvent,
-            handleTargetLeaveEvent: handleTargetLeaveEvent
+            triggerTitleTipEvent: triggerTitleTipEvent,
+            handleTitleTipLeaveEvent: handleTitleTipLeaveEvent
         };
         Object.assign($xeform, formMethods, formPrivateMethods);
         watch(function () { return reactData.staticItems; }, function (value) {

package/es/form/src/render.js

@@ -1,3 +1,14 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 import { h, resolveComponent } from 'vue';
 import GlobalConfig from '../../v-x-e-table/src/conf';
 import { VXETable } from '../../v-x-e-table';
@@ -22,7 +33,9 @@ function renderSuffixIcon(titleSuffix) {
 }
 export function renderTitle($xeform, item) {
     var data = $xeform.props.data;
+    var computeTooltipOpts = $xeform.getComputeMaps().computeTooltipOpts;
     var slots = item.slots, field = item.field, itemRender = item.itemRender, titlePrefix = item.titlePrefix, titleSuffix = item.titleSuffix;
+    var tooltipOpts = computeTooltipOpts.value;
     var compConf = isEnableConf(itemRender) ? VXETable.renderer.get(itemRender.name) : null;
     var params = { data: data, property: field, item: item, $form: $xeform };
     var titleSlot = slots ? slots.title : null;
@@ -30,11 +43,7 @@ export function renderTitle($xeform, item) {
     var titVNs = [];
     if (titlePrefix) {
         titVNs.push((titlePrefix.content || titlePrefix.message)
-            ? h(resolveComponent('vxe-tooltip'), {
-                content: getFuncText(titlePrefix.content || titlePrefix.message),
-                enterable: titlePrefix.enterable,
-                theme: titlePrefix.theme
-            }, {
+            ? h(resolveComponent('vxe-tooltip'), __assign(__assign(__assign({}, tooltipOpts), titlePrefix), { content: getFuncText(titlePrefix.content || titlePrefix.message) }), {
                 default: function () { return renderPrefixIcon(titlePrefix); }
             })
             : renderPrefixIcon(titlePrefix));
@@ -48,11 +57,7 @@ export function renderTitle($xeform, item) {
     var fixVNs = [];
     if (titleSuffix) {
         fixVNs.push((titleSuffix.content || titleSuffix.message)
-            ? h(resolveComponent('vxe-tooltip'), {
-                content: getFuncText(titleSuffix.content || titleSuffix.message),
-                enterable: titleSuffix.enterable,
-                theme: titleSuffix.theme
-            }, {
+            ? h(resolveComponent('vxe-tooltip'), __assign(__assign(__assign({}, tooltipOpts), titleSuffix), { content: getFuncText(titleSuffix.content || titleSuffix.message) }), {
                 default: function () { return renderSuffixIcon(titleSuffix); }
             })
             : renderSuffixIcon(titleSuffix));

package/es/select/style.css

@@ -155,7 +155,7 @@
 
 .vxe-select-option {
   padding: 0 10px;
-  max-width: 400px;
+  max-width: 600px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;