!3525 feat(#I60TFU): add SidebarTemplate on DatetimePicker component

* test: 增加 SidebarTemplate 单元测试
* feat: DateTimePicker 增加 SidebarTemplate 参数
* feat: DatePickerBody 增加 SidebarTemplate
This commit is contained in:
Argo 2022-11-12 05:40:22 +00:00
parent 212316ad51
commit d2bc2bb58f
5 changed files with 47 additions and 14 deletions

View File

@ -6,15 +6,22 @@
@if (ShowSidebar)
{
<div class="picker-panel-sidebar">
<div class="sidebar-item">
<DatePickerCell Value="@DateTime.Today" Text="@Today" OnClick="@(async d => await OnClickDateTime(d))" />
</div>
<div class="sidebar-item">
<DatePickerCell Value="@DateTime.Today.AddDays(-1)" Text="@Yesterday" OnClick="@(async d => await OnClickDateTime(d))" />
</div>
<div class="sidebar-item">
<DatePickerCell Value="@DateTime.Today.AddDays(-7)" Text="@Week" OnClick="@(async d => await OnClickDateTime(d))" />
</div>
@if (SidebarTemplate != null)
{
@SidebarTemplate(OnClickDateTime)
}
else
{
<div class="sidebar-item">
<DatePickerCell Value="@DateTime.Today" Text="@Today" OnClick="@(async d => await OnClickDateTime(d))" />
</div>
<div class="sidebar-item">
<DatePickerCell Value="@DateTime.Today.AddDays(-1)" Text="@Yesterday" OnClick="@(async d => await OnClickDateTime(d))" />
</div>
<div class="sidebar-item">
<DatePickerCell Value="@DateTime.Today.AddDays(-7)" Text="@Week" OnClick="@(async d => await OnClickDateTime(d))" />
</div>
}
</div>
}
<div class="picker-panel-body">

View File

@ -164,11 +164,17 @@ public partial class DatePickerBody
public string? DateFormat { get; set; }
/// <summary>
/// 获得/设置 是否显示快捷侧边栏 默认不显示
/// 获得/设置 是否显示快捷侧边栏 默认 false 不显示
/// </summary>
[Parameter]
public bool ShowSidebar { get; set; }
/// <summary>
/// 获得/设置 侧边栏模板 默认 null
/// </summary>
[Parameter]
public RenderFragment<Func<DateTime, Task>>? SidebarTemplate { get; set; }
/// <summary>
/// 获得/设置 是否显示左侧控制按钮 默认显示
/// </summary>

View File

@ -9,9 +9,9 @@
<div @attributes="@AdditionalAttributes" tabindex="@TabIndexString" id="@Id" class="@ClassString" data-bb-auto-close="@AutoCloseString" data-bb-dropdown=".picker-panel" data-bb-dismiss=".picker-panel-link-btn">
<input readonly class="@InputClassName" value="@CurrentValueAsString" placeholder="@PlaceholderString" disabled="@Disabled" data-bs-toggle="@Constants.DropdownToggleString" data-bs-placement="@PlacementString" data-bs-custom-class="@CustomClassString" />
<i class="@DateTimePickerIconClassString"></i>
<DatePickerBody @bind-Value="@ComponentValue" AllowNull="@AllowNull" ShowSidebar="@ShowSidebar"
DateFormat="@DateFormat" ShowFooter="true"
OnConfirm="@OnConfirm" OnClear="@OnClear" MinValue="@MinValue" MaxValue="@MaxValue"
AutoClose="AutoClose" ViewMode="@ViewMode">
<DatePickerBody @bind-Value="ComponentValue" AllowNull="AllowNull" ShowSidebar="ShowSidebar" SidebarTemplate="SidebarTemplate!"
DateFormat="DateFormat" ShowFooter="true"
OnConfirm="OnConfirm" OnClear="OnClear" MinValue="MinValue" MaxValue="MaxValue"
AutoClose="AutoClose" ViewMode="ViewMode">
</DatePickerBody>
</div>

View File

@ -104,6 +104,12 @@ public partial class DateTimePicker<TValue>
[Parameter]
public bool ShowSidebar { get; set; }
/// <summary>
/// 获得/设置 侧边栏模板 默认 null
/// </summary>
[Parameter]
public RenderFragment<Func<DateTime, Task>>? SidebarTemplate { get; set; }
/// <summary>
/// 获得/设置 当前日期最大值
/// </summary>

View File

@ -631,6 +631,20 @@ public class DateTimePickerTest : BootstrapBlazorTestBase
Assert.NotEqual(val, DateTime.MinValue);
}
[Fact]
public void SidebarTemplate_Ok()
{
var cut = Context.RenderComponent<DateTimePicker<DateTime>>(pb =>
{
pb.Add(a => a.ShowSidebar, true);
pb.Add(a => a.SidebarTemplate, new RenderFragment<Func<DateTime, Task>>(cb => builder =>
{
builder.AddContent(0, "test-sidebar-template");
}));
});
cut.Contains("test-sidebar-template");
}
[Fact]
public void GetSafeYearDateTime_Ok()
{