vxe-gantt/lib/gantt/src/gantt-chart.min.js

A vue based gantt component

Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _vue=require("vue"),_comp=require("../../ui/src/comp"),_core=require("@vxe-ui/core"),_xeUtils=_interopRequireDefault(require("xe-utils")),_util=require("./util"),_utils=require("../../ui/src/utils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}let{getIcon,renderEmptyElement}=_core.VxeUI,sourceType="gantt",viewType="chart";var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeGanttViewChart",setup(){let z=(0,_vue.inject)("$xeGantt",{});var e=(0,_vue.inject)("$xeGanttView",{});let{props:K,context:v,reactData:W,internalData:Y}=z,{reactData:_,internalData:u}=e,{computeProgressField:J,computeTitleField:Q,computeTypeField:X,computeTaskBarOpts:Z,computeScaleUnit:ee,computeTaskLinkOpts:c,computeTaskBarMilestoneOpts:te,computeTaskBarSubviewOpts:ae}=z.getComputeMaps(),d=e.getComputeMaps().computeNowLineLeft,p=(0,_vue.ref)(),w=(0,_vue.ref)(),h=(0,_vue.ref)(),g=(0,_vue.ref)(),m=(0,_vue.ref)(),x=(d,e,t,a,r,n,s,$)=>{let{resizeHeightFlag:V,pendingRowFlag:p}=d.reactData,{fullAllDataRowIdData:j,pendingRowMaps:w}=d.internalData;var{computeCellOpts:i,computeRowOpts:l,computeDefaultRowHeight:o}=d.getComputeMaps(),i=i.value,l=l.value,o=o.value,v=d.getComputeMaps().computeTreeOpts,v=v.value,v=v.children||v.childrenField,u=z.context.slots;let h=u.taskBar||u["task-bar"];u=u.taskBarOverview||u["task-bar-overview"];let{treeConfig:G,taskBarMilestoneConfig:L,taskBarSubviewConfig:g}=K;var{activeLink:c,activeBarRowid:q}=W;let _=Q.value,m=J.value,x=X.value;var b=Z.value,k=te.value;let f=ae.value,{showOverview:A,barStyle:T}=f,y=ee.value,E={$gantt:z,row:e,scaleType:y},{showProgress:C,showContent:B,contentMethod:M,barStyle:D,moveable:S,showTooltip:N}=b,O=_xeUtils.default.isFunction(D);var b=(D?O?D(E)||void 0:D:{})||{},P=b.round,H=j[t]||{},H=V?(0,_util.getCellRestHeight)(H,i,l,o):0;let U=(0,_utils.getStringValue)(_xeUtils.default.get(e,_));i=C?Math.min(100,Math.max(0,_xeUtils.default.toNumber(_xeUtils.default.get(e,m)))):0,l=(0,_util.getTaskType)(_xeUtils.default.get(e,x)),o={},i={width:`${i||0}%`};O&&({bgColor:b,completedBgColor:F}=b,b&&(o.backgroundColor=b),F)&&(i.backgroundColor=F);let R={$gantt:z,source:sourceType,type:viewType,scaleType:y,row:e,$rowIndex:r,rowIndex:a,_rowIndex:n},I=[];if(z.renderGanttTaskBarContent)I=z.renderGanttTaskBarContent(R,{$gantt:z,$table:d,rowid:t});else{var b=!(!(0,_utils.hasEnableConf)(L,k)||!(0,_util.hasMilestoneTask)(l)),F=!(!(0,_utils.hasEnableConf)(g,f)||!(0,_util.hasSubviewTask)(l));M&&(U=(0,_utils.getStringValue)(M({row:e,title:U,scaleType:y})));let c={};if(N&&(c.onMouseover=e=>{var t=Y.dragBarRow,a=Object.assign({$event:e},R);t||z.triggerTaskBarTooltipEvent(e,a),z.dispatchEvent("task-bar-mouseenter",a,e)},c.onMouseleave=e=>{var t=Y.dragBarRow,a=Object.assign({$event:e},R);t||z.handleTaskBarTooltipLeaveEvent(e,a),z.dispatchEvent("task-bar-mouseleave",a,e)}),F&&G&&s&&s.length)if($)A&&I.push((0,_vue.h)("div",{key:"vcso",class:"vxe-gantt-view--chart-subview-wrapper is--overview"},[(0,_vue.h)("div",{key:t,rowid:t,class:["vxe-gantt-view--chart-subview-row",{"is--progress":C,"is--round":P,"is--move":S}]},[(0,_vue.h)("div",{rowid:t,class:[u?"vxe-gantt-view--chart-subview-custom-bar":"vxe-gantt-view--chart-subview-bar","is--"+l]},[u?(0,_vue.h)("div",{key:"cbc",class:"vxe-gantt-view--chart-subview-custom-bar-content-wrapper"},z.callSlot(u,E)):(0,_vue.h)("div",{class:"vxe-gantt-view--chart-subview-bar-content-wrapper"},[B?(0,_vue.h)("div",{class:"vxe-gantt-view--chart-content"},U):renderEmptyElement(z)])])])]));else{let u=[];_xeUtils.default.eachTree(s,e=>{var a={$gantt:z,row:e,scaleType:y},a=(D?O?D(a):D:{})||{},r=a.round,n=d.getRowid(e);let s=(0,_utils.getStringValue)(_xeUtils.default.get(e,_));var i=C?Math.min(100,Math.max(0,_xeUtils.default.toNumber(_xeUtils.default.get(e,m)))):0,l=(0,_util.getTaskType)(_xeUtils.default.get(e,x)),o=!(!(0,_utils.hasEnableConf)(g,f)||!(0,_util.hasSubviewTask)(l));if(!o){var v,o={width:`${i||0}%`};O&&({bgColor:v,completedBgColor:i}=a,i)&&(o.backgroundColor=i);let t=_xeUtils.default.assign({},R,{row:e,rowIndex:d.getRowIndex(e),$rowIndex:d.getVMRowIndex(e),_rowIndex:d.getVTRowIndex(e)});M&&(s=(0,_utils.getStringValue)(M({row:e,title:s,scaleType:y}))),u.push((0,_vue.h)("div",{key:n,rowid:n,class:["vxe-gantt-view--chart-subview-row","is--"+l,{"is--progress":C,"is--round":r,"is--move":S,"row--pending":!!p&&!!w[n]}]},[(0,_vue.h)("div",{rowid:n,class:[h?"vxe-gantt-view--chart-subview-custom-bar":"vxe-gantt-view--chart-subview-bar","is--"+l],style:T?_xeUtils.default.isFunction(T)?T(t):T:void 0,onClick(e){e.stopPropagation(),z.handleTaskBarClickEvent(e,t)},onDblclick(e){e.stopPropagation(),z.handleTaskBarDblclickEvent(e,t)},onMousedown(e){e.stopPropagation(),z.handleTaskBarMousedownEvent&&z.handleTaskBarMousedownEvent(e,t)}},[h?(0,_vue.h)("div",Object.assign({key:"cbc",class:"vxe-gantt-view--chart-subview-custom-bar-content-wrapper"},c),z.callSlot(h,t)):(0,_vue.h)("div",Object.assign({class:"vxe-gantt-view--chart-subview-bar-content-wrapper"},c),[C?(0,_vue.h)("div",{class:"vxe-gantt-view--chart-progress",style:o}):renderEmptyElement(z),B?(0,_vue.h)("div",{class:"vxe-gantt-view--chart-content"},s):renderEmptyElement(z)])])]))}},{children:v}),I.push((0,_vue.h)("div",{key:"vcsc",class:"vxe-gantt-view--chart-subview-wrapper is--inline"},u))}else h?I.push((0,_vue.h)("div",Object.assign({key:"cbc",class:"vxe-gantt-view--chart-custom-bar-content-wrapper"},c),z.callSlot(h,E))):b?({icon:r,iconStatus:a,iconStyle:n}=k,F={$gantt:z,row:e},I.push((0,_vue.h)("div",Object.assign({key:"vcm",class:"vxe-gantt-view--chart-milestone-wrapper"},c),[(0,_vue.h)("div",{class:["vxe-gantt-view--chart-milestone-icon",a?"theme--"+(_xeUtils.default.isFunction(a)?a(F):a):""],style:n?Object.assign({},_xeUtils.default.isFunction(n)?n(F):n):void 0},[(0,_vue.h)("i",{class:(r?_xeUtils.default.isFunction(r)?r(F):r:"")||getIcon().GANTT_VIEW_TASK_MILESTONE})]),B?(0,_vue.h)("div",{class:"vxe-gantt-view--chart-milestone-content"},U):renderEmptyElement(z)]))):I.push((0,_vue.h)("div",Object.assign({key:"vbc",class:"vxe-gantt-view--chart-bar-content-wrapper"},c),[C?(0,_vue.h)("div",{class:"vxe-gantt-view--chart-progress",style:i}):renderEmptyElement(z),B?(0,_vue.h)("div",{class:"vxe-gantt-view--chart-content"},U):renderEmptyElement(z)]))}return(0,_vue.h)("div",{key:t,rowid:t,class:["vxe-gantt-view--chart-row","is--"+l,{"is--progress":C,"row--pending":!!p&&!!w[t],"is--round":P,"is--move":S}],style:{height:H+"px"},onDragstart(e){Y.dragBarRow&&e.preventDefault()},onContextmenu(e){z.handleTaskBarContextmenuEvent(e,R)}},[(0,_vue.h)("div",{class:[h?"vxe-gantt-view--chart-custom-bar":"vxe-gantt-view--chart-bar","is--"+l,{"is--active":q===t,"active--link":c&&(t===""+c.from||t===""+c.to)}],style:o,rowid:t,onClick(e){z.handleTaskBarClickEvent(e,E)},onDblclick(e){z.handleTaskBarDblclickEvent(e,E)},onMousedown(e){z.handleTaskBarMousedownEvent&&z.handleTaskBarMousedownEvent(e,E)}},I)])},b=(o,e)=>{let v=o.props.treeConfig,u=o.reactData.treeExpandedFlag,{fullAllDataRowIdData:c,treeExpandedMaps:d}=o.internalData;var t=o.getComputeMaps().computeTreeOpts,t=t.value;let p=t.transform,w=t.children||t.childrenField,h=_.scrollYLoad,g=[];return e.forEach((e,t)=>{var a=o.getRowid(e),r=c[a]||{};let n=t,s=-1,i=(r&&(n=r.index,s=r._index),!1),l=[];v&&(l=e[w],i=!!u&&l&&0<l.length&&!!d[a]),g.push(x(o,e,a,n,t,s,l,i)),v&&i&&!h&&!p&&g.push(...b(o,l))}),g};return(0,_vue.onMounted)(()=>{var e=u.elemStore,t="main-chart-";e[t+"now-line"]=m,e[t+"task-wrapper"]=w,e[t+"before-wrapper"]=h,e[t+"after-wrapper"]=g}),(0,_vue.onUnmounted)(()=>{var e=u.elemStore,t="main-chart-";e[t+"now-line"]=null,e[t+"task-wrapper"]=null,e[t+"before-wrapper"]=null,e[t+"after-wrapper"]=null}),()=>{var e=u.xeTable,t=v.slots,a=W.dragLinkFromStore,r=_.tableData,n=c.value,s=Z.value,i=d.value,{isCurrent:l,isHover:o}=n,s=s.linkCreatable,t=t.taskNowLine||t["task-now-line"];return(0,_vue.h)("div",{ref:p,class:["vxe-gantt-view--chart-wrapper",{"is--cl-drag":a.rowid}]},[0<i?(0,_vue.h)("div",{ref:m,class:"vxe-gantt-view--chart-now-line",style:{left:i+"px"}},t?t({}):[]):renderEmptyElement(z),z.renderGanttTaskChartBefores?(0,_vue.h)("div",{ref:h,class:["vxe-gantt-view--chart-before-wrapper",{"link--current":l,"link--hover":o}]},e&&(0,_utils.isEnableConf)(n)?z.renderGanttTaskChartBefores():[]):renderEmptyElement(z),(0,_vue.h)("div",{ref:w,class:["vxe-gantt-view--chart-task-wrapper",{"link--current":l,"link--create":s}]},e?b(e,r):[]),z.renderGanttTaskChartAfters?(0,_vue.h)("div",{ref:g,class:"vxe-gantt-view--chart-after-wrapper"},e&&(0,_utils.isEnableConf)(n)?z.renderGanttTaskChartAfters():[]):renderEmptyElement(z)])}}});