feat(Message): support OnDismiss event callback (#2902)

* doc: 更新文档注释

* refactor: 使用主构造函数

* feat: 更新 OnDismiss 触发逻辑

* refactor: 移除可为空标记

* refactor: 更新示例

* test: 更新单元测试

* test: 更新单元测试

* chore: bump version 8.2.2
This commit is contained in:
Argo Zhang
2024-02-05 16:44:12 +08:00
committed by GitHub
parent 3c95910037
commit 4bd3bcc8f0
8 changed files with 46 additions and 46 deletions

View File

@@ -40,6 +40,11 @@ public sealed partial class Messages
Content = "This is a reminder message",
Icon = "fa-solid fa-circle-info",
ShowDismiss = true,
IsAutoHide = false,
OnDismiss = () =>
{
return Task.CompletedTask;
}
});
}

View File

@@ -1,7 +1,7 @@
<Project Sdk="Microsoft.NET.Sdk.Razor">
<PropertyGroup>
<Version>8.2.2-beta02</Version>
<Version>8.2.2</Version>
</PropertyGroup>
<ItemGroup Condition="'$(TargetFramework)' == 'net5.0'">

View File

@@ -15,7 +15,7 @@
<span>@item.Content</span>
@if (item.ShowDismiss)
{
<button type="button" class="btn-close" aria-label="Close" @onclick="() => OnDismiss(item)"></button>
<button type="button" class="btn-close" aria-label="close"></button>
}
</div>
}
@@ -33,7 +33,7 @@
<span>@item.Content</span>
@if (item.ShowDismiss)
{
<button type="button" class="btn-close" aria-label="Close" @onclick="() => OnDismiss(item)"></button>
<button type="button" class="btn-close" aria-label="close"></button>
}
</div>
}

View File

@@ -65,7 +65,7 @@ public partial class Message
.AddClass("alert-bar", option.ShowBar)
.Build();
private string? GetItemId(MessageOption option) => $"{Id}_{option.GetHashCode()}";
private string GetItemId(MessageOption option) => $"{Id}_{option.GetHashCode()}";
private string? _msgId;
@@ -103,7 +103,7 @@ public partial class Message
}
/// <summary>
/// 清除 Message 方法
/// 清除 Message 方法 由 JSInvoke 触发
/// </summary>
[JSInvokable]
public Task Clear()
@@ -113,9 +113,15 @@ public partial class Message
return Task.CompletedTask;
}
private static async Task OnDismiss(MessageOption option)
/// <summary>
/// OnDismiss 回调方法 由 JSInvoke 触发
/// </summary>
/// <param name="id"></param>
[JSInvokable]
public async Task Dismiss(string id)
{
if (option.OnDismiss != null)
var option = _messages.Find(i => GetItemId(i) == id);
if (option is { OnDismiss: not null })
{
await option.OnDismiss();
}

View File

@@ -58,6 +58,12 @@ export function show(id, msgId) {
e.preventDefault();
e.stopPropagation();
// trigger on-dismiss event callback
const alert = e.delegateTarget.closest('.alert');
if(alert) {
const alertId = alert.getAttribute('id');
msg.invoke.invokeMethodAsync('Dismiss', alertId);
}
close();
});
}

View File

@@ -7,18 +7,10 @@ namespace BootstrapBlazor.Components;
/// <summary>
///
/// </summary>
public class MessageService : BootstrapServiceBase<MessageOption>
/// <param name="option"></param>
public class MessageService(IOptionsMonitor<BootstrapBlazorOptions> option) : BootstrapServiceBase<MessageOption>
{
private BootstrapBlazorOptions Options { get; }
/// <summary>
/// 构造方法
/// </summary>
/// <param name="option"></param>
public MessageService(IOptionsMonitor<BootstrapBlazorOptions> option)
{
Options = option.CurrentValue;
}
private BootstrapBlazorOptions Options { get; } = option.CurrentValue;
/// <summary>
/// Show 方法

View File

@@ -696,7 +696,7 @@ public partial class Table<TItem>
public FullScreenSize EditDialogFullScreenSize { get; set; }
/// <summary>
/// 获得/设置 编辑框是否显示最大化按钮 默认 true 显示
/// 获得/设置 编辑框是否显示最大化按钮 默认 true 显示
/// </summary>
[Parameter]
public bool EditDialogShowMaximizeButton { get; set; } = true;

View File

@@ -10,7 +10,7 @@ namespace UnitTest.Components;
public class MessageTest : MessageTestBase
{
[Fact]
public void Message_Ok()
public async Task Message_Ok()
{
var dismiss = false;
var service = Context.Services.GetRequiredService<MessageService>();
@@ -43,7 +43,7 @@ public class MessageTest : MessageTestBase
});
Assert.NotNull(cut.Instance.MessageContainer);
cut.InvokeAsync(() =>
await cut.InvokeAsync(() =>
{
var btn = cut.Find("button");
btn.Click();
@@ -51,18 +51,15 @@ public class MessageTest : MessageTestBase
Assert.Contains("data-bb-autohide", cut.Markup);
Assert.Contains("data-bb-delay=\"4000\"", cut.Markup);
cut.InvokeAsync(() =>
{
var btnClose = cut.Find(".btn-close");
btnClose.Click();
});
var alert = cut.Find(".alert");
Assert.NotNull(alert);
Assert.NotNull(alert.Id);
var message = cut.FindComponent<Message>();
await message.Instance.Dismiss(alert.Id);
Assert.True(dismiss);
cut.InvokeAsync(() =>
{
var message = cut.FindComponent<Message>();
message.Instance.Clear();
});
await cut.InvokeAsync(() => message.Instance.Clear());
}
[Fact]
@@ -78,33 +75,27 @@ public class MessageTest : MessageTestBase
}
[Fact]
public void Placement_Ok()
public async Task Placement_Ok()
{
var dismiss = false;
var service = Context.Services.GetRequiredService<MessageService>();
var cut = Context.RenderComponent<Message>(pb =>
{
pb.Add(a => a.Placement, Placement.Bottom);
});
cut.InvokeAsync(() => service.Show(new MessageOption()
await cut.InvokeAsync(() => service.Show(new MessageOption()
{
Content = "Test Content",
IsAutoHide = false,
ShowDismiss = true,
Icon = "fa-solid fa-font-awesome",
OnDismiss = () =>
{
dismiss = true;
return Task.CompletedTask;
}
Icon = "fa-solid fa-font-awesome"
}, cut.Instance));
Assert.DoesNotContain("data-bb-autohide", cut.Markup);
cut.InvokeAsync(() =>
{
var btnClose = cut.Find(".btn-close");
btnClose.Click();
});
Assert.True(dismiss);
var alert = cut.Find(".alert");
Assert.NotNull(alert);
Assert.NotNull(alert.Id);
await cut.Instance.Dismiss(alert.Id);
await cut.Instance.Dismiss("test_id");
}
}