UNPKG

vxe-table-demonic

Version:

一个基于 vue 的 PC 端表单/表格组件,支持增删改查、虚拟列表、虚拟树、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、弹窗、自定义模板、渲染器、JSON 配置式...

1 lines 16.1 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireWildcard(require("xe-utils")),_conf=_interopRequireDefault(require("../../v-x-e-table/src/conf")),_size=require("../../hooks/size"),_dom=require("../../tools/dom"),_utils=require("../../tools/utils"),_event=require("../../tools/event"),_input=_interopRequireDefault(require("../../input/src/input")),_vn=require("../../tools/vn");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _getRequireWildcardCache(e){var t,n;return"function"!=typeof WeakMap?null:(t=new WeakMap,n=new WeakMap,(_getRequireWildcardCache=function(e){return e?n:t})(e))}function _interopRequireWildcard(e,t){if(!t&&e&&e.__esModule)return e;if(null===e||"object"!=typeof e&&"function"!=typeof e)return{default:e};t=_getRequireWildcardCache(t);if(t&&t.has(e))return t.get(e);var n,i,o={},l=Object.defineProperty&&Object.getOwnPropertyDescriptor;for(n in e)"default"!==n&&Object.prototype.hasOwnProperty.call(e,n)&&((i=l?Object.getOwnPropertyDescriptor(e,n):null)&&(i.get||i.set)?Object.defineProperty(o,n,i):o[n]=e[n]);return o.default=e,t&&t.set(e,o),o}var __assign=function(){return(__assign=Object.assign||function(e){for(var t,n=1,i=arguments.length;n<i;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e}).apply(this,arguments)};function isOptionVisible(e){return!1!==e.visible}function getOptUniqueId(){return _xeUtils.default.uniqueId("opt_")}var _default=(0,_vue.defineComponent)({name:"VxeSelect",props:{modelValue:null,clearable:Boolean,placeholder:{type: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],popupClassName:[String,Function],max:{type:[String,Number],default:null},size:{type:String,default:function(){return _conf.default.select.size||_conf.default.size}},filterable:{type:Boolean,default:function(){return _conf.default.select.filterable}},filterMethod:Function,remote:Boolean,remoteMethod:Function,emptyText:String,optionId:{type:String,default:function(){return _conf.default.select.optionId}},optionKey:Boolean,transfer:{type:Boolean,default:function(){return _conf.default.select.transfer}}},emits:["update:modelValue","change","clear"],setup:function(x,e){function O(e,t){return e&&(_xeUtils.default.isString(e)&&(e=V[e]||null),_xeUtils.default.isFunction(e))?(0,_vn.getSlotVNs)(e(t)):[]}function o(t){var e=T.remoteValueList,n=P.value,e=(e=e.find(function(e){return t===e.key}))?e.result:null;return _xeUtils.default.toValueString(e?e[n]:t)}function l(e){var t=P.value,n=m(e);return _xeUtils.default.toValueString(n?n[t]:e)}function t(){var e=x.modelValue,t=x.multiple,n=x.remote,i=X.value;e&&t?(t=_xeUtils.default.isArray(e)?e:[e],N.value=(n?t.map(o):t.map(function(e){e=l(e);return 0<i&&e.length>i?"".concat(e.substring(0,i),"..."):e})).join(", ")):N.value=(n?o:l)(e)}function u(e){var t=x.filterable,n=x.filterMethod,i=x.multiple,o=T.fullOptionList,l=T.fullGroupList,u=G.value,r=H.value,a=P.value,s=n&&(0,_xeUtils.isFunction)(n)?n:i?function(e){var t=e.group,n=e.option,e=e.searchValue,e=e?e.split(","):[];return!(0<e.length)||e.some(function(e){return t&&-1<t[r].indexOf(e)||n&&-1<n[a].indexOf(e)})}:function(e){var t=e.group,n=e.option,e=e.searchValue;return t&&-1<t[r].indexOf(e)||n&&-1<n[a].indexOf(e)};return u?T.visibleGroupList=t?e?l.filter(function(e){return isOptionVisible(e)}).map(function(e){return __assign(__assign({},e),{options:e.options.filter(function(e){return isOptionVisible(e)})})}):l.map(function(e){return!isOptionVisible(e)||N.value&&!s({group:e,option:null,searchValue:N.value})?__assign(__assign({},e),{options:e.options?e.options.filter(function(e){return isOptionVisible(e)&&(!N.value||s({group:null,option:e,searchValue:N.value}))}):[]}):e}):l.filter(isOptionVisible).map(function(e){return __assign(__assign({},e),{options:e.options?e.options.filter(isOptionVisible):[]})}):T.visibleOptionList=t?e?o.filter(function(e){return isOptionVisible(e)}):o.filter(function(e){return isOptionVisible(e)&&s({group:null,option:e,searchValue:N.value})}):o.filter(isOptionVisible),(0,_vue.nextTick)()}function n(e){function t(e){C(e)||(e[l]=getOptUniqueId())}var n=T.fullOptionList,i=T.fullGroupList,o=g.value,l=J();i.length?i.forEach(function(e){t(e),e[o]&&e[o].forEach(t)}):n.length&&n.forEach(t),u(!!e)}function E(e){var t=S.value;e&&(T.currentOption=e,T.currentValue=e[t])}function v(i,o){(0,_vue.nextTick)().then(function(){var e,t,n;i&&(e=B.value,t=h.value.querySelector("[optid='".concat(C(i),"']")),e)&&t&&(n=e.offsetHeight,o?t.offsetTop+t.offsetHeight-e.scrollTop>n&&(e.scrollTop=t.offsetTop+t.offsetHeight-n):(t.offsetTop+5<e.scrollTop||t.offsetTop+5>e.scrollTop+e.clientHeight)&&(e.scrollTop=t.offsetTop-5))})}function r(){(0,_vue.nextTick)().then(function(){var e,t,n,i,o,l,u,r=x.transfer,a=x.placement,s=T.panelIndex,c=_.value,f=h.value;if(f&&c)return e=c.offsetHeight,t=c.offsetWidth,n=f.offsetHeight,f=f.offsetWidth,s={zIndex:s},i=(c=(0,_dom.getAbsolutePos)(c)).boundingTop,u=c.boundingLeft,o=c.visibleHeight,c=c.visibleWidth,l="bottom",r?(r=i+e,"top"===a?(l="top",r=i-n):a||(o<r+n+5&&(l="top",r=i-n),r<5&&(l="bottom",r=i+e)),c<(u=u)+f+5&&(u-=u+f+5-c),u<5&&(u=5),Object.assign(s,{left:"".concat(u,"px"),top:"".concat(r,"px"),minWidth:"".concat(t,"px")})):"top"===a?(l="top",s.bottom="".concat(e,"px")):a||o<i+e+n&&5<i-e-n&&(l="top",s.bottom="".concat(e,"px")),T.panelStyle=s,T.panelPlacement=l,(0,_vue.nextTick)()})}function q(e,t){Q(t,null),A()}function y(e,t,n){var i=x.modelValue,o=x.multiple,l=T.remoteValueList;o?(o=void 0,o=i?-1===i.indexOf(t)?i.concat([t]):i.filter(function(e){return e!==t}):[t],(i=l.find(function(e){return e.key===t}))?i.result=n:l.push({key:t,result:n}),I(e,o)):(T.remoteValueList=[{key:t,result:n}],I(e,t),A())}function U(e){var t=x.disabled,n=T.visiblePanel;t||n&&(t=h.value,((0,_dom.getEventTargetNode)(e,t).flag?r:A)())}function K(e){var t,n=x.disabled,i=T.visiblePanel;n||(n=_.value,t=h.value,T.isActivated=(0,_dom.getEventTargetNode)(e,n).flag||(0,_dom.getEventTargetNode)(e,t).flag,i&&!T.isActivated&&A())}function j(e){var t,n,i,o,l,u,r=x.clearable,a=x.disabled,s=T.visiblePanel,c=T.currentValue,f=T.currentOption;a||(a=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.TAB),t=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.ENTER),u=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.ESCAPE),n=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.ARROW_UP),i=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.ARROW_DOWN),o=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.DELETE),l=(0,_event.hasEventKey)(e,_event.EVENT_KEYS.SPACEBAR),a&&(T.isActivated=!1),s?u||a?A():t?(e.preventDefault(),e.stopPropagation(),y(e,c,f)):n||i?(e.preventDefault(),u=(s=function(e,t){var n,i,o,l,u=T.visibleOptionList,r=T.visibleGroupList,a=G.value,s=S.value,c=g.value;if(a)for(var f=0;f<r.length;f++){var v=r[f],p=v[c],d=v.disabled;if(p)for(var _=0;_<p.length;_++){var b=isOptionVisible(m=p[_]),h=d||m.disabled;if(n||h||(n=m),l&&b&&!h&&(o=m,!t))return{offsetOption:o};if(e===m[s]){if(l=m,t)return{offsetOption:i}}else b&&!h&&(i=m)}}else for(_=0;_<u.length;_++){var m,h=(m=u[_]).disabled;if(n||h||(n=m),l&&!h&&(o=m,!t))return{offsetOption:o};if(e===m[s]){if(l=m,t)return{offsetOption:i}}else h||(i=m)}return{firstOption:n}}(c,n)).firstOption,(a=s.offsetOption)||m(c)||(a=u),E(a),v(a,i)):l&&e.preventDefault():(n||i||t||l)&&T.isActivated&&(e.preventDefault(),w()),T.isActivated&&o&&r&&Q(e,null))}function D(){A()}function M(){x.disabled||(T.isActivated=!0,w())}function R(){T.isActivated=!1}function d(e){e.$event.preventDefault(),(T.visiblePanel?A:w)()}var i,a,V=e.slots,s=e.emit,c=(0,_vue.inject)("$xeform",null),f=(0,_vue.inject)("$xeformiteminfo",null),W=_xeUtils.default.uniqueId(),F=(0,_size.useSize)(x),T=(0,_vue.reactive)({inited:!1,staticOptions:[],fullGroupList:null!=(i=x.optionGroups)?i:[],fullOptionList:null!=(i=x.options)?i:[],visibleGroupList:[],visibleOptionList:[],remoteValueList:[],panelIndex:0,panelStyle:{},panelPlacement:null,currentOption:null,currentValue:null,visiblePanel:!1,animatVisible:!1,isActivated:!1,searchLoading:!1}),_=(0,_vue.ref)(),b=(0,_vue.ref)(),B=(0,_vue.ref)(),h=(0,_vue.ref)(),$={refElem:_},L={xID:W,props:x,context:e,reactData:T,getRefMaps:function(){return $}},p={},z=(0,_vue.computed)(function(){return x.optionProps||{}}),Y=(0,_vue.computed)(function(){return x.optionGroupProps||{}}),P=(0,_vue.computed)(function(){return z.value.label||"label"}),S=(0,_vue.computed)(function(){return z.value.value||"value"}),H=(0,_vue.computed)(function(){return Y.value.label||"label"}),g=(0,_vue.computed)(function(){return Y.value.options||"options"}),Z=(0,_vue.computed)(function(){var e=x.modelValue,t=x.multiple,n=x.max;return!(!t||!n)&&(e?e.length:0)>=_xeUtils.default.toNumber(n)}),k=(0,_vue.computed)(function(){return Object.assign({},_conf.default.select.optionConfig,x.optionConfig)}),G=(0,_vue.computed)(function(){return T.fullGroupList.some(function(e){return e.options&&e.options.length})}),X=(0,_vue.computed)(function(){return _xeUtils.default.toNumber(x.multiCharOverflow)}),m=function(t){var e=T.fullOptionList,n=T.fullGroupList,i=G.value,o=S.value;if(i)for(var l=0;l<n.length;l++){var u=n[l];if(u.options)for(var r=0;r<u.options.length;r++){var a=u.options[r];if(t===a[o])return a}}return e.find(function(e){return t===e[o]})},N=(0,_vue.ref)(""),J=((0,_vue.watchEffect)(t),function(){return k.value.keyField||x.optionId||"_X_OPTION_KEY"}),C=function(e){e=e[J()];return e?encodeURIComponent(e):""},w=function(e){var t=x.loading,n=x.remote,i=x.remoteMethod,o=x.disabled,l=x.filterable;t||o||(clearTimeout(a),T.inited||(T.inited=!0),T.isActivated=!0,T.animatVisible=!0,n&&i?(T.searchLoading=!0,Promise.resolve(i({searchValue:N.value})).then(function(){return(0,_vue.nextTick)()}).catch(function(){return(0,_vue.nextTick)()}).finally(function(){T.searchLoading=!1,u(!0)})):l&&u(!e),setTimeout(function(){var e=x.modelValue,t=x.multiple,t=m(t&&e?e[0]:e);T.visiblePanel=!0,t&&(E(t),v(t))},10),T.panelIndex<(0,_utils.getLastZIndex)()&&(T.panelIndex=(0,_utils.nextZIndex)()),r())},A=function(){var e;t(),T.searchLoading=!1,T.visiblePanel=!1,T.isActivated=!1,null!=(e=b.value)&&e.blur(),a=window.setTimeout(function(){T.animatVisible=!1},350)},I=function(e,t){t!==x.modelValue&&(s("update:modelValue",t),p.dispatchEvent("change",{value:t},e),c)&&f&&c.triggerItemEvent(e,f.itemConfig.field,t)},Q=function(e,t){T.remoteValueList=[],I(e,t),p.dispatchEvent("clear",{value:t},e)},ee=_xeUtils.default.debounce(function(){var e=x.remote,t=x.remoteMethod;e&&t?(T.searchLoading=!0,Promise.resolve(t({searchValue:N.value})).then(function(){return(0,_vue.nextTick)()}).catch(function(){return(0,_vue.nextTick)()}).finally(function(){T.searchLoading=!1,w(!0)})):w(!0)},350,{trailing:!0}),te=function(e,c){var f=x.optionKey,v=x.modelValue,p=x.multiple,d=T.currentValue,t=k.value,_=P.value,b=S.value,h=G.value,m=t.useKey,g=V.option;return e.map(function(t,e){var n=t.slots,i=t.className,o=t[b],l=p?v&&-1<v.indexOf(o):v===o,u=!h||isOptionVisible(t),r=(s=l,a=c,!!t.disabled||!(!a||!a.disabled)||!(!Z.value||s)),a=C(t),s=n?n.default:null,n={option:t,group:null,$select:L};return u?(0,_vue.h)("div",{key:m||f?a:e,class:["vxe-select-option",i?_xeUtils.default.isFunction(i)?i(n):i:"",{"is--disabled":r,"is--selected":l,"is--hover":d===o}],optid:a,onMousedown:function(e){0===e.button&&e.stopPropagation()},onClick:function(e){!r&&T.visiblePanel&&y(e,o,t)},onMouseenter:function(){r||E(t)}},g?O(g,n):s?O(s,n):(0,_utils.formatText)((0,_utils.getFuncText)(t[_]))):null})},ne=function(){var r=x.optionKey,e=T.visibleGroupList,t=k.value,a=H.value,s=g.value,c=t.useKey,f=V.option;return e.map(function(e,t){var n=e.slots,i=e.className,o=C(e),l=e.disabled,n=n?n.default:null,u={option:e,group:e,$select:L};return(0,_vue.h)("div",{key:c||r?o:t,class:["vxe-optgroup",i?_xeUtils.default.isFunction(i)?i(u):i:"",{"is--disabled":l}],optid:o},[(0,_vue.h)("div",{class:"vxe-optgroup--title"},f?O(f,u):n?O(n,u):(0,_utils.getFuncText)(e[a])),(0,_vue.h)("div",{class:"vxe-optgroup--wrapper"},te(e[s]||[],e))])})},p={dispatchEvent:function(e,t,n){s(e,Object.assign({$select:L,$event:n},t))},isPanelVisible:function(){return T.visiblePanel},togglePanel:function(){return(T.visiblePanel?A:w)(),(0,_vue.nextTick)()},hidePanel:function(){return T.visiblePanel&&A(),(0,_vue.nextTick)()},showPanel:function(){return T.visiblePanel||w(),(0,_vue.nextTick)()},refreshOption:u,focus:function(){var e=b.value;return T.isActivated=!0,e.blur(),(0,_vue.nextTick)()},blur:function(){return b.value.blur(),(T.isActivated=!1,_vue.nextTick)()}};Object.assign(L,p),(0,_vue.watch)(function(){return T.staticOptions},function(e){e.some(function(e){return e.options&&e.options.length})?(T.fullOptionList=[],T.fullGroupList=e):(T.fullGroupList=[],T.fullOptionList=e||[]),n()}),(0,_vue.watch)(function(){return x.options},function(e){T.fullGroupList=[],T.fullOptionList=e||[],n(!0)}),(0,_vue.watch)(function(){return x.optionGroups},function(e){T.fullOptionList=[],T.fullGroupList=e||[],n(!0)}),(0,_vue.onMounted)(function(){(0,_vue.nextTick)(function(){var e=x.options,t=x.optionGroups;t?T.fullGroupList=t:e&&(T.fullOptionList=e),n(!0)}),_event.GlobalEvent.on(L,"mousewheel",U),_event.GlobalEvent.on(L,"mousedown",K),_event.GlobalEvent.on(L,"keydown",j),_event.GlobalEvent.on(L,"blur",D)}),(0,_vue.onUnmounted)(function(){_event.GlobalEvent.off(L,"mousewheel"),_event.GlobalEvent.off(L,"mousedown"),_event.GlobalEvent.off(L,"keydown"),_event.GlobalEvent.off(L,"blur")});return L.renderVN=function(){var e=x.className,t=x.popupClassName,n=x.transfer,i=x.disabled,o=x.loading,l=x.filterable,u=T.inited,r=T.isActivated,a=T.visiblePanel,s=F.value,c=V.default,f=V.header,v=V.footer,p=V.prefix;return(0,_vue.h)("div",{ref:_,class:["vxe-select",e?_xeUtils.default.isFunction(e)?e({$select:L}):e:"",((e={})["size--".concat(s)]=s,e["is--visivle"]=a,e["is--disabled"]=i,e["is--filter"]=l,e["is--loading"]=o,e["is--active"]=r,e)]},[(0,_vue.h)("div",{class:"vxe-select-slots",ref:"hideOption"},c?c({}):[]),(0,_vue.h)(_input.default,{ref:b,clearable:x.clearable,placeholder:x.placeholder,readonly:!l,disabled:i,type:"text",prefixIcon:x.prefixIcon,suffixIcon:o?_conf.default.icon.SELECT_LOADED:a?_conf.default.icon.SELECT_OPEN:_conf.default.icon.SELECT_CLOSE,modelValue:N.value,onInput:function(e){e=e.$event.target;N.value=e.value},onClear:q,onMouseUp:d,onFocus:M,onBlur:R,onChange:ee,onSuffixClick:d},p?{prefix:function(){return p({})}}:{}),(0,_vue.h)(_vue.Teleport,{to:"body",disabled:!n||!u},[(0,_vue.h)("div",{ref:h,class:["vxe-table--ignore-clear vxe-select--panel",t?_xeUtils.default.isFunction(t)?t({$select:L}):t:"",((r={})["size--".concat(s)]=s,r["is--transfer"]=n,r["animat--leave"]=!o&&T.animatVisible,r["animat--enter"]=!o&&a,r)],placement:T.panelPlacement,style:T.panelStyle},u?[(0,_vue.h)("div",{class:"vxe-select--panel-wrapper"},[f?(0,_vue.h)("div",{class:"vxe-select--panel-header"},f(x)):(0,_vue.createCommentVNode)(),(0,_vue.h)("div",{class:"vxe-select--panel-body"},[(0,_vue.h)("div",{ref:B,class:"vxe-select-option--wrapper"},function(){var e=T.visibleGroupList,t=T.visibleOptionList,n=T.searchLoading,i=G.value;if(n)return[(0,_vue.h)("div",{class:"vxe-select--search-loading"},[(0,_vue.h)("i",{class:["vxe-select--search-icon",_conf.default.icon.SELECT_LOADED]}),(0,_vue.h)("span",{class:"vxe-select--search-text"},_conf.default.i18n("vxe.select.loadingText"))])];if(i){if(e.length)return ne()}else if(t.length)return te(t);return[(0,_vue.h)("div",{class:"vxe-select--empty-placeholder"},x.emptyText||_conf.default.i18n("vxe.select.emptyText"))]}())]),v?(0,_vue.h)("div",{class:"vxe-select--panel-footer"},v(x)):(0,_vue.createCommentVNode)()])]:[])])])},(0,_vue.provide)("$xeselect",L),L},render:function(){return this.renderVN()}});exports.default=_default;