ant-design-blazor/components/date-picker/internal/DatePickerHeader.razor
Bin Dong d99f4f35a8 feat: add localization option to DatePicker (#206)
* feat: add localization option to DatePicker

* fix(module: datepicker): fix formatting issue

* fix: fix Week/Year panel miss matching
fix picker not update when setting CultureInfo
fix ShortWeekDays names and order

* fix: fix binding of CultureInfo in datetime demos
Add globalization demo

* fix: datetime string format

Co-authored-by: ElderJames <shunjiey@hotmail.com>
2020-06-16 12:31:46 +08:00

98 lines
3.7 KiB
C#

@namespace AntDesign.Internal
@typeparam TValue
@inherits DatePickerPanelBase<TValue>
<div class="@(PrefixCls)-header">
@if (ShowSuperPreChange)
{
<button tabindex="-1" class="@(PrefixCls)-header-super-prev-btn" @onclick="e => ChangePickerYearValue(-SuperChangeDateInterval)">
<span class="@(PrefixCls)-super-prev-icon"></span>
</button>
}
@if (ShowPreChange)
{
<button tabindex="-1" class="@(PrefixCls)-header-prev-btn" @onclick="e => ChangePickerMonthValue(-ChangeDateInterval)">
<span class="@(PrefixCls)-prev-icon"></span>
</button>
}
<div class="@(PrefixCls)-header-view">
@if (this.DatePicker.CultureInfo.GetDateLocale().MonthBeforeYear)
{
@if (Picker.IsIn(DatePickerType.Date, DatePickerType.Week))
{
<button type="button" tabindex="-1" class="@(PrefixCls)-month-btn" @onclick="e => PopUpPicker(DatePickerType.Month)">
@(PickerValue.ToString(this.DatePicker.CultureInfo.GetDateLocale().MonthFormat, this.DatePicker.CultureInfo))
</button>
}
@if (Picker.IsIn(DatePickerType.Date, DatePickerType.Month, DatePickerType.Quarter, DatePickerType.Week))
{
<button type="button" tabindex="-1" class="@(PrefixCls)-year-btn" @onclick="e => PopUpPicker(DatePickerType.Year)">
@(PickerValue.ToString(this.DatePicker.CultureInfo.GetDateLocale().YearFormat, this.DatePicker.CultureInfo))
</button>
}
}
else
{
@if (Picker.IsIn(DatePickerType.Date, DatePickerType.Month, DatePickerType.Quarter, DatePickerType.Week))
{
<button type="button" tabindex="-1" class="@(PrefixCls)-year-btn" @onclick="e => PopUpPicker(DatePickerType.Year)">
@(PickerValue.ToString(this.DatePicker.CultureInfo.GetDateLocale().YearFormat, this.DatePicker.CultureInfo))
</button>
}
@if (Picker.IsIn(DatePickerType.Date, DatePickerType.Week))
{
<button type="button" tabindex="-1" class="@(PrefixCls)-month-btn" @onclick="e => PopUpPicker(DatePickerType.Month)">
@(PickerValue.ToString(this.DatePicker.CultureInfo.GetDateLocale().MonthFormat, this.DatePicker.CultureInfo))
</button>
}
}
@if (Picker.IsIn(DatePickerType.Year))
{
int startYear = PickerValue.Year / 10 * 10;
<button type="button" class="@(PrefixCls)-decade-btn" @onclick="e => PopUpPicker(DatePickerType.Decade)">
@(startYear)-@(startYear + 9)
</button>
}
@if (Picker.IsIn(DatePickerType.Decade))
{
int startYear = PickerValue.Year / 100 * 100;
<button type="button" class="@(PrefixCls)-decade-btn">
@(startYear)-@(startYear + 99)
</button>
}
</div>
@if (ShowNextChange)
{
<button tabindex="-1" class="@(PrefixCls)-header-next-btn" @onclick="e => ChangePickerMonthValue(ChangeDateInterval)">
<span class="@(PrefixCls)-next-icon"></span>
</button>
}
@if (ShowSuperNextChange)
{
<button tabindex="-1" class="@(PrefixCls)-header-super-next-btn" @onclick="e => ChangePickerYearValue(SuperChangeDateInterval)">
<span class="@(PrefixCls)-super-next-icon"></span>
</button>
}
</div>
@code {
[Parameter]
public int SuperChangeDateInterval { get; set; } = 1;
[Parameter]
public int ChangeDateInterval { get; set; } = 1;
[Parameter]
public bool ShowSuperPreChange { get; set; } = true;
[Parameter]
public bool ShowPreChange { get; set; } = true;
[Parameter]
public bool ShowNextChange { get; set; } = true;
[Parameter]
public bool ShowSuperNextChange { get; set; } = true;
}