feat: 增加刷新按钮

Author: ArgoZhang

src/BootstrapBlazor/Components/Tab/Tab.razor

@@ -76,9 +76,15 @@ else
                 @if (ShowToolbar)
                 {
                     <div class="tabs-nav-toolbar">
-                        @if (ShowFullscreenButton)
+                        @if (ShowRefreshToolbarButton)
                         {
-                            <div class="tabs-nav-toolbar-button">
+                            <div class="tabs-nav-toolbar-button tabs-nav-toolbar-refresh">
+                                <TabToolbarRefreshButton Icon="@RefreshToolbarButtonIcon" OnClickAsync="OnRefreshAsync"></TabToolbarRefreshButton>
+                            </div>
+                        }
+                        @if (ShowFullscreenToolbarButton)
+                        {
+                            <div class="tabs-nav-toolbar-button tabs-nav-toolbar-fs">
                                 <FullScreenButton TargetId="@Id"></FullScreenButton>
                             </div>
                         }

src/BootstrapBlazor/Components/Tab/Tab.razor.cs

@@ -304,7 +304,19 @@ public partial class Tab : IHandlerException
     /// Gets or sets whether show the full screen button. Default is true.
     /// </summary>
     [Parameter]
-    public bool ShowFullscreenButton { get; set; } = true;
+    public bool ShowFullscreenToolbarButton { get; set; } = true;
+
+    /// <summary>
+    /// Gets or sets whether show the full screen button. Default is true.
+    /// </summary>
+    [Parameter]
+    public bool ShowRefreshToolbarButton { get; set; } = true;
+
+    /// <summary>
+    /// Gets or sets the refresh toolbar button icon string. Default is null.
+    /// </summary>
+    [Parameter]
+    public string? RefreshToolbarButtonIcon { get; set; }
 
     [CascadingParameter]
     private Layout? Layout { get; set; }
@@ -372,6 +384,7 @@ protected override void OnParametersSet()
         NextIcon ??= IconTheme.GetIconByKey(ComponentIcons.TabNextIcon);
         DropdownIcon ??= IconTheme.GetIconByKey(ComponentIcons.TabDropdownIcon);
         CloseIcon ??= IconTheme.GetIconByKey(ComponentIcons.TabCloseIcon);
+        RefreshToolbarButtonIcon ??= IconTheme.GetIconByKey(ComponentIcons.TabRefreshButtonIcon);
 
         AdditionalAssemblies ??= new[] { Assembly.GetEntryAssembly()! };
 
@@ -890,6 +903,11 @@ public async Task DragItemCallback(int originIndex, int currentIndex)
 
     private string? GetIdByTabItem(TabItem item) => (ShowFullScreen && item.ShowFullScreen) ? ComponentIdGenerator.Generate(item) : null;
 
+    private Task OnRefreshAsync()
+    {
+        return Task.CompletedTask;
+    }
+
     /// <summary>
     /// <inheritdoc/>
     /// </summary>

src/BootstrapBlazor/Components/Tab/Tab.razor.scss

@@ -669,6 +669,10 @@
             display: none;
             align-items: center;
             height: 100%;
+
+            .tabs-nav-toolbar-button {
+                cursor: pointer;
+            }
         }
     }
 }

src/BootstrapBlazor/Components/Tab/TabToolbarRefreshButton.razor

@@ -0,0 +1,3 @@
+@namespace BootstrapBlazor.Components
+
+<i class="@Icon" @onclick="OnClick"></i>

src/BootstrapBlazor/Components/Tab/TabToolbarRefreshButton.razor.cs

@@ -0,0 +1,32 @@
+// Licensed to the .NET Foundation under one or more agreements.
+// The .NET Foundation licenses this file to you under the Apache 2.0 License
+// See the LICENSE file in the project root for more information.
+// Maintainer: Argo Zhang([email protected]) Website: https://www.blazor.zone
+
+namespace BootstrapBlazor.Components;
+
+/// <summary>
+/// TabToolbarRefreshButton component
+/// </summary>
+public partial class TabToolbarRefreshButton
+{
+    /// <summary>
+    /// Gets or sets the button icon string. Default is null.
+    /// </summary>
+    [Parameter]
+    public string? Icon { get; set; }
+
+    /// <summary>
+    /// Gets or sets the button click event handler. Default is null.
+    /// </summary>
+    [Parameter]
+    public Func<Task>? OnClickAsync { get; set; }
+
+    private async Task OnClick()
+    {
+        if (OnClickAsync != null)
+        {
+            await OnClickAsync();
+        }
+    }
+}

src/BootstrapBlazor/Enums/ComponentIcons.cs

@@ -705,6 +705,11 @@ public enum ComponentIcons
     /// </summary>
     TabCloseIcon,
 
+    /// <summary>
+    /// Tab 组件 RefreshToolbarButtonIcon 属性图标
+    /// </summary>
+    TabRefreshButtonIcon,
+
     /// <summary>
     /// Timer 组件 Icon 属性图标
     /// </summary>

src/BootstrapBlazor/Icons/BootstrapIcons.cs

@@ -136,6 +136,7 @@ internal static class BootstrapIcons
         { ComponentIcons.TabNextIcon, "bi bi-chevron-right" },
         { ComponentIcons.TabDropdownIcon, "bi bi-chevron-down" },
         { ComponentIcons.TabCloseIcon, "bi bi-x" },
+        { ComponentIcons.TabRefreshButtonIcon, "bi bi-arrow-clockwise" },
 
         { ComponentIcons.TableColumnToolboxIcon, "bi bi-gear" },
 

src/BootstrapBlazor/Icons/FontAwesomeIcons.cs

@@ -134,6 +134,7 @@ internal static class FontAwesomeIcons
         { ComponentIcons.TabNextIcon, "fa-solid fa-chevron-right" },
         { ComponentIcons.TabDropdownIcon, "fa-solid fa-chevron-down" },
         { ComponentIcons.TabCloseIcon, "fa-solid fa-xmark" },
+        { ComponentIcons.TabRefreshButtonIcon, "fa-solid fa-arrows-rotate" },
 
         { ComponentIcons.TableColumnToolboxIcon, "fa-solid fa-gear" },
 

src/BootstrapBlazor/Icons/MaterialDesignIcons.cs

@@ -136,6 +136,7 @@ internal static class MaterialDesignIcons
         { ComponentIcons.TabNextIcon, "mdi mdi-chevron-right" },
         { ComponentIcons.TabDropdownIcon, "mdi mdi-chevron-down" },
         { ComponentIcons.TabCloseIcon, "mdi mdi-close" },
+        { ComponentIcons.TabRefreshButtonIcon, "mdi mdi-refresh" },
 
         { ComponentIcons.TableColumnToolboxIcon, "mdi mdi-cog" },