vhb-table
Version:
一个基于 vue 的 PC 端表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、贼灵活的配置项、扩展接口等...
1 lines • 13.9 kB
JavaScript
"use strict";function _typeof(t){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0,exports.renderOptgroup=renderOptgroup,exports.renderOption=renderOption;var _xeUtils=_interopRequireDefault(require("xe-utils")),_input=_interopRequireDefault(require("../../input/src/input")),_conf=_interopRequireDefault(require("../../v-h-b-table/src/conf")),_size=_interopRequireDefault(require("../../mixins/size")),_utils=_interopRequireWildcard(require("../../tools/utils")),_dom=_interopRequireDefault(require("../../tools/dom")),_event=require("../../tools/event");function _getRequireWildcardCache(t){if("function"!=typeof WeakMap)return null;var e=new WeakMap,i=new WeakMap;return(_getRequireWildcardCache=function(t){return t?i:e})(t)}function _interopRequireWildcard(t,e){if(!e&&t&&t.__esModule)return t;if(null===t||"object"!==_typeof(t)&&"function"!=typeof t)return{default:t};var i=_getRequireWildcardCache(e);if(i&&i.has(t))return i.get(t);var n={},o=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(var l in t)if("default"!==l&&Object.prototype.hasOwnProperty.call(t,l)){var s=o?Object.getOwnPropertyDescriptor(t,l):null;s&&(s.get||s.set)?Object.defineProperty(n,l,s):n[l]=t[l]}return n.default=t,i&&i.set(t,n),n}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 _xeUtils.default.uniqueId("opt_")}function getOptkey(t){return t.optionOpts.keyField||t.optionId||"_X_OPTION_KEY"}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 _=0;_<a.length;_++){var y=a[_],P=y.disabled;if(n||P||(n=y),s&&!P&&(l=y,!i))return{offsetOption:l};if(e===y[p]){if(s=y,i)return{offsetOption:o}}else P||(o=y)}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 _xeUtils.default.toValueString(i?i[t.labelField]:e)}function renderOption(a,u,t,p){var f=u.isGroup,c=u.labelField,h=u.valueField,d=u.optionKey,v=u.value,b=u.multiple,O=u.currentValue,g=u.optionOpts.useKey;return t.map(function(t,e){var i=t.slots,n=!f||isOptionVisible(t),o=p&&p.disabled||t.disabled,l=t[h],s=getOptid(u,t),r=i?i.default:null;return n?a("div",{key:g||d?s:e,class:["vhb-select-option",t.className,{"is--disabled":o,"is--selected":b?v&&-1<v.indexOf(l):v===l,"is--hover":O===l}],attrs:{optid:s},on:{mousedown:u.mousedownOptionEvent,click:function(t){o||u.changeOptionEvent(t,l)},mouseenter:function(){o||u.setCurrentOption(t)}}},r?u.callSlot(r,{option:t,$select:u},a):_utils.default.formatText((0,_utils.getFuncText)(t[c]))):null})}function renderOptgroup(s,r){var a=r.optionKey,t=r.visibleGroupList,u=r.groupLabelField,p=r.groupOptionsField,f=r.optionOpts.useKey;return t.map(function(t,e){var i=t.slots,n=getOptid(r,t),o=t.disabled,l=i?i.default:null;return s("div",{key:f||a?n:e,class:["vhb-optgroup",t.className,{"is--disabled":o}],attrs:{optid:n}},[s("div",{class:"vhb-optgroup--title"},l?r.callSlot(l,{option:t,$select:r},s):(0,_utils.getFuncText)(t[u])),s("div",{class:"vhb-optgroup--wrapper"},renderOption(s,r,t[p],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:"vhb-select--empty-placeholder"},e.emptyText||_conf.default.i18n("vhb.select.emptyText"))]}var _default2={name:"VhbSelect",mixins:[_size.default],props:{value:null,clearable:Boolean,placeholder:String,loading:Boolean,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,optionConfig:Object,className:[String,Function],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:{VhbInput:_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"},optionOpts:function(){return Object.assign({},_conf.default.select.optionConfig,this.optionConfig)},isGroup:function(){return this.fullGroupList.some(function(t){return t.options&&t.options.length})},multiMaxCharNum:function(){return _xeUtils.default.toNumber(this.multiCharOverflow)},selectLabel:function(){var i=this,t=this.value,e=this.multiple,n=this.multiMaxCharNum;return t&&e?(_xeUtils.default.isArray(t)?t:[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.cacheItemMap()},options:function(t){this.fullGroupList=[],this.fullOptionList=t,this.cacheItemMap()},optionGroups:function(t){this.fullOptionList=[],this.fullGroupList=t,this.cacheItemMap()}},created:function(){var t=this.options,e=this.optionGroups;e?this.fullGroupList=e:t&&(this.fullOptionList=t),this.cacheItemMap(),_event.GlobalEvent.on(this,"mousewheel",this.handleGlobalMousewheelEvent),_event.GlobalEvent.on(this,"mousedown",this.handleGlobalMousedownEvent),_event.GlobalEvent.on(this,"keydown",this.handleGlobalKeydownEvent),_event.GlobalEvent.on(this,"blur",this.handleGlobalBlurEvent)},beforeDestroy:function(){var t=this.$refs.panel;t&&t.parentNode&&t.parentNode.removeChild(t)},destroyed:function(){_event.GlobalEvent.off(this,"mousewheel"),_event.GlobalEvent.off(this,"mousedown"),_event.GlobalEvent.off(this,"keydown"),_event.GlobalEvent.off(this,"blur")},render:function(t){var e,i,n=this.$scopedSlots,o=this.vSize,l=this.className,s=this.inited,r=this.isActivated,a=this.loading,u=this.disabled,p=this.visiblePanel,f=n.prefix;return t("div",{class:["vhb-select",l?_xeUtils.default.isFunction(l)?l({$select:this}):l:"",(e={},_defineProperty(e,"size--".concat(o),o),_defineProperty(e,"is--visivle",p),_defineProperty(e,"is--disabled",u),_defineProperty(e,"is--loading",a),_defineProperty(e,"is--active",r),e)]},[t("div",{class:"vhb-select-slots",ref:"hideOption"},this.$slots.default),t("vhb-input",{ref:"input",props:{clearable:this.clearable,placeholder:this.placeholder,readonly:!0,disabled:u,type:"text",prefixIcon:this.prefixIcon,suffixIcon:a?_conf.default.icon.SELECT_LOADED:p?_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},scopedSlots:f?{prefix:function(){return f({})}}:{}}),t("div",{ref:"panel",class:["vhb-table--ignore-clear vhb-select--panel",(i={},_defineProperty(i,"size--".concat(o),o),_defineProperty(i,"is--transfer",this.transfer),_defineProperty(i,"animat--leave",!a&&this.animatVisible),_defineProperty(i,"animat--enter",!a&&p),i)],attrs:{placement:this.panelPlacement},style:this.panelStyle},s?[t("div",{ref:"optWrapper",class:"vhb-select-option--wrapper"},renderOpts(t,this))]:null)])},methods:{callSlot:function(t,e,i){if(t){var n=this.$scopedSlots;if(_xeUtils.default.isString(t)&&(t=n[t]||null),_xeUtils.default.isFunction(t))return t.call(this,e,i)}return[]},cacheItemMap: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("[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}))},mousedownOptionEvent:function(t){0===t.button&&t.stopPropagation()},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&&(_dom.default.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=_dom.default.getEventTargetNode(t,i).flag||_dom.default.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<_utils.default.getLastZIndex()&&(this.panelIndex=_utils.default.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,t=this.loading,e=this.disabled;t||e||(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=_dom.default.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;