Skip to content

Commit 1a219dc

Browse files
ArgoZhangjvk-digres
ArgoZhang
and
jvk-digres
authored
fix(DateTimeRange): should be reset Value after close pop-up (#5413)
* refactor: 增加 hideCallback 回调 * feat: 增加 TriggerHideCallback 回调 * test: 增加单元测试 * refactor: 移除日志输出 * refactor: 增加重置逻辑 * test: 增加单元测试 * chore: bump version 9.3.1-beta26 Co-Authored-By: Jiří Vokřínek <[email protected]> --------- Co-authored-by: Jiří Vokřínek <[email protected]>
1 parent c45b44c commit 1a219dc

File tree

9 files changed

+106
-24
lines changed

9 files changed

+106
-24
lines changed

‎src/BootstrapBlazor/BootstrapBlazor.csproj‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<Project Sdk="Microsoft.NET.Sdk.Razor">
22

33
<PropertyGroup>
4-
<Version>9.3.1-beta25</Version>
4+
<Version>9.3.1-beta26</Version>
55
</PropertyGroup>
66

77
<ItemGroup>

‎src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
@namespace BootstrapBlazor.Components
22
@typeparam TValue
33
@inherits PopoverDropdownBase<TValue>
4-
@attribute [BootstrapModuleAutoLoader("DateTimePicker/DateTimePicker.razor.js")]
4+
@attribute [BootstrapModuleAutoLoader("DateTimePicker/DateTimePicker.razor.js", JSObjectReference = true)]
55

66
@if (IsShowLabel)
77
{

‎src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor.cs‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -372,6 +372,15 @@ protected override string FormatValueAsString(TValue? value)
372372
return ret;
373373
}
374374

375+
/// <summary>
376+
/// <inheritdoc/>
377+
/// </summary>
378+
/// <returns></returns>
379+
protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, Interop, new
380+
{
381+
TriggerHideCallback = nameof(TriggerHideCallback)
382+
});
383+
375384
private bool MinValueToEmpty(DateTime val) => val == DateTime.MinValue && AllowNull && DisplayMinValueAsEmpty;
376385

377386
private bool MinValueToToday(DateTime val) => val == DateTime.MinValue && !AllowNull && AutoToday;
@@ -454,4 +463,15 @@ protected virtual async Task OnBlur()
454463
await OnBlurAsync(Value);
455464
}
456465
}
466+
467+
/// <summary>
468+
/// 客户端弹窗关闭后由 Javascript 调用此方法
469+
/// </summary>
470+
/// <returns></returns>
471+
[JSInvokable]
472+
public Task TriggerHideCallback()
473+
{
474+
StateHasChanged();
475+
return Task.CompletedTask;
476+
}
457477
}

‎src/BootstrapBlazor/Components/DateTimePicker/DateTimePicker.razor.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import EventHandler from "../../modules/event-handler.js"
33
import Popover from "../../modules/base-popover.js"
44

5-
export function init(id) {
5+
export function init(id, invoke, options) {
66
const el = document.getElementById(id)
77
if (el == null) {
88
return
@@ -13,6 +13,9 @@ export function init(id) {
1313
dropdownSelector: el.getAttribute('data-bb-dropdown'),
1414
isDisabled: () => {
1515
return el.classList.contains('disabled');
16+
},
17+
hideCallback: () => {
18+
invoke?.invokeMethodAsync(options.triggerHideCallback);
1619
}
1720
});
1821
const dateTimePicker = {

‎src/BootstrapBlazor/Components/DateTimeRange/DateTimeRange.razor‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@namespace BootstrapBlazor.Components
22
@inherits PopoverDropdownBase<DateTimeRangeValue>
3-
@attribute [BootstrapModuleAutoLoader("DateTimePicker/DateTimePicker.razor.js")]
3+
@attribute [BootstrapModuleAutoLoader("DateTimePicker/DateTimePicker.razor.js", JSObjectReference = true)]
44

55
@if (IsShowLabel)
66
{

‎src/BootstrapBlazor/Components/DateTimeRange/DateTimeRange.razor.cs‎

Lines changed: 43 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -311,24 +311,7 @@ protected override void OnParametersSet()
311311
new() { Text = Localizer["LastMonth"], StartDateTime = DateTime.Today.AddDays(1- DateTime.Today.Day).AddMonths(-1), EndDateTime = DateTime.Today.AddDays(1- DateTime.Today.Day).AddSeconds(-1) },
312312
];
313313

314-
Value ??= new DateTimeRangeValue();
315-
EndValue = Value.End == DateTime.MinValue ? GetEndDateTime(DateTime.Today) : Value.End;
316-
317-
if (ViewMode == DatePickerViewMode.Year)
318-
{
319-
var d = DateTime.Today.AddYears(-1);
320-
StartValue = Value.Start == DateTime.MinValue ? new DateTime(d.Year, 1, 1) : Value.Start;
321-
}
322-
else if (ViewMode == DatePickerViewMode.Month)
323-
{
324-
var d = DateTime.Today.AddMonths(-1);
325-
StartValue = Value.Start == DateTime.MinValue ? new DateTime(d.Year, d.Month, 1) : Value.Start;
326-
}
327-
else
328-
{
329-
StartValue = EndValue.AddMonths(-1).Date;
330-
}
331-
314+
ResetBodyValue();
332315
SelectedValue.Start = Value.Start;
333316
SelectedValue.End = Value.End;
334317

@@ -342,6 +325,15 @@ void CheckValid()
342325
}
343326
}
344327

328+
/// <summary>
329+
/// <inheritdoc/>
330+
/// </summary>
331+
/// <returns></returns>
332+
protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, Interop, new
333+
{
334+
TriggerHideCallback = nameof(TriggerHideCallback)
335+
});
336+
345337
private async Task OnClickSidebarItem(DateTimeRangeSidebarItem item)
346338
{
347339
SelectedValue.Start = item.StartDateTime;
@@ -505,4 +497,37 @@ private void UpdateValue(DateTime d)
505497
public override bool IsComplexValue(object? propertyValue) => false;
506498

507499
private static DateTime GetEndDateTime(DateTime dt) => dt.Date.AddHours(23).AddMinutes(59).AddSeconds(59);
500+
501+
private void ResetBodyValue()
502+
{
503+
Value ??= new DateTimeRangeValue();
504+
EndValue = Value.End == DateTime.MinValue ? GetEndDateTime(DateTime.Today) : Value.End;
505+
506+
if (ViewMode == DatePickerViewMode.Year)
507+
{
508+
var d = DateTime.Today.AddYears(-1);
509+
StartValue = Value.Start == DateTime.MinValue ? new DateTime(d.Year, 1, 1) : Value.Start;
510+
}
511+
else if (ViewMode == DatePickerViewMode.Month)
512+
{
513+
var d = DateTime.Today.AddMonths(-1);
514+
StartValue = Value.Start == DateTime.MinValue ? new DateTime(d.Year, d.Month, 1) : Value.Start;
515+
}
516+
else
517+
{
518+
StartValue = EndValue.AddMonths(-1).Date;
519+
}
520+
}
521+
522+
/// <summary>
523+
/// 客户端弹窗关闭后由 Javascript 调用此方法
524+
/// </summary>
525+
/// <returns></returns>
526+
[JSInvokable]
527+
public Task TriggerHideCallback()
528+
{
529+
ResetBodyValue();
530+
StateHasChanged();
531+
return Task.CompletedTask;
532+
}
508533
}

‎src/BootstrapBlazor/wwwroot/modules/base-popover.js‎

Lines changed: 13 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,10 @@ const Popover = {
1414
isDisabled: () => {
1515
return isDisabled(el) || isDisabled(el.parentNode) || isDisabled(el.querySelector('.form-control'))
1616
},
17-
initCallback: null
17+
initCallback: null,
18+
hideCallback: null
1819
},
19-
...config || {}
20+
...(config ?? {})
2021
}
2122
const createPopover = () => {
2223
if (!popover.isDisabled()) {
@@ -69,6 +70,12 @@ const Popover = {
6970
}
7071
}
7172

73+
popover.triggerHideCallback = () => {
74+
if (popover.hideCallback) {
75+
popover.hideCallback();
76+
};
77+
}
78+
7279
if (popover.isPopover) {
7380
popover.hasDisplayNone = false;
7481

@@ -112,6 +119,8 @@ const Popover = {
112119
popover.popover.tip.classList.remove('show');
113120
el.classList.remove('show');
114121
el.append(popover.toggleMenu);
122+
123+
popover.triggerHideCallback();
115124
}
116125

117126
const active = e => {
@@ -176,6 +185,7 @@ const Popover = {
176185
}
177186

178187
EventHandler.on(el, 'show.bs.dropdown', show)
188+
EventHandler.on(el, 'hide.bs.dropdown', popover.triggerHideCallback)
179189

180190
popover.popover = bootstrap.Dropdown.getOrCreateInstance(popover.toggleElement);
181191
}
@@ -200,6 +210,7 @@ const Popover = {
200210
}
201211
else {
202212
EventHandler.off(popover.el, 'show.bs.dropdown')
213+
EventHandler.off(popover.el, 'hide.bs.dropdown')
203214
}
204215
}
205216
}

‎test/UnitTest/Components/DateTimePickerTest.cs‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -482,6 +482,19 @@ class MockCalendarHolidayService : ICalendarHolidays
482482
public bool IsWorkday(DateTime dt) => dt == new DateTime(2024, 4, 7);
483483
}
484484

485+
[Fact]
486+
public async Task TriggerHideCallback_Ok()
487+
{
488+
var cut = Context.RenderComponent<DateTimePicker<DateTime>>(pb =>
489+
{
490+
pb.Add(a => a.DayTemplate, dt => builder =>
491+
{
492+
builder.AddContent(0, "day-template");
493+
});
494+
});
495+
await cut.InvokeAsync(() => cut.Instance.TriggerHideCallback());
496+
}
497+
485498
[Fact]
486499
public void DayTemplate_Ok()
487500
{

‎test/UnitTest/Components/DateTimeRangeTest.cs‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -666,4 +666,14 @@ public async Task ViewMode_Month()
666666
await cut.InvokeAsync(() => cells[0].Click());
667667
await cut.InvokeAsync(() => cells[1].Click());
668668
}
669+
670+
[Fact]
671+
public async Task TriggerHideCallback_Ok()
672+
{
673+
var cut = Context.RenderComponent<DateTimeRange>(pb =>
674+
{
675+
pb.Add(a => a.Value, new DateTimeRangeValue());
676+
});
677+
await cut.InvokeAsync(() => cut.Instance.TriggerHideCallback());
678+
}
669679
}

0 commit comments

Comments
 (0)