UNPKG

vxe-table

Version:

一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、扩展接口等...

1 lines 11.9 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.renderOption=renderOption,exports.renderOptgroup=renderOptgroup,exports.default=void 0;var _ctor=_interopRequireDefault(require("xe-utils/ctor")),_input=_interopRequireDefault(require("../../input/src/input")),_conf=_interopRequireDefault(require("../../conf")),_size=_interopRequireDefault(require("../../mixins/size")),_tools=require("../../tools");function _interopRequireDefault(t){return t&&t.__esModule?t:{default:t}}function _defineProperty(t,e,i){return e in t?Object.defineProperty(t,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):t[e]=i,t}function isOptionVisible(t){return!1!==t.visible}function getOptUniqueId(){return _ctor.default.uniqueId("opt_")}function getOptkey(t){return t.optionId||"_XID"}function getOptid(t,e){var i=e[getOptkey(t)];return i?encodeURIComponent(i):""}function findOffsetOption(t,e,i){var n,o,l,s,r=t.isGroup,a=t.visibleOptionList,u=t.visibleGroupList,p=t.valueField,f=t.groupOptionsField;if(r)for(var c=0;c<u.length;c++){var h=u[c],d=h[f],v=h.disabled;if(d)for(var b=0;b<d.length;b++){var O=d[b],g=isOptionVisible(O),m=v||O.disabled;if(n||m||(n=O),s&&g&&!m&&(l=O,!i))return{offsetOption:l};if(e===O[p]){if(s=O,i)return{offsetOption:o}}else g&&!m&&(o=O)}}else for(var P=0;P<a.length;P++){var x=a[P],_=x.disabled;if(n||_||(n=x),s&&!_&&(l=x,!i))return{offsetOption:l};if(e===x[p]){if(s=x,i)return{offsetOption:o}}else _||(o=x)}return{firstOption:n}}function findOption(t,e){var i=t.isGroup,n=t.fullOptionList,o=t.fullGroupList,l=t.valueField;if(i)for(var s=0;s<o.length;s++){var r=o[s];if(r.options)for(var a=0;a<r.options.length;a++){var u=r.options[a];if(e===u[l])return u}}return n.find(function(t){return e===t[l]})}function getSelectLabel(t,e){var i=findOption(t,e);return _ctor.default.toString(i?i[t.labelField]:e)}function renderOption(s,r,t,a){var u=r.isGroup,p=r.labelField,f=r.valueField,c=r.optionKey,h=r.value,d=r.multiple,v=r.currentValue;return t.map(function(t,e){var i=!u||isOptionVisible(t),n=a&&a.disabled||t.disabled,o=t[f],l=getOptid(r,t);return i?s("div",{key:c?l:e,class:["vxe-select-option",{"is--disabled":n,"is--selected":d?h&&-1<h.indexOf(o):h===o,"is--hover":v===o}],attrs:{"data-optid":l},on:{click:function(t){n||r.changeOptionEvent(t,o)},mouseenter:function(){n||r.setCurrentOption(t)}}},_tools.UtilTools.formatText(_tools.UtilTools.getFuncText(t[p]))):null})}function renderOptgroup(o,l){var s=l.optionKey,t=l.visibleGroupList,r=l.groupLabelField,a=l.groupOptionsField;return t.map(function(t,e){var i=getOptid(l,t),n=t.disabled;return o("div",{key:s?i:e,class:["vxe-optgroup",{"is--disabled":n}],attrs:{"data-optid":i}},[o("div",{class:"vxe-optgroup--title"},_tools.UtilTools.getFuncText(t[r])),o("div",{class:"vxe-optgroup--wrapper"},renderOption(o,l,t[a],t))])})}function renderOpts(t,e){var i=e.isGroup,n=e.visibleGroupList,o=e.visibleOptionList;if(i){if(n.length)return renderOptgroup(t,e)}else if(o.length)return renderOption(t,e,o);return[t("div",{class:"vxe-select--empty-placeholder"},e.emptyText||_conf.default.i18n("vxe.select.emptyText"))]}var _default2={name:"VxeSelect",mixins:[_size.default],props:{value:null,clearable:Boolean,placeholder:String,disabled:Boolean,multiple:Boolean,multiCharOverflow:{type:[Number,String],default:function(){return _conf.default.select.multiCharOverflow}},prefixIcon:String,placement:String,options:Array,optionProps:Object,optionGroups:Array,optionGroupProps:Object,size:{type:String,default:function(){return _conf.default.select.size||_conf.default.size}},emptyText:String,optionId:{type:String,default:function(){return _conf.default.select.optionId}},optionKey:Boolean,transfer:{type:Boolean,default:function(){return _conf.default.select.transfer}}},components:{VxeInput:_input.default},provide:function(){return{$xeselect:this}},data:function(){return{inited:!1,collectOption:[],fullGroupList:[],fullOptionList:[],visibleGroupList:[],visibleOptionList:[],panelIndex:0,panelStyle:null,panelPlacement:null,currentValue:null,visiblePanel:!1,animatVisible:!1,isActivated:!1}},computed:{propsOpts:function(){return this.optionProps||{}},groupPropsOpts:function(){return this.optionGroupProps||{}},labelField:function(){return this.propsOpts.label||"label"},valueField:function(){return this.propsOpts.value||"value"},groupLabelField:function(){return this.groupPropsOpts.label||"label"},groupOptionsField:function(){return this.groupPropsOpts.options||"options"},isGroup:function(){return this.fullGroupList.some(function(t){return t.options&&t.options.length})},multiMaxCharNum:function(){return _ctor.default.toNumber(this.multiCharOverflow)},selectLabel:function(){var i=this,t=this.value,e=this.multiple,n=this.multiMaxCharNum;return t&&e?t.map(function(t){var e=getSelectLabel(i,t);return 0<n&&e.length>n?"".concat(e.substring(0,n),"..."):e}).join(", "):getSelectLabel(this,t)}},watch:{collectOption:function(t){t.some(function(t){return t.options&&t.options.length})?(this.fullOptionList=[],this.fullGroupList=t):(this.fullGroupList=[],this.fullOptionList=t),this.updateCache()},options:function(t){this.fullGroupList=[],this.fullOptionList=t,this.updateCache()},optionGroups:function(t){this.fullOptionList=[],this.fullGroupList=t,this.updateCache()}},created:function(){var t=this.options,e=this.optionGroups;e?this.fullGroupList=e:t&&(this.fullOptionList=t),this.updateCache(),_tools.GlobalEvent.on(this,"mousewheel",this.handleGlobalMousewheelEvent),_tools.GlobalEvent.on(this,"mousedown",this.handleGlobalMousedownEvent),_tools.GlobalEvent.on(this,"keydown",this.handleGlobalKeydownEvent),_tools.GlobalEvent.on(this,"blur",this.handleGlobalBlurEvent)},beforeDestroy:function(){var t=this.$refs.panel;t&&t.parentNode&&t.parentNode.removeChild(t)},destroyed:function(){_tools.GlobalEvent.off(this,"mousewheel"),_tools.GlobalEvent.off(this,"mousedown"),_tools.GlobalEvent.off(this,"keydown"),_tools.GlobalEvent.off(this,"blur")},render:function(t){var e,i,n=this.vSize,o=this.inited,l=this.isActivated,s=this.disabled,r=this.visiblePanel;return t("div",{class:["vxe-select",(e={},_defineProperty(e,"size--".concat(n),n),_defineProperty(e,"is--visivle",r),_defineProperty(e,"is--disabled",s),_defineProperty(e,"is--active",l),e)]},[t("div",{class:"vxe-select-slots",ref:"hideOption"},this.$slots.default),t("vxe-input",{ref:"input",props:{clearable:this.clearable,placeholder:this.placeholder,readonly:!0,disabled:s,type:"text",prefixIcon:this.prefixIcon,suffixIcon:r?_conf.default.icon.SELECT_OPEN:_conf.default.icon.SELECT_CLOSE,value:this.selectLabel},on:{clear:this.clearEvent,click:this.togglePanelEvent,focus:this.focusEvent,blur:this.blurEvent,"suffix-click":this.togglePanelEvent}}),t("div",{ref:"panel",class:["vxe-table--ignore-clear vxe-select--panel",(i={},_defineProperty(i,"size--".concat(n),n),_defineProperty(i,"is--transfer",this.transfer),_defineProperty(i,"animat--leave",this.animatVisible),_defineProperty(i,"animat--enter",r),i)],attrs:{"data-placement":this.panelPlacement},style:this.panelStyle},o?[t("div",{ref:"optWrapper",class:"vxe-select-option--wrapper"},renderOpts(t,this))]:null)])},methods:{updateCache:function(){var e=this,t=this.fullOptionList,i=this.fullGroupList,n=this.groupOptionsField,o=getOptkey(this),l=function(t){getOptid(e,t)||(t[o]=getOptUniqueId())};i.length?i.forEach(function(t){l(t),t[n]&&t[n].forEach(l)}):t.length&&t.forEach(l),this.refreshOption()},refreshOption:function(){var t=this.isGroup,e=this.fullOptionList,i=this.fullGroupList;return t?this.visibleGroupList=i.filter(isOptionVisible):this.visibleOptionList=e.filter(isOptionVisible),this.$nextTick()},setCurrentOption:function(t){t&&(this.currentValue=t[this.valueField])},scrollToOption:function(o,l){var s=this;return this.$nextTick().then(function(){if(o){var t=s.$refs,e=t.optWrapper,i=t.panel.querySelector("[data-optid='".concat(getOptid(s,o),"']"));if(e&&i){var n=e.offsetHeight;l?i.offsetTop+i.offsetHeight-e.scrollTop>n&&(e.scrollTop=i.offsetTop+i.offsetHeight-n):(i.offsetTop+5<e.scrollTop||i.offsetTop+5>e.scrollTop+e.clientHeight)&&(e.scrollTop=i.offsetTop-5)}}})},clearEvent:function(t,e){this.clearValueEvent(e,null),this.hideOptionPanel()},clearValueEvent:function(t,e){this.changeEvent(t,e),this.$emit("clear",{value:e,$event:t})},changeEvent:function(t,e){e!==this.value&&(this.$emit("input",e),this.$emit("change",{value:e,$event:t}))},changeOptionEvent:function(t,e){var i,n=this.value;this.multiple?(i=n?-1===n.indexOf(e)?n.concat([e]):n.filter(function(t){return t!==e}):[e],this.changeEvent(t,i)):(this.changeEvent(t,e),this.hideOptionPanel())},handleGlobalMousewheelEvent:function(t){var e=this.$refs,i=this.disabled,n=this.visiblePanel;i||n&&(_tools.DomTools.getEventTargetNode(t,e.panel).flag?this.updatePlacement():this.hideOptionPanel())},handleGlobalMousedownEvent:function(t){var e=this.$refs,i=this.$el,n=this.disabled,o=this.visiblePanel;n||(this.isActivated=_tools.DomTools.getEventTargetNode(t,i).flag||_tools.DomTools.getEventTargetNode(t,e.panel).flag,o&&!this.isActivated&&this.hideOptionPanel())},handleGlobalKeydownEvent:function(t){var e=this.visiblePanel,i=this.currentValue,n=this.clearable;if(!this.disabled){var o=t.keyCode,l=9===o,s=13===o,r=27===o,a=38===o,u=40===o,p=46===o,f=32===o;if(l&&(this.isActivated=!1),e)if(r||l)this.hideOptionPanel();else if(s)t.preventDefault(),t.stopPropagation(),this.changeOptionEvent(t,i);else if(a||u){t.preventDefault();var c=findOffsetOption(this,i,a),h=c.firstOption,d=c.offsetOption;d||findOption(this,i)||(d=h),this.setCurrentOption(d),this.scrollToOption(d,u)}else f&&t.preventDefault();else(a||u||s||f)&&this.isActivated&&(t.preventDefault(),this.showOptionPanel());this.isActivated&&p&&n&&this.clearValueEvent(t,null)}},handleGlobalBlurEvent:function(){this.hideOptionPanel()},updateZindex:function(){this.panelIndex<_tools.UtilTools.getLastZIndex()&&(this.panelIndex=_tools.UtilTools.nextZIndex())},focusEvent:function(){this.disabled||(this.isActivated=!0)},blurEvent:function(){this.isActivated=!1},isPanelVisible:function(){return this.visiblePanel},togglePanel:function(){this.visiblePanel?this.hideOptionPanel():this.showOptionPanel(),this.$nextTick()},hidePanel:function(){this.visiblePanel&&this.hideOptionPanel(),this.$nextTick()},showPanel:function(){this.visiblePanel||this.showOptionPanel(),this.$nextTick()},togglePanelEvent:function(t){t.$event.preventDefault(),this.visiblePanel?this.hideOptionPanel():this.showOptionPanel()},showOptionPanel:function(){var n=this;this.disabled||(clearTimeout(this.hidePanelTimeout),this.inited||(this.inited=!0,this.transfer&&document.body.appendChild(this.$refs.panel)),this.isActivated=!0,this.animatVisible=!0,setTimeout(function(){var t=n.value,e=n.multiple,i=findOption(n,e&&t?t[0]:t);n.visiblePanel=!0,i&&(n.setCurrentOption(i),n.scrollToOption(i))},10),this.updateZindex(),this.updatePlacement())},hideOptionPanel:function(){var t=this;this.visiblePanel=!1,this.hidePanelTimeout=setTimeout(function(){t.animatVisible=!1},350)},updatePlacement:function(){var m=this;return this.$nextTick().then(function(){var t=m.$refs,e=m.transfer,i=m.placement,n=m.panelIndex,o=t.input.$el,l=t.panel;if(l&&o){var s=o.offsetHeight,r=o.offsetWidth,a=l.offsetHeight,u=l.offsetWidth,p={zIndex:n},f=_tools.DomTools.getAbsolutePos(o),c=f.boundingTop,h=f.boundingLeft,d=f.visibleHeight,v=f.visibleWidth,b="bottom";if(e){var O=h,g=c+s;"top"===i?(b="top",g=c-a):i||(d<g+a+5&&(b="top",g=c-a),g<5&&(b="bottom",g=c+s)),v<O+u+5&&(O-=O+u+5-v),O<5&&(O=5),Object.assign(p,{left:"".concat(O,"px"),top:"".concat(g,"px"),minWidth:"".concat(r,"px")})}else"top"===i?(b="top",p.bottom="".concat(s,"px")):i||d<c+s+a&&5<c-s-a&&(b="top",p.bottom="".concat(s,"px"));return m.panelStyle=p,m.panelPlacement=b,m.$nextTick()}})},focus:function(){return this.isActivated=!0,this.$refs.input.focus(),this.$nextTick()},blur:function(){return this.hideOptionPanel(),this.$refs.input.blur(),this.$nextTick()}}};exports.default=_default2;