feat(DateTimePicker): add OnBlurAsync parameter (#4529)

* feat: 增加 OnBlurAsync 参数

* test: 更新单元测试

Author: ArgoZhang

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>

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);
+        }
+    }
 }

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()