diff --git a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.css b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.css index 316279230e2..fdda5614f14 100644 --- a/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.css +++ b/src/BootstrapBlazor.Server/Components/Layout/BaseLayout.razor.css @@ -3,7 +3,7 @@ box-shadow: var(--bb-layout-button-shadow); transition: opacity .3s linear; position: fixed; - z-index: 45; + z-index: 1001; } ::deep .btn-fade:hover { diff --git a/src/BootstrapBlazor.Server/Components/Pages/Coms.razor b/src/BootstrapBlazor.Server/Components/Pages/Coms.razor index d6d05fd5642..ee980e054b3 100644 --- a/src/BootstrapBlazor.Server/Components/Pages/Coms.razor +++ b/src/BootstrapBlazor.Server/Components/Pages/Coms.razor @@ -4,7 +4,7 @@
- +
diff --git a/src/BootstrapBlazor.Server/Components/Samples/Searches.razor b/src/BootstrapBlazor.Server/Components/Samples/Searches.razor index bf26b1f551d..3f726c62291 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Searches.razor +++ b/src/BootstrapBlazor.Server/Components/Samples/Searches.razor @@ -1,5 +1,7 @@ @page "/search" @inject IStringLocalizer Localizer +@inject IStringLocalizer LocalizerFoo +@inject IOptionsMonitor WebsiteOption

@Localizer["SearchesTitle"]

@@ -39,10 +41,21 @@ Introduction="@Localizer["SearchesItemTemplateIntro"]" Name="ItemTemplate"> -
@context.Name
-
@context.Address
+
+
+ avatar +
+
+
@context.Name
+
@context.Address
+
+
+ +
+
@@ -51,7 +64,7 @@ Introduction="@Localizer["SearchesKeyboardsIntro"]" Name="keyboards"> @@ -60,7 +73,7 @@ Introduction="@Localizer["SearchesValidateFormIntro"]" Name="ValidateForm"> - + diff --git a/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.cs b/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.cs index 6cd10797ebf..6671d933947 100644 --- a/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.cs +++ b/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.cs @@ -52,12 +52,21 @@ private Task> OnKeyboardSearch(string searchText) return Task.FromResult>([$"{searchText}1", $"{searchText}12", $"{searchText}123"]); } - private Foo Model { get; set; } = new Foo() { Name = "" }; + private Foo Model { get; } = new() { Name = "" }; - private static async Task> OnSearchFoo(string searchText) + private string? OnGetDisplayText(Foo foo) => foo.Name; + + private async Task> OnSearchFoo(string searchText) { + // 模拟异步延时 await Task.Delay(100); - return Enumerable.Range(1, 10).Select(i => new Foo() { Name = $"{searchText}-{i}", Address = $"Address - 10{i}" }).ToList(); + return Enumerable.Range(1, 10).Select(i => new Foo() + { + Id = i, + Name = LocalizerFoo["Foo.Name", $"{i:d4}"], + Address = LocalizerFoo["Foo.Address", $"{Random.Shared.Next(1000, 2000)}"], + Count = Random.Shared.Next(1, 100) + }).ToList(); } /// @@ -66,20 +75,6 @@ private static async Task> OnSearchFoo(string searchText) /// private AttributeItem[] GetAttributes() => [ - new() { - Name = "ChildContent", - Description = Localizer["SearchesChildContent"], - Type = "RenderFragment", - ValueList = " — ", - DefaultValue = " — " - }, - new() { - Name = "Items", - Description = Localizer["SearchesItems"], - Type = "IEnumerable", - ValueList = " — ", - DefaultValue = " — " - }, new() { Name = "NoDataTip", Description = Localizer["SearchesNoDataTip"], @@ -123,13 +118,6 @@ private AttributeItem[] GetAttributes() => ValueList = " — ", DefaultValue = "Primary" }, - new() { - Name = "IsLikeMatch", - Description = Localizer["SearchesIsLikeMatch"], - Type = "bool", - ValueList = "true|false", - DefaultValue = "false" - }, new() { Name = "IsAutoFocus", Description = Localizer["SearchesIsAutoFocus"], @@ -145,21 +133,13 @@ private AttributeItem[] GetAttributes() => DefaultValue = "false" }, new() { - Name = "IsOnInputTrigger", - Description = Localizer["SearchesIsOnInputTrigger"], + Name = "IsTriggerSearchByInput", + Description = Localizer["SearchesIsTriggerSearchByInput"], Type = "bool", ValueList = "true|false", DefaultValue = "false" }, new() - { - Name = "IgnoreCase", - Description = Localizer["SearchesIgnoreCase"], - Type = "bool", - ValueList = "true|false", - DefaultValue = "true" - }, - new() { Name = "ShowClearButton", Description = Localizer["SearchesShowClearButton"], diff --git a/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.css b/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.css new file mode 100644 index 00000000000..379e10267ea --- /dev/null +++ b/src/BootstrapBlazor.Server/Components/Samples/Searches.razor.css @@ -0,0 +1,31 @@ +.search-result { + border: solid 1px var(--bs-boder-color); + display: flex; + border-radius: 10px; + padding: .5rem; + border: 1px dashed var(--bs-border-color); +} + +.search-result-avatar { + flex-basis: 60px; + border-radius: 10px; + border: 2px solid var(--bb-primary-color); + overflow: hidden; + margin-inline-end: 1rem; +} + + .search-result-avatar img { + width: 100%; + } + +.search-result-main { + flex-grow: 1; + width: 1%; + min-width: 0; +} + +.search-result-address { + margin-top: .25rem; + font-size: 86%; + color: #c0c4cc; +} diff --git a/src/BootstrapBlazor.Server/Locales/en-US.json b/src/BootstrapBlazor.Server/Locales/en-US.json index 00bc2c5ac27..936fb1aaa68 100644 --- a/src/BootstrapBlazor.Server/Locales/en-US.json +++ b/src/BootstrapBlazor.Server/Locales/en-US.json @@ -4182,11 +4182,9 @@ "SearchesDisplayButtonTitle": "The Empty button is displayed", "SearchesDisplayButtonIntro": "Control whether the Empty button is displayed by setting the ShowClearButton parameter", "SearchesKeyboardsTitle": "Keyboard input instant search", - "SearchesKeyboardsIntro": "Control whether search operations are performed in real time by setting the IsOnInputTrigger parameter", + "SearchesKeyboardsIntro": "Control whether search operations are performed in real time by setting IsTriggerSearchByInput parameter", "SearchesValidateFormTitle": "ValidateForm", "SearchesValidateFormIntro": "Inside ValidateForm", - "SearchesChildContent": "Content", - "SearchesItems": "Data source", "SearchesNoDataTip": "Auto-complete data prompts when there is no match", "SearchesNoDataTipDefaultValue": "No matching data", "SearchesButtonLoadingIcon": "Searching for button icon", @@ -4194,14 +4192,14 @@ "SearchesClearButtonText": "Empty the button text", "SearchesClearButtonColor": "Clear the button color", "SearchesButtonColor": "Search for button color", - "SearchesIsLikeMatch": "Whether fuzzy matching is turned on", "SearchesIsAutoFocus": "Whether to get the focus automatically", "SearchesIsAutoClearAfterSearch": "Click Search to automatically empty the search box", - "SearchesIsOnInputTrigger": "Whether the search mode is triggered by input, it is triggered by clicking the search button by default", - "SearchesIgnoreCase": "Whether case is ignored when matching", + "SearchesIsTriggerSearchByInput": "Whether the search mode is triggered by input, it is triggered by clicking the search button by default", "SearchesShowClearButton": "Whether the Clear button is displayed", "SearchesOnSearch": "Call back this delegate when you click Search", - "SearchesOnClear": "Click Recall this order when emptying" + "SearchesOnClear": "Click Recall this order when emptying", + "SearchesItemTemplateTitle": "Item Template", + "SearchesItemTemplateIntro": "By setting ItemTemplate and matching generic data, you can achieve any desired effect. In this example, by searching for any keyword, the backend calls any third-party search results and displays them. After selecting the search item, you can handle it yourself through the OnSelectedItemChanged callback method" }, "BootstrapBlazor.Server.Components.Samples.Titles": { "Title": "Title", diff --git a/src/BootstrapBlazor.Server/Locales/zh-CN.json b/src/BootstrapBlazor.Server/Locales/zh-CN.json index b22be0abe6d..b67c96ab6bf 100644 --- a/src/BootstrapBlazor.Server/Locales/zh-CN.json +++ b/src/BootstrapBlazor.Server/Locales/zh-CN.json @@ -4182,11 +4182,9 @@ "SearchesDisplayButtonTitle": "显示清空按钮", "SearchesDisplayButtonIntro": "通过设置 ShowClearButton 参数控制是否显示清空按钮", "SearchesKeyboardsTitle": "键盘输入即时搜索", - "SearchesKeyboardsIntro": "通过设置 IsOnInputTrigger 参数控制是否实时进行搜索操作", + "SearchesKeyboardsIntro": "通过设置 IsTriggerSearchByInput 参数控制是否实时进行搜索操作", "SearchesValidateFormTitle": "验证表单内使用", "SearchesValidateFormIntro": "内置于 ValidateForm 使用，输入中文时不会多次触发搜索功能", - "SearchesChildContent": "内容", - "SearchesItems": "数据源", "SearchesNoDataTip": "自动完成数据无匹配项时提示信息", "SearchesNoDataTipDefaultValue": "无匹配数据", "SearchesButtonLoadingIcon": "正在搜索按钮图标", @@ -4194,14 +4192,14 @@ "SearchesClearButtonText": "清空按钮文本", "SearchesClearButtonColor": "清空按钮颜色", "SearchesButtonColor": "搜索按钮颜色", - "SearchesIsLikeMatch": "是否开启模糊匹配", "SearchesIsAutoFocus": "是否自动获得焦点", "SearchesIsAutoClearAfterSearch": "点击搜索后是否自动清空搜索框", - "SearchesIsOnInputTrigger": "搜索模式是否为输入即触发,默认点击搜索按钮触发", - "SearchesIgnoreCase": "匹配时是否忽略大小写", + "SearchesIsTriggerSearchByInput": "搜索模式是否为输入即触发,默认点击搜索按钮触发", "SearchesShowClearButton": "是否显示清除按钮", "SearchesOnSearch": "点击搜索时回调此委托", - "SearchesOnClear": "点击清空时回调此委托" + "SearchesOnClear": "点击清空时回调此委托", + "SearchesItemTemplateTitle": "模板", + "SearchesItemTemplateIntro": "通过设置 ItemTemplate 配合泛型数据可以做出自己想要的任何效果，本例中通过搜索任意关键字，后台调用任意第三方搜索结果并且进行展示，选中搜索项后通过 OnSelectedItemChanged 回调方法可以自行处理" }, "BootstrapBlazor.Server.Components.Samples.Titles": { "Title": "Title 网站标题", diff --git a/src/BootstrapBlazor/BootstrapBlazor.csproj b/src/BootstrapBlazor/BootstrapBlazor.csproj index 46b5ff3f9b1..4fbb53d2166 100644 --- a/src/BootstrapBlazor/BootstrapBlazor.csproj +++ b/src/BootstrapBlazor/BootstrapBlazor.csproj @@ -1,7 +1,7 @@ - 9.2.0-beta01 + 9.2.1-beta01 diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.cs b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.cs index a7a2a1cf2c7..47f7830a3a9 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.cs +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.cs @@ -69,6 +69,12 @@ public partial class AutoComplete [Parameter] public bool ShowDropdownListOnFocus { get; set; } = true; + /// + /// 获得/设置 是否显示无匹配数据选项 默认 true 显示 + /// + [Parameter] + public bool ShowNoDataTip { get; set; } = true; + /// /// IStringLocalizer 服务实例 /// diff --git a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js index 6cb7303ff51..fb863319cab 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js +++ b/src/BootstrapBlazor/Components/AutoComplete/AutoComplete.razor.js @@ -61,7 +61,7 @@ export function init(id, invoke) { } el.classList.add('is-loading'); - await invoke.invokeMethodAsync('TriggerOnChange', v, useInput); + await invoke.invokeMethodAsync('TriggerOnChange', v); el.classList.remove('is-loading'); }); diff --git a/src/BootstrapBlazor/Components/AutoComplete/PopoverCompleteBase.cs b/src/BootstrapBlazor/Components/AutoComplete/PopoverCompleteBase.cs index 4d0bf2b9554..6292eb5c2ee 100644 --- a/src/BootstrapBlazor/Components/AutoComplete/PopoverCompleteBase.cs +++ b/src/BootstrapBlazor/Components/AutoComplete/PopoverCompleteBase.cs @@ -43,13 +43,6 @@ public abstract class PopoverCompleteBase : BootstrapInputBase, [NotNull] public string? NoDataTip { get; set; } - /// - /// 获得/设置 是否显示无匹配数据选项 默认 true 显示 - /// - [Parameter] - [NotNull] - public bool ShowNoDataTip { get; set; } = true; - /// /// /// diff --git a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs index 4272cac2715..64c4cf87a72 100644 --- a/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs +++ b/src/BootstrapBlazor/Components/AutoFill/AutoFill.razor.cs @@ -70,6 +70,12 @@ public partial class AutoFill [Parameter] public Func>>? OnCustomFilter { get; set; } + /// + /// 获得/设置 是否显示无匹配数据选项 默认 true 显示 + /// + [Parameter] + public bool ShowNoDataTip { get; set; } = true; + /// /// 获得/设置 候选项模板 默认 null /// diff --git a/src/BootstrapBlazor/Components/Search/Search.razor b/src/BootstrapBlazor/Components/Search/Search.razor index e5bdd549224..7597d7b5dba 100644 --- a/src/BootstrapBlazor/Components/Search/Search.razor +++ b/src/BootstrapBlazor/Components/Search/Search.razor @@ -7,21 +7,22 @@ @if (ShowClearButton) { - } -