mirror of
https://gitee.com/LongbowEnterprise/BootstrapBlazor.git
synced 2024-12-05 05:29:47 +08:00
!2343 feat(#I4RQG7): add SortString parameter on Table component
* doc: 更新 SortString 示例 * feat: 移除 SortList 改用 SortString * refactor: 移除 SortList 使用 SortString 方便代码编写 * feat: 增加 SortListString 参数用于设置多列排序规则
This commit is contained in:
parent
e7fc250dcd
commit
2629130e39
@ -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" />
|
||||
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
@ -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(),
|
||||
|
@ -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>
|
||||
/// 获得/设置 内部表头排序时回调方法
|
||||
|
@ -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();
|
||||
|
Loading…
Reference in New Issue
Block a user