diff --git a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor index ee784ea03f7..4b1c93add90 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor @@ -496,6 +496,30 @@ private void Navigation() + + + + +
@Localizer["TabItem1Content"]
+ + +
@Localizer["TabItem2Content"]
+ + +
@Localizer["TabItem3Content"]
+ + +
@Localizer["TabItem4Content"]
+ + + + + + + + + + diff --git a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs index 451677d0dc0..77eb539f128 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/Tabs.razor.cs @@ -171,6 +171,33 @@ private Task OnSetTitle(string text) return Task.CompletedTask; } + [NotNull] + private Tab? _tab = null; + + private async Task OnClose(ContextMenuItem item, object? context) + { + if (context is TabItem tabItem) + { + await _tab.RemoveTab(tabItem); + } + } + + private Task OnCloseOther(ContextMenuItem item, object? context) + { + if (context is TabItem tabItem) + { + _tab.ActiveTab(tabItem); + } + _tab.CloseOtherTabs(); + return Task.CompletedTask; + } + + private Task OnCloseAll(ContextMenuItem item, object? context) + { + _tab.CloseAllTabs(); + return Task.CompletedTask; + } + /// /// 获得属性方法 /// diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 4704f1fb0bd..20eb4918929 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -2132,7 +2132,12 @@ "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.", - "AttributeOnToolbarRefreshCallback": "Click the toolbar refresh button callback method" + "AttributeOnToolbarRefreshCallback": "Click the toolbar refresh button callback method", + "ContextClose": "Close", + "ContextCloseOther": "Close Other Tabs", + "ContextCloseAll": "Close All Tabs", + "TabsContextMenuTitle": "TabItem Context Menu", + "TabsContextMenuIntro": "Use the built-in ContextMenuZone component to pop up a custom context menu when you right-click a tab item" }, "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 6afbbb41e80..b30f29bf7ac 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -2132,7 +2132,12 @@ "AttributeRefreshToolbarButtonIcon": "工具栏刷新按钮图标", "AttributeFullscreenToolbarButtonIcon": "工具栏全屏按钮图标", "TabsToolbarDesc": "点击按钮计数器数值增加后，点击工具栏的 刷新 按钮计数器清零", - "AttributeOnToolbarRefreshCallback": "点击工具栏刷新按钮回调方法" + "AttributeOnToolbarRefreshCallback": "点击工具栏刷新按钮回调方法", + "ContextClose": "关闭", + "ContextCloseOther": "关闭其他", + "ContextCloseAll": "关闭全部", + "TabsContextMenuTitle": "右键菜单", + "TabsContextMenuIntro": "通过内置 ContextMenuZone 组件，点击标签页右键时弹窗自定义右键菜单" }, "BootstrapBlazor.Server.Components.Components.DemoTabItem": { "Info": "点击下方按钮，本 TabItem 标题更改为当前分钟与秒", diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj index e8410287ff9..c7a6b4e7fe6 100644 --- a/src/BootstrapBlazor/BootstrapBlazor.csproj +++ b/src/BootstrapBlazor/BootstrapBlazor.csproj @@ -1,7 +1,7 @@  - 9.4.11 + 9.5.0-beta12 diff --git a/src/BootstrapBlazor/Components/Tab/Tab.razor b/src/BootstrapBlazor/Components/Tab/Tab.razor index 37bcab00101..8a67edeae58 100644 --- a/src/BootstrapBlazor/Components/Tab/Tab.razor +++ b/src/BootstrapBlazor/Components/Tab/Tab.razor @@ -166,7 +166,9 @@ else RenderFragment RenderHeaderItem(TabItem item) => @
- + @RenderHeaderItemContent(item) @if (TabStyle == TabStyle.Chrome) diff --git a/src/BootstrapBlazor/Components/Tab/Tab.razor.cs b/src/BootstrapBlazor/Components/Tab/Tab.razor.cs index 84a50c17829..33aebffd200 100644 --- a/src/BootstrapBlazor/Components/Tab/Tab.razor.cs +++ b/src/BootstrapBlazor/Components/Tab/Tab.razor.cs @@ -3,6 +3,7 @@ // See the LICENSE file in the project root for more information. // Maintainer: Argo Zhang(argo@live.ca) Website: https://www.blazor.zone +using Microsoft.AspNetCore.Components.Web; using Microsoft.Extensions.Localization; using System.Collections.Concurrent; using System.Reflection; @@ -370,6 +371,9 @@ public partial class Tab : IHandlerException [Inject, NotNull] private DialogService? DialogService { get; set; } + [CascadingParameter] + private ContextMenuZone? ContextMenuZone { get; set; } + private ConcurrentDictionary LazyTabCache { get; } = new(); private bool HandlerNavigation { get; set; } @@ -382,6 +386,8 @@ public partial class Tab : IHandlerException private readonly ConcurrentDictionary _cache = []; + private bool IsPreventDefault => ContextMenuZone != null; + /// /// /// @@ -965,4 +971,12 @@ protected override async ValueTask DisposeAsync(bool disposing) ErrorLogger?.UnRegister(this); } } + + private async Task OnContextMenu(MouseEventArgs e, TabItem item) + { + if (ContextMenuZone != null) + { + await ContextMenuZone.OnContextMenu(e, item); + } + } } diff --git a/test/UnitTest/Components/TabTest.cs b/test/UnitTest/Components/TabTest.cs index 9f5152d4121..f32d7dbe880 100644 --- a/test/UnitTest/Components/TabTest.cs +++ b/test/UnitTest/Components/TabTest.cs @@ -7,6 +7,7 @@ using Bunit.TestDoubles; using Microsoft.AspNetCore.Components.Rendering; using System.Reflection; +using System.Threading.Tasks; using UnitTest.Misc; namespace UnitTest.Components; @@ -25,6 +26,49 @@ protected override void ConfigureServices(IServiceCollection services) }); } + [Fact] + public async Task ContextMenu_Ok() + { + var clicked = false; + var cut = Context.RenderComponent(pb => + { + pb.AddChildContent(pb => + { + pb.AddChildContent(pb => + { + pb.Add(a => a.Text, "Tab1"); + pb.Add(a => a.Url, "/Index"); + pb.Add(a => a.Closable, true); + pb.Add(a => a.Icon, "fa-solid fa-font-awesome"); + pb.Add(a => a.ChildContent, "Tab1-Content"); + }); + }); + pb.AddChildContent(pb => + { + pb.AddChildContent(pb => + { + pb.Add(a => a.Text, "test-close"); + pb.Add(a => a.OnClick, (context, item) => + { + clicked = true; + if (item is TabItem tabItem) + { + + } + return Task.CompletedTask; + }); + }); + }); + }); + + var menuItem = cut.Find(".tabs-item"); + await cut.InvokeAsync(() => menuItem.ContextMenu()); + + var item = cut.Find(".dropdown-menu .dropdown-item"); + await cut.InvokeAsync(() => item.Click()); + Assert.True(clicked); + } + [Fact] public void ToolbarTemplate_Ok() {