vxe-gantt 0.0.2 → 4.0.0-beta.0

package/lib/gantt/src/gantt-view.min.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_dom=require("../../ui/src/dom"),_ui=require("../../ui"),_util=require("./util"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ganttHeader=_interopRequireDefault(require("./gantt-header")),_ganttBody=_interopRequireDefault(require("./gantt-body"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let globalEvents=_ui.VxeUI.globalEvents;function createInternalData(){return{xeTable:null,startMaps:{},endMaps:{},chartMaps:{},elemStore:{},scrollXStore:{preloadSize:0,offsetSize:0,visibleSize:0,visibleStartIndex:0,visibleEndIndex:0,startIndex:0,endIndex:0},scrollYStore:{preloadSize:0,offsetSize:0,visibleSize:0,visibleStartIndex:0,visibleEndIndex:0,startIndex:0,endIndex:0}}}let maxYHeight=5e6,maxXWidth=5e6;var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeGanttView",setup(e,l){var t=_xeUtils.default.uniqueId();let{computeTaskViewOpts:c,computeStartField:h,computeEndField:g,computeScrollbarOpts:o,computeScrollbarXToTop:f,computeScrollbarYToLeft:r}=(0,_vue.inject)("$xeGantt",{}).getComputeMaps(),m=(0,_vue.ref)(),p=(0,_vue.ref)(),x=(0,_vue.ref)(),s=(0,_vue.ref)(),_=(0,_vue.ref)(),S=(0,_vue.ref)(),n=(0,_vue.ref)(),y=(0,_vue.ref)(),w=(0,_vue.ref)(),b=(0,_vue.ref)(),T=(0,_vue.ref)(),u=(0,_vue.ref)(),d=(0,_vue.ref)(),E=(0,_vue.ref)(),D=(0,_vue.reactive)({scrollXLoad:!1,scrollYLoad:!1,overflowY:!1,overflowX:!1,scrollbarWidth:0,scrollbarHeight:0,lazScrollLoading:!1,scrollVMLoading:!1,scrollYHeight:0,scrollYTop:0,isScrollYBig:!1,scrollXLeft:0,scrollXWidth:0,isScrollXBig:!1,minViewDate:null,maxViewDate:null,tableData:[],tableColumn:[],headerGroups:[],viewCellWidth:40,rowHeightStore:{large:52,default:48,medium:44,small:40,mini:36}}),H=createInternalData(),k={refElem:m},z={},a={xID:t,props:e,context:l,reactData:D,internalData:H,getRefMaps:()=>k,getComputeMaps:()=>z},B=()=>{var e=H.xeTable;let a=null,i=null;if(e){let t=h.value,r=g.value;e=e.internalData.afterFullData;e.forEach(e=>{var l=_xeUtils.default.get(e,t),e=_xeUtils.default.get(e,r);l&&e&&(l=_xeUtils.default.toStringDate(l),(!a||a.getTime()>l.getTime())&&(a=l),l=_xeUtils.default.toStringDate(e),!i||i.getTime()<l.getTime())&&(i=l)})}D.minViewDate=a,D.maxViewDate=i,H.startMaps={},H.endMaps={},(()=>{let{minViewDate:n,maxViewDate:e}=D;var t=[],l=[];switch(c.value.mode){case"year":case"quarter":case"month":case"week":break;default:if(n&&e){var r=n.getTime(),a=e.getTime()-n.getTime(),i=Math.max(6,Math.floor(a/864e5)+1),o=[],s=[],u={};for(let l=0;l<i;l++){var v=new Date(r+864e5*l),d=v.getFullYear()+"-"+(v.getMonth()+1),v=""+v.getDate();let e=u[d];v={field:d+"-"+v,title:v};e?(e.children.push(v),t.push(e)):(e={field:d,title:d,children:[v]},o.push(e),t.push(e),u[d]=e),s.push(v)}l.push(o,s);let c=H.xeTable;if(c){let i=h.value,o=g.value;a=c.internalData.afterFullData;let s={};a.forEach(e=>{var l,t=c.getRowid(e),r=_xeUtils.default.get(e,i),a=_xeUtils.default.get(e,o);r&&a&&(r=_xeUtils.default.toStringDate(r),a=_xeUtils.default.toStringDate(a),l=Math.floor((r.getTime()-n.getTime())/864e5),a=Math.floor((a.getTime()-r.getTime())/864e5)+1,s[t]={row:e,rowid:t,oLeftSize:l,oWidthSize:a})}),H.chartMaps=s}}}D.tableColumn=t,D.headerGroups=l})()},W=()=>{var{scrollXWidth:e,scrollYHeight:l}=D,t=H.elemStore,r=o.value,t=(0,_util.getRefElem)(t["main-body-wrapper"]),a=s.value,i=n.value;t&&(l=l>t.clientHeight,i&&(D.scrollbarWidth=r.width||i.offsetWidth-i.clientWidth||14),D.overflowY=l,i=e>t.clientWidth,a&&(D.scrollbarHeight=r.height||a.offsetHeight-a.clientHeight||14),D.overflowX=i)},L=()=>{var{scrollbarWidth:a,scrollbarHeight:i,tableColumn:o}=D,s=H.elemStore,c=H.xeTable,n=m.value;if(n&&n.clientHeight){var u=f.value,v=_.value,d=S.value,h=p.value;let e=0,l=0,t=0;c&&(c=c.internalData,e=c.tBodyHeight,l=c.tHeaderHeight,t=c.tFooterHeight);c=(0,_util.getRefElem)(s["main-header-scroll"]),c=(c&&(c.style.height=l+"px"),(0,_util.getRefElem)(s["main-body-scroll"])),h=(c&&(c.style.height=e+"px"),h&&(h.style.height=i+"px",h.style.visibility="visible"),w.value),h=(h&&(h.style.left=u?a+"px":"",h.style.width=n.clientWidth-a+"px"),v&&(v.style.width=u?a+"px":"",v.style.display=u&&i?"block":""),d&&(d.style.width=u?"":a+"px",d.style.display=!u&&i?"block":""),x.value),n=(h&&(h.style.width=a+"px",h.style.height=e+l+t+"px",h.style.visibility="visible"),y.value),v=(n&&(n.style.height=l+"px",n.style.display=l?"block":""),b.value),d=(v&&(v.style.height=e+"px",v.style.top=l+"px"),T.value),u=(d&&(d.style.height=t+"px",d.style.top=l+e+"px",d.style.display=t?"block":""),E.value);u&&(D.viewCellWidth=u.clientWidth||40);let r=D.viewCellWidth*o.length;c&&0<(a=(i=c.clientWidth)-r)&&(D.viewCellWidth+=Math.floor(a/o.length),r=i);h=(0,_util.getRefElem)(s["main-header-table"]),n=(0,_util.getRefElem)(s["main-body-table"]);return h&&(h.style.width=r+"px"),n&&(n.style.width=r+"px"),D.scrollXWidth=r,(()=>{let t=D.viewCellWidth,{elemStore:e,chartMaps:r}=H;var l=(0,_util.getRefElem)(e["main-chart-wrapper"]);return l&&_xeUtils.default.arrayEach(l.children,e=>{var l=e.children[0];l&&(e=(e=e.getAttribute("rowid"))?r[e]:null)&&(l.style.left=t*e.oLeftSize+"px",l.style.width=t*e.oWidthSize+"px")}),(0,_vue.nextTick)()})()}},i=()=>(W(),L(),(0,_vue.nextTick)());let v=(e,l,t,r,a)=>{var i;i=H.lcsTimeout,D.lazScrollLoading=!0,i&&clearTimeout(i),H.lcsTimeout=setTimeout(()=>{H.lcsRunTime=Date.now(),H.lcsTimeout=void 0,H.intoRunScroll=!1,H.inVirtualScroll=!1,H.inWheelScroll=!1,H.inHeaderScroll=!1,H.inBodyScroll=!1,H.inFooterScroll=!1,D.lazScrollLoading=!1},200)},Y=e=>{var l=H.xeTable;l&&(l=l.internalData.elemStore,l=(0,_util.getRefElem)(l["main-body-scroll"]))&&(l.scrollTop=e)};t={handleUpdateStyle:L,handleLazyRecalculate:i,triggerHeaderScrollEvent(e){var{elemStore:l,inVirtualScroll:t,inBodyScroll:r,inFooterScroll:a}=H;t||r||a||(t=e.currentTarget,r=(0,_util.getRefElem)(l["main-body-scroll"]),a=s.value,r&&t&&(e=t.scrollLeft,H.inHeaderScroll=!0,(0,_dom.setScrollLeft)(a,e),(0,_dom.setScrollLeft)(r,e),v(0,0,0,t.scrollTop)))},triggerBodyScrollEvent(e){var l,{elemStore:t,inVirtualScroll:r,inHeaderScroll:a,inFooterScroll:i}=H;r||a||i||(r=e.currentTarget,a=(0,_util.getRefElem)(t["main-header-scroll"]),i=s.value,e=n.value,a&&r&&(t=r.scrollLeft,l=r.scrollTop,H.inBodyScroll=!0,(0,_dom.setScrollLeft)(i,t),(0,_dom.setScrollLeft)(a,t),(0,_dom.setScrollTop)(e,l),Y(l),v(0,0,0,r.scrollTop)))},triggerFooterScrollEvent(e){var{inVirtualScroll:l,inHeaderScroll:t,inBodyScroll:r}=H;l||t||r||(l=e.currentTarget)&&(l.scrollLeft,v(0,0,0,l.scrollTop))},triggerVirtualScrollXEvent(e){var{elemStore:l,inHeaderScroll:t,inBodyScroll:r}=H;t||r||(t=e.currentTarget,r=(0,_util.getRefElem)(l["main-header-scroll"]),e=(0,_util.getRefElem)(l["main-body-scroll"]),t&&(l=t.scrollLeft,H.inVirtualScroll=!0,(0,_dom.setScrollLeft)(r,l),(0,_dom.setScrollLeft)(e,l),v(0,0,0,t.scrollTop)))},triggerVirtualScrollYEvent(e){var{elemStore:l,inHeaderScroll:t,inBodyScroll:r}=H;t||r||(t=e.currentTarget,r=(0,_util.getRefElem)(l["main-body-scroll"]),t&&(e=t.scrollTop,H.inVirtualScroll=!0,(0,_dom.setScrollTop)(r,e),Y(e),v(0,0,0,0,t.scrollLeft)))},updateScrollXSpace:()=>{let{scrollXLoad:l,scrollXWidth:e}=D,t=H.elemStore;var r=(0,_util.getRefElem)(t["main-body-scroll"]),a=(0,_util.getRefElem)(t["main-body-table"]);let i=0,o=0,s=(r&&(o=r.clientWidth),!1),c=e;e>maxXWidth&&(i=r&&a&&r.scrollLeft+o>=maxXWidth?maxXWidth-a.clientWidth:(maxXWidth-o)*(i/(e-o)),c=maxXWidth,s=!0),a&&(a.style.transform=`translate(${i}px, ${D.scrollYTop||0}px)`);["header","body","footer"].forEach(e=>{e=(0,_util.getRefElem)(t[`main-${e}-xSpace`]);e&&(e.style.width=l?c+"px":"")}),D.scrollXLeft=i,D.scrollXWidth=c,D.isScrollXBig=s;r=u.value;return r&&(r.style.width=c+"px"),W(),(0,_vue.nextTick)().then(()=>{L()})},updateScrollYSpace:()=>{var{scrollYLoad:e,overflowY:l}=D;let t=H.elemStore;var r=H.xeTable,a=(0,_util.getRefElem)(t["main-body-scroll"]),i=(0,_util.getRefElem)(t["main-body-table"]);let o=0,s=0,c=!1,n=(r&&(r=r.reactData,o=r.scrollYTop,s=r.scrollYHeight,c=r.isScrollYBig),s),u=o,v=0;a&&(v=a.clientHeight),c&&(u=a&&i&&a.scrollTop+v>=maxYHeight?maxYHeight-i.clientHeight:(maxYHeight-v)*(o/(s-v)),n=maxYHeight),e&&l||(u=0),i&&(i.style.transform=`translate(${D.scrollXLeft||0}px, ${u}px)`);["header","body","footer"].forEach(e=>{e=(0,_util.getRefElem)(t[`main-${e}-ySpace`]);e&&(e.style.height=n?n+"px":"")});r=d.value;return r&&(r.style.height=n?n+"px":""),D.scrollYTop=u,D.scrollYHeight=s,D.isScrollYBig=c,W(),(0,_vue.nextTick)().then(()=>{L()})}};let q=()=>{i()},R=(Object.assign(a,{updateViewData(){var e=H.xeTable;return e&&(e=e.reactData.tableData,D.tableData=e),(0,_vue.nextTick)()},connectUpdate({$table:e}){return e&&(H.xeTable=e),(0,_vue.nextTick)()}},t),()=>(0,_vue.h)("div",{key:"vsx",ref:p,class:"vxe-gantt-view--scroll-x-virtual"},[(0,_vue.h)("div",{ref:_,class:"vxe-gantt-view--scroll-x-left-corner"}),(0,_vue.h)("div",{ref:w,class:"vxe-gantt-view--scroll-x-wrapper"},[(0,_vue.h)("div",{ref:s,class:"vxe-gantt-view--scroll-x-handle",onScroll:a.triggerVirtualScrollXEvent},[(0,_vue.h)("div",{ref:u,class:"vxe-gantt-view--scroll-x-space"})])]),(0,_vue.h)("div",{ref:S,class:"vxe-gantt-view--scroll-x-right-corner"})])),X=()=>(0,_vue.h)("div",{ref:x,class:"vxe-gantt-view--scroll-y-virtual"},[(0,_vue.h)("div",{ref:y,class:"vxe-gantt-view--scroll-y-top-corner"}),(0,_vue.h)("div",{ref:b,class:"vxe-gantt-view--scroll-y-wrapper"},[(0,_vue.h)("div",{ref:n,class:"vxe-gantt-view--scroll-y-handle",onScroll:a.triggerVirtualScrollYEvent},[(0,_vue.h)("div",{ref:d,class:"vxe-gantt-view--scroll-y-space"})])]),(0,_vue.h)("div",{ref:T,class:"vxe-gantt-view--scroll-y-bottom-corner"})]),V=()=>(0,_vue.h)("div",{class:"vxe-gantt-view--viewport-wrapper"},[(0,_vue.h)(_ganttHeader.default),(0,_vue.h)(_ganttBody.default)]),M=()=>{var e=r.value;return(0,_vue.h)("div",{class:"vxe-gantt-view--layout-wrapper"},e?[X(),V()]:[V(),X()])};let U=(0,_vue.ref)(0);return(0,_vue.watch)(()=>D.tableData,()=>{U.value++}),(0,_vue.watch)(()=>D.tableData.length,()=>{U.value++}),(0,_vue.watch)(U,()=>{B()}),(0,_vue.onMounted)(()=>{globalEvents.on(a,"resize",q)}),(0,_vue.onUnmounted)(()=>{globalEvents.off(a,"keydown"),_xeUtils.default.assign(H,createInternalData())}),a.renderVN=()=>{var{overflowX:e,overflowY:l,scrollXLoad:t,scrollYLoad:r}=D,a=c.value,i=f.value;return(0,_vue.h)("div",{ref:m,class:["vxe-gantt-view","mode--"+(a.mode||"day"),{"is--scroll-y":l,"is--scroll-x":e,"is--virtual-x":t,"is--virtual-y":r}]},[(0,_vue.h)("div",{class:"vxe-gantt-view--render-wrapper"},i?[R(),M()]:[M(),R()]),(0,_vue.h)("div",{class:"vxe-gantt-view--render-vars"},[(0,_vue.h)("div",{ref:E,class:"vxe-gantt-view--column-info"})])])},(0,_vue.provide)("$xeGanttView",a),a},render(){return this.renderVN()}});