From 47d9795bf59cfe4423f820a1699004fec569648d Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Fri, 16 May 2025 21:45:02 +0800 Subject: [PATCH 1/5] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E7=A4=BA=E4=BE=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Samples/Messages.razor | 4 ++++ .../Components/Samples/Messages.razor.cs | 24 +++++++++++++++++++ src/BootstrapBlazor.Server/Locales/en-US.json | 6 +++++ src/BootstrapBlazor.Server/Locales/zh-CN.json | 6 +++++ 4 files changed, 40 insertions(+) diff --git a/src/BootstrapBlazor.Server/Components/Samples/Messages.razor b/src/BootstrapBlazor.Server/Components/Samples/Messages.razor index fd42f331a75..08226ed497a 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Messages.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Messages.razor @@ -24,6 +24,10 @@ private MessageService? MessageService { get; set; } + + + + diff --git a/src/BootstrapBlazor.Server/Components/Samples/Messages.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/Messages.razor.cs index 85fd810476e..6b771017d0a 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Messages.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/Messages.razor.cs @@ -16,6 +16,8 @@ public sealed partial class Messages [NotNull] private Message? Message1 { get; set; } + private readonly MessageOption _option = new(); + private async Task ShowMessage() { Message.SetPlacement(Placement.Top); @@ -25,6 +27,28 @@ await MessageService.Show(new MessageOption() }); } + private async Task ShowAsyncMessage() + { + _option.ForceDelay = true; + _option.IsAutoHide = false; + _option.Delay = 3000; + _option.Content = Localizer["MessagesAsyncDemoStep1Text"]; + _option.Color = Color.Info; + await MessageService.Show(_option); + + await Task.Delay(3000); + _option.Content = Localizer["MessagesAsyncDemoStep2Text"]; + _option.IsAutoHide = true; + _option.Color = Color.Info; + await MessageService.Show(_option); + + await Task.Delay(2000); + _option.Content = Localizer["MessagesAsyncDemoStep3Text"]; + _option.Color = Color.Success; + + await MessageService.Show(_option); + } + private async Task ShowIconMessage() { await MessageService.Show(new MessageOption() diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index e7556b4a69a..0999f0b32d5 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -465,6 +465,12 @@ "MessagesNormalTitle": "Basic usage", "MessagesNormalIntro": "Appears from the top and automatically disappears after 4 seconds", "MessagesMessagePrompt": "Open the message prompt", + "MessagesAsyncTitle": "Async notification", + "MessagesAsyncIntro": "By setting the button's IsAsync parameter, use the same MessageOption to update the pop-up window information for different steps", + "MessagesAsyncDemoStep1Text": "Packing documents, please wait...", + "MessagesAsyncDemoStep2Text": "Packaging completed, downloading...", + "MessagesAsyncDemoStep3Text": "Download completed, close the window automatically", + "MessagesAsyncText": "AsyncNotify", "MessagesIconTitle": "message box with icon", "MessagesIconIntro": "Change the small icon on the left side of the message box by setting the Icon property of MessageOption", "MessagesCloseButtonTitle": "message box with close button", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index 800e289d3c3..c6c66cceaca 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -465,6 +465,12 @@ "MessagesNormalTitle": "基础用法", "MessagesNormalIntro": "从顶部出现，4 秒后自动消失", "MessagesMessagePrompt": "打开消息提示", + "MessagesAsyncTitle": "线程阻塞通知", + "MessagesAsyncIntro": "通过设置按钮 IsAsync 参数，使用同一个 MessageOption 更新弹窗信息提示不同步骤时的信息", + "MessagesAsyncDemoStep1Text": "正在打包文档，请稍等...", + "MessagesAsyncDemoStep2Text": "打包完成，正在下载...", + "MessagesAsyncDemoStep3Text": "下载完成，自动关窗", + "MessagesAsyncText": "线程阻塞通知示例", "MessagesIconTitle": "带图标的消息框", "MessagesIconIntro": "通过设置 MessageOption 的 Icon 属性，更改消息框左侧小图标", "MessagesCloseButtonTitle": "带关闭按钮的消息框", From 584e942cb97094960a78e8d13c750908a63eafd5 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Fri, 16 May 2025 21:45:11 +0800 Subject: [PATCH 2/5] =?UTF-8?q?feat:=20=E6=94=AF=E6=8C=81=E4=BF=9D?= =?UTF-8?q?=E6=8C=81=E7=9B=B8=E5=90=8C=E6=B6=88=E6=81=AF?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/Message/Message.razor.cs | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor/Components/Message/Message.razor.cs b/src/BootstrapBlazor/Components/Message/Message.razor.cs index e5d8ab983c8..e70cfd1667e 100644 --- a/src/BootstrapBlazor/Components/Message/Message.razor.cs +++ b/src/BootstrapBlazor/Components/Message/Message.razor.cs @@ -102,8 +102,11 @@ private async Task Show(MessageOption option) _messages.Clear(); } - _messages.Add(option); - _msgId = GetItemId(option); + if (!_messages.Contains(option)) + { + _messages.Add(option); + _msgId = GetItemId(option); + } await InvokeAsync(StateHasChanged); } From 997e39f4ba1faff35b0703a57b41dbc772b974fa Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Fri, 16 May 2025 21:47:07 +0800 Subject: [PATCH 3/5] =?UTF-8?q?doc:=20=E6=9B=B4=E6=96=B0=E6=9C=AC=E5=9C=B0?= =?UTF-8?q?=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor.Server/Locales/en-US.json | 2 +- src/BootstrapBlazor.Server/Locales/zh-CN.json | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 0999f0b32d5..176c29f09f3 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -125,7 +125,7 @@ "ToastsPreventIntro": "By setting PreventDuplicates=\"true\" to repeatedly click the button below, only one pop-up window will appear", "ToastsPreventText": "Prevent Duplicates", "ToastsAsyncTitle": "Async notification", - "ToastsAsyncIntro": "By setting IsAsync, the pop-up window is displayed, the thread is blocked, and after clicking the close button, the subsequent code continues to execute", + "ToastsAsyncIntro": "By setting the button's IsAsync parameter, use the same ToastOption to update the pop-up window information for different steps", "ToastsAsyncDemoTitle": "Async notification", "ToastsAsyncDemoStep1Text": "Packing documents, please wait...", "ToastsAsyncDemoStep2Text": "Packaging completed, downloading...", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index c6c66cceaca..558af50f46e 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -125,7 +125,7 @@ "ToastsPreventIntro": "通过设置 PreventDuplicates=\"true\" 重复点击下方按钮时，仅弹窗一次", "ToastsPreventText": "阻止重复", "ToastsAsyncTitle": "线程阻塞通知", - "ToastsAsyncIntro": "通过设置 IsAsync 弹窗显示后，线程阻塞，点击关闭按钮后，继续执行后续代码", + "ToastsAsyncIntro": "通过设置按钮 IsAsync 参数，使用同一个 ToastOption 更新弹窗信息提示不同步骤时的信息", "ToastsAsyncDemoTitle": "异步通知", "ToastsAsyncDemoStep1Text": "正在打包文档，请稍等...", "ToastsAsyncDemoStep2Text": "打包完成，正在下载...", From 6907d76c77702faf89dc4846023b3ed742ec041c Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Fri, 16 May 2025 22:02:44 +0800 Subject: [PATCH 4/5] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E6=80=A7?= =?UTF-8?q?=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Components/Toast/Toast.razor.js | 37 ++++++++++--------- 1 file changed, 20 insertions(+), 17 deletions(-) diff --git a/src/BootstrapBlazor/Components/Toast/Toast.razor.js b/src/BootstrapBlazor/Components/Toast/Toast.razor.js index 4640ff84110..dfc3e793a00 100644 --- a/src/BootstrapBlazor/Components/Toast/Toast.razor.js +++ b/src/BootstrapBlazor/Components/Toast/Toast.razor.js @@ -3,6 +3,7 @@ import EventHandler from "../../modules/event-handler.js" export function init(id, invoke, callback) { const el = document.getElementById(id) + const progressElement = el.querySelector('.toast-progress') const toast = { element: el, invoke, @@ -10,43 +11,43 @@ export function init(id, invoke, callback) { toast: new bootstrap.Toast(el), showProgress: () => { return toast.toast._config.autohide - } + }, + progressElement } Data.set(id, toast); if (toast.showProgress()) { - toast.progressElement = toast.element.querySelector('.toast-progress') const delay = toast.toast._config.delay / 1000 - toast.progressElement.style.transition = `width linear ${delay}s` + progressElement.style.transition = `width linear ${delay}s` } - EventHandler.on(toast.element, 'shown.bs.toast', () => { + EventHandler.on(el, 'shown.bs.toast', () => { if (toast.showProgress()) { - toast.progressElement.style.width = '100%' + progressElement.style.width = '100%' } }) - EventHandler.on(toast.element, 'hidden.bs.toast', () => { - toast.invoke.invokeMethodAsync(toast.callback) + EventHandler.on(el, 'hidden.bs.toast', () => { + invoke.invokeMethodAsync(toast.callback) }) - toast.toast.show() + EventHandler.on(progressElement, 'transitionend', e => { + toast.toast.hide(); + }); + + toast.toast.show(); } export function update(id) { const t = Data.get(id); - const { element, toast } = t; + const { element, toast, progressElement } = t; const autoHide = element.getAttribute('data-bs-autohide') !== 'false'; - if(autoHide) { + if (autoHide) { const delay = parseInt(element.getAttribute('data-bs-delay')); - const progressElement = element.querySelector('.toast-progress'); toast._config.autohide = autoHide; toast._config.delay = delay; progressElement.style.width = '100%'; progressElement.style.transition = `width linear ${delay / 1000}s`; - EventHandler.on(progressElement, 'transitionend', e => { - toast.hide(); - }); } } @@ -54,10 +55,12 @@ export function dispose(id) { const toast = Data.get(id) Data.remove(id) - EventHandler.off(toast.element, 'shown.bs.toast') - EventHandler.off(toast.element, 'hidden.bs.toast') + const { element, progressElement } = toast; + EventHandler.off(element, 'shown.bs.toast'); + EventHandler.off(element, 'hidden.bs.toast'); + EventHandler.off(progressElement, 'transitionend'); if (toast.toast) { - toast.toast.dispose() + toast.toast.dispose(); } } From 54208fb5e263550abbd0ab7708c56a35f0fb2146 Mon Sep 17 00:00:00 2001 From: Argo Zhang Date: Fri, 16 May 2025 22:06:10 +0800 Subject: [PATCH 5/5] =?UTF-8?q?refactor:=20=E5=AE=8C=E5=96=84=E9=80=BB?= =?UTF-8?q?=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/BootstrapBlazor/Components/Toast/Toast.razor.js | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/BootstrapBlazor/Components/Toast/Toast.razor.js b/src/BootstrapBlazor/Components/Toast/Toast.razor.js index dfc3e793a00..c3f1a8d3f24 100644 --- a/src/BootstrapBlazor/Components/Toast/Toast.razor.js +++ b/src/BootstrapBlazor/Components/Toast/Toast.razor.js @@ -49,6 +49,11 @@ export function update(id) { progressElement.style.width = '100%'; progressElement.style.transition = `width linear ${delay / 1000}s`; } + else { + toast._config.autohide = false; + progressElement.style.removeProperty('width'); + progressElement.style.removeProperty('transition'); + } } export function dispose(id) {