Commit 1dc6faf3e638d1fd61097c5b7df9e2006a60faa2
Committed by
GitHub
1 parent
598ce5a1
feat(table component): add 'expandRows' table action (#1537)
* fix(table component): add 'expandRows' * feat(table component): add 'expandRows' table action
Showing
4 changed files
with
18 additions
and
2 deletions
src/components/Table/src/BasicTable.vue
@@ -199,7 +199,11 @@ | @@ -199,7 +199,11 @@ | ||
199 | 199 | ||
200 | const { getRowClassName } = useTableStyle(getProps, prefixCls); | 200 | const { getRowClassName } = useTableStyle(getProps, prefixCls); |
201 | 201 | ||
202 | - const { getExpandOption, expandAll, collapseAll } = useTableExpand(getProps, tableData, emit); | 202 | + const { getExpandOption, expandAll, expandRows, collapseAll } = useTableExpand( |
203 | + getProps, | ||
204 | + tableData, | ||
205 | + emit, | ||
206 | + ); | ||
203 | 207 | ||
204 | const handlers: InnerHandlers = { | 208 | const handlers: InnerHandlers = { |
205 | onColumnsChange: (data: ColumnChangeParam[]) => { | 209 | onColumnsChange: (data: ColumnChangeParam[]) => { |
@@ -300,6 +304,7 @@ | @@ -300,6 +304,7 @@ | ||
300 | getShowPagination, | 304 | getShowPagination, |
301 | setCacheColumnsByField, | 305 | setCacheColumnsByField, |
302 | expandAll, | 306 | expandAll, |
307 | + expandRows, | ||
303 | collapseAll, | 308 | collapseAll, |
304 | scrollTo, | 309 | scrollTo, |
305 | getSize: () => { | 310 | getSize: () => { |
src/components/Table/src/hooks/useTable.ts
@@ -152,6 +152,9 @@ export function useTable(tableProps?: Props): [ | @@ -152,6 +152,9 @@ export function useTable(tableProps?: Props): [ | ||
152 | expandAll: () => { | 152 | expandAll: () => { |
153 | getTableInstance().expandAll(); | 153 | getTableInstance().expandAll(); |
154 | }, | 154 | }, |
155 | + expandRows: (keys: string[]) => { | ||
156 | + getTableInstance().expandRows(keys); | ||
157 | + }, | ||
155 | collapseAll: () => { | 158 | collapseAll: () => { |
156 | getTableInstance().collapseAll(); | 159 | getTableInstance().collapseAll(); |
157 | }, | 160 | }, |
src/components/Table/src/hooks/useTableExpand.ts
@@ -37,6 +37,13 @@ export function useTableExpand( | @@ -37,6 +37,13 @@ export function useTableExpand( | ||
37 | expandedRowKeys.value = keys; | 37 | expandedRowKeys.value = keys; |
38 | } | 38 | } |
39 | 39 | ||
40 | + function expandRows(keys: string[]) { | ||
41 | + // use row ID expands the specified table row | ||
42 | + const { isTreeTable } = unref(propsRef); | ||
43 | + if (!isTreeTable) return; | ||
44 | + expandedRowKeys.value = [...expandedRowKeys.value, ...keys]; | ||
45 | + } | ||
46 | + | ||
40 | function getAllKeys(data?: Recordable[]) { | 47 | function getAllKeys(data?: Recordable[]) { |
41 | const keys: string[] = []; | 48 | const keys: string[] = []; |
42 | const { childrenColumnName } = unref(propsRef); | 49 | const { childrenColumnName } = unref(propsRef); |
@@ -54,5 +61,5 @@ export function useTableExpand( | @@ -54,5 +61,5 @@ export function useTableExpand( | ||
54 | expandedRowKeys.value = []; | 61 | expandedRowKeys.value = []; |
55 | } | 62 | } |
56 | 63 | ||
57 | - return { getExpandOption, expandAll, collapseAll }; | 64 | + return { getExpandOption, expandAll, expandRows, collapseAll }; |
58 | } | 65 | } |
src/components/Table/src/types/table.ts
@@ -87,6 +87,7 @@ export interface TableActionType { | @@ -87,6 +87,7 @@ export interface TableActionType { | ||
87 | getSelectRows: <T = Recordable>() => T[]; | 87 | getSelectRows: <T = Recordable>() => T[]; |
88 | clearSelectedRowKeys: () => void; | 88 | clearSelectedRowKeys: () => void; |
89 | expandAll: () => void; | 89 | expandAll: () => void; |
90 | + expandRows: (keys: string[]) => void; | ||
90 | collapseAll: () => void; | 91 | collapseAll: () => void; |
91 | scrollTo: (pos: string) => void; // pos: id | "top" | "bottom" | 92 | scrollTo: (pos: string) => void; // pos: id | "top" | "bottom" |
92 | getSelectRowKeys: () => string[]; | 93 | getSelectRowKeys: () => string[]; |