vxe-table 3.15.11 → 3.15.13

package/packages/table/module/menu/panel.ts

@@ -40,6 +40,7 @@ export default {
           const hasChildMenus = item.children && item.children.some((child: any) => child.visible !== false)
           const prefixOpts = Object.assign({}, item.prefixConfig)
           const suffixOpts = Object.assign({}, item.suffixConfig)
+          const menuContent = getFuncText(item.name)
           return item.visible === false
             ? null
             : h('li', {
@@ -72,8 +73,11 @@ export default {
                   prefixOpts.content ? h('span', {}, `${prefixOpts.content}`) : _e()
                 ]),
                 h('span', {
-                  class: 'vxe-context-menu--link-content'
-                }, getFuncText(item.name)),
+                  class: 'vxe-context-menu--link-content',
+                  attrs: {
+                    title: menuContent
+                  }
+                }, menuContent),
                 h('div', {
                   class: ['vxe-context-menu--link-suffix', suffixOpts.className || '']
                 }, [
@@ -91,6 +95,7 @@ export default {
                 }, item.children.map((child: any, cIndex: any) => {
                   const childPrefixOpts = Object.assign({}, child.prefixConfig)
                   const childSuffixOpts = Object.assign({}, child.suffixConfig)
+                  const childMenuContent = getFuncText(child.name)
                   return child.visible === false
                     ? null
                     : h('li', {
@@ -123,8 +128,11 @@ export default {
                           childPrefixOpts.content ? h('span', `${childPrefixOpts.content}`) : _e()
                         ]),
                         h('span', {
-                          class: 'vxe-context-menu--link-content'
-                        }, getFuncText(child.name)),
+                          class: 'vxe-context-menu--link-content',
+                          attrs: {
+                            title: childMenuContent
+                          }
+                        }, childMenuContent),
                         h('div', {
                           class: ['vxe-context-menu--link-suffix', childSuffixOpts.className || '']
                         }, [

package/packages/table/src/cell.ts

@@ -15,7 +15,7 @@ function renderTitlePrefixIcon (h: CreateElement, params: VxeTableDefines.CellRe
   const titlePrefix = column.titlePrefix || column.titleHelp
   if (titlePrefix) {
     return h('i', {
-      class: ['vxe-cell-title-prefix-icon', titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX],
+      class: ['vxe-cell-title-prefix-icon', titlePrefix.iconStatus ? `theme--${titlePrefix.iconStatus}` : '', titlePrefix.icon || getIcon().TABLE_TITLE_PREFIX],
       on: {
         mouseenter (evnt: any) {
           $table.triggerHeaderTitleEvent(evnt, titlePrefix, params)
@@ -34,7 +34,7 @@ function renderTitleSuffixIcon (h: CreateElement, params: VxeTableDefines.CellRe
   const titleSuffix = column.titleSuffix
   if (titleSuffix) {
     return h('i', {
-      class: ['vxe-cell-title-suffix-icon', titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX],
+      class: ['vxe-cell-title-suffix-icon', titleSuffix.iconStatus ? `theme--${titleSuffix.iconStatus}` : '', titleSuffix.icon || getIcon().TABLE_TITLE_SUFFIX],
       on: {
         mouseenter (evnt: any) {
           $table.triggerHeaderTitleEvent(evnt, titleSuffix, params)

package/packages/table/src/methods.ts

@@ -2513,13 +2513,13 @@ function calcScrollbar ($xeTable: VxeTableConstructor & VxeTablePrivateMethods)
   if (bodyWrapperElem) {
     overflowY = scrollYHeight > bodyWrapperElem.clientHeight
     if (yHandleEl) {
-      reactData.scrollbarWidth = Math.max(scrollbarOpts.width || 0, yHandleEl.offsetWidth - yHandleEl.clientWidth)
+      reactData.scrollbarWidth = scrollbarOpts.width || (yHandleEl.offsetWidth - yHandleEl.clientWidth) || 14
     }
     reactData.overflowY = overflowY
 
     overflowX = scrollXWidth > bodyWrapperElem.clientWidth
     if (xHandleEl) {
-      reactData.scrollbarHeight = Math.max(scrollbarOpts.height || 0, xHandleEl.offsetHeight - xHandleEl.clientHeight)
+      reactData.scrollbarHeight = scrollbarOpts.height || (xHandleEl.offsetHeight - xHandleEl.clientHeight) || 14
     }
     reactData.overflowX = overflowX
 
@@ -2724,6 +2724,7 @@ function loadTableData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods,
   scrollYStore.endIndex = 1
   scrollXStore.startIndex = 0
   scrollXStore.endIndex = 1
+  internalData.cvCacheMaps = {}
   reactData.isRowLoading = true
   reactData.scrollVMLoading = false
   internalData.treeExpandedMaps = {}
@@ -3171,45 +3172,45 @@ const createGetColumnCacheProp = (prop: 'index' | '_index' | '$index') => {
   }
 }
 
-function lazyScrollXData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
-  const internalData = $xeTable as unknown as TableInternalData
-
-  const { lxTimeout, lxRunTime, scrollXStore } = internalData
-  const { visibleSize } = scrollXStore
-  const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)))
-  if (lxTimeout) {
-    clearTimeout(lxTimeout)
-  }
-  if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
-    internalData.lxRunTime = Date.now()
-    loadScrollXData($xeTable)
-  }
-  internalData.lxTimeout = setTimeout(() => {
-    internalData.lxTimeout = undefined
-    internalData.lxRunTime = undefined
-    loadScrollXData($xeTable)
-  }, fpsTime)
-}
-
-function lazyScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
-  const internalData = $xeTable as unknown as TableInternalData
-
-  const { lyTimeout, lyRunTime, scrollYStore } = internalData
-  const { visibleSize } = scrollYStore
-  const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)))
-  if (lyTimeout) {
-    clearTimeout(lyTimeout)
-  }
-  if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
-    internalData.lyRunTime = Date.now()
-    loadScrollYData($xeTable)
-  }
-  internalData.lyTimeout = setTimeout(() => {
-    internalData.lyTimeout = undefined
-    internalData.lyRunTime = undefined
-    loadScrollYData($xeTable)
-  }, fpsTime)
-}
+// function lazyScrollXData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
+//   const internalData = $xeTable as unknown as TableInternalData
+
+//   const { lxTimeout, lxRunTime, scrollXStore } = internalData
+//   const { visibleSize } = scrollXStore
+//   const fpsTime = Math.max(5, Math.min(10, Math.floor(visibleSize / 3)))
+//   if (lxTimeout) {
+//     clearTimeout(lxTimeout)
+//   }
+//   if (!lxRunTime || lxRunTime + fpsTime < Date.now()) {
+//     internalData.lxRunTime = Date.now()
+//     loadScrollXData($xeTable)
+//   }
+//   internalData.lxTimeout = setTimeout(() => {
+//     internalData.lxTimeout = undefined
+//     internalData.lxRunTime = undefined
+//     loadScrollXData($xeTable)
+//   }, fpsTime)
+// }
+
+// function lazyScrollYData ($xeTable: VxeTableConstructor & VxeTablePrivateMethods) {
+//   const internalData = $xeTable as unknown as TableInternalData
+
+//   const { lyTimeout, lyRunTime, scrollYStore } = internalData
+//   const { visibleSize } = scrollYStore
+//   const fpsTime = Math.floor(Math.max(4, Math.min(10, visibleSize / 3)))
+//   if (lyTimeout) {
+//     clearTimeout(lyTimeout)
+//   }
+//   if (!lyRunTime || lyRunTime + fpsTime < Date.now()) {
+//     internalData.lyRunTime = Date.now()
+//     loadScrollYData($xeTable)
+//   }
+//   internalData.lyTimeout = setTimeout(() => {
+//     internalData.lyTimeout = undefined
+//     internalData.lyRunTime = undefined
+//     loadScrollYData($xeTable)
+//   }, fpsTime)
+// }
 
 function checkLastSyncScroll ($xeTable: VxeTableConstructor & VxeTablePrivateMethods, isRollX: boolean, isRollY: boolean) {
   const reactData = $xeTable as unknown as TableReactData
@@ -9302,12 +9303,12 @@ const Methods = {
   triggerScrollXEvent () {
     const $xeTable = this
 
-    const virtualXOpts = $xeTable.computeVirtualXOpts
-    if (virtualXOpts.immediate) {
-      loadScrollXData($xeTable)
-    } else {
-      lazyScrollXData($xeTable)
-    }
+    // const virtualXOpts = $xeTable.computeVirtualXOpts
+    // if (virtualXOpts.immediate) {
+    loadScrollXData($xeTable)
+    // } else {
+    //   lazyScrollXData($xeTable)
+    // }
   },
   /**
    * 纵向 Y 可视渲染事件处理
@@ -9315,12 +9316,12 @@ const Methods = {
   triggerScrollYEvent () {
     const $xeTable = this
 
-    const virtualYOpts = $xeTable.computeVirtualYOpts
-    if (virtualYOpts.immediate) {
-      loadScrollYData($xeTable)
-    } else {
-      lazyScrollYData($xeTable)
-    }
+    // const virtualYOpts = $xeTable.computeVirtualYOpts
+    // if (virtualYOpts.immediate) {
+    loadScrollYData($xeTable)
+    // } else {
+    //   lazyScrollYData($xeTable)
+    // }
   },
   triggerBodyScrollEvent (evnt: Event, fixedType: '' | 'left' | 'right') {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
@@ -9883,47 +9884,45 @@ const Methods = {
    */
   scrollTo (scrollLeft: number | null, scrollTop?: number | null) {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const reactData = $xeTable as unknown as TableReactData
     const internalData = $xeTable as unknown as TableInternalData
 
-    const { $refs } = this
-    const { refTableBody, refTableHeader, leftBody, rightBody, refTableFooter } = $refs
-    const tableBodyElem = refTableBody ? refTableBody.$el : null
-    const leftBodyElem = leftBody ? leftBody.$el : null
-    const rightBodyElem = rightBody ? rightBody.$el : null
-    const tableHeaderElem = refTableHeader ? refTableHeader.$el : null
-    const tableFooterElem = refTableFooter ? refTableFooter.$el : null
+    const { elemStore } = internalData
+    const headerScrollElem = getRefElem(elemStore['main-header-scroll'])
+    const bodyScrollElem = getRefElem(elemStore['main-body-scroll'])
+    const footerScrollElem = getRefElem(elemStore['main-footer-scroll'])
+    const leftScrollElem = getRefElem(elemStore['left-body-scroll'])
+    const rightScrollElem = getRefElem(elemStore['right-body-scroll'])
+    const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
+    const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
+
     internalData.intoRunScroll = true
+
     if (XEUtils.isNumber(scrollLeft)) {
-      const xHandleEl = $xeTable.$refs.refScrollXHandleElem as HTMLDivElement
-      if (xHandleEl) {
-        setScrollLeft(xHandleEl, scrollLeft)
-      } else {
-        setScrollLeft(tableBodyElem, scrollLeft)
-        setScrollLeft(tableHeaderElem, scrollLeft)
-        setScrollLeft(tableFooterElem, scrollLeft)
-      }
+      setScrollLeft(xHandleEl, scrollLeft)
+      setScrollLeft(bodyScrollElem, scrollLeft)
+      setScrollLeft(headerScrollElem, scrollLeft)
+      setScrollLeft(footerScrollElem, scrollLeft)
+      loadScrollXData($xeTable)
     }
     if (XEUtils.isNumber(scrollTop)) {
-      const yHandleEl = $xeTable.$refs.refScrollYHandleElem as HTMLDivElement
-      if (yHandleEl) {
-        setScrollTop(yHandleEl, scrollTop)
-      } else {
-        setScrollTop(tableBodyElem, scrollTop)
-        setScrollTop(leftBodyElem, scrollTop)
-        setScrollTop(rightBodyElem, scrollTop)
-      }
+      setScrollTop(yHandleEl, scrollTop)
+      setScrollTop(bodyScrollElem, scrollTop)
+      setScrollTop(leftScrollElem, scrollTop)
+      setScrollTop(rightScrollElem, scrollTop)
+      loadScrollYData($xeTable)
     }
-    if (this.scrollXLoad || this.scrollYLoad) {
+    if (reactData.scrollXLoad || reactData.scrollYLoad) {
       return new Promise<void>(resolve => {
         setTimeout(() => {
           $xeTable.$nextTick(() => {
             internalData.intoRunScroll = false
             resolve()
           })
-        })
+        }, 30)
       })
     }
-    return this.$nextTick()
+    return $xeTable.$nextTick()
   },
   /**
    * 如果有滚动条，则滚动到对应的行
@@ -9932,15 +9931,16 @@ const Methods = {
    */
   scrollToRow (row: any, fieldOrColumn?: VxeColumnPropTypes.Field | VxeTableDefines.ColumnInfo) {
     const $xeTable = this as VxeTableConstructor & VxeTablePrivateMethods
+    const props = $xeTable
     const reactData = $xeTable as unknown as TableReactData
 
     const { isAllOverflow, scrollYLoad, scrollXLoad } = reactData
     const rest = []
     if (row) {
-      if (this.treeConfig) {
-        rest.push(this.scrollToTreeRow(row))
+      if (props.treeConfig) {
+        rest.push($xeTable.scrollToTreeRow(row))
       } else {
-        rest.push(rowToVisible(this, row))
+        rest.push(rowToVisible($xeTable, row))
       }
     }
     if (fieldOrColumn) {

package/packages/table/src/table.ts

@@ -1509,6 +1509,8 @@ export default {
       // 已删除行
       removeRowMaps: {},
 
+      cvCacheMaps: {},
+
       swYSize: 0,
       swYInterval: 0,
       swYTotal: 0
@@ -1821,11 +1823,15 @@ export default {
   },
   beforeDestroy () {
     const $xeTable = this
+    const internalData = $xeTable as unknown as TableInternalData
 
     const tableViewportEl = $xeTable.$refs.refTableViewportElem as HTMLDivElement
     if (tableViewportEl) {
       tableViewportEl.removeEventListener('wheel', $xeTable.triggerBodyWheelEvent)
     }
+    internalData.cvCacheMaps = {}
+    internalData.prevDragRow = null
+    internalData.prevDragCol = null
     if (this.$resize) {
       this.$resize.disconnect()
     }

package/packages/table/src/util.ts

@@ -72,23 +72,18 @@ export const convertHeaderColumnToRows = (originColumns: any) => {
 export function restoreScrollLocation ($xeTable: VxeTableConstructor, scrollLeft: number, scrollTop: number) {
   const internalData = $xeTable as unknown as TableInternalData
 
-  return $xeTable.clearScroll().then(() => {
-    if (scrollLeft || scrollTop) {
-      // 重置最后滚动状态
-      internalData.lastScrollLeft = 0
-      internalData.lastScrollTop = 0
-
-      internalData.intoRunScroll = false
-      internalData.inVirtualScroll = false
-      internalData.inWheelScroll = false
-      internalData.inHeaderScroll = false
-      internalData.inBodyScroll = false
-      internalData.inFooterScroll = false
-      internalData.scrollRenderType = ''
-      // 还原滚动状态
-      return $xeTable.scrollTo(scrollLeft, scrollTop)
-    }
-  })
+  if (scrollLeft || scrollTop) {
+    internalData.intoRunScroll = false
+    internalData.inVirtualScroll = false
+    internalData.inWheelScroll = false
+    internalData.inHeaderScroll = false
+    internalData.inBodyScroll = false
+    internalData.inFooterScroll = false
+    internalData.scrollRenderType = ''
+    // 还原滚动状态
+    return $xeTable.scrollTo(scrollLeft, scrollTop)
+  }
+  return $xeTable.$nextTick()
 }
 
 export function toTreePathSeq (path: any) {

package/packages/ui/index.ts

@@ -209,7 +209,7 @@ VxeUI.setConfig({
     },
     virtualXConfig: {
       enabled: true,
-      gt: 28,
+      gt: 24,
       preSize: 0,
       oSize: 1
     },
@@ -220,8 +220,8 @@ VxeUI.setConfig({
       oSize: 2
     },
     scrollbarConfig: {
-      width: 14,
-      height: 14
+      // width: 14,
+      // height: 14
     }
   },
   // export: {

package/styles/components/table.scss

@@ -1,7 +1,36 @@
+@use "sass:map";
+@use "sass:list";
 @use '../helpers/baseMixin.scss';
 @use './icon.scss';
 @use './table-module/all.scss';
 
+$btnThemeList: (
+  (
+    name: "primary",
+    textColor: var(--vxe-ui-font-primary-color),
+  ),
+  (
+    name: "success",
+    textColor: var(--vxe-ui-status-success-color),
+  ),
+  (
+    name: "info",
+    textColor: var(--vxe-ui-status-info-color),
+  ),
+  (
+    name: "warning",
+    textColor: var(--vxe-ui-status-warning-color),
+  ),
+  (
+    name: "danger",
+    textColor: var(--vxe-ui-status-danger-color),
+  ),
+  (
+    name: "error",
+    textColor: var(--vxe-ui-status-error-color),
+  )
+);
+
 .vxe-table-slots,
 .vxe-table--file-form {
   display: none;
@@ -792,6 +821,12 @@
   .vxe-cell-title-prefix-icon,
   .vxe-cell-title-suffix-icon {
     cursor: help;
+    @for $index from 0 to list.length($btnThemeList) {
+      $item: list.nth($btnThemeList, $index + 1);
+      &.theme--#{map.get($item, name)} {
+        color: map.get($item, textColor);
+      }
+    }
   }
 }