feat: add batch expand/collapse all tree nodes #4033

PoorShawn · 2025-06-12T15:14:05Z

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

实现方案：

增强底层数据层：在 DataSource 中增加了 expandAllNodes() 和 collapseAllNodes() 方法，通过递归遍历数据源，统一设置所有节点的 hierarchyState 属性，并重建表格的层级状态。

基于数据层增加 API ：在 ListTable 中新增了两个公共 API：expandAllTreeNode() 和 collapseAllTreeNode()。这两个方法会同步更新表头和数据行的节点状态，然后刷新整个表格视图，并触发相应的 TREE_HIERARCHY_STATE_CHANGE 事件。

功能演示：

新增 API 及使用示例：

// 展开所有树形节点（包括表头和数据行）
tableInstance.expandAllTreeNode(): void;

// 折叠所有树形节点（包括表头和数据行）
tableInstance.collapseAllTreeNode(): void;

📝 Changelog

Language	Changelog
🇺🇸 English	Added expandAllTreeNode() and collapseAllTreeNode() methods to support batch expanding and collapsing of all tree nodes for ListTable.
🇨🇳 Chinese	针对 ListTable，新增 expandAllTreeNode() 和 collapseAllTreeNode()方法，支持批� 8000 ��展开和折叠所有树形节点。

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

Doc is updated/provided or not needed
Demo is updated/provided or not needed
TypeScript definition is updated/provided or not needed
Changelog is provided or not needed

🚀 Summary

copilot:summary

🔍 Walkthrough

copilot:walkthrough

fangsmile · 2025-06-13T09:05:11Z

packages/vtable/src/ListTable.ts

+
+    // 刷新视图
+    if (stateChanged) {
+      this.updateColumns(this.internalProps.columns); // 应用表头变化并重新评估列


这里的逻辑有点奇怪可以看看有没有其他更好的逻辑

是的，感谢指出！updateColumns 应该是一个开销比较大的操作，这里会造成性能的浪费，是一个可以优化的点

PoorShawn · 2025-06-15T08:42:12Z

@fangsmile 我增加和使用了 _recreateSceneForStateChange，作为 updateColumns 的轻量级替代方案，避免了 updateColumns 中开销较大的 cloneDeepSpec 深拷贝操作

Rui-Sun · 2025-06-16T11:17:53Z

看起来还是有问题，可以试一下这个示例

const option = {
    rows: ['province', 'city'],
    columns: ['category', 'sub_category'],
    indicators: ['sales', 'number'],
    enableDataAnalysis: true,
    indicatorTitle: '指标名称',
    indicatorsAsCol: false,
    corner: { titleOnDimension: 'row' },
    records: [
      {
        sales: 891,
        number: 7789,
        province: '浙江省',
        city: '杭州市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 792,
        number: 2367,
        province: '浙江省',
        city: '绍兴市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 893,
        number: 3877,
        province: '浙江省',
        city: '宁波市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 1094,
        number: 4342,
        province: '浙江省',
        city: '舟山市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 1295,
        number: 5343,
        province: '浙江省',
        city: '杭州市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 496,
        number: 632,
        province: '浙江省',
        city: '绍兴市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 1097,
        number: 7234,
        province: '浙江省',
        city: '宁波市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 998,
        number: 834,
        province: '浙江省',
        city: '舟山市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 766,
        number: 945,
        province: '浙江省',
        city: '杭州市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 990,
        number: 1304,
        province: '浙江省',
        city: '绍兴市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 891,
        number: 1145,
        province: '浙江省',
        city: '宁波市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 792,
        number: 1432,
        province: '浙江省',
        city: '舟山市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 745,
        number: 1343,
        province: '浙江省',
        city: '杭州市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 843,
        number: 1354,
        province: '浙江省',
        city: '绍兴市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 895,
        number: 1523,
        province: '浙江省',
        city: '宁波市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 965,
        number: 1634,
        province: '浙江省',
        city: '舟山市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 776,
        number: 1723,
        province: '四川省',
        city: '成都市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 634,
        number: 1822,
        province: '四川省',
        city: '绵阳市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 909,
        number: 1943,
        province: '四川省',
        city: '南充市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 399,
        number: 2330,
        province: '四川省',
        city: '乐山市',
        category: '家具',
        sub_category: '桌子'
      },
      {
        sales: 700,
        number: 2451,
        province: '四川省',
        city: '成都市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 689,
        number: 2244,
        province: '四川省',
        city: '绵阳市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 500,
        number: 2333,
        province: '四川省',
        city: '南充市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 800,
        number: 2445,
        province: '四川省',
        city: '乐山市',
        category: '家具',
        sub_category: '沙发'
      },
      {
        sales: 1044,
        number: 2335,
        province: '四川省',
        city: '成都市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 689,
        number: 245,
        province: '四川省',
        city: '绵阳市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 794,
        number: 2457,
        province: '四川省',
        city: '南充市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 566,
        number: 2458,
        province: '四川省',
        city: '乐山市',
        category: '办公用品',
        sub_category: '笔'
      },
      {
        sales: 865,
        number: 4004,
        province: '四川省',
        city: '成都市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 999,
        number: 3077,
        province: '四川省',
        city: '绵阳市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 999,
        number: 3551,
        province: '四川省',
        city: '南充市',
        category: '办公用品',
        sub_category: '纸张'
      },
      {
        sales: 999,
        number: 352,
        province: '四川省',
        city: '乐山市',
        category: '办公用品',
        sub_category: '纸张'
      }
    ],
rowSeriesNumber: {
      enable: true,
      title: '',
      field: 'name',
      dragOrder: true,
      // headerIcon: 'book',
      width: 'auto',
      // format: (args: any) => {
      //   return '';
      // },
      headerStyle: {
        color: 'black',
        bgColor: 'pink'
      },
      style: {
        color: 'red'
      }
    },
dragHeaderMode:'all',
    widthMode: 'autoWidth' // 宽度模式：standard 标准模式； adaptive 自动填满容器
  };

PoorShawn · 2025-06-16T16:53:40Z

感谢耐心的测试！我注意到这是一段 PivotTable 透视表的配置。关于节点一次性展开/折叠全部节点的能力，目前只针对 ListTable 进行了处理。关于 PivotTable 透视表的处理，我还在进行相应的修改

PoorShawn · 2025-07-01T05:33:04Z

@Rui-Sun 关于透视表节点的一键展开/折叠，也进行了相应的支持，请求再次审核

fangsmile · 2025-07-01T06:29:51Z

packages/vtable/src/PivotTable.ts

+        col: -1,
+        row: -1,
+        hierarchyState: HierarchyState.collapse,
+        originData: this.internalProps.layoutMap.columnDimensionTree.tree


触发事件的这个originData可以去掉。事件定义中加个明确的参数changeAll:boolean

fangsmile · 2025-07-01T06:56:56Z

packages/vtable/src/ListTable.ts

+  expandAllTreeNode(): void {
+    let stateChanged = false;
+
+    // 展开所有表头节点


把这块逻辑先去掉吧后续有需求可以单独开个header的接口

fangsmile · 2025-07-01T06:59:54Z

packages/vtable/src/ListTable.ts

+  /**
+   * 展开所有树形节点
+   */
+  expandAllTreeNode(): void {


执行逻辑前最好有个判断，可以调用这个看用户是否是tree模式下

fangsmile · 2025-07-01T07:01:42Z

packages/vtable/src/PivotTable.ts

+  /**
+   * 展开行表头树的所有节点
+   */
+  expandAllForRowTree() {


这个也一样先判断是否是tree模式 columnHierarchyType rowHierarchyType

/**层级维度结构显示形式 */ rowHierarchyType?: 'grid' | 'tree' | 'grid-tree'; columnHierarchyType?: 'grid' | 'grid-tree';

记得测试下 'tree' | 'grid-tree'

PoorShawn · 2025-07-01T08:56:38Z

嗯嗯好的，已经完成了相应的修改，'tree' | 'grid-tree' 在 demo 上的测试也是 ok 的

8000

…e update

…TreeNode

github-actions bot added docs vtable labels Jun 12, 2025

fangsmile reviewed Jun 13, 2025

View reviewed changes

Rui-Sun mentioned this pull request Jun 20, 2025

fix: resolve mismatch between drag indices and update checkbox logic for groups issue 3975 #4008

Open

21 tasks

PoorShawn force-pushed the feat/3078 branch from 79ae108 to 3565d68 Compare June 30, 2025 15:37

fangsmile reviewed Jul 1, 2025

View reviewed changes

PoorShawn force-pushed the feat/3078 branch from 3565d68 to 29210ad Compare July 1, 2025 08:53

PoorShawn added 10 commits July 1, 2025 18:50

feat: add batch expand/collapse all tree nodes

400bee2

fix: preserve sort state after batch expand/collapse of tree nodes

7341672

perf: optimize all tree node expansion/collapse with lightweight scen…

f59fc55

…e update

feat: add batch expand all of column header tree

2c0954d

feat: add batch collapse all of column header tree

032e1e6

feat: add batch expand/collapse all of row header tree

d797f83

chore: add docs for batch expand/collapse methods of pivot table

6d4d362

fix: add tree mode check before expanding/collapsing all tree nodes

4b60f93

refactor: remove batch collapse logic for header nodes in collapseAll…

30dc313

…TreeNode

chore: remove useless comments

f5427aa

PoorShawn force-pushed the feat/3078 branch from 7847ae3 to f5427aa Compare July 1, 2025 11:20

fangsmile changed the base branch from develop to feat/add_batch_expand_collapse_api July 7, 2025 06:32

fangsmile merged commit 8aa0002 into VisActor:feat/add_batch_expand_collapse_api Jul 7, 2025
3 of 4 checks passed

fangsmile mentioned this pull request Jul 7, 2025

Feat/add batch expand collapse api #4167

Merged

21 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: add batch expand/collapse all tree nodes #4033

feat: add batch expand/collapse all tree nodes #4033

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

feat: add batch expand/collapse all tree nodes #4033

feat: add batch expand/collapse all tree nodes #4033

Uh oh!

Conversation

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

实现方案：

功能演示：

新增 API 及使用示例：

📝 Changelog

☑️ Self-Check before Merge

🚀 Summary

🔍 Walkthrough

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!