element-gui/lib/virtual.js

A Component Library for Vue.js.

module.exports=function(t){var e={};function i(s){if(e[s])return e[s].exports;var r=e[s]={i:s,l:!1,exports:{}};return t[s].call(r.exports,r,r.exports,i),r.l=!0,r.exports}return i.m=t,i.c=e,i.d=function(t,e,s){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:s})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var s=Object.create(null);if(i.r(s),Object.defineProperty(s,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)i.d(s,r,function(e){return t[e]}.bind(null,r));return s},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="/dist/",i(i.s=144)}({144:function(t,e,i){"use strict";i.r(e);var s="FRONT",r="BEHIND",n="INIT",o="FIXED",a="DYNAMIC",h=function(){function t(e,i){!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.init(e,i)}return t.prototype.init=function(t,e){this.param=t,this.callUpdate=e,this.sizes=new Map,this.firstRangeTotalSize=0,this.firstRangeAverageSize=0,this.fixedSizeValue=0,this.calcType=n,this.offset=0,this.direction="",this.range=Object.create(null),t&&this.checkRange(0,t.keeps-1)},t.prototype.destroy=function(){this.init(null,null)},t.prototype.getRange=function(){var t=Object.create(null);return t.start=this.range.start,t.end=this.range.end,t.padFront=this.range.padFront,t.padBehind=this.range.padBehind,t},t.prototype.isBehind=function(){return this.direction===r},t.prototype.isFront=function(){return this.direction===s},t.prototype.getOffset=function(t){return(t<1?0:this.getIndexOffset(t))+this.param.slotHeaderSize},t.prototype.updateParam=function(t,e){var i=this;this.param&&t in this.param&&("uniqueIds"===t&&this.sizes.forEach((function(t,s){e.includes(s)||i.sizes.delete(s)})),this.param[t]=e)},t.prototype.saveSize=function(t,e){this.sizes.set(t,e),this.calcType===n?(this.fixedSizeValue=e,this.calcType=o):this.calcType===o&&this.fixedSizeValue!==e&&(this.calcType=a,delete this.fixedSizeValue),this.calcType!==o&&void 0!==this.firstRangeTotalSize&&(this.sizes.size<Math.min(this.param.keeps,this.param.uniqueIds.length)?(this.firstRangeTotalSize=[].concat(this.sizes.values()).reduce((function(t,e){return t+e}),0),this.firstRangeAverageSize=Math.round(this.firstRangeTotalSize/this.sizes.size)):delete this.firstRangeTotalSize)},t.prototype.handleDataSourcesChange=function(){var t=this.range.start;this.isFront()?t-=0:this.isBehind()&&(t+=0),t=Math.max(t,0),this.updateRange(this.range.start,this.getEndByStart(t))},t.prototype.handleSlotSizeChange=function(){this.handleDataSourcesChange()},t.prototype.handleScroll=function(t){this.direction=t<this.offset||0===t?s:r,this.offset=t,this.param&&(this.direction===s?this.handleFront():this.direction===r&&this.handleBehind())},t.prototype.handleFront=function(){var t=this.getScrollOvers();if(!(t>this.range.start)){var e=Math.max(t-this.param.buffer,0);this.checkRange(e,this.getEndByStart(e))}},t.prototype.handleBehind=function(){var t=this.getScrollOvers();t<this.range.start+this.param.buffer||this.checkRange(t,this.getEndByStart(t))},t.prototype.getScrollOvers=function(){var t=this.offset-this.param.slotHeaderSize;if(t<=0)return 0;if(this.isFixedType())return Math.floor(t/this.fixedSizeValue);for(var e=0,i=0,s=0,r=this.param.uniqueIds.length;e<=r;){if(i=e+Math.floor((r-e)/2),(s=this.getIndexOffset(i))===t)return i;s<t?e=i+1:s>t&&(r=i-1)}return e>0?--e:0},t.prototype.getIndexOffset=function(t){if(!t)return 0;for(var e=0,i=0,s=0;s<t;s++)e+="number"==typeof(i=this.sizes.get(this.param.uniqueIds[s]))?i:this.getEstimateSize();return e},t.prototype.isFixedType=function(){return this.calcType===o},t.prototype.getLastIndex=function(){return this.param.uniqueIds.length-1},t.prototype.checkRange=function(t,e){var i=this.param.keeps;this.param.uniqueIds.length<=i?(t=0,e=this.getLastIndex()):e-t<i-1&&(t=e-i+1),this.range.start!==t&&this.updateRange(t,e)},t.prototype.updateRange=function(t,e){this.range.start=t,this.range.end=e,this.range.padFront=this.getPadFront(),this.range.padBehind=this.getPadBehind(),this.callUpdate(this.getRange())},t.prototype.getEndByStart=function(t){var e=t+this.param.keeps-1;return Math.min(e,this.getLastIndex())},t.prototype.getPadFront=function(){return this.isFixedType()?this.fixedSizeValue*this.range.start:this.getIndexOffset(this.range.start)},t.prototype.getPadBehind=function(){var t=this.range.end,e=this.getLastIndex();return this.isFixedType()?(e-t)*this.fixedSizeValue:(e-t)*this.getEstimateSize()},t.prototype.getEstimateSize=function(){return this.isFixedType()?this.fixedSizeValue:this.firstRangeAverageSize||this.param.estimateSize},t}(),l={created:function(){this.shapeKey=this.horizontal?"offsetWidth":"offsetHeight"},mounted:function(){var t=this;"undefined"!=typeof ResizeObserver&&(this.resizeObserver=new ResizeObserver((function(){t.dispatchSizeChange()})),this.resizeObserver.observe(this.$el))},updated:function(){this.resizeObserver?this.resizeObserver.observe(this.$el):this.dispatchSizeChange()},beforeDestroy:function(){this.resizeObserver&&(this.resizeObserver.disconnect(),this.resizeObserver=null)},methods:{getCurrentSize:function(){return this.$el?this.$el[this.shapeKey]:0},dispatchSizeChange:function(){this.$parent.$emit(this.event,this.uniqueKey,this.getCurrentSize(),this.hasInitial)}}},u=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var i=arguments[e];for(var s in i)Object.prototype.hasOwnProperty.call(i,s)&&(t[s]=i[s])}return t},d={name:"ElVirtualItem",mixins:[l],render:function(t){var e=this.tag,i=this.component,s=this.extraProps,r=void 0===s?{}:s,n=this.index,o=this.source,a=this.scopedSlots,h=void 0===a?{}:a,l=this.uniqueKey,d=this.slotComponent,c=u({},r,{source:o,index:n});return t(e,{key:l,attrs:{role:"item"}},[d?d({item:o,index:n,scope:c}):t(i,{props:c,scopedSlots:h})])},props:{index:{type:Number},event:{type:String},tag:{type:String},horizontal:{type:Boolean},source:{type:Object},component:{type:[Object,Function]},slotComponent:{type:Function},uniqueKey:{type:[String,Number]},extraProps:{type:Object},scopedSlots:{type:Object}}},c={name:"ElVirtualSlot",mixins:[l],render:function(t){var e=this.tag,i=this.uniqueKey;return t(e,{key:i,attrs:{role:i}},this.$slots.default)},props:{event:{type:String},uniqueKey:{type:String},tag:{type:String},horizontal:{type:Boolean}}},p="item_resize",f="slot_resize",g="thead",y="tfoot",m={name:"ElVirtual",components:{virtualItem:d,virtualSlot:c},props:{dataKey:{type:[String,Function],required:!0},dataSources:{type:Array,required:!0},dataComponent:{type:[Object,Function],required:!0},keeps:{type:Number,default:30},extraProps:{type:Object},estimateSize:{type:Number,default:50},direction:{type:String,default:"vertical"},start:{type:Number,default:0},offset:{type:Number,default:0},topThreshold:{type:Number,default:0},bottomThreshold:{type:Number,default:0},pageMode:{type:Boolean,default:!1},rootTag:{type:String,default:"div"},wrapTag:{type:String,default:"div"},wrapClass:{type:String,default:"el-virtual-group"},wrapStyle:{type:Object},itemTag:{type:String,default:"div"},itemClass:{type:String,default:"el-virtual-item"},itemClassAdd:{type:Function},itemStyle:{type:Object},headerTag:{type:String,default:"div"},headerClass:{type:String,default:""},headerStyle:{type:Object},footerTag:{type:String,default:"div"},footerClass:{type:String,default:""},footerStyle:{type:Object},itemScopedSlots:{type:Object}},data:function(){return{range:null}},watch:{"dataSources.length":function(){this.virtual.updateParam("uniqueIds",this.getUniqueIdFromDataSources()),this.virtual.handleDataSourcesChange()},keeps:function(t){this.virtual.updateParam("keeps",t),this.virtual.handleSlotSizeChange()},start:function(t){this.scrollToIndex(t)},offset:function(t){this.scrollToOffset(t)}},created:function(){this.isHorizontal="horizontal"===this.direction,this.directionKey=this.isHorizontal?"scrollLeft":"scrollTop",this.installVirtual(),this.$on(p,this.onItemResized),(this.$slots.header||this.$slots.footer)&&this.$on(f,this.onSlotResized)},activated:function(){this.scrollToOffset(this.virtual.offset),this.pageMode&&document.addEventListener("scroll",this.onScroll,{passive:!1})},deactivated:function(){this.pageMode&&document.removeEventListener("scroll",this.onScroll)},mounted:function(){this.start?this.scrollToIndex(this.start):this.offset&&this.scrollToOffset(this.offset),this.pageMode&&(this.updatePageModeFront(),document.addEventListener("scroll",this.onScroll,{passive:!1}))},beforeDestroy:function(){this.virtual.destroy(),this.pageMode&&document.removeEventListener("scroll",this.onScroll)},methods:{getSize:function(t){return this.virtual.sizes.get(t)},getSizes:function(){return this.virtual.sizes.size},getOffset:function(){if(this.pageMode)return document.documentElement[this.directionKey]||document.body[this.directionKey];var t=this.$refs.root;return t?Math.ceil(t[this.directionKey]):0},getClientSize:function(){var t=this.isHorizontal?"clientWidth":"clientHeight";if(this.pageMode)return document.documentElement[t]||document.body[t];var e=this.$refs.root;return e?Math.ceil(e[t]):0},getScrollSize:function(){var t=this.isHorizontal?"scrollWidth":"scrollHeight";if(this.pageMode)return document.documentElement[t]||document.body[t];var e=this.$refs.root;return e?Math.ceil(e[t]):0},scrollToOffset:function(t){if(this.pageMode)document.body[this.directionKey]=t,document.documentElement[this.directionKey]=t;else{var e=this.$refs.root;e&&(e[this.directionKey]=t)}},scrollToIndex:function(t){if(t>=this.dataSources.length-1)this.scrollToBottom();else{var e=this.virtual.getOffset(t);this.scrollToOffset(e)}},scrollToBottom:function(){var t=this,e=this.$refs.shepherd;if(e){var i=e[this.isHorizontal?"offsetLeft":"offsetTop"];this.scrollToOffset(i),setTimeout((function(){t.getOffset()+t.getClientSize()+1<t.getScrollSize()&&t.scrollToBottom()}),3)}},updatePageModeFront:function(){var t=this.$refs.root;if(t){var e=t.getBoundingClientRect(),i=t.ownerDocument.defaultView,s=this.isHorizontal?e.left+i.pageXOffset:e.top+i.pageYOffset;this.virtual.updateParam("slotHeaderSize",s)}},reset:function(){this.virtual.destroy(),this.scrollToOffset(0),this.installVirtual()},installVirtual:function(){this.virtual=new h({slotHeaderSize:0,slotFooterSize:0,keeps:this.keeps,estimateSize:this.estimateSize,buffer:Math.round(this.keeps/3),uniqueIds:this.getUniqueIdFromDataSources()},this.onRangeChanged),this.range=this.virtual.getRange()},getUniqueIdFromDataSources:function(){var t=this.dataKey;return this.dataSources.map((function(e){return"function"==typeof t?t(e):e[t]}))},onItemResized:function(t,e){this.virtual.saveSize(t,e),this.$emit("resized",t,e)},onSlotResized:function(t,e,i){t===g?this.virtual.updateParam("slotHeaderSize",e):t===y&&this.virtual.updateParam("slotFooterSize",e),i&&this.virtual.handleSlotSizeChange()},onRangeChanged:function(t){this.range=t},onScroll:function(t){var e=this.getOffset(),i=this.getClientSize(),s=this.getScrollSize();e<0||e+i>s+1||!s||(this.virtual.handleScroll(e),this.emitEvent(e,i,s,t))},emitEvent:function(t,e,i,s){this.$emit("scroll",s,this.virtual.getRange()),this.virtual.isFront()&&this.dataSources.length&&t-this.topThreshold<=0?this.$emit("totop"):this.virtual.isBehind()&&t+e+this.bottomThreshold>=i&&this.$emit("tobottom")},getRenderSlots:function(t){for(var e=[],i=this.range,s=i.start,r=i.end,n=this.dataSources,o=this.dataKey,a=this.itemClass,h=this.itemTag,l=this.itemStyle,u=this.isHorizontal,c=this.extraProps,f=this.dataComponent,g=this.itemScopedSlots,y=this.$scopedSlots&&this.$scopedSlots.item,m=s;m<=r;m++){var S=n[m];if(S){var v="function"==typeof o?o(S):S[o];"string"==typeof v||"number"==typeof v?e.push(t(d,{props:{index:m,tag:h,event:p,horizontal:u,uniqueKey:v,source:S,extraProps:c,component:f,slotComponent:y,scopedSlots:g},style:l,class:a+(this.itemClassAdd?" "+this.itemClassAdd(m):"")})):console.warn("Cannot get the data-key '"+o+"' from data-sources.")}else console.warn("Cannot get the index '"+m+"' from data-sources.")}return e}},render:function(t){var e=this.$slots,i=e.header,s=e.footer,r=this.range,n=r.padFront,o=r.padBehind,a=this.isHorizontal,h=this.pageMode,l=this.rootTag,u=this.wrapTag,d=this.wrapClass,p=this.wrapStyle,m=this.headerTag,S=this.headerClass,v=this.headerStyle,z=this.footerTag,b=this.footerClass,O=this.footerStyle,x={padding:a?"0px "+o+"px 0px "+n+"px":n+"px 0px "+o+"px"},T=p?Object.assign({},p,x):x;return t(l,{ref:"root",on:{"&scroll":!h&&this.onScroll}},[i?t(c,{class:S,style:v,props:{tag:m,event:f,uniqueKey:g}},i):null,t(u,{class:d,attrs:{role:"group"},style:T},this.getRenderSlots(t)),s?t(c,{class:b,style:O,props:{tag:z,event:f,uniqueKey:y}},s):null,t("div",{ref:"shepherd",style:{width:a?"0px":"100%",height:a?"100%":"0px"}})])},install:function(t){t.component(m.name,m)}};e.default=m}});