UNPKG

vxe-table-demonic

Version:

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

1 lines 5.29 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_xeUtils=_interopRequireDefault(require("xe-utils")),_conf=_interopRequireDefault(require("../../v-x-e-table/src/conf")),_size=require("../../hooks/size"),_resize=require("../../tools/resize"),_dom=require("../../tools/dom"),_event=require("../../tools/event"),_index=_interopRequireDefault(require("../../loading/index"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=(0,_vue.defineComponent)({name:"VxeList",props:{data:Array,height:[Number,String],maxHeight:[Number,String],loading:Boolean,className:[String,Function],size:{type:String,default:function(){return _conf.default.list.size||_conf.default.size}},autoResize:{type:Boolean,default:function(){return _conf.default.list.autoResize}},syncResize:[Boolean,String,Number],scrollY:Object},emits:["scroll"],setup:function(a,e){function u(){I(),H()}function l(){return(0,_vue.nextTick)().then(function(){var e,t=h.scrollYLoad,n=p.scrollYStore,l=g.value,o=b.value,r=0;(e=l?(e=o.sItem?l.querySelector(o.sItem):e)||l.children[0]:e)&&(r=e.offsetHeight),r=Math.max(20,r),n.rowHeight=r,(t?(l=x.value,e=Math.max(8,Math.ceil(l.clientHeight/r)),t=o.oSize?_xeUtils.default.toNumber(o.oSize):_dom.browse.edge?10:0,n.offsetSize=t,n.visibleSize=e,n.endIndex=Math.max(n.startIndex,e+t,n.endIndex),u):H)(),h.rowHeight=r})}function n(){var e=x.value;return e&&(e.scrollTop=0),(0,_vue.nextTick)()}function o(e,t){var n=x.value;return _xeUtils.default.isNumber(e)&&(n.scrollLeft=e),_xeUtils.default.isNumber(t)&&(n.scrollTop=t),h.scrollYLoad?new Promise(function(e){setTimeout(function(){(0,_vue.nextTick)(function(){e()})},50)}):(0,_vue.nextTick)()}function r(){var e=p.lastScrollLeft,t=p.lastScrollTop;return n().then(function(){if(e||t)return p.lastScrollLeft=0,p.lastScrollTop=0,o(e,t)})}function t(){var e=_.value;return e.clientWidth&&e.clientHeight?l():Promise.resolve()}function s(e){var t=e.target,n=t.scrollTop,l=(t=t.scrollLeft)!==p.lastScrollLeft,o=n!==p.lastScrollTop;p.lastScrollTop=n,p.lastScrollLeft=t,h.scrollYLoad&&Y(e),z.dispatchEvent("scroll",{scrollLeft:t,scrollTop:n,isX:l,isY:o},e)}var i,c=e.slots,f=e.emit,d=_xeUtils.default.uniqueId(),v=(0,_size.useSize)(a),h=(0,_vue.reactive)({scrollYLoad:!1,bodyHeight:0,rowHeight:0,topSpaceHeight:0,items:[]}),_=(0,_vue.ref)(),x=(0,_vue.ref)(),g=(0,_vue.ref)(),p={fullData:[],lastScrollLeft:0,lastScrollTop:0,scrollYStore:{startIndex:0,endIndex:0,visibleSize:0,offsetSize:0,rowHeight:0}},m={refElem:_},S={xID:d,props:a,context:e,reactData:h,internalData:p,getRefMaps:function(){return m}},z={},b=(0,_vue.computed)(function(){return Object.assign({},_conf.default.list.scrollY,a.scrollY)}),T=(0,_vue.computed)(function(){var e=a.height,t=a.maxHeight,n={};return e?n.height="".concat(isNaN(e)?e:"".concat(e,"px")):t&&(n.height="auto",n.maxHeight="".concat(isNaN(t)?t:"".concat(t,"px"))),n}),H=function(){var e=h.scrollYLoad,t=p.scrollYStore,n=p.fullData;h.bodyHeight=e?n.length*t.rowHeight:0,h.topSpaceHeight=e?Math.max(t.startIndex*t.rowHeight,0):0},I=function(){var e=h.scrollYLoad,t=p.fullData,n=p.scrollYStore;return h.items=e?t.slice(n.startIndex,n.endIndex):t.slice(0),(0,_vue.nextTick)()},Y=function(e){var t=p.scrollYStore,n=t.startIndex,l=t.endIndex,o=t.visibleSize,r=t.offsetSize,i=t.rowHeight,e=e.target.scrollTop,e=Math.floor(e/i),i=Math.max(0,e-1-r),r=e+o+r;!(e<=n||l-o-1<=e)||n===i&&l===r||(t.startIndex=i,t.endIndex=r,u())},z={dispatchEvent:function(e,t,n){f(e,Object.assign({$list:S,$event:n},t))},loadData:function(e){var t=p.scrollYStore,n=b.value,e=e||[];return Object.assign(t,{startIndex:0,endIndex:1,visibleSize:0}),p.fullData=e,h.scrollYLoad=!!n.enabled&&-1<n.gt&&(0===n.gt||n.gt<=e.length),I(),l().then(function(){r()})},reloadData:function(e){return n(),z.loadData(e)},recalculate:t,scrollTo:o,refreshScroll:r,clearScroll:n},D=(Object.assign(S,z),(0,_vue.ref)(0));(0,_vue.watch)(function(){return a.data?a.data.length:-1},function(){D.value++}),(0,_vue.watch)(function(){return a.data},function(){D.value++}),(0,_vue.watch)(D,function(){z.loadData(a.data||[])}),(0,_vue.watch)(function(){return a.syncResize},function(e){e&&(t(),(0,_vue.nextTick)(function(){return setTimeout(t)}))}),(0,_vue.onActivated)(function(){t().then(r)}),(0,_vue.nextTick)(function(){var e;_event.GlobalEvent.on(S,"resize",function(){t()}),a.autoResize&&(e=_.value,(i=(0,_resize.createResizeEvent)(t)).observe(e)),z.loadData(a.data||[])}),(0,_vue.onUnmounted)(function(){i&&i.disconnect(),_event.GlobalEvent.off(S,"resize")});return S.renderVN=function(){var e=a.className,t=a.loading,n=h.bodyHeight,l=h.topSpaceHeight,o=h.items,r=v.value,i=T.value;return(0,_vue.h)("div",{ref:_,class:["vxe-list",e?_xeUtils.default.isFunction(e)?e({$list:S}):e:"",((e={})["size--".concat(r)]=r,e["is--loading"]=t,e)]},[(0,_vue.h)("div",{ref:x,class:"vxe-list--virtual-wrapper",style:i,onScroll:s},[(0,_vue.h)("div",{class:"vxe-list--y-space",style:{height:n?"".concat(n,"px"):""}}),(0,_vue.h)("div",{ref:g,class:"vxe-list--body",style:{marginTop:l?"".concat(l,"px"):""}},c.default?c.default({items:o,$list:S}):[])]),(0,_vue.h)(_index.default,{class:"vxe-list--loading",modelValue:t})])},S},render:function(){return this.renderVN()}});exports.default=_default;