feat(Calendar): add FirstDayOfWeek parameter (#5692)

* refactor: 代码重构

* feat: 增加 FirstDayOfWeek 参数

* doc: 更新示例

* doc: 增加参数文档

* chore: bump version 9.4.11

* test: 增加单元测试

Author: ArgoZhang

src/BootstrapBlazor.Server/Components/Samples/Calendars.razor

@@ -6,7 +6,7 @@
 <h4>@Localizer["SubTitle"]</h4>
 
 <DemoBlock Title="@Localizer["BasicUsageTitle"]" Introduction="@Localizer["BasicUsageIntro"]" Name="Normal">
-    <Calendar ValueChanged="@OnValueChanged" />
+    <Calendar ValueChanged="@OnValueChanged" FirstDayOfWeek="DayOfWeek.Monday" />
     <ConsoleLogger @ref="NormalLogger" />
 </DemoBlock>
 

src/BootstrapBlazor.Server/Components/Samples/Calendars.razor.cs

@@ -77,6 +77,14 @@ private AttributeItem[] GetAttributes() =>
             Type = "RenderFragment<CalendarCellValue>",
             ValueList = " — ",
             DefaultValue = " — "
+        },
+        new()
+        {
+            Name = nameof(Calendar.FirstDayOfWeek),
+            Description = Localizer["FirstDayOfWeek"],
+            Type = "DayOfWeek",
+            ValueList = " — ",
+            DefaultValue = "Sunday"
         }
     ];
 }

src/BootstrapBlazor.Server/Components/Samples/DateTimePickers.razor.cs

@@ -221,6 +221,14 @@ private AttributeItem[] GetAttributes() =>
             DefaultValue = " — "
         },
         new()
+        {
+            Name = nameof(DateTimePicker<DateTime>.FirstDayOfWeek),
+            Description = Localizer["AttrFirstDayOfWeek"],
+            Type = "DayOfWeek",
+            ValueList = " — ",
+            DefaultValue = "Sunday"
+        },
+        new()
         {
             Name = "ViewMode",
             Description = Localizer["Att9"],

src/BootstrapBlazor.Server/Locales/en-US.json

@@ -2572,7 +2572,8 @@
     "FeatureShowHolidaysIntro": "<code>ShowHolidays</code> Whether to display holidays",
     "OnGetDisabledDaysCallbackEvent": "Disable date callback method",
     "AttrEnableDisabledDaysCache": "Whether to enable custom disabled date cache",
-    "AttrDisplayDisabledDayAsEmpty": "Display disabled date as an empty string"
+    "AttrDisplayDisabledDayAsEmpty": "Display disabled date as an empty string",
+    "AttrFirstDayOfWeek": "The first day of the week"
   },
   "BootstrapBlazor.Server.Components.Samples.TimePickers": {
     "Title": "TimePicker",
@@ -3768,7 +3769,8 @@
     "Chinese": "Chinese",
     "Math": "Math",
     "English": "English",
-    "Study": "Study"
+    "Study": "Study",
+    "FirstDayOfWeek": "The first day of the week"
   },
   "BootstrapBlazor.Server.Components.Samples.Cameras": {
     "Title": "Camera",

src/BootstrapBlazor.Server/Locales/zh-CN.json

@@ -2572,7 +2572,8 @@
     "FeatureShowHolidaysIntro": "<code>ShowHolidays</code> 是否显示假日",
     "OnGetDisabledDaysCallbackEvent": "获得自定义禁用日期回调方法",
     "AttrEnableDisabledDaysCache": "是否启用获得自定义禁用日期缓存",
-    "AttrDisplayDisabledDayAsEmpty": "显示禁用日期为空字符串"
+    "AttrDisplayDisabledDayAsEmpty": "显示禁用日期为空字符串",
+    "AttrFirstDayOfWeek": "设置每周第一天"
   },
   "BootstrapBlazor.Server.Components.Samples.TimePickers": {
     "Title": "TimePicker 时间选择器",
@@ -3768,7 +3769,8 @@
     "Chinese": "语文",
     "Math": "数学",
     "English": "英语",
-    "Study": "自习"
+    "Study": "自习",
+    "FirstDayOfWeek": "设置每周第一天"
   },
   "BootstrapBlazor.Server.Components.Samples.Cameras": {
     "Title": "Camera 摄像头拍照组件",

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.5.0-beta11</Version>
+    <Version>9.4.11</Version>
   </PropertyGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Components/Calendar/Calendar.razor.cs

@@ -107,7 +107,7 @@ protected override void OnInitialized()
         PreviousMonth = Localizer[nameof(PreviousMonth)];
         NextMonth = Localizer[nameof(NextMonth)];
         Today = Localizer[nameof(Today)];
-        WeekLists = [.. Localizer[nameof(WeekLists)].Value.Split(',')];
+        WeekLists = GetWeekList();
         PreviousWeek = Localizer[nameof(PreviousWeek)];
         NextWeek = Localizer[nameof(NextWeek)];
         WeekText = Localizer[nameof(WeekText)];
@@ -124,7 +124,7 @@ protected DateTime StartDate
         get
         {
             var d = Value.AddDays(1 - Value.Day);
-            d = d.AddDays(0 - (int)d.DayOfWeek);
+            d = d.AddDays((int)FirstDayOfWeek - (int)d.DayOfWeek);
             return d;
         }
     }
@@ -197,6 +197,12 @@ protected int GetWeekCount()
     [Parameter]
     public bool ShowYearButtons { get; set; } = true;
 
+    /// <summary>
+    /// 获得/设置 星期第一天 默认 <see cref="DayOfWeek.Sunday"/>
+    /// </summary>
+    [Parameter]
+    public DayOfWeek FirstDayOfWeek { get; set; } = DayOfWeek.Sunday;
+
     /// <summary>
     /// 选中日期时回调此方法
     /// </summary>
@@ -297,4 +303,12 @@ private BodyTemplateContext GetBodyTemplateContext(DateTime week)
         context.Values.AddRange(Enumerable.Range(0, 7).Select(i => CreateCellValue(week.AddDays(i))));
         return context;
     }
+    private List<string> GetWeekList()
+    {
+        var list = Localizer[nameof(WeekLists)].Value.Split(',', StringSplitOptions.RemoveEmptyEntries).ToList();
+
+        // 调整顺序
+        var firstDayIndex = (int)FirstDayOfWeek;
+        return [.. list.Skip(firstDayIndex), .. list.Take(firstDayIndex)];
+    }
 }

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

@@ -537,7 +537,7 @@ private List<string> GetWeekList()
 
         // 调整顺序
         var firstDayIndex = (int)FirstDayOfWeek;
-        return list.Skip(firstDayIndex).Concat(list.Take(firstDayIndex)).ToList();
+        return [.. list.Skip(firstDayIndex), .. list.Take(firstDayIndex)];
     }
 
     private async Task UpdateDisabledDaysCache(bool force)

test/UnitTest/Components/CalendarTest.cs

@@ -233,4 +233,17 @@ await cut.InvokeAsync(() =>
         });
         Assert.NotEqual(v, DateTime.MinValue);
     }
+
+    [Fact]
+    public void FirstDayOfWeek_Ok()
+    {
+        var cut = Context.RenderComponent<Calendar>(pb =>
+        {
+            pb.Add(a => a.Value, new DateTime(2025, 02, 20));
+            pb.Add(a => a.FirstDayOfWeek, DayOfWeek.Monday);
+        });
+        var labels = cut.FindAll(".calendar-table thead > tr > th");
+        Assert.Equal("一", labels[0].TextContent);
+        Assert.Equal("日", labels[6].TextContent);
+    }
 }