Skip to content

Commit e832302

Browse files
authored
fix(TableColumn): ShownWithBreakPoint not work well with Fixed (#4601)
* refactor: 更正变量名 * refactor: 消除参数 * feat: 增加 GetColumnFixedWidth 扩展方法 * refactor: 移除 CheckShownWithBreakpoint 方法 * test: 更新单元测试 * chore: bump version 9.0.0-rc.2.11.2.1
1 parent bcd80c5 commit e832302

File tree

7 files changed

+211
-267
lines changed

7 files changed

+211
-267
lines changed

src/BootstrapBlazor/BootstrapBlazor.csproj

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

33
<PropertyGroup>
4-
<Version>9.0.0-rc.2.11.2.0</Version>
4+
<Version>9.0.0-rc.2.11.2.1</Version>
55
</PropertyGroup>
66

77
<ItemGroup>

src/BootstrapBlazor/Components/Table/Table.razor

Lines changed: 171 additions & 186 deletions
Large diffs are not rendered by default.

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

Lines changed: 12 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -281,8 +281,9 @@ private int GetExtendButtonsColumnLeftMargin()
281281
return width;
282282
}
283283

284-
private int CalcMargin(int margin)
284+
private int CalcMargin()
285285
{
286+
var margin = 0;
286287
if (ShowDetails())
287288
{
288289
margin += DetailColumnWidth;
@@ -339,10 +340,11 @@ string GetFixedHeaderStyleString() => IsFixedHeader
339340

340341
private string? GetLeftStyle(ITableColumn col)
341342
{
343+
var columns = GetVisibleColumns().ToList();
342344
var defaultWidth = 200;
343345
var width = 0;
344346
var start = 0;
345-
var index = Columns.IndexOf(col);
347+
var index = columns.IndexOf(col);
346348
if (GetFixedDetailRowHeaderColumn)
347349
{
348350
width += DetailColumnWidth;
@@ -357,45 +359,38 @@ string GetFixedHeaderStyleString() => IsFixedHeader
357359
}
358360
while (index > start)
359361
{
360-
var column = Columns[start++];
361-
if (IsVisible(column))
362-
{
363-
width += column.Width ?? defaultWidth;
364-
}
362+
var column = columns[start++];
363+
width += column.Width ?? defaultWidth;
365364
}
366365
return $"left: {width}px;";
367366
}
368367

369368
private string? GetRightStyle(ITableColumn col, int margin)
370369
{
370+
var columns = GetVisibleColumns().ToList();
371371
var defaultWidth = 200;
372372
var width = 0;
373-
var index = Columns.IndexOf(col);
373+
var index = columns.IndexOf(col);
374374

375375
// after
376-
while (index + 1 < Columns.Count)
376+
while (index + 1 < columns.Count)
377377
{
378-
var column = Columns[index++];
379-
if (IsVisible(column))
380-
{
381-
width += column.Width ?? defaultWidth;
382-
}
378+
var column = columns[index++];
379+
width += column.Width ?? defaultWidth;
383380
}
384381
if (ShowExtendButtons && FixedExtendButtonsColumn)
385382
{
386383
width += ExtendButtonColumnWidth;
387384
}
388385

389386
// 如果是固定表头时增加滚动条位置
390-
if (IsFixedHeader && (index + 1) == Columns.Count)
387+
if (IsFixedHeader && (index + 1) == columns.Count)
391388
{
392389
width += margin;
393390
}
394391
return $"right: {width}px;";
395392
}
396393

397-
private bool IsVisible(ITableColumn col) => VisibleColumns.Find(i => i.Name == col.GetFieldName()) is { Visible: true };
398-
399394
/// <summary>
400395
/// 获取指定列头样式字符串
401396
/// </summary>

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

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -464,7 +464,7 @@ public IEnumerable<ITableColumn> GetVisibleColumns()
464464
{
465465
// 不可见列
466466
var items = VisibleColumns.Where(i => i.Visible);
467-
return Columns.Where(i => !i.GetIgnore() && items.Any(v => v.Name == i.GetFieldName()));
467+
return Columns.Where(i => !i.GetIgnore() && items.Any(v => v.Name == i.GetFieldName()) && ScreenSize >= i.ShownWithBreakPoint);
468468
}
469469

470470
private bool GetColumnsListState(ColumnVisibleItem item) => VisibleColumns.Find(i => i.Name == item.Name) is { Visible: true } && VisibleColumns.Where(i => i.Visible).DistinctBy(i => i.Name).Count(i => i.Visible) == 1;

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

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -13,9 +13,7 @@ namespace BootstrapBlazor.Components;
1313
/// <summary>
1414
/// Table 组件基类
1515
/// </summary>
16-
#if NET6_0_OR_GREATER
1716
[CascadingTypeParameter(nameof(TItem))]
18-
#endif
1917
public partial class Table<TItem> : ITable, IModelEqualityComparer<TItem> where TItem : class
2018
{
2119
/// <summary>
@@ -31,6 +29,12 @@ public partial class Table<TItem> : ITable, IModelEqualityComparer<TItem> where
3129
[NotNull]
3230
public string? ColumnToolboxIcon { get; set; }
3331

32+
/// <summary>
33+
/// 获得/设置 默认固定列宽度 默认 200 单位 px
34+
/// </summary>
35+
[Parameter]
36+
public int DefaultFixedColumnWidth { get; set; } = 200;
37+
3438
/// <summary>
3539
/// 获得/设置 内置虚拟化组件实例
3640
/// </summary>
@@ -930,7 +934,7 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
930934
await ProcessFirstRender();
931935
}
932936

933-
if(_viewChanged)
937+
if (_viewChanged)
934938
{
935939
_viewChanged = false;
936940
await InvokeVoidAsync("toggleView", Id);
@@ -1231,13 +1235,6 @@ protected async Task LoopQueryAsync()
12311235
private bool _firstQuery;
12321236
private bool _autoQuery;
12331237

1234-
/// <summary>
1235-
/// 检查当前列是否显示方法
1236-
/// </summary>
1237-
/// <param name="col"></param>
1238-
/// <returns></returns>
1239-
protected bool CheckShownWithBreakpoint(ITableColumn col) => ScreenSize >= col.ShownWithBreakPoint;
1240-
12411238
/// <summary>
12421239
/// OnQueryAsync 查询结果数据集合
12431240
/// </summary>
@@ -1400,7 +1397,7 @@ private Func<Task> TriggerDoubleClickCell(ITableColumn col, TItem item) => async
14001397

14011398
private int GetColumnCount()
14021399
{
1403-
var colSpan = GetVisibleColumns().Count(col => ScreenSize >= col.ShownWithBreakPoint);
1400+
var colSpan = GetVisibleColumns().Count();
14041401
if (IsMultipleSelect)
14051402
{
14061403
colSpan++;

src/BootstrapBlazor/Extensions/ITableColumnExtensions.cs

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -316,4 +316,6 @@ private static RenderFragment RenderTooltip<TItem>(this ITableColumn col, string
316316
internal static bool GetShowTips(this ITableColumn col) => col.ShowTips ?? false;
317317

318318
internal static Alignment GetAlign(this ITableColumn col) => col.Align ?? Alignment.None;
319+
320+
internal static int? GetColumnFixedWidth(this ITableColumn col, int width) => col.Fixed ? col.Width ?? width : col.Width;
319321
}

test/UnitTest/Components/TableTest.cs

Lines changed: 16 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -971,7 +971,7 @@ public async Task PageItemsSource_Ok()
971971
pb.AddChildContent<Table<Foo>>(pb =>
972972
{
973973
pb.Add(a => a.RenderMode, TableRenderMode.Table);
974-
pb.Add(a => a.PageItemsSource, new int[] { 2, 4, 8 });
974+
pb.Add(a => a.PageItemsSource, [2, 4, 8]);
975975
pb.Add(a => a.IsPagination, true);
976976
pb.Add(a => a.OnQueryAsync, OnQueryAsync(localizer));
977977
pb.Add(a => a.TableColumns, foo => builder =>
@@ -1558,6 +1558,7 @@ public void ColumnFixed_Ok(bool showExtendButton, bool isFixedHeader)
15581558
pb.Add(a => a.FixedExtendButtonsColumn, true);
15591559
pb.Add(a => a.IsFixedHeader, isFixedHeader);
15601560
pb.Add(a => a.ScrollWidth, 8);
1561+
pb.Add(a => a.DefaultFixedColumnWidth, 200);
15611562
pb.Add(a => a.TableColumns, foo => builder =>
15621563
{
15631564
builder.OpenComponent<TableColumn<Foo, string>>(0);
@@ -1816,14 +1817,8 @@ public void Column_IsFixedDetailColumn()
18161817
});
18171818
});
18181819
cut.Contains("style=\"left: 0;\"");
1819-
1820-
var table = cut.FindComponent<Table<Foo>>();
1821-
var methodIsVisible = table.Instance.GetType().GetMethod("IsVisible", BindingFlags.Instance | BindingFlags.NonPublic);
1822-
Assert.NotNull(methodIsVisible);
1823-
1824-
var v = methodIsVisible.Invoke(table.Instance, [new MockTableColumn()]);
1825-
Assert.Equal(false, v);
18261820
}
1821+
18271822
class MockTableColumn : AutoGenerateColumnAttribute
18281823
{
18291824
public new string GetFieldName() => "Test";
@@ -4529,7 +4524,7 @@ public async Task KeepSelectedRows_Ok()
45294524
pb.Add(a => a.IsMultipleSelect, true);
45304525
pb.Add(a => a.IsPagination, true);
45314526
pb.Add(a => a.IsKeepSelectedRows, true);
4532-
pb.Add(a => a.PageItemsSource, new int[] { 2 });
4527+
pb.Add(a => a.PageItemsSource, [2]);
45334528
pb.Add(a => a.OnQueryAsync, options =>
45344529
{
45354530
var total = Items.Count;
@@ -6650,7 +6645,7 @@ public void OnConfirm_Ok()
66506645
pb.Add(a => a.IsMultipleSelect, true);
66516646
pb.Add(a => a.ShowToolbar, true);
66526647
pb.Add(a => a.IsPagination, true);
6653-
pb.Add(a => a.PageItemsSource, new int[] { 1 });
6648+
pb.Add(a => a.PageItemsSource, [1]);
66546649
pb.Add(a => a.TableColumns, foo => builder =>
66556650
{
66566651
builder.OpenComponent<TableColumn<Foo, string>>(0);
@@ -6671,7 +6666,7 @@ public void OnConfirm_Ok()
66716666

66726667
table.SetParametersAndRender(pb =>
66736668
{
6674-
pb.Add(a => a.PageItemsSource, new int[] { 1, 2, 4, 8 });
6669+
pb.Add(a => a.PageItemsSource, [1, 2, 4, 8]);
66756670
});
66766671
cut.InvokeAsync(() => deleteButton.Instance.OnConfirm());
66776672
}
@@ -6924,17 +6919,17 @@ public void GetTreeClassString_Ok()
69246919

69256920
var instance = cut.FindComponent<Table<FooTree>>().Instance;
69266921
var type = instance.GetType();
6927-
var method = type.GetMethod("GetTreeClassString", System.Reflection.BindingFlags.NonPublic | System.Reflection.BindingFlags.Instance)!;
6928-
var expected = method.Invoke(instance, new object[] { false })!;
6922+
var method = type.GetMethod("GetTreeClassString", BindingFlags.NonPublic | BindingFlags.Instance)!;
6923+
var expected = method.Invoke(instance, [false])!;
69296924
Assert.Equal("is-tree fa-solid fa-caret-right", expected.ToString());
6930-
expected = method.Invoke(instance, new object[] { true })!;
6925+
expected = method.Invoke(instance, [true])!;
69316926
Assert.Equal("is-tree fa-solid fa-caret-right fa-rotate-90", expected.ToString());
69326927

6933-
var p = type.GetProperty("IsLoadChildren", System.Reflection.BindingFlags.NonPublic | System.Reflection.BindingFlags.Instance)!;
6928+
var p = type.GetProperty("IsLoadChildren", BindingFlags.NonPublic | BindingFlags.Instance)!;
69346929
p.SetValue(instance, true);
6935-
expected = method.Invoke(instance, new object[] { false })!;
6930+
expected = method.Invoke(instance, [false])!;
69366931
Assert.Equal("is-tree fa-solid fa-spin fa-spinner", expected.ToString());
6937-
expected = method.Invoke(instance, new object[] { true })!;
6932+
expected = method.Invoke(instance, [true])!;
69386933
Assert.Equal("is-tree fa-solid fa-spin fa-spinner", expected.ToString());
69396934
}
69406935

@@ -7319,28 +7314,6 @@ public void AutoGenerateColumns_Ok()
73197314
Assert.Equal(7, table.Instance.Columns.Count);
73207315
}
73217316

7322-
[Fact]
7323-
public void CheckShownWithBreakpoint_Ok()
7324-
{
7325-
var localizer = Context.Services.GetRequiredService<IStringLocalizer<Foo>>();
7326-
var cut = Context.RenderComponent<BootstrapBlazorRoot>(pb =>
7327-
{
7328-
pb.AddChildContent<MockTable>(pb =>
7329-
{
7330-
pb.Add(a => a.AutoGenerateColumns, true);
7331-
});
7332-
});
7333-
7334-
var table = cut.FindComponent<MockTable>();
7335-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.Small, BreakPoint.ExtraExtraLarge));
7336-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.Medium, BreakPoint.ExtraExtraLarge));
7337-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.Large, BreakPoint.ExtraExtraLarge));
7338-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.ExtraLarge, BreakPoint.ExtraExtraLarge));
7339-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.ExtraExtraLarge, BreakPoint.ExtraExtraLarge));
7340-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.ExtraSmall, BreakPoint.ExtraExtraLarge));
7341-
Assert.True(table.Instance.TestCheckShownWithBreakpoint(BreakPoint.None, BreakPoint.ExtraExtraLarge));
7342-
}
7343-
73447317
[Fact]
73457318
public void QueryItems_Null()
73467319
{
@@ -7502,6 +7475,7 @@ public void Value_Datetime()
75027475
[Fact]
75037476
public void Value_Enumerable()
75047477
{
7478+
var items = new List<string>() { "test-0" };
75057479
var localizer = Context.Services.GetRequiredService<IStringLocalizer<Foo>>();
75067480
var cut = Context.RenderComponent<BootstrapBlazorRoot>(pb =>
75077481
{
@@ -7511,7 +7485,7 @@ public void Value_Enumerable()
75117485
pb.Add(a => a.TableColumns, foo => builder =>
75127486
{
75137487
builder.OpenComponent<TableColumn<Foo, IEnumerable<string>>>(0);
7514-
builder.AddAttribute(1, "Field", new string[] { "test-0" });
7488+
builder.AddAttribute(1, "Field", items);
75157489
builder.AddAttribute(2, "FieldExpression", Utility.GenerateValueExpression(foo, "Hobby", typeof(IEnumerable<string>)));
75167490
builder.CloseComponent();
75177491
});
@@ -8223,11 +8197,9 @@ await Assert.ThrowsAsync<InvalidOperationException>(() =>
82238197
});
82248198
}
82258199

8226-
class MockFoo
8200+
class MockFoo(string name)
82278201
{
8228-
public MockFoo(string name) => Name = name;
8229-
8230-
public string Name { get; set; }
8202+
public string Name { get; set; } = name;
82318203
}
82328204

82338205
private static DataTable CreateDataTable(IStringLocalizer<Foo> localizer)
@@ -8504,13 +8476,6 @@ public TableRenderMode ShouldBeCardView()
85048476
return base.ActiveRenderMode;
85058477
}
85068478

8507-
public bool TestCheckShownWithBreakpoint(BreakPoint point, BreakPoint screenSize)
8508-
{
8509-
var col = new AutoGenerateColumnAttribute() { ShownWithBreakPoint = point };
8510-
ScreenSize = screenSize;
8511-
return CheckShownWithBreakpoint(col);
8512-
}
8513-
85148479
public RenderFragment TestRenderCell(Foo item, ItemChangedType changedType, Action<ITableColumn> callback)
85158480
{
85168481
var col = Columns[0];

0 commit comments

Comments
 (0)