UNPKG

vhb-table

Version:

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

1 lines 5.3 kB
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _xeUtils=_interopRequireDefault(require("xe-utils")),_conf=_interopRequireDefault(require("../../v-h-b-table/src/conf")),_size=_interopRequireDefault(require("../../mixins/size")),_resize=require("../../tools/resize"),_event=require("../../tools/event"),_dom=require("../../tools/dom");function _interopRequireDefault(t){return t&&t.__esModule?t:{default:t}}var _default2={name:"VhbList",mixins:[_size.default],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},data:function(){return{scrollYLoad:!1,bodyHeight:0,topSpaceHeight:0,items:[]}},computed:{sYOpts:function(){return Object.assign({},_conf.default.list.scrollY,this.scrollY)},styles:function(){var t=this.height,e=this.maxHeight,i={};return t?i.height=isNaN(t)?t:"".concat(t,"px"):e&&(i.height="auto",i.maxHeight=isNaN(e)?e:"".concat(e,"px")),i}},watch:{data:function(t){this.loadData(t)},syncResize:function(t){var e=this;t&&(this.recalculate(),this.$nextTick(function(){return setTimeout(function(){return e.recalculate()})}))}},created:function(){Object.assign(this,{fullData:[],lastScrollLeft:0,lastScrollTop:0,scrollYStore:{startIndex:0,endIndex:0,visibleSize:0}}),this.loadData(this.data),_event.GlobalEvent.on(this,"resize",this.handleGlobalResizeEvent)},mounted:function(){var t=this;if(this.autoResize){var e=(0,_resize.createResizeEvent)(function(){return t.recalculate()});e.observe(this.$el),this.$resize=e}},beforeDestroy:function(){this.$resize&&this.$resize.disconnect()},destroyed:function(){_event.GlobalEvent.off(this,"resize")},render:function(t){var e=this.$scopedSlots,i=this.styles,s=this.bodyHeight,l=this.topSpaceHeight,r=this.items,a=this.className,o=this.loading;return t("div",{class:["vhb-list",a?_xeUtils.default.isFunction(a)?a({$list:this}):a:"",{"is--loading":o}]},[t("div",{ref:"virtualWrapper",class:"vhb-list--virtual-wrapper",style:i,on:{scroll:this.scrollEvent}},[t("div",{ref:"ySpace",class:"vhb-list--y-space",style:{height:s?"".concat(s,"px"):""}}),t("div",{ref:"virtualBody",class:"vhb-list--body",style:{marginTop:l?"".concat(l,"px"):""}},e.default?e.default.call(this,{items:r,$list:this},t):[])]),t("div",{class:["vhb-list--loading vhb-loading",{"is--visible":o}]},[t("div",{class:"vhb-loading--spinner"})])])},methods:{getParentElem:function(){return this.$el.parentNode},loadData:function(t){var e=this,i=this.sYOpts,s=this.scrollYStore,l=t||[];return Object.assign(s,{startIndex:0,endIndex:1,visibleSize:0}),this.fullData=l,this.scrollYLoad=i.enabled&&-1<i.gt&&i.gt<=l.length,this.handleData(),this.computeScrollLoad().then(function(){e.refreshScroll()})},reloadData:function(t){return this.clearScroll(),this.loadData(t)},handleData:function(){var t=this.fullData,e=this.scrollYLoad,i=this.scrollYStore;return this.items=e?t.slice(i.startIndex,i.endIndex):t.slice(0),this.$nextTick()},recalculate:function(){var t=this.$el;return t.clientWidth&&t.clientHeight?this.computeScrollLoad():Promise.resolve()},clearScroll:function(){var t=this.$refs.virtualWrapper;return t&&(t.scrollTop=0),this.$nextTick()},refreshScroll:function(){var t=this,e=this.lastScrollLeft,i=this.lastScrollTop;return this.clearScroll().then(function(){if(e||i)return t.lastScrollLeft=0,t.lastScrollTop=0,t.scrollTo(e,i)})},scrollTo:function(t,e){var i=this,s=this.$refs.virtualWrapper;return _xeUtils.default.isNumber(t)&&(s.scrollLeft=t),_xeUtils.default.isNumber(e)&&(s.scrollTop=e),this.scrollYLoad?new Promise(function(t){return setTimeout(function(){return t(i.$nextTick())},50)}):this.$nextTick()},computeScrollLoad:function(){var u=this;return this.$nextTick().then(function(){var t,e=u.$refs,i=u.sYOpts,s=u.scrollYLoad,l=u.scrollYStore,r=e.virtualWrapper,a=e.virtualBody,o=0;if(a&&(i.sItem&&(t=a.querySelector(i.sItem)),t||(t=a.children[0])),t&&(o=t.offsetHeight),o=Math.max(20,o),l.rowHeight=o,s){var n=Math.max(8,Math.ceil(r.clientHeight/o)),c=i.oSize?_xeUtils.default.toNumber(i.oSize):_dom.browse.msie?20:_dom.browse.edge?10:0;l.offsetSize=c,l.visibleSize=n,l.endIndex=Math.max(l.startIndex,n+c,l.endIndex),u.updateYData()}else u.updateYSpace();u.rowHeight=o})},scrollEvent:function(t){var e=t.target,i=e.scrollTop,s=e.scrollLeft,l=s!==this.lastScrollLeft,r=i!==this.lastScrollTop;this.lastScrollTop=i,this.lastScrollLeft=s,this.scrollYLoad&&this.loadYData(t),this.$emit("scroll",{scrollLeft:s,scrollTop:i,isX:l,isY:r,$event:t})},loadYData:function(t){var e=this.scrollYStore,i=e.startIndex,s=e.endIndex,l=e.visibleSize,r=e.offsetSize,a=e.rowHeight,o=t.target.scrollTop,n=Math.floor(o/a),c=Math.max(0,n-1-r),u=n+l+r;(n<=i||s-l-1<=n)&&(i===c&&s===u||(e.startIndex=c,e.endIndex=u,this.updateYData()))},updateYData:function(){this.handleData(),this.updateYSpace()},updateYSpace:function(){var t=this.scrollYStore,e=this.scrollYLoad,i=this.fullData;this.bodyHeight=e?i.length*t.rowHeight:0,this.topSpaceHeight=e?Math.max(t.startIndex*t.rowHeight,0):0},handleGlobalResizeEvent:function(){this.recalculate()}}};exports.default=_default2;