yw-common-list
Version:
基于vxe-table封装的自定义可配置表格
1 lines • 5.64 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_conf=_interopRequireDefault(require("../../v-x-e-table/src/conf")),_size=_interopRequireDefault(require("../../mixins/size")),_utils=_interopRequireDefault(require("../../tools/utils")),_dom=_interopRequireDefault(require("../../tools/dom"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _defineProperty(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function updateTipStyle(e){var t,i,n,o,r,l,s,a,u=e.$el,c=e.tipTarget,e=e.tipStore;c&&(t=(n=_dom.default.getDomNode()).scrollTop,i=n.scrollLeft,n=n.visibleWidth,o=(r=_dom.default.getAbsolutePos(c)).top,r=r.left,l=u.offsetHeight,u=u.offsetWidth,s=o-l-6,i+n<(a=Math.max(6,r+Math.floor((c.offsetWidth-u)/2)))+u+6&&(a=i+n-u-6),o-l<t+6&&(e.placement="bottom",s=o+c.offsetHeight+6),e.style.top="".concat(s,"px"),e.style.left="".concat(a,"px"),e.arrowStyle.left="".concat(r-a+c.offsetWidth/2,"px"))}function showTip(e){var t=e.$el,i=e.tipStore,n=e.zIndex;return t.parentNode||document.body.appendChild(t),e.updateValue(!0),e.updateZindex(),i.placement="top",i.style={width:"auto",left:0,top:0,zIndex:n||e.tipZindex},i.arrowStyle={left:"50%"},e.updatePlacement()}function renderContent(e,t){var i=t.$scopedSlots,n=t.useHTML,t=t.tipContent;return i.content?e("div",{key:1,class:"vxe-table--tooltip-content"},i.content.call(this,{})):n?e("div",{key:2,class:"vxe-table--tooltip-content",domProps:{innerHTML:t}}):e("div",{key:3,class:"vxe-table--tooltip-content"},_utils.default.formatText(t))}var _default2={name:"VxeTooltip",mixins:[_size.default],props:{value:Boolean,size:{type:String,default:function(){return _conf.default.tooltip.size||_conf.default.size}},trigger:{type:String,default:function(){return _conf.default.tooltip.trigger}},theme:{type:String,default:function(){return _conf.default.tooltip.theme}},content:{type:[String,Number],default:null},useHTML:Boolean,zIndex:[String,Number],isArrow:{type:Boolean,default:!0},enterable:Boolean,enterDelay:{type:Number,default:function(){return _conf.default.tooltip.enterDelay}},leaveDelay:{type:Number,default:function(){return _conf.default.tooltip.leaveDelay}}},data:function(){return{isUpdate:!1,visible:!1,tipContent:"",tipActive:!1,tipTarget:null,tipZindex:0,tipStore:{style:{},placement:"",arrowStyle:null}}},watch:{content:function(e){this.tipContent=e},value:function(e){this.isUpdate||this[e?"open":"close"](),this.isUpdate=!1}},created:function(){var e=this;this.showDelayTip=_xeUtils.default.debounce(function(){e.tipActive&&showTip(e)},this.enterDelay,{leading:!1,trailing:!0})},mounted:function(){var i,n=this.$el,e=this.trigger,t=this.content,o=this.value,r=n.parentNode;r&&(this.tipContent=t,this.tipZindex=_utils.default.nextZIndex(),_xeUtils.default.arrayEach(n.children,function(e,t){1<t&&(r.insertBefore(e,n),i=i||e)}),r.removeChild(n),(this.target=i)&&("hover"===e?(i.onmouseleave=this.targetMouseleaveEvent,i.onmouseenter=this.targetMouseenterEvent):"click"===e&&(i.onclick=this.clickEvent)),o&&this.open())},beforeDestroy:function(){var e=this.$el,t=this.target,i=this.trigger,n=e.parentNode;n&&n.removeChild(e),t&&("hover"===i?(t.onmouseenter=null,t.onmouseleave=null):"click"===i&&(t.onclick=null))},render:function(e){var t,i=this.$scopedSlots,n=this.vSize,o=this.theme,r=this.tipActive,l=this.isArrow,s=this.visible,a=this.tipStore,u=this.enterable;return u&&(t={mouseenter:this.wrapperMouseenterEvent,mouseleave:this.wrapperMouseleaveEvent}),e("div",{class:["vxe-table--tooltip-wrapper","theme--".concat(o),(_defineProperty(o={},"size--".concat(n),n),_defineProperty(o,"placement--".concat(a.placement),a.placement),_defineProperty(o,"is--enterable",u),_defineProperty(o,"is--visible",s),_defineProperty(o,"is--arrow",l),_defineProperty(o,"is--actived",r),o)],style:a.style,ref:"tipWrapper",on:t},[renderContent(e,this),e("div",{class:"vxe-table--tooltip-arrow",style:a.arrowStyle})].concat(i.default?i.default.call(this,{}):[]))},methods:{open:function(e,t){return this.toVisible(e||this.target,t)},close:function(){return this.tipTarget=null,this.tipActive=!1,Object.assign(this.tipStore,{style:{},placement:"",arrowStyle:null}),this.updateValue(!1),this.$nextTick()},updateValue:function(e){e!==this.visible&&(this.visible=e,this.isUpdate=!0,this.$listeners.input&&this.$emit("input",this.visible))},updateZindex:function(){this.tipZindex<_utils.default.getLastZIndex()&&(this.tipZindex=_utils.default.nextZIndex())},toVisible:function(e,t){if(e){var i=this.trigger,n=this.enterDelay;if(this.tipActive=!0,this.tipTarget=e,t&&(this.tipContent=t),!n||"hover"!==i)return showTip(this);this.showDelayTip()}return this.$nextTick()},updatePlacement:function(){var t=this;return this.$nextTick().then(function(){var e=t.$el;if(t.tipTarget&&e)return updateTipStyle(t),t.$nextTick().then(function(){return updateTipStyle(t)})})},isActived:function(){return this.tipActive},setActived:function(e){this.tipActive=!!e},clickEvent:function(){this[this.visible?"close":"open"]()},targetMouseenterEvent:function(){this.open()},targetMouseleaveEvent:function(){var e=this,t=this.trigger,i=this.enterable,n=this.leaveDelay;this.tipActive=!1,i&&"hover"===t?setTimeout(function(){e.tipActive||e.close()},n):this.close()},wrapperMouseenterEvent:function(){this.tipActive=!0},wrapperMouseleaveEvent:function(){var e=this,t=this.trigger,i=this.enterable,n=this.leaveDelay;this.tipActive=!1,i&&"hover"===t&&setTimeout(function(){e.tipActive||e.close()},n)}}};exports.default=_default2;