feat(module: table): add ExpandAll and CollapseAll methods. (#3491)

* feat(module: table): add ExpandAll and CollapseAll methods.

* update the demo
This commit is contained in:
James Yeung 2023-12-08 08:41:56 +08:00 committed by GitHub
parent 6a0bb0b26b
commit 2df1693414
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 61 additions and 1 deletions

View File

@ -22,6 +22,10 @@ namespace AntDesign
void UnselectAll();
void ExpandAll();
void CollapseAll();
internal TableLocale Locale { get; }
internal ISelectionColumn Selection { get; set; }

View File

@ -24,6 +24,22 @@ namespace AntDesign
_selection?.StateHasChanged();
}
public void ExpandAll()
{
foreach (var item in _rootRowDataCache)
{
item.Value.SetExpanded(true);
}
}
public void CollapseAll()
{
foreach (var item in _rootRowDataCache)
{
item.Value.SetExpanded(false);
}
}
private RowData<TItem> GetGroupRowData(IGrouping<object, TItem> grouping, int index, int level, Dictionary<int, RowData<TItem>> rowCache = null)
{
int rowIndex = index + 1;

View File

@ -1,7 +1,7 @@
@using System.ComponentModel
@using TableModels
<Table DataSource="data" RowExpandable="@((record)=>record.Data.Name!="Not Expandable")">
<Table @ref="table" DataSource="data" RowExpandable="@((record)=>record.Data.Name!="Not Expandable")">
<ColumnDefinitions>
<PropertyColumn Property="c=>c.Name" />
<PropertyColumn Property="c=>c.Age" />
@ -30,7 +30,14 @@
</ExpandTemplate>
</Table>
<br />
<Button OnClick="()=> table.ExpandAll()">Expand All</Button>
<Button OnClick="()=> table.CollapseAll()">Collapse All</Button>
@code {
ITable table;
Contact[] data =
{

View File

@ -106,6 +106,23 @@ Inherit from `Column`.
| ---------------- | ---------------- | ---------------------------- | ------ |
| Property | Defines the value to be displayed in this column's cells. | Expression<Func<TItem, TProp>> | - |
### Public methods
The Table can be controlled using the methods provided in the instance of the `@ref` binding `ITable`.
| Methods | Instruction |
| ---------------- | ------------------------------------------- |
| ReloadData | Reloads the data, with three overloads, specifying paging, filtering, and sorting |
| ResetData | Reset table paging, filtering, sorting status |
| GetQueryModel | Gets table state, which can be used for persistence and recovery |
| SetSelection | Set selection column |
| SelectAll | Select all rows |
| UnselectAll | Unselect all rows |
| ExpandAll | Expand all rows |
| CollapseAll | Collapse all rows |
### Responsive
The table supports responsive by default, and when the screen width is less than 960px, the table would switch to small-screen mode.

View File

@ -108,6 +108,22 @@ cover: https://gw.alipayobjects.com/zos/alicdn/f-SbcX2Lx/Table.svg
| Property | 指定要绑定的属性 | Expression<Func<TItem, TProp>> | - |
### 公开方法
可以使用 `@ref` 绑定 `ITable` 的实例中提供的方法操作 Table。
| 方法名 | 说明 |
| ---------------- | ------------------------------------------- |
| ReloadData | 重新加载数据,有三个重载,可指定分页、筛选和排序 |
| ResetData | 重置表格分页、筛选、排序状态 |
| GetQueryModel | 获取表格状态,可用于持久化和恢复 |
| SetSelection | 设置选择列 |
| SelectAll | 全选 |
| UnselectAll | 取消全选 |
| ExpandAll | 展开全部列 |
| CollapseAll | 收起所有展开的的列 |
### 响应式
表格默认支持响应式,当屏幕宽度小于 960px 时,表格的数据列变为小屏模式。