feat(SelectTable): add ShowToolbar parameter

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>10.3.2</Version>
+    <Version>10.3.3-beta01</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/Empty/Empty.razor

@@ -1,10 +1,10 @@
-@namespace BootstrapBlazor.Components
+@namespace BootstrapBlazor.Components
 @inherits BootstrapComponentBase
 
 <div @attributes="AdditionalAttributes" class="@ClassString">
     @if (Template != null)
     {
-        <div class="empty-telemplate">
+        <div class="empty-template">
             @Template
         </div>
     }

src/BootstrapBlazor/Components/Empty/Empty.razor.scss

@@ -1,4 +1,4 @@
-@use "../../wwwroot/scss/variables" as *;
+@use "../../wwwroot/scss/variables" as *;
 
 .empty {
     --bb-empty-image-margin: #{$bb-empty-image-margin};
@@ -9,7 +9,7 @@
         margin: var(--bb-empty-image-margin);
     }
 
-    .empty-telemplate {
+    .empty-template {
         margin: var(--bb-empty-template-margin);
     }
 }

src/BootstrapBlazor/Components/Select/SelectTable.razor

@@ -80,6 +80,9 @@
                    IsPagination="IsPagination" PageItemsSource="PageItemsSource" ShowGotoNavigator="false" MaxPageLinkCount="3"
                    OnClickRowCallback="OnClickRowCallback" OnQueryAsync="OnQueryAsync"
                    IsMultipleSelect="IsMultipleSelect" @bind-SelectedRows="SelectedItems"
+                   ShowToolbar="ShowToolbar" ToolbarTemplate="ToolbarTemplate"
+                   TableExtensionToolbarTemplate="TableExtensionToolbarTemplate"
+                   ShowDefaultButtons="false" ShowRefresh="false"
                    ShowEmpty="ShowEmpty" EmptyTemplate="EmptyTemplate"></Table>
         </div>
     </RenderTemplate>

src/BootstrapBlazor/Components/Select/SelectTable.razor.cs

@@ -88,8 +88,8 @@ namespace BootstrapBlazor.Components;
     public bool ShowAppendArrow { get; set; } = true;
 
     /// <summary>
-    /// <para lang="zh">获得/设置 弹窗表格最小宽度 默认为 null 未设置使用样式中的默认值</para>
-    /// <para lang="en">Gets or sets Dropdown Table Min Width. Default null (use style default)</para>
+    /// <para lang="zh">获得/设置 弹窗表格最小宽度 默认为 null 未设置使用样式中的默认值 602px</para>
+    /// <para lang="en">Gets or sets Dropdown Table Min Width. Default null (use style default 602px)</para>
     /// </summary>
     [Parameter]
     public int? TableMinWidth { get; set; }
@@ -139,6 +139,27 @@ namespace BootstrapBlazor.Components;
     [Parameter]
     public string? MultiSelectedItemMaxWidth { get; set; }
 
+    /// <summary>
+    /// <para lang="zh">获得/设置 是否显示工具栏 默认 false 不显示</para>
+    /// <para lang="en">Gets or sets Whether to show toolbar. Default false</para>
+    /// </summary>
+    [Parameter]
+    public bool ShowToolbar { get; set; }
+
+    /// <summary>
+    /// <para lang="zh">获得/设置 表格 Toolbar 工具栏模板</para>
+    /// <para lang="en">Gets or sets the table toolbar template, content appears center of toolbar</para>
+    /// </summary>
+    [Parameter]
+    public RenderFragment? ToolbarTemplate { get; set; }
+
+    /// <summary>
+    /// <para lang="zh">获得/设置 表格 Toolbar 工具栏右侧按钮模板，模板中内容出现在默认按钮后面</para>
+    /// <para lang="en">Gets or sets the table toolbar right-side button template, content appears after the default buttons</para>
+    /// </summary>
+    [Parameter]
+    public RenderFragment? TableExtensionToolbarTemplate { get; set; }
+
     /// <summary>
     /// <para lang="zh">获得/设置 IIconTheme 服务实例</para>
     /// <para lang="en">Gets or sets IIconTheme Service Instance</para>

src/BootstrapBlazor/Components/Select/SelectTable.razor.js

@@ -10,7 +10,7 @@ export function init(id, invoke) {
     }
 
     const setWidth = () => {
-        const minWidth = parseFloat(el.dataset.bbMinWidth || '580');
+        const minWidth = parseFloat(el.dataset.bbMinWidth || '602');
         let width = getWidth(el);
         if (width < minWidth) {
             width = minWidth;

test/UnitTest/Components/SelectTableTest.cs

@@ -603,7 +603,7 @@ public void EmptyTemplate_OK()
             });
         });
 
-        cut.Contains("<div class=\"empty\"><div class=\"empty-telemplate\">empty-template</div></div>");
+        cut.Contains("<div class=\"empty\"><div class=\"empty-template\">empty-template</div></div>");
     }
 
     [Fact]
@@ -686,6 +686,59 @@ public async Task IsMultipleSelect_Ok()
         cut.Contains("multi-select-item-ph");
     }
 
+    [Fact]
+    public void ToolbarTemplate_Ok()
+    {
+        var localizer = Context.Services.GetRequiredService<IStringLocalizer<Foo>>();
+        var items = Foo.GenerateFoo(localizer);
+        var cut = Context.Render<BootstrapBlazorRoot>(pb =>
+        {
+            pb.AddChildContent<SelectTable<Foo>>(pb =>
+            {
+                pb.Add(a => a.OnQueryAsync, options =>
+                {
+                    return Task.FromResult(new QueryData<Foo>()
+                    {
+                        Items = items,
+                        IsAdvanceSearch = true,
+                        IsFiltered = true,
+                        IsSearch = true,
+                        IsSorted = true
+                    });
+                });
+                pb.Add(a => a.GetTextCallback, foo => foo.Name);
+                pb.Add(a => a.TableColumns, foo => builder =>
+                {
+                    builder.OpenComponent<TableColumn<Foo, string>>(0);
+                    builder.AddAttribute(1, "Field", "Name");
+                    builder.AddAttribute(2, "FieldExpression", Utility.GenerateValueExpression(foo, "Name", typeof(string)));
+                    builder.AddAttribute(3, "Searchable", true);
+                    builder.CloseComponent();
+                });
+                pb.Add(a => a.ShowToolbar, true);
+                pb.Add(a => a.ToolbarTemplate, builder =>
+                {
+                    builder.AddContent(0, "toolbar-template");
+                });
+                pb.Add(a => a.TableExtensionToolbarTemplate, builder =>
+                {
+                    builder.AddContent(0, "toolbar-extension-template");
+                });
+            });
+        });
+
+        cut.Contains("toolbar-template");
+        cut.Contains("toolbar-extension-template");
+
+        var table = cut.FindComponent<SelectTable<Foo>>();
+        table.Render(pb =>
+        {
+            pb.Add(a => a.ShowToolbar, false);
+        });
+        cut.DoesNotContain("toolbar-template");
+        cut.DoesNotContain("toolbar-extension-template");
+    }
+
     private static Task<QueryData<Foo>> OnFilterQueryAsync(QueryPageOptions options, IEnumerable<Foo> _filterItems)
     {
         _filterItems = _filterItems.Where(options.ToFilterFunc<Foo>());