vxe-pc-ui 3.8.0 → 3.8.2

package/packages/tree/src/tree.ts

@@ -8,7 +8,7 @@ import { getSlotVNs } from '../../ui/src/vn'
 import { toCssUnit, isScale, getPaddingTopBottomSize } from '../../ui/src/dom'
 import VxeLoadingComponent from '../../loading/src/loading'
 
-import type { TreeReactData, VxeTreeEmits, VxeTreePropTypes, TreeInternalData, VxeTreeDefines, VxeComponentSizeType, ValueOf } from '../../../types'
+import type { TreeReactData, VxeTreeEmits, VxeTreeConstructor, VxeTreePropTypes, TreeInternalData, VxeTreeDefines, VxeComponentSizeType, ValueOf } from '../../../types'
 
 /**
  * 生成节点的唯一主键
@@ -29,6 +29,36 @@ function handleSetExpand (nodeid: string, expanded: boolean, expandedMaps: Recor
   }
 }
 
+function handleScrollTo ($xeTree: VxeTreeConstructor, scrollLeft: { top?: number | null; left?: number | null; } | number | null | undefined, scrollTop?: number | null) {
+  const reactData = $xeTree.reactData
+
+  const scrollBodyElem = $xeTree.$refs.refVirtualWrapper as HTMLDivElement
+  if (scrollLeft) {
+    if (!XEUtils.isNumber(scrollLeft)) {
+      scrollTop = scrollLeft.top
+      scrollLeft = scrollLeft.left
+    }
+  }
+  if (scrollBodyElem) {
+    if (XEUtils.isNumber(scrollLeft)) {
+      scrollBodyElem.scrollLeft = scrollLeft
+    }
+    if (XEUtils.isNumber(scrollTop)) {
+      scrollBodyElem.scrollTop = scrollTop
+    }
+  }
+  if (reactData.scrollYLoad) {
+    return new Promise<void>(resolve => {
+      setTimeout(() => {
+        $xeTree.$nextTick(() => {
+          resolve()
+        })
+      }, 50)
+    })
+  }
+  return $xeTree.$nextTick()
+}
+
 export default /* define-vxe-component start */ defineVxeComponent({
   name: 'VxeTree',
   mixins: [
@@ -852,33 +882,44 @@ export default /* define-vxe-component start */ defineVxeComponent({
      */
     scrollTo (scrollLeft: { top?: number | null; left?: number | null; } | number | null | undefined, scrollTop?: number | null) {
       const $xeTree = this
-      const reactData = $xeTree.reactData
 
+      return handleScrollTo($xeTree, scrollLeft, scrollTop)
+    },
+    scrollToNode (node: any) {
+      const $xeTree = this
+
+      return $xeTree.scrollToNodeId($xeTree.getNodeId(node))
+    },
+    scrollToNodeId (nodeid: string | number | null) {
+      const $xeTree = this
+      const props = $xeTree
+      const internalData = $xeTree.internalData
+
+      const { transform } = props
+      const { scrollYStore, afterTreeList } = internalData
+      const childrenField = $xeTree.computeChildrenField
+      const mapChildrenField = $xeTree.computeMapChildrenField
       const scrollBodyElem = $xeTree.$refs.refVirtualWrapper as HTMLDivElement
-      if (scrollLeft) {
-        if (!XEUtils.isNumber(scrollLeft)) {
-          scrollTop = scrollLeft.top
-          scrollLeft = scrollLeft.left
-        }
-      }
-      if (scrollBodyElem) {
-        if (XEUtils.isNumber(scrollLeft)) {
-          scrollBodyElem.scrollLeft = scrollLeft
-        }
-        if (XEUtils.isNumber(scrollTop)) {
-          scrollBodyElem.scrollTop = scrollTop
-        }
-      }
-      if (reactData.scrollYLoad) {
-        return new Promise<void>(resolve => {
-          setTimeout(() => {
-            $xeTree.$nextTick(() => {
-              resolve()
+      if (nodeid && scrollBodyElem) {
+        if (transform) {
+          const matchObj = XEUtils.findTree(afterTreeList, item => $xeTree.getNodeId(item) === nodeid, { children: transform ? mapChildrenField : childrenField })
+          if (matchObj) {
+            return $xeTree.setExpandNode(matchObj.nodes, true).then(() => {
+              const itemIndex = XEUtils.findIndexOf(internalData.afterVisibleList, item => $xeTree.getNodeId(item) === nodeid)
+              if (itemIndex > -1) {
+                const targetTop = Math.max(0, (itemIndex - 1) * scrollYStore.rowHeight)
+                return handleScrollTo($xeTree, scrollBodyElem.scrollLeft, targetTop)
+              }
             })
-          }, 50)
-        })
+          }
+        } else {
+          const itemEl = scrollBodyElem.querySelector<HTMLDivElement>(`.vxe-tree--node-wrapper[nodeid="${nodeid}"]`)
+          if (itemEl) {
+            return handleScrollTo($xeTree, scrollBodyElem.scrollLeft, itemEl.offsetTop)
+          }
+        }
       }
-      return $xeTree.$nextTick()
+      return $xeTree.recalculate()
     },
     /**
      * 刷新滚动条
@@ -1403,13 +1444,13 @@ export default /* define-vxe-component start */ defineVxeComponent({
       }
       return null
     },
-    setCurrentNodeId (nodeKey: any) {
+    setCurrentNodeId (nodeKey: string | number | null) {
       const $xeTree = this
       const reactData = $xeTree.reactData
       const internalData = $xeTree.internalData
 
       const { nodeMaps } = internalData
-      const nodeItem = nodeMaps[nodeKey]
+      const nodeItem = nodeMaps[`${nodeKey}`]
       reactData.currentNode = nodeItem ? nodeItem.item : null
       return $xeTree.$nextTick()
     },
@@ -1448,7 +1489,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       }
       return null
     },
-    setRadioNodeId (nodeKey: any) {
+    setRadioNodeId (nodeKey: string | number | null) {
       const $xeTree = this
       const reactData = $xeTree.reactData
 
@@ -1534,7 +1575,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       $xeTree.handleData()
       return $xeTree.recalculate()
     },
-    setExpandByNodeId (nodeids: any, expanded: boolean) {
+    setExpandByNodeId (nodeids: string | number | (string | number | null)[] | null, expanded: boolean) {
       const $xeTree = this
       const reactData = $xeTree.reactData
       const internalData = $xeTree.internalData
@@ -1544,8 +1585,8 @@ export default /* define-vxe-component start */ defineVxeComponent({
         if (!XEUtils.isArray(nodeids)) {
           nodeids = [nodeids]
         }
-        nodeids.forEach((nodeid: string) => {
-          handleSetExpand(nodeid, expanded, treeExpandedMaps)
+        nodeids.forEach((nodeid) => {
+          handleSetExpand(`${nodeid}`, expanded, treeExpandedMaps)
         })
         reactData.updateExpandedFlag++
       }
@@ -1594,7 +1635,7 @@ export default /* define-vxe-component start */ defineVxeComponent({
       $xeTree.handleData()
       return $xeTree.recalculate()
     },
-    toggleExpandByNodeId (nodeids: any) {
+    toggleExpandByNodeId (nodeids: string | number | null | (string | number | null)[]) {
       const $xeTree = this
       const reactData = $xeTree.reactData
       const internalData = $xeTree.internalData
@@ -1604,8 +1645,8 @@ export default /* define-vxe-component start */ defineVxeComponent({
         if (!XEUtils.isArray(nodeids)) {
           nodeids = [nodeids]
         }
-        nodeids.forEach((nodeid: string) => {
-          handleSetExpand(nodeid, !treeExpandedMaps[nodeid], treeExpandedMaps)
+        nodeids.forEach((nodeid) => {
+          handleSetExpand(`${nodeid}`, !treeExpandedMaps[`${nodeid}`], treeExpandedMaps)
         })
         reactData.updateExpandedFlag++
       }

package/types/components/column.d.ts

@@ -35,9 +35,9 @@ export namespace VxeColumnPropTypes {
   export type ShowOverflow = VxeTablePropTypes.ShowOverflow
   export type ShowHeaderOverflow = ShowOverflow
   export type ShowFooterOverflow = ShowOverflow
-  export type ClassName<D = any> = string | ((params: VxeGlobalRendererHandles.RenderCellParams<D>) => string | any[] | { [key: string]: boolean })
-  export type HeaderClassName<D = any> = string | ((params: VxeGlobalRendererHandles.RenderHeaderParams<D>) => string | any[] | { [key: string]: boolean })
-  export type FooterClassName<D = any> = string | ((params: VxeGlobalRendererHandles.RenderFooterParams<D>) => string | any[] | { [key: string]: boolean })
+  export type ClassName<D = any> = string | ((params: VxeGlobalRendererHandles.RenderTableCellParams<D>) => string | any[] | { [key: string]: boolean })
+  export type HeaderClassName<D = any> = string | ((params: VxeGlobalRendererHandles.RenderTableHeaderParams<D>) => string | any[] | { [key: string]: boolean })
+  export type FooterClassName<D = any> = string | ((params: VxeGlobalRendererHandles.RenderTableFooterParams<D>) => string | any[] | { [key: string]: boolean })
   export type Padding = boolean
   export type VerticalAlign = '' | 'top' | 'center' | null
 
@@ -144,7 +144,7 @@ export namespace VxeColumnPropTypes {
    */
   export type RowGroupNode = boolean
   /**
-   * 设置为拖拽排序
+   * 设置为树节点
    */
   export type TreeNode = boolean
   /**
@@ -507,14 +507,6 @@ export interface VxeColumnProps<D = any> {
    * 自定义筛选方法
    */
   filterMethod?: VxeColumnPropTypes.FilterMethod<D>
-  /**
-   * 筛选重置方法
-   */
-  filterResetMethod?: VxeColumnPropTypes.FilterResetMethod<D>
-  /**
-   * 筛选复原方法
-   */
-  filterRecoverMethod?: VxeColumnPropTypes.FilterRecoverMethod<D>
   /**
    * 筛选模板配置项
    */

package/types/components/table.d.ts

@@ -882,7 +882,7 @@ export namespace VxeTablePropTypes {
     updateStore?(params: {
       $table: VxeTableConstructor<D>
       id: string
-      type: 'reset' | 'confirm' | 'update:width' | 'update:fixed' | 'update:sort' | 'update:visible' | 'update:rowGroup' | 'update:aggFunc'
+      type: 'reset' | 'confirm' | 'update:width' | 'update:fixed' | 'update:sort' | 'update:visible' | 'update:aggGroup' | 'update:aggFunc'
       storeData: VxeTableDefines.CustomStoreData
     }): Promise<any>
     mode?: 'default' | 'modal' | 'drawer' | 'simple' | 'popup' | '' | null
@@ -5333,7 +5333,7 @@ export namespace VxeTableDefines {
     /**
      * @private
      */
-    parentId: string
+    parentId: string | null
     /**
      * @private
      */
@@ -5346,6 +5346,10 @@ export namespace VxeTableDefines {
      * @private
      */
     colSpan: number
+    /**
+     * @private
+     */
+    defaultParentId: string | null
     /**
      * @private
      */
@@ -5358,6 +5362,10 @@ export namespace VxeTableDefines {
      * @private
      */
     defaultFixed: VxeColumnPropTypes.Fixed | undefined
+    /**
+     * @private
+     */
+    defaultAggGroup: boolean
     /**
      * @private
      */
@@ -5908,37 +5916,43 @@ export namespace VxeTableDefines {
     oldVisibleMaps: Record<string, boolean>
   }
 
+  export type CustomSortStoreObj = {
+    k: string
+    c?: CustomSortStoreObj[]
+  }
+
   export interface CustomStoreData {
     resizableData?: Record<string, number>
-    sortData?: Record<string, number>
+    sortData?: CustomSortStoreObj[]
     visibleData?: Record<string, boolean>
     fixedData?: Record<string, VxeColumnPropTypes.Fixed>
+    aggGroupData?: Record<string, boolean>
     aggFuncData?: Record<string, VxeColumnPropTypes.AggFunc>
   }
 
   export interface VxeTableCustomStorageObj {
     /**
-     * 显示/隐藏列状态
+     * 保存列可视状态
      */
     visible?: boolean
     /**
-     * 列拖拽调整顺序
+     * 保存列宽调整状态
      */
     resizable?: boolean
     /**
-     * 冻结列状态
+     * 保存列冻结状态
      */
     fixed?: boolean
     /**
-     * 列顺序
+     * 保存列顺序状态
      */
     sort?: boolean
     /**
-     * 聚合分组字段
+     * 保存列的聚合分组状态
      */
-    // rowGroup?: boolean
+    aggGroup?: boolean
     /**
-     * 聚合函数
+     * 保存列聚合函数状态
      */
     aggFunc?: boolean
   }

package/types/components/tree.d.ts

@@ -298,7 +298,7 @@ export interface TreeMethods<D = any> {
   /**
    * 根据主键设置当前节点是否被选中
    */
-  setCurrentNodeId(nodeKey: string | number): Promise<any>
+  setCurrentNodeId(nodeKey: string | number | null): Promise<any>
   /**
    * 根据节点设置当前节点是否被选中
    */
@@ -318,7 +318,7 @@ export interface TreeMethods<D = any> {
   /**
    * 只对 show-radio 有效，通过键值设置节点是否被选中
    */
-  setRadioNodeId(nodeKey: string | number): Promise<any>
+  setRadioNodeId(nodeKey: string | number | null): Promise<any>
   /**
    * 用于 showRadio 单选框，设置指定节点为选中状态
    */
@@ -350,7 +350,7 @@ export interface TreeMethods<D = any> {
   /**
    * 用于 showCheckbox 复选框，设置指定节点 key 为选中状态，第二个参数为选中与否
    */
-  setCheckboxByNodeId(nodeKeys: any | any[], checked: boolean): Promise<any>
+  setCheckboxByNodeId(nodeKeys: string | number | null | (string | number | null)[], checked: boolean): Promise<any>
   /**
    * 已废弃，请使用 clearAllExpandNode
    * @deprecated
@@ -363,7 +363,7 @@ export interface TreeMethods<D = any> {
   /**
    * 设置指定节点 key 为展开状态，第二个参数为选中与否
    */
-  setExpandByNodeId(nodeKeys: any | any[], expanded: boolean): Promise<any>
+  setExpandByNodeId(nodeKeys: string | number | null | (string | number | null)[], expanded: boolean): Promise<any>
   /**
    * 设置指定节点为展开状态
    */
@@ -371,7 +371,7 @@ export interface TreeMethods<D = any> {
   /**
    * 根据节点主键切换指定节点为展开状态
    */
-  toggleExpandByNodeId(nodeKeys: any | any[]): Promise<any>
+  toggleExpandByNodeId(nodeKeys: string | number | null | (string | number | null)[]): Promise<any>
   /**
    * 切换指定节点为展开状态
    */
@@ -404,7 +404,7 @@ export interface TreeMethods<D = any> {
   /**
    * 用于 show-radio，根据节点主键判断指定节点是否为选中状态
    */
-  isCheckedByRadioNodeId(nodeKey: any): boolean
+  isCheckedByRadioNodeId(nodeKey: string | number | null): boolean
   /**
    * 用于 show-radio，判断指定节点是否为选中状态
    */
@@ -412,7 +412,7 @@ export interface TreeMethods<D = any> {
   /**
    * 用于 show-checkbox，根据节点主键判断指定节点是否为选中状态
    */
-  isCheckedByCheckboxNodeId(nodeKey: any): boolean
+  isCheckedByCheckboxNodeId(nodeKey: string | number | null): boolean
   /**
    * 用于 show-checkbox，判断指定节点是否为半选状态
    */
@@ -437,6 +437,14 @@ export interface TreeMethods<D = any> {
     top?: number | null
     left?: number | null
   } | number | null | undefined, y?: number | null): Promise<void>
+  /**
+   * 如果有滚动条，则滚动到指定的节点位置
+   */
+  scrollToNode(node: any): Promise<void>
+  /**
+   * 如果有滚动条，则根据节点主键滚动到对应的节点位置
+   */
+  scrollToNodeId(nodeKey: string | number | null): Promise<void>
 
   /**
    * 手动清除滚动相关信息，还原到初始状态