diff --git a/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor b/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor index be0128c7343..88854c6bc38 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor @@ -59,6 +59,20 @@ + + + + @if (context is IconSelectedItem item) + { + + @item.Text + } + + + +
@((MarkupString)Localizer["EnumTip"].Value)
diff --git a/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor.cs index c3d38486a91..0d40e8d97dd 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/CheckboxLists.razor.cs @@ -89,6 +89,12 @@ protected override void OnInitialized() new() { Text = Localizer["item4"], Value = Localizer["item4"] }, }; + IconDemoValues = new List() + { + new() { Text = "Item1", Value = "1", Icon = "fa-solid fa-users" }, + new() { Text = "Item2", Value = "2", Icon = "fa-solid fa-users-gear" } + }; + Dummy = new Foo() { Name = Localizer["Foo"] }; Model = Foo.Generate(LocalizerFoo); FooItems = Foo.GenerateHobbies(LocalizerFoo); @@ -135,6 +141,9 @@ protected override async Task OnInitializedAsync() new() { Text = "Item 4", Value = "4" }, }; + [NotNull] + private IEnumerable? IconDemoValues { get; set; } + private Task OnSelectedChanged(IEnumerable items, string value) { NormalLogger.Log($"{Localizer["Header"]} {items.Count(i => i.Active)} {Localizer["Counter"]}：{value}"); @@ -157,6 +166,11 @@ private Task OnMaxSelectedCountExceed() return ToastService.Information(Localizer["OnMaxSelectedCountExceedTitle"], Localizer["OnMaxSelectedCountExceedContent", 2]); } + class IconSelectedItem : SelectedItem + { + public string? Icon { get; init; } + } + private AttributeItem[] GetAttributes() => [ new() diff --git a/src/BootstrapBlazor.Server/Components/Samples/Checkboxs.razor b/src/BootstrapBlazor.Server/Components/Samples/Checkboxs.razor index 6f936963d41..0bd662dc426 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Checkboxs.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Checkboxs.razor @@ -54,6 +54,15 @@
+ + + + @Localizer["StatusText1"] + + +
diff --git a/src/BootstrapBlazor.Server/Components/Samples/Radios.razor b/src/BootstrapBlazor.Server/Components/Samples/Radios.razor index 598411afc0d..c2e2274260b 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Radios.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Radios.razor @@ -61,10 +61,8 @@ @if (context is IconSelectedItem item) { -
- - @item.Text -
+ + @item.Text } diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 4bd7594ded2..ba4ddad8e7b 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -2369,6 +2369,8 @@ "ValidateFormTitle": "Used in forms", "ValidateFormIntro": "When you use Checkbox in a form, the display label text is placed in front of the component", "ValidateFormDescription": "The pre-label explicit rules are consistent with the BootstrapInput component [portal]", + "RadiosItemTemplateTitle": "ItemTemplate", + "RadiosItemTemplateIntro": "Set ItemTemplate for customer the item UI", "OnBeforeStateChangedTitle": "OnBeforeStateChanged", "OnBeforeStateChangedIntro": "By setting the OnBeforeStateChanged callback method, you can cancel the state change logic", "OnBeforeStateChangedText": "Confirm", @@ -2405,6 +2407,8 @@ "ShowLabelTitle": "Bidirectional binding collection", "ShowLabelIntro": "Binding values are collections", "ShowLabelTip": "TValue is set to IEnumerable<int> generic collection, the ValueField specified field of the bound collection must be consistent with the generic type", + "ItemTemplateTitle": "ItemTemplate", + "ItemTemplateIntro": "Set ItemTemplate for customer the item UI", "EnumTitle": "Bidirectional binding enumeration", "EnumIntro": "The binding value is enumeration", "EnumTip": "When CheckboxList binds an enumeration set, Items does not need to be specified, Items will be automatically set to all values in the enumeration. If you need to bind some values, please provide the enumeration set Items", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index b31b50a7c7c..67daf203764 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -2369,6 +2369,8 @@ "ValidateFormTitle": "表单中使用", "ValidateFormIntro": "在表单中使用 Checkbox 时，显示标签文字会放置到组件前面", "ValidateFormDescription": "前置标签显式规则与 BootstrapInput 组件一致 [传送门]", + "ItemTemplateTitle": "项目模板", + "ItemTemplateIntro": "通过设置 ItemTemplate 自定义显示 UI", "OnBeforeStateChangedTitle": "选中前回调方法", "OnBeforeStateChangedIntro": "通过设置 OnBeforeStateChanged 回调方法，可取消选中逻辑", "OnBeforeStateChangedText": "弹窗确认", @@ -2405,6 +2407,8 @@ "ShowLabelTitle": "双向绑定集合", "ShowLabelIntro": "绑定值为集合", "ShowLabelTip": "TValue 设置为 IEnumerable<int> 泛型集合，绑定集合的 ValueField 指定字段必须与泛型类型一致", + "ItemTemplateTitle": "项目模板", + "ItemTemplateIntro": "通过设置 ItemTemplate 自定义显示 UI", "EnumTitle": "双向绑定枚举", "EnumIntro": "绑定值为枚举", "EnumTip": "当 CheckboxList 绑定一个枚举集合时，Items 不需要指定，Items 会被自动设置成枚举里面所有的值，如果需要绑定部分值时，请自行提供枚举集合 Items", @@ -3018,14 +3022,14 @@ "RadiosVerticalIntro": "通过设置 IsVertical 使组件内部竖向排列", "RadiosEnumTitle": "绑定枚举类型", "RadiosEnumIntro": "通过双向绑定 Value 无需设置 Items", - "RadiosIsButtonTitle": "按钮样式", - "RadiosIsButtonIntro": "通过设定 IsButton 值为 True 将候选项更改为按钮样式", - "RadiosItemTemplateTitle": "项目模板", - "RadiosItemTemplateIntro": "通过设置 ItemTemplate 自定义显示 UI", "RadiosEnumDescription": "通过设置 IsAutoAddNullItem 自动添加 空值 选项，通过设置 NullItemText 自定义 空值 选项", "RadiosEnumText": "空值", "RadiosColorTitle": "颜色", "RadiosColorIntro": "通过设置 Color 属性改变组件背景色", + "RadiosIsButtonTitle": "按钮样式", + "RadiosIsButtonIntro": "通过设定 IsButton 值为 True 将候选项更改为按钮样式", + "RadiosItemTemplateTitle": "项目模板", + "RadiosItemTemplateIntro": "通过设置 ItemTemplate 自定义显示 UI", "RadiosDisplayText": "显示文字", "RadiosNullItemText": "空值显示文字", "RadiosIsDisabled": "是否禁用", diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj index be4a63ed475..02fff502375 100644 --- a/src/BootstrapBlazor/BootstrapBlazor.csproj +++ b/src/BootstrapBlazor/BootstrapBlazor.csproj @@ -1,7 +1,7 @@ - 9.3.1-beta01 + 9.3.1-beta02 diff --git a/src/BootstrapBlazor/Components/Checkbox/Checkbox.razor b/src/BootstrapBlazor/Components/Checkbox/Checkbox.razor index d18cdc583c2..64301b540d3 100644 --- a/src/BootstrapBlazor/Components/Checkbox/Checkbox.razor +++ b/src/BootstrapBlazor/Components/Checkbox/Checkbox.razor @@ -9,7 +9,13 @@
- @if (IsShowAfterLabel) + @if(ChildContent != null) + { + + } + else if (IsShowAfterLabel) {
diff --git a/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.cs b/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.cs index 2c14e40b158..1505d7ed21e 100644 --- a/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.cs +++ b/src/BootstrapBlazor/Components/Checkbox/CheckboxList.razor.cs @@ -98,6 +98,12 @@ public partial class CheckboxList : ValidateBase [Parameter] public Func? OnMaxSelectedCountExceed { get; set; } + /// + /// 获得/设置 项模板 + /// + [Parameter] + public RenderFragment? ItemTemplate { get; set; } + /// /// 获得 当前选项是否被禁用 /// @@ -295,4 +301,8 @@ protected virtual void EnsureParameterValid() throw new NotSupportedException(); } } + + private RenderFragment? GetChildContent(SelectedItem item) => ItemTemplate == null + ? null + : ItemTemplate(item); } diff --git a/src/BootstrapBlazor/Components/Radio/Radio.razor.cs b/src/BootstrapBlazor/Components/Radio/Radio.razor.cs index ad9ec273923..e461776a61f 100644 --- a/src/BootstrapBlazor/Components/Radio/Radio.razor.cs +++ b/src/BootstrapBlazor/Components/Radio/Radio.razor.cs @@ -17,19 +17,11 @@ public partial class Radio : Checkbox [Parameter] public Func? OnClick { get; set; } - /// - /// 获得/设置 子组件 RenderFragment 实例 - /// - [Parameter] - public RenderFragment? ChildContent { get; set; } - /// /// 获得/设置 Radio 组名称一般来讲需要设置 默认为 null 未设置 /// [Parameter] -#if NET6_0_OR_GREATER [EditorRequired] -#endif public string? GroupName { get; set; } private string? ClassString => CssBuilder.Default("form-check") diff --git a/src/BootstrapBlazor/Components/Radio/RadioList.razor b/src/BootstrapBlazor/Components/Radio/RadioList.razor index 8ea5dcfcbe9..c4923deca93 100644 --- a/src/BootstrapBlazor/Components/Radio/RadioList.razor +++ b/src/BootstrapBlazor/Components/Radio/RadioList.razor @@ -24,8 +24,7 @@ else
@foreach (var item in Items) { - var content = GetChildContent(item); - + }
} diff --git a/src/BootstrapBlazor/Components/Radio/RadioList.razor.cs b/src/BootstrapBlazor/Components/Radio/RadioList.razor.cs index 904f755e79c..899f1d4946b 100644 --- a/src/BootstrapBlazor/Components/Radio/RadioList.razor.cs +++ b/src/BootstrapBlazor/Components/Radio/RadioList.razor.cs @@ -25,12 +25,6 @@ public partial class RadioList [NotNull] public string? NullItemText { get; set; } - /// - /// 获得/设置 项模板 - /// - [Parameter] - public RenderFragment? ItemTemplate { get; set; } - /// /// 获得/设置 未设置选中项时是否自动选择第一项 默认 true /// diff --git a/test/UnitTest/Components/CheckboxListTest.cs b/test/UnitTest/Components/CheckboxListTest.cs index 17f7b9e93c4..c7cb7e45a6a 100644 --- a/test/UnitTest/Components/CheckboxListTest.cs +++ b/test/UnitTest/Components/CheckboxListTest.cs @@ -27,6 +27,16 @@ public void Checkbox_Ok() Assert.DoesNotContain("is-label", cut.Markup); } + [Fact] + public void ChildContent_Ok() + { + var cut = Context.RenderComponent>(builder => + { + builder.Add(a => a.ChildContent, pb => pb.AddContent(0, "test-childcontent")); + }); + cut.MarkupMatches("
"); + } + [Fact] public void StopPropagation_Ok() { @@ -443,6 +453,26 @@ await cut.InvokeAsync(async () => Assert.False(max); } + [Fact] + public void ItemTemplate_Ok() + { + var items = new List() + { + new("1", "Test 1"), + new("2", "Test 2"), + new("3", "Test 3") + }; + var cut = Context.RenderComponent>(pb => + { + pb.Add(a => a.Items, items); + pb.Add(a => a.ItemTemplate, item => b => + { + b.AddContent(0, item.Text); + }); + }); + cut.MarkupMatches("
"); + } + private class CheckboxListGenericMock {