!2343 feat(#I4RQG7): add SortString parameter on Table component

* doc: 更新 SortString 示例
* feat: 移除 SortList 改用 SortString
* refactor: 移除 SortList 使用 SortString 方便代码编写
* feat: 增加 SortListString 参数用于设置多列排序规则
This commit is contained in:
Argo 2022-01-22 03:44:32 +00:00
parent e7fc250dcd
commit 2629130e39
5 changed files with 17 additions and 18 deletions

View File

@ -122,11 +122,11 @@
</DemoBlock>
<DemoBlock Title="动态多列排序" Introduction="设置 <code>OnSort</code> 参数" Name="OnSort">
<p>点击列头进行排序时,组件内部查询前调用此回调,可以在此处根据条件设置 <code>SortList</code> 参数,即可实现动态多列排序功能,本例中点击时间列头进行正序排序时,内部使用 <code>DateTime, Count</code> 倒序时使用 <code>DateTime desc, Count desc</code></p>
<p>点击列头进行排序时,组件内部调用 <code>OnSort</code> 回调,可以在此处根据业务逻辑设置其返回值即可实现动态多列排序功能,本例中点击 <b>时间</b> 列头进行正序排序时,内部使用 <code>DateTime, Count</code> 倒序时使用 <code>DateTime desc, Count desc</code></p>
<Table TItem="Foo"
IsPagination="true" PageItemsSource="@PageItemsSource"
IsStriped="true" IsBordered="true" IsMultipleSelect="true"
ShowSkeleton="true" SortList="SortList" OnSort="OnSort"
ShowSkeleton="true" SortString="@SortString" OnSort="OnSort"
OnQueryAsync="@OnQueryAsync">
<TableColumns>
<TableColumn @bind-Field="@context.DateTime" Width="180" Sortable="true" />

View File

@ -26,7 +26,7 @@ public partial class TablesFilter
[NotNull]
private IStringLocalizer<Foo>? Localizer { get; set; }
private List<string> SortList { get; } = new List<string> { "DateTime desc", "Address" };
private string SortString { get; set; } = "DateTime desc, Address";
/// <summary>
/// OnInitialized 方法
@ -81,28 +81,24 @@ public partial class TablesFilter
});
}
private void OnSort(string sortName, SortOrder sortOrder)
private string OnSort(string sortName, SortOrder sortOrder)
{
string sortString = "";
if (sortName == nameof(Foo.DateTime))
{
if (sortOrder == SortOrder.Asc)
{
SortList.Clear();
SortList.Add(nameof(Foo.DateTime));
SortList.Add(nameof(Foo.Count));
sortString = "DateTime, Count";
}
else if (sortOrder == SortOrder.Desc)
{
SortList.Clear();
SortList.Add($"{nameof(Foo.DateTime)} desc");
SortList.Add($"{nameof(Foo.Count)} desc");
sortString = "DateTime desc, Count desc";
}
else
{
SortList.Clear();
SortList.Add($"{nameof(Foo.DateTime)} desc");
SortList.Add(nameof(Foo.Count));
sortString = "DateTime desc, Count";
}
}
return sortString;
}
}

View File

@ -443,7 +443,7 @@ public partial class Table<TItem>
SearchText = SearchText,
SortOrder = SortOrder,
SortName = SortName,
SortList = SortList,
SortList = SortString?.SpanSplit(",", StringSplitOptions.RemoveEmptyEntries),
Filters = Filters.Values,
Searchs = GetSearchs(),
AdvanceSearchs = GetAdvanceSearchs(),

View File

@ -44,16 +44,16 @@ public partial class Table<TItem>
public string SortIcon { get; set; } = "fa fa-sort";
/// <summary>
/// 获得/设置 多列排序顺序 默认为空 设置时支持 Order 后缀 "Name" "Age desc"
/// 获得/设置 多列排序顺序 默认为空 多列时使用逗号分割 如:"Name, Age desc"
/// </summary>
[Parameter]
public List<string>? SortList { get; set; }
public string? SortString { get; set; }
/// <summary>
/// 获得/设置 点击表头排序时回调方法
/// </summary>
[Parameter]
public Action<string, SortOrder>? OnSort { get; set; }
public Func<string, SortOrder, string>? OnSort { get; set; }
/// <summary>
/// 获得/设置 内部表头排序时回调方法

View File

@ -663,7 +663,10 @@ public partial class Table<TItem> : BootstrapComponentBase, IDisposable, ITable
IntenralOnSortAsync = async (sortName, sortOrder) =>
{
// 调用 OnSort 回调方法
OnSort?.Invoke(sortName, SortOrder);
if (OnSort != null)
{
SortString = OnSort(sortName, SortOrder);
}
// 重新查询
await QueryAsync();