From 1c402ff174bd09da69b83efd3b58894b6f0dcc7d Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 23 Mar 2025 11:18:59 +0800 Subject: [PATCH 1/5] =?UTF-8?q?feat:=20=E5=A2=9E=E5=8A=A0=20OnToolbarRefre?= =?UTF-8?q?shCallback=20=E5=9B=9E=E8=B0=83=E6=96=B9=E6=B3=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/Tab/Tab.razor.cs | 14 ++++++++++++-- test/UnitTest/Components/TabTest.cs | 9 ++++++++- 2 files changed, 20 insertions(+), 3 deletions(-) diff --git a/src/BootstrapBlazor/Components/Tab/Tab.razor.cs b/src/BootstrapBlazor/Components/Tab/Tab.razor.cs index 09528ad0228..84a50c17829 100644 --- a/src/BootstrapBlazor/Components/Tab/Tab.razor.cs +++ b/src/BootstrapBlazor/Components/Tab/Tab.razor.cs @@ -338,6 +338,12 @@ public partial class Tab : IHandlerException [Parameter] public string? RefreshToolbarTooltipText { get; set; } + /// + /// Gets or sets the refresh toolbar button click event callback. Default is null. + /// + [Parameter] + public Func? OnToolbarRefreshCallback { get; set; } + [CascadingParameter] private Layout? Layout { get; set; } @@ -934,12 +940,16 @@ public async Task DragItemCallback(int originIndex, int currentIndex) private string? GetIdByTabItem(TabItem item) => ComponentIdGenerator.Generate(item); - private Task OnRefreshAsync() + private async Task OnRefreshAsync() { // refresh the active tab item var item = TabItems.FirstOrDefault(i => i.IsActive); item.Refresh(_cache); - return Task.CompletedTask; + + if (OnToolbarRefreshCallback != null) + { + await OnToolbarRefreshCallback(); + } } /// diff --git a/test/UnitTest/Components/TabTest.cs b/test/UnitTest/Components/TabTest.cs index 3bc049d6ad6..9f5152d4121 100644 --- a/test/UnitTest/Components/TabTest.cs +++ b/test/UnitTest/Components/TabTest.cs @@ -1021,6 +1021,7 @@ public void BeforeNavigatorTemplate_Ok() [Fact] public async Task ShowToolbar_Ok() { + var clicked = false; var cut = Context.RenderComponent(pb => { pb.AddChildContent(pb => @@ -1032,6 +1033,11 @@ public async Task ShowToolbar_Ok() pb.Add(a => a.Text, "Text1"); pb.Add(a => a.ChildContent, builder => builder.AddContent(0, "Test1")); }); + pb.Add(a => a.OnToolbarRefreshCallback, () => + { + clicked = true; + return Task.CompletedTask; + }); }); }); cut.DoesNotContain("tabs-nav-toolbar"); @@ -1046,8 +1052,9 @@ public async Task ShowToolbar_Ok() cut.Contains("tabs-nav-toolbar-fs"); // 点击刷新按钮 - var button = cut.Find(".tabs-nav-toolbar-refresh > i"); + var button = cut.Find(".tabs-nav-toolbar-refresh"); await cut.InvokeAsync(() => button.Click()); + Assert.True(clicked); tab.SetParametersAndRender(pb => { From 4c1a13ff30d2477ee467ca42c17ea22fe8b5739e Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 23 Mar 2025 11:19:26 +0800 Subject: [PATCH 2/5] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor.Server/Components/Samples/Tabs.razor | 5 ++++- src/BootstrapBlazor.Server/Locales/en-US.json | 5 +++-- src/BootstrapBlazor.Server/Locales/zh-CN.json | 5 +++-- 3 files changed, 10 insertions(+), 5 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor index 94b5c192492..a191824cfc2 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor @@ -457,7 +457,6 @@ private void Navigation()
@Localizer["TabItem1Content"]
-
@Localizer["TabItem2Content"]
@@ -472,10 +471,14 @@ private void Navigation() +
+
@((MarkupString)Localizer["TabsToolbarDesc"].Value)
+
@Localizer["TabItem1Content"]
+
@Localizer["TabItem2Content"]
diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index f49c380c855..24692dc2571 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -2123,14 +2123,15 @@ "TabsCapsuleStyleIntro": "Set the capsule tab style by setting TabStyle=\"TabStyle.Capsule\". Currently only supports Placement=\"Placement.Top\" Placement=\"Placement.Bottom\" mode", "AttributeToolbarTemplate": "The template for Toolbar", "TabsToolbarTitle": "Toolbar", - "TabsToolbarIntro": "By setting ShowToolbar, you can display the tab toolbar. By default, the Refresh and Fullscreen buttons are displayed. You can control whether to display them by ShowRefreshToolbarButton and ShowFullscreenToolbarButton", + "TabsToolbarIntro": "By setting ShowToolbar, you can display the tab toolbar. By default, the Refresh and Fullscreen buttons are displayed. You can control whether to display them by ShowRefreshToolbarButton and ShowFullscreenToolbarButton, click the Refresh button to trigger the OnToolbarRefreshCallback callback method", "AttributeShowToolbar": "Whether to display the toolbar", "AttributeShowRefreshToolbarButton": "Whether to display the toolbar refresh button", "AttributeShowFullscreenToolbarButton": "Whether to display the toolbar full screen button", "AttributeRefreshToolbarTooltipText": "Toolbar refresh button tooltip text", "AttributeFullscreenToolbarTooltipText": "Toolbar full screen button tooltip text", "AttributeRefreshToolbarButtonIcon": "Toolbar refresh button icon", - "AttributeFullscreenToolbarButtonIcon": "Toolbar full screen button icon" + "AttributeFullscreenToolbarButtonIcon": "Toolbar full screen button icon", + "TabsToolbarDesc": "After clicking the button, the counter value increases, and clicking the Refresh button on the toolbar will reset the counter." }, "BootstrapBlazor.Server.Components.Components.DemoTabItem": { "Info": "Reset the title of this TabItem by click the button", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index 2455cc8c013..412abe69b51 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -2123,14 +2123,15 @@ "TabsCapsuleStyleIntro": "通过设置 TabStyle=\"TabStyle.Capsule\" 设置标签页为胶囊样式，目前仅支持 Placement=\"Placement.Top\" Placement=\"Placement.Bottom\" 模式", "AttributeToolbarTemplate": "Toolbar 模板", "TabsToolbarTitle": "工具栏", - "TabsToolbarIntro": "通过设置 ShowToolbar 显示标签页工具栏，默认显示 刷新 全屏 按钮，可以通过 ShowRefreshToolbarButton ShowFullscreenToolbarButton 控制是否显示", + "TabsToolbarIntro": "通过设置 ShowToolbar 显示标签页工具栏，默认显示 刷新 全屏 按钮，可以通过 ShowRefreshToolbarButton ShowFullscreenToolbarButton 控制是否显示，点击 刷新 按钮后触发 OnToolbarRefreshCallback 回调方法", "AttributeShowToolbar": "是否显示工具栏", "AttributeShowRefreshToolbarButton": "是否显示工具栏刷新按钮", "AttributeShowFullscreenToolbarButton": "是否显示工具栏全屏按钮", "AttributeRefreshToolbarTooltipText": "工具栏刷新按钮提示框文字", "AttributeFullscreenToolbarTooltipText": "工具栏全屏按钮提示框文字", "AttributeRefreshToolbarButtonIcon": "工具栏刷新按钮图标", - "AttributeFullscreenToolbarButtonIcon": "工具栏全屏按钮图标" + "AttributeFullscreenToolbarButtonIcon": "工具栏全屏按钮图标", + "TabsToolbarDesc": "点击按钮计数器数值增加后，点击工具栏的 刷新 按钮计数器清零" }, "BootstrapBlazor.Server.Components.Components.DemoTabItem": { "Info": "点击下方按钮，本 TabItem 标题更改为当前分钟与秒", From 2f6dfa179a410cbd10944a26b37eff8b96592d03 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 23 Mar 2025 11:21:24 +0800 Subject: [PATCH 3/5] =?UTF-8?q?doc:=20=E5=A2=9E=E5=8A=A0=E5=88=B7=E6=96=B0?= =?UTF-8?q?=E6=8C=89=E9=92=AE=E5=9B=9E=E8=B0=83=E6=96=B9=E6=B3=95=E6=96=87?= =?UTF-8?q?=E6=A1=A3=E8=AF=B4=E6=98=8E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/Tabs.razor.cs | 8 ++++++++ src/BootstrapBlazor.Server/Locales/en-US.json | 3 ++- src/BootstrapBlazor.Server/Locales/zh-CN.json | 3 ++- 3 files changed, 12 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs index c4288da0bd9..451677d0dc0 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs @@ -442,6 +442,14 @@ private AttributeItem[] GetAttributes() => DefaultValue = " — " }, new() + { + Name = nameof(Tab.OnToolbarRefreshCallback), + Description = Localizer["AttributeOnToolbarRefreshCallback"].Value, + Type = "Func", + ValueList = " — ", + DefaultValue = " — " + }, + new() { Name = nameof(Tab.FullscreenToolbarButtonIcon), Description = Localizer["AttributeFullscreenToolbarButtonIcon"].Value, diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 24692dc2571..820c24b0bc3 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -2131,7 +2131,8 @@ "AttributeFullscreenToolbarTooltipText": "Toolbar full screen button tooltip text", "AttributeRefreshToolbarButtonIcon": "Toolbar refresh button icon", "AttributeFullscreenToolbarButtonIcon": "Toolbar full screen button icon", - "TabsToolbarDesc": "After clicking the button, the counter value increases, and clicking the Refresh button on the toolbar will reset the counter." + "TabsToolbarDesc": "After clicking the button, the counter value increases, and clicking the Refresh button on the toolbar will reset the counter.", + "AttributeOnToolbarRefreshCallback": "Click the toolbar refresh button callback method" }, "BootstrapBlazor.Server.Components.Components.DemoTabItem": { "Info": "Reset the title of this TabItem by click the button", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index 412abe69b51..c91c12d6c02 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -2131,7 +2131,8 @@ "AttributeFullscreenToolbarTooltipText": "工具栏全屏按钮提示框文字", "AttributeRefreshToolbarButtonIcon": "工具栏刷新按钮图标", "AttributeFullscreenToolbarButtonIcon": "工具栏全屏按钮图标", - "TabsToolbarDesc": "点击按钮计数器数值增加后，点击工具栏的 刷新 按钮计数器清零" + "TabsToolbarDesc": "点击按钮计数器数值增加后，点击工具栏的 刷新 按钮计数器清零", + "AttributeOnToolbarRefreshCallback": "点击工具栏刷新按钮回调方法" }, "BootstrapBlazor.Server.Components.Components.DemoTabItem": { "Info": "点击下方按钮，本 TabItem 标题更改为当前分钟与秒", From 147fe0b894eb019a8140c2c83b5f2ad2b9844560 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 23 Mar 2025 11:29:14 +0800 Subject: [PATCH 4/5] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E6=96=87=E6=A1=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor.Server/Components/Samples/Tabs.razor | 2 +- src/BootstrapBlazor.Server/Locales/en-US.json | 2 +- src/BootstrapBlazor.Server/Locales/zh-CN.json | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor index a191824cfc2..ee784ea03f7 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor @@ -491,7 +491,7 @@ private void Navigation() - + diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 820c24b0bc3..4704f1fb0bd 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -2123,7 +2123,7 @@ "TabsCapsuleStyleIntro": "Set the capsule tab style by setting TabStyle=\"TabStyle.Capsule\". Currently only supports Placement=\"Placement.Top\" Placement=\"Placement.Bottom\" mode", "AttributeToolbarTemplate": "The template for Toolbar", "TabsToolbarTitle": "Toolbar", - "TabsToolbarIntro": "By setting ShowToolbar, you can display the tab toolbar. By default, the Refresh and Fullscreen buttons are displayed. You can control whether to display them by ShowRefreshToolbarButton and ShowFullscreenToolbarButton, click the Refresh button to trigger the OnToolbarRefreshCallback callback method", + "TabsToolbarIntro": "By setting ShowToolbar, you can display the tab toolbar. By default, the Refresh and Fullscreen buttons are displayed. You can control whether to display them by ShowRefreshToolbarButton and ShowFullscreenToolbarButton, click the Refresh button to trigger the OnToolbarRefreshCallback callback method. You can customize toolbar buttons using ToolbarTemplate", "AttributeShowToolbar": "Whether to display the toolbar", "AttributeShowRefreshToolbarButton": "Whether to display the toolbar refresh button", "AttributeShowFullscreenToolbarButton": "Whether to display the toolbar full screen button", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index c91c12d6c02..6afbbb41e80 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -2123,7 +2123,7 @@ "TabsCapsuleStyleIntro": "通过设置 TabStyle=\"TabStyle.Capsule\" 设置标签页为胶囊样式，目前仅支持 Placement=\"Placement.Top\" Placement=\"Placement.Bottom\" 模式", "AttributeToolbarTemplate": "Toolbar 模板", "TabsToolbarTitle": "工具栏", - "TabsToolbarIntro": "通过设置 ShowToolbar 显示标签页工具栏，默认显示 刷新 全屏 按钮，可以通过 ShowRefreshToolbarButton ShowFullscreenToolbarButton 控制是否显示，点击 刷新 按钮后触发 OnToolbarRefreshCallback 回调方法", + "TabsToolbarIntro": "通过设置 ShowToolbar 显示标签页工具栏，默认显示 刷新 全屏 按钮，可以通过 ShowRefreshToolbarButton ShowFullscreenToolbarButton 控制是否显示，点击 刷新 按钮后触发 OnToolbarRefreshCallback 回调方法，可以通过 ToolbarTemplate 自定义工具栏按钮", "AttributeShowToolbar": "是否显示工具栏", "AttributeShowRefreshToolbarButton": "是否显示工具栏刷新按钮", "AttributeShowFullscreenToolbarButton": "是否显示工具栏全屏按钮", From bae95860198b4d756b3b14f7d85d5e5e6a6e7fae Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Sun, 23 Mar 2025 11:32:08 +0800 Subject: [PATCH 5/5] =?UTF-8?q?refactor:=20=E6=9B=B4=E6=96=B0=20=20Tooltip?= =?UTF-8?q?Trigger=20=E5=80=BC=E4=B8=BA=20hover?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/Tab/Tab.razor | 2 +- src/BootstrapBlazor/Components/Tab/TabToolbarButton.razor | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/Tab/Tab.razor b/src/BootstrapBlazor/Components/Tab/Tab.razor index ea014eceee2..37bcab00101 100644 --- a/src/BootstrapBlazor/Components/Tab/Tab.razor +++ b/src/BootstrapBlazor/Components/Tab/Tab.razor @@ -92,7 +92,7 @@ else + TooltipPlacement="Placement.Bottom" TooltipTrigger="hover"> } @if (ToolbarTemplate != null) diff --git a/src/BootstrapBlazor/Components/Tab/TabToolbarButton.razor b/src/BootstrapBlazor/Components/Tab/TabToolbarButton.razor index 6ba72420030..25d4446e077 100644 --- a/src/BootstrapBlazor/Components/Tab/TabToolbarButton.razor +++ b/src/BootstrapBlazor/Components/Tab/TabToolbarButton.razor @@ -1,7 +1,7 @@ @namespace BootstrapBlazor.Components @inherits BootstrapModuleComponentBase - +