vxe-gantt 3.2.5 → 3.2.8

package/lib/index.umd.js

@@ -8286,7 +8286,7 @@ var core_ = __webpack_require__(4345);
 
 var setConfig = core_.VxeUI.setConfig,
   setIcon = core_.VxeUI.setIcon;
-core_.VxeUI.ganttVersion = "3.2.5";
+core_.VxeUI.ganttVersion = "3.2.8";
 var ymdFormat = 'yyyy-MM-dd';
 var ymdhmsFormat = 'yyyy-MM-dd HH:mm:ss';
 setConfig({
@@ -8377,6 +8377,9 @@ setConfig({
       resize: true,
       showCollapseTableButton: true,
       showCollapseTaskButton: true
+    },
+    taskBarSubviewConfig: {
+      // showOverview: false
     }
   }
 });
@@ -8400,7 +8403,7 @@ var es_array_concat = __webpack_require__(8706);
 ;// ./packages/ui/src/log.ts
 
 var log = core_.VxeUI.log;
-var version = "gantt v".concat("3.2.5");
+var version = "gantt v".concat("3.2.8");
 var warnLog = log.create('warn', version);
 var errLog = log.create('error', version);
 ;// ./packages/ui/src/depend.ts
@@ -8862,6 +8865,9 @@ var getConfig = core_.VxeUI.getConfig;
 function isEnableConf(conf) {
   return conf && conf.enabled !== false;
 }
+function hasEnableConf(conf, opts) {
+  return opts && (conf ? opts.enabled !== false : opts.enabled);
+}
 function isEmptyValue(cellValue) {
   return cellValue === null || cellValue === undefined || cellValue === '';
 }
@@ -9151,15 +9157,19 @@ function getTaskBarLeft(chartRest, viewCellWidth) {
   return chartRest ? viewCellWidth * chartRest.oLeftSize : 0;
 }
 function getTaskBarWidth(chartRest, viewCellWidth) {
-  return Math.max(1, chartRest ? Math.floor(viewCellWidth * chartRest.oWidthSize) - 1 : 0);
+  return chartRest && chartRest.oWidthSize ? Math.max(1, chartRest ? Math.floor(viewCellWidth * chartRest.oWidthSize) - 1 : 0) : 0;
 }
 var taskTypeMaps = {
-  milestone: true
+  milestone: true,
+  subview: true
 };
 function hasMilestoneTask(type) {
-  return taskTypeMaps[type];
+  return type === 'milestone';
+}
+function hasSubviewTask(type) {
+  return type === 'subview';
 }
-function gettaskType(type) {
+function getTaskType(type) {
   return taskTypeMaps[type] ? type : 'default';
 }
 ;// ./packages/gantt/src/gantt-header.ts
@@ -9339,6 +9349,8 @@ var viewType = 'header';
 
 
 
+
+
 var getIcon = core_.VxeUI.getIcon,
   renderEmptyElement = core_.VxeUI.renderEmptyElement;
 var gantt_chart_sourceType = 'gantt';
@@ -9362,7 +9374,7 @@ var gantt_chart_viewType = 'chart';
     //
     // Render
     //
-    renderTaskBar: function renderTaskBar(h, $xeTable, row, rowid, rowIndex, $rowIndex, _rowIndex) {
+    renderTaskBar: function renderTaskBar(h, $xeTable, row, rowid, rowIndex, $rowIndex, _rowIndex, rowChildren, isExpandTree) {
       var _vm = this;
       var $xeGantt = _vm.$xeGantt;
       var tableReactData = $xeTable;
@@ -9379,7 +9391,8 @@ var gantt_chart_viewType = 'chart';
       var ganttInternalData = $xeGantt.internalData;
       var ganttSlots = $xeGantt.$scopedSlots;
       var taskBarSlot = ganttSlots.taskBar || ganttSlots['task-bar'];
-      var taskBarMilestoneConfig = ganttProps.taskBarMilestoneConfig;
+      var taskBarMilestoneConfig = ganttProps.taskBarMilestoneConfig,
+        taskBarSubviewConfig = ganttProps.taskBarSubviewConfig;
       var activeLink = ganttReactData.activeLink,
         activeBarRowid = ganttReactData.activeBarRowid;
       var titleField = $xeGantt.computeTitleField;
@@ -9387,6 +9400,7 @@ var gantt_chart_viewType = 'chart';
       var typeField = $xeGantt.computeTypeField;
       var taskBarOpts = $xeGantt.computeTaskBarOpts;
       var taskBarMilestoneOpts = $xeGantt.computeTaskBarMilestoneOpts;
+      var taskBarSubviewOpts = $xeGantt.computeTaskBarSubviewOpts;
       var scaleUnit = $xeGantt.computeScaleUnit;
       var barParams = {
         $gantt: $xeGantt,
@@ -9406,8 +9420,9 @@ var gantt_chart_viewType = 'chart';
       var cellHeight = resizeHeightFlag ? getCellRestHeight(rowRest, cellOpts, rowOpts, defaultRowHeight) : 0;
       var title = getStringValue(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, titleField));
       var progressValue = showProgress ? Math.min(100, Math.max(0, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, progressField)))) : 0;
-      var typeValue = gettaskType(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, typeField));
-      var isMilestone = !!(taskBarMilestoneConfig && hasMilestoneTask(typeValue));
+      var renderTaskType = getTaskType(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, typeField));
+      var isMilestone = !!(hasEnableConf(taskBarMilestoneConfig, taskBarMilestoneOpts) && hasMilestoneTask(renderTaskType));
+      var isSubview = !!(hasEnableConf(taskBarSubviewConfig, taskBarSubviewOpts) && hasSubviewTask(renderTaskType));
       var vbStyle = {};
       var vpStyle = {
         width: "".concat(progressValue || 0, "%")
@@ -9479,7 +9494,72 @@ var gantt_chart_viewType = 'chart';
           on: ctOns
         }, $xeGantt.callSlot(taskBarSlot, barParams, h)));
       } else {
-        if (isMilestone) {
+        if (isSubview && rowChildren && rowChildren.length) {
+          if (isExpandTree) {
+            if (taskBarSubviewOpts.showOverview) {
+              cbVNs.push(h('div', {
+                key: 'vcso',
+                class: ['vxe-gantt-view--chart-subview-wrapper is--overview', {
+                  'is--round': round,
+                  'is--move': moveable
+                }]
+              }, [h('div', {
+                key: rowid,
+                attrs: {
+                  rowid: rowid
+                },
+                class: 'vxe-gantt-view--chart-subview-bar'
+              }, [h('div', {
+                class: 'vxe-gantt-view--chart-subview-bar-content-wrapper'
+              }, [showContent ? h('div', {
+                class: 'vxe-gantt-view--chart-content'
+              }, title) : renderEmptyElement($xeGantt)])])]));
+            }
+          } else {
+            cbVNs.push(h('div', {
+              key: 'vcsc',
+              class: ['vxe-gantt-view--chart-subview-wrapper is--inline', {
+                'is--round': round,
+                'is--move': moveable
+              }]
+            }, rowChildren.map(function (childRow) {
+              var childRowid = $xeTable.getRowid(childRow);
+              var childTitle = getStringValue(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(childRow, titleField));
+              var childProgressValue = showProgress ? Math.min(100, Math.max(0, external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().toNumber(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(childRow, progressField)))) : 0;
+              var childRenderTaskType = getTaskType(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(childRow, typeField));
+              var vpcStyle = {
+                width: "".concat(childProgressValue || 0, "%")
+              };
+              if (isBarRowStyle) {
+                var _completedBgColor = barStyObj.completedBgColor;
+                if (_completedBgColor) {
+                  vpcStyle.backgroundColor = _completedBgColor;
+                }
+              }
+              if (contentMethod) {
+                childTitle = getStringValue(contentMethod({
+                  row: childRow,
+                  title: childTitle,
+                  scaleType: scaleUnit
+                }));
+              }
+              return h('div', {
+                key: childRowid,
+                attrs: {
+                  rowid: childRowid
+                },
+                class: ['vxe-gantt-view--chart-subview-bar', "is--".concat(childRenderTaskType)]
+              }, [h('div', {
+                class: 'vxe-gantt-view--chart-subview-bar-content-wrapper'
+              }, [showProgress ? h('div', {
+                class: 'vxe-gantt-view--chart-progress',
+                style: vpcStyle
+              }) : renderEmptyElement($xeGantt), showContent ? h('div', {
+                class: 'vxe-gantt-view--chart-content'
+              }, childTitle) : renderEmptyElement($xeGantt)])]);
+            })));
+          }
+        } else if (isMilestone) {
           var icon = taskBarMilestoneOpts.icon,
             iconStatus = taskBarMilestoneOpts.iconStatus,
             iconStyle = taskBarMilestoneOpts.iconStyle;
@@ -9505,11 +9585,9 @@ var gantt_chart_viewType = 'chart';
             class: 'vxe-gantt-view--chart-bar-content-wrapper',
             on: ctOns
           }, [showProgress ? h('div', {
-            key: 'vcp',
             class: 'vxe-gantt-view--chart-progress',
             style: vpStyle
           }) : renderEmptyElement($xeGantt), showContent ? h('div', {
-            key: 'vcc',
             class: 'vxe-gantt-view--chart-content'
           }, title) : renderEmptyElement($xeGantt)]));
         }
@@ -9519,7 +9597,7 @@ var gantt_chart_viewType = 'chart';
         attrs: {
           rowid: rowid
         },
-        class: ['vxe-gantt-view--chart-row', "is--".concat(gettaskType(typeValue)), {
+        class: ['vxe-gantt-view--chart-row', "is--".concat(renderTaskType), {
           'row--pending': !!pendingRowFlag && !!pendingRowMaps[rowid],
           'is--round': round,
           'is--move': moveable
@@ -9533,7 +9611,7 @@ var gantt_chart_viewType = 'chart';
           }
         }
       }, [h('div', {
-        class: [taskBarSlot ? 'vxe-gantt-view--chart-custom-bar' : 'vxe-gantt-view--chart-bar', "is--".concat(gettaskType(typeValue)), {
+        class: [taskBarSlot ? 'vxe-gantt-view--chart-custom-bar' : 'vxe-gantt-view--chart-bar', "is--".concat(renderTaskType), {
           'is--active': activeBarRowid === rowid,
           'active--link': activeLink && (rowid === "".concat(activeLink.from) || rowid === "".concat(activeLink.to))
         }],
@@ -9581,15 +9659,15 @@ var gantt_chart_viewType = 'chart';
           rowIndex = rowRest.index;
           _rowIndex = rowRest._index;
         }
-        trVNs.push(_vm.renderTaskBar(h, $xeTable, row, rowid, rowIndex, $rowIndex, _rowIndex));
         var isExpandTree = false;
         var rowChildren = [];
-        if (treeConfig && !scrollYLoad && !transform) {
+        if (treeConfig) {
           rowChildren = row[childrenField];
           isExpandTree = !!treeExpandedFlag && rowChildren && rowChildren.length > 0 && !!treeExpandedMaps[rowid];
         }
+        trVNs.push(_vm.renderTaskBar(h, $xeTable, row, rowid, rowIndex, $rowIndex, _rowIndex, rowChildren, isExpandTree));
         // 如果是树形表格
-        if (isExpandTree) {
+        if (treeConfig && isExpandTree && !scrollYLoad && !transform) {
           trVNs.push.apply(trVNs, _toConsumableArray(_vm.renderTaskRows(h, $xeTable, rowChildren)));
         }
       });
@@ -10655,14 +10733,23 @@ function handleParseColumn($xeGanttView) {
         var rowid = $xeTable.getRowid(row);
         var startValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, startField);
         var endValue = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, endField);
-        var isMilestone = hasMilestoneTask(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, typeField));
+        var renderTaskType = getTaskType(external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(row, typeField));
+        var isMilestone = hasMilestoneTask(renderTaskType);
+        var isSubview = hasSubviewTask(renderTaskType);
         if (isMilestone) {
           if (!startValue) {
             startValue = endValue;
           }
           endValue = startValue;
         }
-        if (startValue && endValue) {
+        if (isSubview) {
+          ctMaps[rowid] = {
+            row: row,
+            rowid: rowid,
+            oLeftSize: 0,
+            oWidthSize: 0
+          };
+        } else if (startValue && endValue) {
           var _renderFn = renderFn(startValue, endValue),
             offsetLeftSize = _renderFn.offsetLeftSize,
             offsetWidthSize = _renderFn.offsetWidthSize;
@@ -10800,7 +10887,35 @@ function calcScrollbar($xeGanttView) {
     reactData.overflowX = overflowX;
   }
 }
-function updateTaskChart($xeGanttView) {
+function handleSubTaskMinMaxSize($xeGanttView, $xeTable, list) {
+  var $xeGantt = $xeGanttView.$xeGantt;
+  var internalData = $xeGanttView.internalData;
+  var chartMaps = internalData.chartMaps;
+  var treeOpts = $xeTable.computeTreeOpts;
+  var childrenField = treeOpts.children || treeOpts.childrenField;
+  var typeField = $xeGantt.computeTypeField;
+  var minChildLeftSize = 0;
+  var maxChildLeftSize = 0;
+  external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().eachTree(list, function (childRow) {
+    var childRowid = $xeTable.getRowid(childRow);
+    var renderTaskType = external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().get(childRow, typeField);
+    if (hasSubviewTask(renderTaskType)) {
+      return;
+    }
+    var childChartRest = childRowid ? chartMaps[childRowid] : null;
+    if (childChartRest) {
+      maxChildLeftSize = Math.max(maxChildLeftSize, childChartRest.oLeftSize + childChartRest.oWidthSize);
+      minChildLeftSize = minChildLeftSize ? Math.min(minChildLeftSize, childChartRest.oLeftSize) : childChartRest.oLeftSize;
+    }
+  }, {
+    children: childrenField
+  });
+  return {
+    minSize: minChildLeftSize,
+    maxSize: maxChildLeftSize
+  };
+}
+function updateTaskChartStyle($xeGanttView) {
   var $xeGantt = $xeGanttView.$xeGantt;
   var reactData = $xeGanttView.reactData;
   var internalData = $xeGanttView.internalData;
@@ -10812,6 +10927,8 @@ function updateTaskChart($xeGanttView) {
     chartMaps = internalData.chartMaps;
   var chartWrapper = getRefElem(elemStore['main-chart-task-wrapper']);
   if (chartWrapper && $xeTable) {
+    var treeOpts = $xeTable.computeTreeOpts;
+    var childrenField = treeOpts.children || treeOpts.childrenField;
     external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().arrayEach(chartWrapper.children, function (rowEl) {
       var barEl = rowEl.children[0];
       if (!barEl) {
@@ -10822,9 +10939,55 @@ function updateTaskChart($xeGanttView) {
         return;
       }
       var chartRest = rowid ? chartMaps[rowid] : null;
-      barEl.style.left = "".concat(getTaskBarLeft(chartRest, viewCellWidth), "px");
-      if (!hasClass(barEl, 'is--milestone')) {
-        barEl.style.width = "".concat(getTaskBarWidth(chartRest, viewCellWidth), "px");
+      var row = chartRest ? chartRest.row : null;
+      // 子任务视图
+      if (hasClass(barEl, 'is--subview')) {
+        var childWrapperEl = barEl.firstElementChild;
+        if (childWrapperEl) {
+          // 行内展示
+          if (hasClass(childWrapperEl, 'is--inline')) {
+            external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().arrayEach(childWrapperEl.children, function (childEl) {
+              var childBarEl = childEl;
+              var childRowid = childBarEl.getAttribute('rowid') || '';
+              var childChartRest = childRowid ? chartMaps[childRowid] : null;
+              if (childChartRest) {
+                var childRow = childChartRest.row;
+                // 如果是子视图
+                if (hasClass(childBarEl, 'is--subview')) {
+                  var subChildren = childRow[childrenField];
+                  var _handleSubTaskMinMaxS = handleSubTaskMinMaxSize($xeGanttView, $xeTable, subChildren),
+                    minChildLeftSize = _handleSubTaskMinMaxS.minSize,
+                    maxChildLeftSize = _handleSubTaskMinMaxS.maxSize;
+                  childBarEl.style.left = "".concat(viewCellWidth * minChildLeftSize, "px");
+                  childBarEl.style.width = "".concat(viewCellWidth * (maxChildLeftSize - minChildLeftSize), "px");
+                } else {
+                  childBarEl.style.left = "".concat(getTaskBarLeft(childChartRest, viewCellWidth), "px");
+                  if (!hasClass(childBarEl, 'is--milestone')) {
+                    // 里程碑不需要宽度
+                    childBarEl.style.width = "".concat(getTaskBarWidth(childChartRest, viewCellWidth), "px");
+                  }
+                }
+              }
+            });
+          } else {
+            // 如果展开子任务
+            var childBarEl = childWrapperEl.firstElementChild;
+            if (childBarEl) {
+              var rowChildren = row ? row[childrenField] : [];
+              var _handleSubTaskMinMaxS2 = handleSubTaskMinMaxSize($xeGanttView, $xeTable, rowChildren),
+                minChildLeftSize = _handleSubTaskMinMaxS2.minSize,
+                maxChildLeftSize = _handleSubTaskMinMaxS2.maxSize;
+              childBarEl.style.left = "".concat(viewCellWidth * minChildLeftSize, "px");
+              childBarEl.style.width = "".concat(viewCellWidth * (maxChildLeftSize - minChildLeftSize), "px");
+            }
+          }
+        }
+      } else {
+        barEl.style.left = "".concat(getTaskBarLeft(chartRest, viewCellWidth), "px");
+        // 里程碑不需要宽度
+        if (!hasClass(barEl, 'is--milestone')) {
+          barEl.style.width = "".concat(getTaskBarWidth(chartRest, viewCellWidth), "px");
+        }
       }
     });
   }
@@ -10950,7 +11113,7 @@ function updateStyle($xeGanttView) {
     bodyTableElem.style.width = "".concat(vmTableWidth, "px");
   }
   reactData.scrollXWidth = viewTableWidth;
-  return Promise.all([updateTaskChart($xeGanttView), $xeGantt.handleUpdateTaskLinkStyle ? $xeGantt.handleUpdateTaskLinkStyle($xeGanttView) : null]);
+  return Promise.all([updateTaskChartStyle($xeGanttView), $xeGantt.handleUpdateTaskLinkStyle ? $xeGantt.handleUpdateTaskLinkStyle($xeGanttView) : null]);
 }
 function handleRecalculateStyle($xeGanttView) {
   var internalData = $xeGanttView.internalData;
@@ -11989,6 +12152,7 @@ function gantt_createReactData() {
     taskLinkConfig: Object,
     taskBarConfig: Object,
     taskBarMilestoneConfig: Object,
+    taskBarSubviewConfig: Object,
     taskBarTooltipConfig: Object,
     taskSplitConfig: Object,
     taskBarResizeConfig: Object,
@@ -12094,6 +12258,11 @@ function gantt_createReactData() {
       var props = $xeGantt;
       return Object.assign({}, gantt_getConfig().gantt.taskBarMilestoneConfig, props.taskBarMilestoneConfig);
     },
+    computeTaskBarSubviewOpts: function computeTaskBarSubviewOpts() {
+      var $xeGantt = this;
+      var props = $xeGantt;
+      return Object.assign({}, gantt_getConfig().gantt.taskBarSubviewConfig, props.taskBarSubviewConfig);
+    },
     computeTaskBarTooltipOpts: function computeTaskBarTooltipOpts() {
       var $xeGantt = this;
       var props = $xeGantt;
@@ -12190,13 +12359,15 @@ function gantt_createReactData() {
       var props = $xeGantt;
       var reactData = $xeGantt.reactData;
       var height = props.height,
-        maxHeight = props.maxHeight;
+        maxHeight = props.maxHeight,
+        taskBarSubviewConfig = props.taskBarSubviewConfig;
       var isZMax = reactData.isZMax,
         tZindex = reactData.tZindex;
       var taskViewOpts = $xeGantt.computeTaskViewOpts;
       var tableStyle = taskViewOpts.tableStyle;
       var taskBarOpts = $xeGantt.computeTaskBarOpts;
       var barStyle = taskBarOpts.barStyle;
+      var taskBarSubviewOpts = $xeGantt.computeTaskBarSubviewOpts;
       var stys = {};
       if (isZMax) {
         stys.zIndex = tZindex;
@@ -12210,13 +12381,17 @@ function gantt_createReactData() {
       }
       if (barStyle && !external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().isFunction(barStyle)) {
         var bgColor = barStyle.bgColor,
-          completedBgColor = barStyle.completedBgColor;
+          completedBgColor = barStyle.completedBgColor,
+          overviewBgColor = barStyle.overviewBgColor;
         if (bgColor) {
           stys['--vxe-ui-gantt-view-task-bar-background-color'] = bgColor;
         }
         if (completedBgColor) {
           stys['--vxe-ui-gantt-view-task-bar-completed-background-color'] = completedBgColor;
         }
+        if (overviewBgColor && hasEnableConf(taskBarSubviewConfig, taskBarSubviewOpts)) {
+          stys['--vxe-ui-gantt-view-task-bar-overview-background-color'] = overviewBgColor;
+        }
       }
       if (tableStyle) {
         var defTbWidth = tableStyle.width;
@@ -14551,14 +14726,18 @@ var VxeGanttDependencyType;
   VxeGanttDependencyType[VxeGanttDependencyType["FinishToFinish"] = 3] = "FinishToFinish";
 })(VxeGanttDependencyType || (VxeGanttDependencyType = {}));
 /**
- * 任务类型
+ * 任务渲染类型
  */
 var VxeGanttTaskType;
 (function (VxeGanttTaskType) {
   /**
-   * 里程碑
+   * 里程碑类型，该类型节点不需要结束日期
    */
   VxeGanttTaskType["Milestone"] = "milestone";
+  /**
+   * 子视图类型，该类型会将子任务渲染到一行，无需开始日期和结束日期
+   */
+  VxeGanttTaskType["Subview"] = "subview";
 })(VxeGanttTaskType || (VxeGanttTaskType = {}));
 ;// ./packages/gantt/index.ts