From cf30213e1c63fa6901581690c25883a842fe13ca Mon Sep 17 00:00:00 2001
From: Argo Zhang <argo@live.ca>
Date: Wed, 23 Oct 2024 21:58:21 -0700
Subject: [PATCH] feat(DateTimePicker): add OnBlurAsync parameter (#4529)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* feat: 增加 OnBlurAsync 参数

* test: 更新单元测试
---
 .../DateTimePicker/DateTimePicker.razor         |  2 +-
 .../DateTimePicker/DateTimePicker.razor.cs      | 17 +++++++++++++++++
 test/UnitTest/Components/DateTimePickerTest.cs  | 17 +++++++++++++++++
 3 files changed, 35 insertions(+), 1 deletion(-)

diff --git a/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor b/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor
index 81b19bc12cf..04317f29135 100644
--- a/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor
+++ b/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor
@@ -8,7 +8,7 @@
     <BootstrapLabel required="@Required" for="@Id" ShowLabelTooltip="ShowLabelTooltip" Value="@DisplayText" />
 }
 <div @attributes="@AdditionalAttributes" tabindex="@TabIndexString" id="@Id" class="@ClassString" data-bb-dropdown=".picker-panel" data-bb-dismiss=".picker-panel-link-btn">
-    <input readonly="@ReadonlyString" class="@InputClassName" @bind="@CurrentValueAsString" placeholder="@PlaceholderString" disabled="@Disabled" data-bs-toggle="@Constants.DropdownToggleString" data-bs-placement="@PlacementString" data-bs-custom-class="@CustomClassString" />
+    <input readonly="@ReadonlyString" class="@InputClassName" @bind="@CurrentValueAsString" placeholder="@PlaceholderString" disabled="@Disabled" data-bs-toggle="@Constants.DropdownToggleString" data-bs-placement="@PlacementString" data-bs-custom-class="@CustomClassString" @onblur="OnBlur" />
     @if (ShowIcon)
     {
         <i class="@DateTimePickerIconClassString"></i>
diff --git a/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor.cs b/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor.cs
index 6039190deb8..05afb3ef97b 100644
--- a/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor.cs
+++ b/src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor.cs
@@ -228,6 +228,12 @@ public string? Format
     [Parameter]
     public bool DisplayDisabledDayAsEmpty { get; set; }
 
+    /// <summary>
+    /// 获得/设置 失去焦点回调方法 默认 null
+    /// </summary>
+    [Parameter]
+    public Func<TValue, Task>? OnBlurAsync { get; set; }
+
     [Inject]
     [NotNull]
     private IStringLocalizer<DateTimePicker<DateTime>>? Localizer { get; set; }
@@ -437,4 +443,15 @@ protected override bool TryParseValueFromString(string value, [MaybeNullWhen(fal
     }
 
     private string? ReadonlyString => IsEditable ? null : "readonly";
+
+    /// <summary>
+    /// <inheritdoc/>
+    /// </summary>
+    protected virtual async Task OnBlur()
+    {
+        if (OnBlurAsync != null)
+        {
+            await OnBlurAsync(Value);
+        }
+    }
 }
diff --git a/test/UnitTest/Components/DateTimePickerTest.cs b/test/UnitTest/Components/DateTimePickerTest.cs
index 842a8b4089c..a2e5df0a3b2 100644
--- a/test/UnitTest/Components/DateTimePickerTest.cs
+++ b/test/UnitTest/Components/DateTimePickerTest.cs
@@ -1239,6 +1239,23 @@ public async Task OnGetDisabledDaysCallback_Ok()
         cut.Instance.ClearDisabledDays();
     }
 
+    [Fact]
+    public async Task OnBlurAsync_Ok()
+    {
+        var blur = false;
+        var cut = Context.RenderComponent<DateTimePicker<DateTime>>(builder =>
+        {
+            builder.Add(a => a.OnBlurAsync, v =>
+            {
+                blur = true;
+                return Task.CompletedTask;
+            });
+        });
+        var input = cut.Find("input");
+        await cut.InvokeAsync(() => { input.Blur(); });
+        Assert.True(blur);
+    }
+
     class MockDateTimePicker : DatePickerBody
     {
         public static bool GetSafeYearDateTime_Ok()