feat(TableFooterCell): add BreakPoint parameter (#3698)

* feat(Table): TableFooterCell 支持显示节点阈值 ShownWithBreakPoint #3689 * 添加TableFooterCell 参数 ScreenSize 和 ShownWithBreakPoint 的测试单元 * refactor: 更新级联参数 * test: 更新单元测试 * test: 增加单元测试 * chore: bump version 8.6.3-beta05 --------- Co-authored-by: Alex chow <zhouchuanglin@gmail.com>
dotnetcore · Jun 20, 2024 · 688d9f1 · 688d9f1
1 parent c536477
commit 688d9f1
Show file tree

Hide file tree

Showing 5 changed files with 91 additions and 8 deletions.
diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj
@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>8.6.3-beta04</Version>
+    <Version>8.6.3-beta05</Version>
   </PropertyGroup>
 
   <ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">

diff --git a/src/BootstrapBlazor/Components/Table/TableFooterCell.razor b/src/BootstrapBlazor/Components/Table/TableFooterCell.razor
@@ -7,7 +7,10 @@
 }
 else
 {
-    <td @attributes="@AdditionalAttributes" colspan="@GetColspanValue()">
-        <div class="@ClassString">@_value</div>
-    </td>
+    if (CheckShownWithBreakpoint)
+    {
+        <td @attributes="@AdditionalAttributes" colspan="@GetColspanValue()">
+            <div class="@ClassString">@_value</div>
+        </td>
+    }
 }
diff --git a/src/BootstrapBlazor/Components/Table/TableFooterCell.razor.cs b/src/BootstrapBlazor/Components/Table/TableFooterCell.razor.cs
@@ -82,6 +82,12 @@ public partial class TableFooterCell
     [CascadingParameter(Name = "TableFooterContext")]
     private object? DataSource { get; set; }
 
+    /// <summary>
+    /// 获得/设置 显示节点阈值 默认值 BreakPoint.None 未设置
+    /// </summary>
+    [Parameter]
+    public BreakPoint ShownWithBreakPoint { get; set; }
+
     private string? _value { get; set; }
 
     /// <summary>
@@ -93,6 +99,12 @@ protected override async Task OnParametersSetAsync()
         _value = Text ?? (GetCount(DataSource) == 0 ? "0" : (GetCountValue() ?? await GetAggregateValue()));
     }
 
+    /// <summary>
+    /// 检查当前列是否显示方法
+    /// </summary>
+    /// <returns></returns>
+    protected bool CheckShownWithBreakpoint => BreakPoint >= ShownWithBreakPoint;
+
     /// <summary>
     /// 解析 Count Aggregate
     /// </summary>

diff --git a/test/UnitTest/Components/TableFooterCellTest.cs b/test/UnitTest/Components/TableFooterCellTest.cs
@@ -19,7 +19,7 @@ public void IsMobileMode_Ok(bool mobile)
 
         var cut = Context.RenderComponent<TableFooterCell>(pb =>
         {
-            pb.AddCascadingValue<bool>("IsMobileMode", mobile);
+            pb.AddCascadingValue("IsMobileMode", mobile);
             pb.AddCascadingValue<object>("TableFooterContext", ds);
             pb.Add(a => a.Field, nameof(Foo.Count));
         });
@@ -37,6 +37,70 @@ public void IsMobileMode_Ok(bool mobile)
         }
     }
 
+    [Theory]
+    [InlineData(BreakPoint.Large)]
+    [InlineData(BreakPoint.Small)]
+    [InlineData(BreakPoint.ExtraLarge)]
+    public void ScreenSize_Ok(BreakPoint screenSize)
+    {
+        var ds = new List<Foo>()
+        {
+            new() { Count = 1 },
+            new() { Count = 2 },
+        };
+
+        var checkShownWithBreakpoint = screenSize >= BreakPoint.Large;
+        var cut = Context.RenderComponent<TableFooterCell>(pb =>
+        {
+            pb.AddCascadingValue("TableBreakPoint", screenSize);
+            pb.AddCascadingValue<object>("TableFooterContext", ds);
+            pb.Add(a => a.Field, nameof(Foo.Count));
+            pb.Add(a => a.ShownWithBreakPoint, BreakPoint.Large);
+            pb.Add(a => a.Text, "test-Text");
+        });
+
+        if (checkShownWithBreakpoint)
+        {
+            cut.Contains("test-Text");
+        }
+        else
+        {
+            cut.DoesNotContain("test-Text");
+        }
+    }
+
+    [Theory]
+    [InlineData(BreakPoint.None)]
+    [InlineData(BreakPoint.Small)]
+    [InlineData(BreakPoint.ExtraLarge)]
+    public void ShownWithBreakPoint_Ok(BreakPoint shownWithBreakPoint)
+    {
+        var ds = new List<Foo>()
+        {
+            new() { Count = 1 },
+            new() { Count = 2 },
+        };
+
+        var screenSize = BreakPoint.Large;
+        var checkShownWithBreakpoint = screenSize >= shownWithBreakPoint;
+        var cut = Context.RenderComponent<TableFooterCell>(pb =>
+        {
+            pb.AddCascadingValue("TableBreakPoint", screenSize);
+            pb.AddCascadingValue<object>("TableFooterContext", ds);
+            pb.Add(a => a.ShownWithBreakPoint, shownWithBreakPoint);
+            pb.Add(a => a.Text, "test-Text");
+        });
+
+        if (checkShownWithBreakpoint)
+        {
+            cut.Contains("test-Text");
+        }
+        else
+        {
+            cut.DoesNotContain("test-Text");
+        }
+    }
+
     [Fact]
     public void ColspanCallback_Ok()
     {

diff --git a/test/UnitTest/Services/MaskServiceTest.cs b/test/UnitTest/Services/MaskServiceTest.cs
@@ -9,13 +9,17 @@ namespace UnitTest.Services;
 /// <summary>
 /// MaskService 单元测试
 /// </summary>
-public class MaskServiceTest : BootstrapBlazorTestBase
+public class MaskServiceTest : TestBase
 {
     [Fact]
     public async Task Mask_Ok()
     {
-        var maskService = Context.Services.GetRequiredService<MaskService>();
-        var cut = Context.RenderComponent<BootstrapBlazorRoot>(pb =>
+        var context = new TestContext();
+        context.JSInterop.Mode = JSRuntimeMode.Loose;
+        context.Services.AddBootstrapBlazor();
+
+        var maskService = context.Services.GetRequiredService<MaskService>();
+        var cut = context.RenderComponent<BootstrapBlazorRoot>(pb =>
         {
             pb.AddChildContent<Button>(pb =>
             {