vxe-table 3.4.14-beta.2 → 3.4.14-beta.3

package/packages/table/src/body.js

@@ -3,7 +3,7 @@ import GlobalConfig from '../../v-x-e-table/src/conf'
 import VXETable from '../../v-x-e-table'
 import { UtilTools, DomTools, isEnableConf } from '../../tools'
 import { getOffsetSize, calcTreeLine, mergeBodyMethod, removeScrollListener, restoreScrollListener } from './util'
-import { browse } from '../../tools/src/dom'
+import { browse, setScrollLeftAndTop } from '../../tools/src/dom'
 
 const renderType = 'body'
 
@@ -401,7 +401,7 @@ function renderRows (h, _vm, $xetable, fixedType, tableData, tableColumn) {
  * 同步滚动条
  */
 let scrollProcessTimeout
-function syncBodyScroll (scrollTop, elem1, elem2) {
+function syncBodyScroll (_vm, fixedType, scrollTop, elem1, elem2) {
   if (elem1 || elem2) {
     if (elem1) {
       removeScrollListener(elem1)
@@ -412,9 +412,30 @@ function syncBodyScroll (scrollTop, elem1, elem2) {
       elem2.scrollTop = scrollTop
     }
     clearTimeout(scrollProcessTimeout)
-    scrollProcessTimeout = setTimeout(function () {
+    scrollProcessTimeout = setTimeout(() => {
+      const { tableBody, leftBody, rightBody } = _vm.$refs
+      const bodyElem = tableBody.$el
+      const leftElem = leftBody ? leftBody.$el : null
+      const rightElem = rightBody ? rightBody.$el : null
       restoreScrollListener(elem1)
       restoreScrollListener(elem2)
+      // 检查滚动条是的同步
+      let targetTop = bodyElem.scrollTop
+      let targetLeft = bodyElem.scrollLeft
+      if (fixedType === 'left') {
+        if (leftElem) {
+          targetTop = leftElem.scrollTop
+          targetLeft = leftElem.scrollLeft
+        }
+      } else if (fixedType === 'right') {
+        if (rightElem) {
+          targetTop = rightElem.scrollTop
+          targetLeft = rightElem.scrollLeft
+        }
+      }
+      setScrollLeftAndTop(bodyElem, targetLeft, targetTop)
+      setScrollLeftAndTop(leftElem, targetLeft, targetTop)
+      setScrollLeftAndTop(rightElem, targetLeft, targetTop)
     }, 300)
   }
 }
@@ -621,10 +642,10 @@ export default {
       }
       if (leftElem && fixedType === 'left') {
         scrollTop = leftElem.scrollTop
-        syncBodyScroll(scrollTop, bodyElem, rightElem)
+        syncBodyScroll($xetable, fixedType, scrollTop, bodyElem, rightElem)
       } else if (rightElem && fixedType === 'right') {
         scrollTop = rightElem.scrollTop
-        syncBodyScroll(scrollTop, bodyElem, leftElem)
+        syncBodyScroll($xetable, fixedType, scrollTop, bodyElem, leftElem)
       } else {
         if (isRollX) {
           if (headerElem) {
@@ -637,7 +658,7 @@ export default {
         if (leftElem || rightElem) {
           $xetable.checkScrolling()
           if (isRollY) {
-            syncBodyScroll(scrollTop, leftElem, rightElem)
+            syncBodyScroll($xetable, fixedType, scrollTop, leftElem, rightElem)
           }
         }
       }
@@ -689,15 +710,15 @@ export default {
             wheelYInterval = wheelYInterval - (wheelYTotal - wheelYSize)
           }
           const { scrollTop, clientHeight, scrollHeight } = bodyElem
-          const targerTop = scrollTop + (wheelYInterval * (isTopWheel ? -1 : 1))
-          bodyElem.scrollTop = targerTop
+          const targetTop = scrollTop + (wheelYInterval * (isTopWheel ? -1 : 1))
+          bodyElem.scrollTop = targetTop
           if (leftElem) {
-            leftElem.scrollTop = targerTop
+            leftElem.scrollTop = targetTop
           }
           if (rightElem) {
-            rightElem.scrollTop = targerTop
+            rightElem.scrollTop = targetTop
           }
-          if (isTopWheel ? targerTop < scrollHeight - clientHeight : targerTop >= 0) {
+          if (isTopWheel ? targetTop < scrollHeight - clientHeight : targetTop >= 0) {
             this.wheelTime = setTimeout(handleSmooth, 10)
           }
           this.wheelYTotal = wheelYTotal

package/packages/table/src/methods.js

@@ -9,7 +9,7 @@ import { browse, getPaddingTopBottomSize, setScrollTop, setScrollLeft } from '..
 import { formats } from '../../v-x-e-table/src/formats'
 
 const { getRowid, getRowkey, setCellValue, hasChildrenList, getColumnList } = UtilTools
-const { calcHeight, hasClass, addClass, removeClass, getEventTargetNode } = DomTools
+const { calcHeight, hasClass, addClass, removeClass, getEventTargetNode, isNodeElement } = DomTools
 
 const isWebkit = browse['-webkit'] && !browse.edge
 const debounceScrollYDuration = browse.msie ? 80 : 20
@@ -301,6 +301,7 @@ const Methods = {
     const { scrollXLoad, scrollYLoad } = this
     return this.handleTableData(true).then(() => {
       this.updateFooter()
+      this.checkSelectionStatus()
       if (scrollXLoad || scrollYLoad) {
         if (scrollXLoad) {
           this.updateScrollXSpace()
@@ -310,7 +311,13 @@ const Methods = {
         }
         return this.refreshScroll()
       }
-    }).then(() => this.recalculate())
+    }).then(() => {
+      this.updateCellAreas()
+      return this.recalculate(true)
+    }).then(() => {
+      // 存在滚动行为未结束情况
+      setTimeout(() => this.recalculate(), 50)
+    })
   },
   handleTableData (force) {
     const { scrollYLoad, scrollYStore, fullDataRowIdData, afterFullData } = this
@@ -1700,15 +1707,22 @@ const Methods = {
     const leftBodyElem = leftBody ? leftBody.$el : null
     const rightBodyElem = rightBody ? rightBody.$el : null
     const tableFooterElem = tableFooter ? tableFooter.$el : null
-    // 还原滚动条位置
-    if (lastScrollLeft || lastScrollTop) {
-      return restoreScrollLocation(this, lastScrollLeft, lastScrollTop)
-    }
-    // 重置
-    setScrollTop(tableBodyElem, lastScrollTop)
-    setScrollTop(leftBodyElem, lastScrollTop)
-    setScrollTop(rightBodyElem, lastScrollTop)
-    setScrollLeft(tableFooterElem, lastScrollLeft)
+    return new Promise(resolve => {
+      // 还原滚动条位置
+      if (lastScrollLeft || lastScrollTop) {
+        return restoreScrollLocation(this, lastScrollLeft, lastScrollTop).then(() => {
+          // 存在滚动行为未结束情况
+          setTimeout(resolve, 30)
+        })
+      }
+      // 重置
+      setScrollTop(tableBodyElem, lastScrollTop)
+      setScrollTop(leftBodyElem, lastScrollTop)
+      setScrollTop(rightBodyElem, lastScrollTop)
+      setScrollLeft(tableFooterElem, lastScrollLeft)
+      // 存在滚动行为未结束情况
+      setTimeout(resolve, 30)
+    })
   },
   /**
    * 计算单元格列宽，动态分配可用剩余空间
@@ -1977,7 +1991,7 @@ const Methods = {
           }
         } else if (layout === 'body') {
           const emptyBlockElem = elemStore[`${name}-${layout}-emptyBlock`]
-          if (wrapperElem) {
+          if (isNodeElement(wrapperElem)) {
             if (customMaxHeight) {
               wrapperElem.style.maxHeight = `${fixedType ? customMaxHeight - headerHeight - (showFooter ? 0 : scrollbarHeight) : customMaxHeight - headerHeight}px`
             } else {
@@ -1993,7 +2007,7 @@ const Methods = {
           if (fixedWrapperElem) {
             const isRightFixed = fixedType === 'right'
             const fixedColumn = columnStore[`${fixedType}List`]
-            if (wrapperElem) {
+            if (isNodeElement(wrapperElem)) {
               wrapperElem.style.top = `${headerHeight}px`
             }
             fixedWrapperElem.style.height = `${(customHeight > 0 ? customHeight - headerHeight - footerHeight : tableHeight) + headerHeight + footerHeight - scrollbarHeight * (showFooter ? 2 : 1)}px`
@@ -2057,7 +2071,7 @@ const Methods = {
           }
           tWidth = tableColumn.reduce((previous, column) => previous + column.renderWidth, 0)
 
-          if (wrapperElem) {
+          if (isNodeElement(wrapperElem)) {
             // 如果是固定列
             if (fixedWrapperElem) {
               wrapperElem.style.top = `${customHeight > 0 ? customHeight - footerHeight : tableHeight + headerHeight}px`

package/packages/tools/src/dom.js

@@ -80,6 +80,17 @@ export function setScrollLeft (elem, scrollLeft) {
   }
 }
 
+export function setScrollLeftAndTop (elem, scrollLeft, scrollTop) {
+  if (elem) {
+    elem.scrollLeft = scrollLeft
+    elem.scrollTop = scrollTop
+  }
+}
+
+function isNodeElement (elem) {
+  return elem && elem.nodeType === 1
+}
+
 export const DomTools = {
   browse,
   isPx (val) {
@@ -225,7 +236,8 @@ export const DomTools = {
       }
     }
     return num
-  }
+  },
+  isNodeElement
 }
 
 export default DomTools