vxe-gantt 4.1.19 → 4.2.0

package/lib/index.umd.js

@@ -2785,7 +2785,7 @@ const {
   setConfig,
   setIcon
 } = core_.VxeUI;
-core_.VxeUI.ganttVersion = "4.1.19";
+core_.VxeUI.ganttVersion = "4.2.0";
 const ymdFormat = 'yyyy-MM-dd';
 const ymdhmsFormat = 'yyyy-MM-dd HH:mm:ss';
 setConfig({
@@ -2895,7 +2895,7 @@ setIcon({
 const {
   log
 } = core_.VxeUI;
-const version = `gantt v${"4.1.19"}`;
+const version = `gantt v${"4.2.0"}`;
 const warnLog = log.create('warn', version);
 const errLog = log.create('error', version);
 ;// ./packages/ui/src/depend.ts
@@ -4099,7 +4099,9 @@ const gantt_body_viewType = 'body';
       } = taskViewOpts;
       const {
         rowClassName,
-        rowStyle
+        rowStyle,
+        cellClassName,
+        cellStyle
       } = viewStyle || {};
       const {
         tableColumn,
@@ -4150,7 +4152,7 @@ const gantt_body_viewType = 'body';
           _rowIndex
         };
         trVNs.push((0,external_commonjs_vue_commonjs2_vue_root_Vue_.h)('tr', {
-          key: treeConfig ? rowid : $rowIndex,
+          key: rowClassName || rowStyle || cellClassName || cellStyle ? rowid : $rowIndex,
           class: ['vxe-gantt-view--body-row', {
             'row--stripe': stripe && (_rowIndex + 1) % 2 === 0,
             'is--new': isNewRow,
@@ -4335,6 +4337,38 @@ function createInternalData() {
     lastScrollLeft: 0
   };
 }
+function createReactData() {
+  return {
+    // 是否启用了横向 X 可视渲染方式加载
+    scrollXLoad: false,
+    // 是否启用了纵向 Y 可视渲染方式加载
+    scrollYLoad: false,
+    // 是否存在纵向滚动条
+    overflowY: true,
+    // 是否存在横向滚动条
+    overflowX: true,
+    // 纵向滚动条的宽度
+    scrollbarWidth: 0,
+    // 横向滚动条的高度
+    scrollbarHeight: 0,
+    // 最后滚动时间戳
+    lastScrollTime: 0,
+    lazScrollLoading: false,
+    scrollVMLoading: false,
+    scrollYHeight: 0,
+    scrollYTop: 0,
+    isScrollYBig: false,
+    scrollXLeft: 0,
+    scrollXWidth: 0,
+    isScrollXBig: false,
+    minViewDate: null,
+    maxViewDate: null,
+    tableData: [],
+    tableColumn: [],
+    headerGroups: [],
+    viewCellWidth: 40
+  };
+}
 const maxYHeight = 5e6;
 // const maxXWidth = 5e6
 /* harmony default export */ var gantt_view = (defineVxeComponent({
@@ -4372,36 +4406,7 @@ const maxYHeight = 5e6;
     const refScrollXSpaceElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refScrollYSpaceElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refColInfoElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)({
-      // 是否启用了横向 X 可视渲染方式加载
-      scrollXLoad: false,
-      // 是否启用了纵向 Y 可视渲染方式加载
-      scrollYLoad: false,
-      // 是否存在纵向滚动条
-      overflowY: true,
-      // 是否存在横向滚动条
-      overflowX: true,
-      // 纵向滚动条的宽度
-      scrollbarWidth: 0,
-      // 横向滚动条的高度
-      scrollbarHeight: 0,
-      // 最后滚动时间戳
-      lastScrollTime: 0,
-      lazScrollLoading: false,
-      scrollVMLoading: false,
-      scrollYHeight: 0,
-      scrollYTop: 0,
-      isScrollYBig: false,
-      scrollXLeft: 0,
-      scrollXWidth: 0,
-      isScrollXBig: false,
-      minViewDate: null,
-      maxViewDate: null,
-      tableData: [],
-      tableColumn: [],
-      headerGroups: [],
-      viewCellWidth: 40
-    });
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(createReactData());
     const internalData = createInternalData();
     const refMaps = {
       refElem,
@@ -5518,27 +5523,30 @@ const maxYHeight = 5e6;
       // if (footerTableElem) {
       //   footerTableElem.style.transform = `translate(${xSpaceLeft}px, 0px)`
       // }
+      const ySpaceWidth = scrollXWidth;
       const layoutList = ['header', 'body', 'footer'];
       layoutList.forEach(layout => {
         const xSpaceElem = getRefElem(elemStore[`main-${layout}-xSpace`]);
         if (xSpaceElem) {
-          xSpaceElem.style.width = scrollXLoad ? `${scrollXWidth}px` : '';
+          xSpaceElem.style.width = scrollXLoad ? `${ySpaceWidth}px` : '';
         }
       });
       const scrollXSpaceEl = refScrollXSpaceElem.value;
       if (scrollXSpaceEl) {
-        scrollXSpaceEl.style.width = `${scrollXWidth}px`;
+        scrollXSpaceEl.style.width = `${ySpaceWidth}px`;
       }
       const beforeWrapper = getRefElem(elemStore['main-chart-before-wrapper']);
       const beforeSvgElem = beforeWrapper ? beforeWrapper.firstElementChild : null;
       if (beforeSvgElem) {
-        beforeSvgElem.style.width = `${scrollXWidth}px`;
+        beforeSvgElem.style.width = `${ySpaceWidth}px`;
       }
       const afterWrapper = getRefElem(elemStore['main-chart-after-wrapper']);
       const afterSvgElem = afterWrapper ? afterWrapper.firstElementChild : null;
       if (afterSvgElem) {
-        afterSvgElem.style.width = `${scrollXWidth}px`;
+        afterSvgElem.style.width = `${ySpaceWidth}px`;
       }
+      reactData.scrollXLeft = xSpaceLeft;
+      reactData.scrollXWidth = ySpaceWidth;
       calcScrollbar();
       return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
     };
@@ -5581,7 +5589,7 @@ const maxYHeight = 5e6;
         bodyTableElem.style.transform = `translate(${reactData.scrollXLeft || 0}px, ${scrollYTop}px)`;
       }
       if (bodyChartWrapperElem) {
-        bodyChartWrapperElem.style.transform = `translate(${reactData.scrollXLeft || 0}px, ${scrollYTop}px)`;
+        bodyChartWrapperElem.style.transform = `translateY(${scrollYTop}px)`;
       }
       const bodyYSpaceElem = getRefElem(elemStore['main-body-ySpace']);
       if (bodyYSpaceElem) {
@@ -5741,7 +5749,7 @@ const maxYHeight = 5e6;
           }
         });
       },
-      updateViewData() {
+      updateViewData(force) {
         const $xeTable = internalData.xeTable;
         if ($xeTable) {
           const tableReactData = $xeTable.reactData;
@@ -5749,6 +5757,10 @@ const maxYHeight = 5e6;
             tableData
           } = tableReactData;
           reactData.tableData = tableData;
+          if (force) {
+            handleUpdateData();
+          }
+          handleRecalculateStyle();
         }
         return (0,external_commonjs_vue_commonjs2_vue_root_Vue_.nextTick)();
       },
@@ -6046,19 +6058,12 @@ const maxYHeight = 5e6;
         class: 'vxe-gantt-view--column-info'
       })])]);
     };
-    const tdFlag = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)(0);
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => reactData.tableData, () => {
-      tdFlag.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(() => reactData.tableData.length, () => {
-      tdFlag.value++;
-    });
-    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.watch)(tdFlag, () => {
-      handleUpdateData();
-    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onMounted)(() => {
       globalEvents.on($xeGanttView, 'resize', handleGlobalResizeEvent);
     });
+    (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, createReactData());
+    });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
       globalEvents.off($xeGanttView, 'keydown');
       external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(internalData, createInternalData());
@@ -6124,7 +6129,7 @@ function gantt_createInternalData() {
     }
   };
 }
-function createReactData() {
+function gantt_createReactData() {
   return {
     tableLoading: false,
     proxyInited: false,
@@ -6219,7 +6224,7 @@ function getViewTypeLevel(type) {
     const {
       computeSize
     } = useFns.useSize(props);
-    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(createReactData());
+    const reactData = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.reactive)(gantt_createReactData());
     const internalData = gantt_createInternalData();
     const refElem = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
     const refTable = (0,external_commonjs_vue_commonjs2_vue_root_Vue_.ref)();
@@ -8801,7 +8806,7 @@ function getViewTypeLevel(type) {
       gantt_globalEvents.on($xeGantt, 'keydown', handleGlobalKeydownEvent);
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onBeforeUnmount)(() => {
-      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, createReactData());
+      external_root_XEUtils_commonjs_xe_utils_commonjs2_xe_utils_amd_xe_utils_default().assign(reactData, gantt_createReactData());
     });
     (0,external_commonjs_vue_commonjs2_vue_root_Vue_.onUnmounted)(() => {
       gantt_globalEvents.off($xeGantt, 'keydown');