feat(table): 多级表头下,动态列配置支持指定父级列以展示其下的所有子列 (#3539)

Tencent · Oct 31, 2023 · 03c6366 · 03c6366
1 parent bb72f88
commit 03c6366
Showing 1 changed file with 7 additions and 3 deletions.
diff --git a/src/table/primary-table.tsx b/src/table/primary-table.tsx
@@ -215,13 +215,17 @@ export default defineComponent({
     };
 
     // 1. 影响列数量的因素有：自定义列配置、展开/收起行、多级表头；2. 影响表头内容的因素有：排序图标、筛选图标
-    const getColumns = (columns: PrimaryTableCol<TableRowData>[]) => {
+    const getColumns = (columns: PrimaryTableCol<TableRowData>[], parentDisplay = false) => {
       const arr: PrimaryTableCol<TableRowData>[] = [];
       for (let i = 0, len = columns.length; i < len; i++) {
         let item = { ...columns[i] };
         // 自定义列显示控制
         const isDisplayColumn = item.children?.length || tDisplayColumns.value?.includes(item.colKey);
-        if (!isDisplayColumn && (props.columnController || props.displayColumns || props.defaultDisplayColumns))
+        if (
+          !isDisplayColumn &&
+          (props.columnController || props.displayColumns || props.defaultDisplayColumns) &&
+          !parentDisplay
+        )
           continue;
         item = formatToRowSelectColumn(item);
         const { sort } = props;
@@ -290,7 +294,7 @@ export default defineComponent({
           };
         }
         if (item.children?.length) {
-          item.children = getColumns(item.children);
+          item.children = getColumns(item.children, parentDisplay || tDisplayColumns.value?.includes(item.colKey));
         }
         // 多级表头和自定义列配置特殊逻辑：要么子节点不存在，要么子节点长度大于 1，方便做自定义列配置
         if (!item.children || item.children?.length) {