Skip to content

Commit c29d23a

Browse files
braia123ArgoZhang
andauthored
feat(Table): add ReloadColumnVisibleFromBrowserAsync method (#7011)
* 持久化列的显隐到bb-table-column-visiable-{ClientTableName} * refactor: 增加持久化逻辑 * refactor: 增加本地持久化方法 * refactor: 增加空兼容 * feat: 增加 ColumnVisibleItemConverter 标签 * refactor: 更新条件 * refactor: 更新加载逻辑 * doc: 更新文档 * chore: 更新依赖 * test: 增加单元测试 * feat: 增加 ReloadColumnVisibleFromBrowserAsync 方法 * test: 更新单元测试 * chore: bump version 9.11.5-beta08 Co-Authored-By: braia123 <[email protected]> --------- Co-authored-by: Argo Zhang <[email protected]> Co-authored-by: braia123 <[email protected]>
1 parent 854643e commit c29d23a

File tree

12 files changed

+142
-16
lines changed

12 files changed

+142
-16
lines changed

src/BootstrapBlazor.Server/Components/Samples/Table/TablesColumnList.razor

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@
2424
IsPagination="true" PageItemsSource="@PageItemsSource"
2525
IsStriped="true" IsBordered="true" IsMultipleSelect="true"
2626
ShowToolbar="true" ShowAddButton="false" ShowEditButton="false" ShowDeleteButton="false"
27-
ShowExtendButtons="false" ShowColumnList="true"
27+
ShowExtendButtons="false" ShowColumnList="true" ClientTableName="testtable"
2828
OnQueryAsync="@OnQueryAsync">
2929
<TableColumns>
3030
<TableColumn @bind-Field="@context.DateTime" Width="180" />

src/BootstrapBlazor/BootstrapBlazor.csproj

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
11
<Project Sdk="Microsoft.NET.Sdk.Razor">
22

33
<PropertyGroup Condition="'$(VisualStudioVersion)' == '17.0'">
4-
<Version>9.11.5-beta07</Version>
4+
<Version>9.11.5-beta08</Version>
55
</PropertyGroup>
66

77
<PropertyGroup Condition="'$(VisualStudioVersion)' == '18.0'">
8-
<Version>10.0.0-rc.2.1.6</Version>
8+
<Version>10.0.0-rc.2.1.7</Version>
99
</PropertyGroup>
1010

1111
<ItemGroup>

src/BootstrapBlazor/Components/Table/ColumnVisibleItem.cs

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,16 @@
33
// See the LICENSE file in the project root for more information.
44
// Maintainer: Argo Zhang([email protected]) Website: https://www.blazor.zone
55

6+
using System.Text.Json.Serialization;
7+
68
namespace BootstrapBlazor.Components;
79

810
/// <summary>
911
/// Table 组件列可见性类
1012
/// </summary>
1113
/// <param name="name"></param>
1214
/// <param name="visible"></param>
15+
[JsonConverter(typeof(ColumnVisibleItemConverter))]
1316
public class ColumnVisibleItem(string name, bool visible)
1417
{
1518
/// <summary>
@@ -20,6 +23,7 @@ public class ColumnVisibleItem(string name, bool visible)
2023
/// <summary>
2124
/// 获得 列名称
2225
/// </summary>
26+
[JsonIgnore]
2327
public string? DisplayName { get; set; }
2428

2529
/// <summary>

src/BootstrapBlazor/Components/Table/Table.razor.Checkbox.cs

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,10 @@ private async Task OnToggleColumnVisible(string columnName, bool visible)
155155
{
156156
_resetColumns = true;
157157
}
158-
158+
if (!string.IsNullOrEmpty(ClientTableName))
159+
{
160+
await InvokeVoidAsync("saveColumnList", ClientTableName, _visibleColumns);
161+
}
159162
if (OnColumnVisibleChanged != null)
160163
{
161164
await OnColumnVisibleChanged(columnName, visible);

src/BootstrapBlazor/Components/Table/Table.razor.Toolbar.cs

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -502,7 +502,7 @@ public async Task AddAsync()
502502
{
503503
// 数据源为 DataTable 新建后重建行与列
504504
await DynamicContext.AddAsync(SelectedRows.OfType<IDynamicObject>());
505-
ResetDynamicContext();
505+
await ResetDynamicContext();
506506

507507
if (!IsKeepSelectedRowAfterAdd)
508508
{
@@ -1030,7 +1030,7 @@ protected async Task DeleteAsync()
10301030
if (DynamicContext != null)
10311031
{
10321032
await DynamicContext.DeleteAsync(SelectedRows.OfType<IDynamicObject>());
1033-
ResetDynamicContext();
1033+
await ResetDynamicContext();
10341034
SelectedRows.Clear();
10351035
await OnSelectedRowsChanged();
10361036
}
@@ -1098,7 +1098,7 @@ async Task<bool> DeleteItemsAsync()
10981098
}
10991099
}
11001100

1101-
private void ResetDynamicContext()
1101+
private async Task ResetDynamicContext()
11021102
{
11031103
if (DynamicContext != null)
11041104
{
@@ -1112,7 +1112,7 @@ private void ResetDynamicContext()
11121112
FirstFixedColumnCache.Clear();
11131113
LastFixedColumnCache.Clear();
11141114

1115-
InternalResetVisibleColumns(Columns);
1115+
await InternalResetVisibleColumns(Columns);
11161116

11171117
var queryOption = BuildQueryPageOptions();
11181118
// 设置是否为首次查询

src/BootstrapBlazor/Components/Table/Table.razor.cs

Lines changed: 24 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1123,6 +1123,24 @@ private async Task OnTableRenderAsync(bool firstRender)
11231123

11241124
private readonly JsonSerializerOptions _serializerOption = new(JsonSerializerDefaults.Web);
11251125

1126+
private async Task ReloadColumnVisibleFromBrowserAsync()
1127+
{
1128+
if (!string.IsNullOrEmpty(ClientTableName))
1129+
{
1130+
// 读取浏览器配置
1131+
var clientColumns = await InvokeAsync<List<ColumnVisibleItem>>("reloadColumnList", ClientTableName);
1132+
clientColumns ??= [];
1133+
foreach (var column in _visibleColumns)
1134+
{
1135+
var item = clientColumns.FirstOrDefault(i => i.Name == column.Name);
1136+
if (item != null)
1137+
{
1138+
column.Visible = item.Visible;
1139+
}
1140+
}
1141+
}
1142+
}
1143+
11261144
private async Task ReloadColumnWidthFromBrowserAsync(List<ITableColumn> columns)
11271145
{
11281146
List<ColumnWidth>? ret = null;
@@ -1207,7 +1225,9 @@ private async Task ProcessFirstRender()
12071225
await OnColumnCreating(cols);
12081226
}
12091227

1210-
InternalResetVisibleColumns(cols);
1228+
await InternalResetVisibleColumns(cols);
1229+
1230+
await ReloadColumnVisibleFromBrowserAsync();
12111231

12121232
Columns.Clear();
12131233
Columns.AddRange(cols.OrderFunc());
@@ -1258,7 +1278,7 @@ private void ResetColumnWidth(List<ITableColumn> columns)
12581278
}
12591279
}
12601280

1261-
private void InternalResetVisibleColumns(List<ITableColumn> columns, IEnumerable<ColumnVisibleItem>? items = null)
1281+
private async Task InternalResetVisibleColumns(List<ITableColumn> columns, IEnumerable<ColumnVisibleItem>? items = null)
12621282
{
12631283
var cols = columns.Select(i => new ColumnVisibleItem(i.GetFieldName(), i.GetVisible()) { DisplayName = i.GetDisplayName() }).ToList();
12641284
if (items != null)
@@ -1284,15 +1304,15 @@ private void InternalResetVisibleColumns(List<ITableColumn> columns, IEnumerable
12841304
/// 设置 列可见方法
12851305
/// </summary>
12861306
/// <param name="columns"></param>
1287-
public void ResetVisibleColumns(IEnumerable<ColumnVisibleItem> columns)
1307+
public async Task ResetVisibleColumns(IEnumerable<ColumnVisibleItem> columns)
12881308
{
12891309
// https://github.com/dotnetcore/BootstrapBlazor/issues/6823
12901310
if (AllowResizing)
12911311
{
12921312
_resetColumns = true;
12931313
}
12941314

1295-
InternalResetVisibleColumns(Columns, columns);
1315+
await InternalResetVisibleColumns(Columns, columns);
12961316
StateHasChanged();
12971317
}
12981318

src/BootstrapBlazor/Components/Table/Table.razor.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,24 @@ export function init(id, invoke, options) {
2121
reset(id)
2222
}
2323

24+
export function saveColumnList(tableName, columns) {
25+
const key = `bb-table-column-visiable-${tableName}`
26+
return localStorage.setItem(key, JSON.stringify(columns));
27+
}
28+
29+
export function reloadColumnList(tableName) {
30+
const key = `bb-table-column-visiable-${tableName}`
31+
const json = localStorage.getItem(key);
32+
let columns = [];
33+
if (json) {
34+
try {
35+
columns = JSON.parse(json);
36+
}
37+
catch { }
38+
}
39+
return columns;
40+
}
41+
2442
export function reloadColumnWidth(tableName) {
2543
const key = `bb-table-column-width-${tableName}`
2644
return localStorage.getItem(key);
Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
// Licensed to the .NET Foundation under one or more agreements.
2+
// The .NET Foundation licenses this file to you under the Apache 2.0 License
3+
// See the LICENSE file in the project root for more information.
4+
// Maintainer: Argo Zhang([email protected]) Website: https://www.blazor.zone
5+
6+
using System.Text.Json;
7+
using System.Text.Json.Serialization;
8+
9+
namespace BootstrapBlazor.Components;
10+
11+
public class ColumnVisibleItemConverter : JsonConverter<ColumnVisibleItem>
12+
{
13+
/// <summary>
14+
/// <inheritdoc/>
15+
/// </summary>
16+
/// <param name="reader"></param>
17+
/// <param name="typeToConvert"></param>
18+
/// <param name="options"></param>
19+
/// <returns></returns>
20+
public override ColumnVisibleItem? Read(ref Utf8JsonReader reader, Type typeToConvert, JsonSerializerOptions options)
21+
{
22+
string? name = null;
23+
bool visible = false;
24+
if (reader.TokenType == JsonTokenType.StartObject)
25+
{
26+
while (reader.Read())
27+
{
28+
if (reader.TokenType == JsonTokenType.EndObject)
29+
{
30+
break;
31+
}
32+
if (reader.TokenType == JsonTokenType.PropertyName)
33+
{
34+
var propertyName = reader.GetString();
35+
if (propertyName == "name")
36+
{
37+
reader.Read();
38+
name = reader.GetString();
39+
}
40+
else if (propertyName == "visible")
41+
{
42+
reader.Read();
43+
visible = reader.GetBoolean();
44+
}
45+
}
46+
}
47+
}
48+
return new ColumnVisibleItem(name, visible);
49+
}
50+
51+
/// <summary>
52+
/// <inheritdoc/>
53+
/// </summary>
54+
/// <param name="writer"></param>
55+
/// <param name="value"></param>
56+
/// <param name="options"></param>
57+
public override void Write(Utf8JsonWriter writer, ColumnVisibleItem value, JsonSerializerOptions options)
58+
{
59+
writer.WriteStartObject();
60+
writer.WriteString("name", value.Name);
61+
writer.WriteBoolean("visible", value.Visible);
62+
writer.WriteEndObject();
63+
}
64+
}

src/BootstrapBlazor/Converter/JsonQueryPageOptionConverter.cs

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@ public class JsonQueryPageOptionsConverter : JsonConverter<QueryPageOptions>
2020
/// <param name="typeToConvert"></param>
2121
/// <param name="options"></param>
2222
/// <returns></returns>
23-
/// <exception cref="NotImplementedException"></exception>
2423
public override QueryPageOptions? Read(ref Utf8JsonReader reader, Type typeToConvert, JsonSerializerOptions options)
2524
{
2625
var ret = new QueryPageOptions();
@@ -203,7 +202,6 @@ public class JsonQueryPageOptionsConverter : JsonConverter<QueryPageOptions>
203202
/// <param name="writer"></param>
204203
/// <param name="value"></param>
205204
/// <param name="options"></param>
206-
/// <exception cref="NotImplementedException"></exception>
207205
public override void Write(Utf8JsonWriter writer, QueryPageOptions value, JsonSerializerOptions options)
208206
{
209207
writer.WriteStartObject();

test/UnitTest/Components/TableTest.cs

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -731,6 +731,12 @@ public void ResetFilter_Null()
731731
[Fact]
732732
public async Task ShowColumnList_Ok()
733733
{
734+
// 设置客户端存储
735+
Context.JSInterop.Setup<List<ColumnVisibleItem>>("reloadColumnList", "test").SetResult(
736+
[
737+
new("Name", false),
738+
new("Address", true)
739+
]);
734740
var show = false;
735741
var localizer = Context.Services.GetRequiredService<IStringLocalizer<Foo>>();
736742
var cut = Context.RenderComponent<BootstrapBlazorRoot>(pb =>
@@ -764,6 +770,7 @@ public async Task ShowColumnList_Ok()
764770
builder.AddAttribute(2, "FieldExpression", Utility.GenerateValueExpression(foo, "Address", typeof(string)));
765771
builder.CloseComponent();
766772
});
773+
pb.Add(a => a.ClientTableName, "test");
767774
});
768775
});
769776
cut.Contains("Test_Column_List");

0 commit comments

Comments
 (0)