PR U-11: FluentCombobox for booking-text autocomplete
Replace the native <input list="texts"> + <datalist> pattern in PendingBookings and TransactionSplitDialog with FluentCombobox + Autocomplete=Both so the booking-text autocomplete matches the rest of the Fluent-driven forms. Sort the suggestions once via a sortedBookingTexts computed getter per codebehind rather than sorting inside each row's foreach. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
97bf85d6a8
commit
ceef2c162f
4 changed files with 19 additions and 14 deletions
|
|
@ -49,13 +49,13 @@
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<div class="text-column">
|
<div class="text-column">
|
||||||
<input list="texts" @bind="@transaction.Text" placeholder="Type or select..."/>
|
<FluentCombobox TOption="string"
|
||||||
<datalist id="texts">
|
Items="@sortedBookingTexts"
|
||||||
@foreach (var text in bookingTexts.OrderBy(t => t))
|
OptionText="@(t => t)"
|
||||||
{
|
OptionValue="@(t => t)"
|
||||||
<option value="@text"></option>
|
@bind-Value="@transaction.Text"
|
||||||
}
|
Autocomplete="ComboboxAutocomplete.Both"
|
||||||
</datalist>
|
Placeholder="Text…"/>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
|
|
|
||||||
|
|
@ -38,6 +38,8 @@ public partial class TransactionSplitDialog : ComponentBase
|
||||||
private decimal openAmount = 0;
|
private decimal openAmount = 0;
|
||||||
private List<string> validationErrors = new();
|
private List<string> validationErrors = new();
|
||||||
|
|
||||||
|
private IEnumerable<string> sortedBookingTexts => bookingTexts.OrderBy(t => t);
|
||||||
|
|
||||||
|
|
||||||
protected override async Task OnInitializedAsync()
|
protected override async Task OnInitializedAsync()
|
||||||
{
|
{
|
||||||
|
|
|
||||||
|
|
@ -35,13 +35,14 @@ else
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
<div class="text-column">
|
<div class="text-column">
|
||||||
<input list="texts" @bind="@transaction.Text" placeholder="Type or select..." readonly="@transaction.ReadOnly"/>
|
<FluentCombobox TOption="string"
|
||||||
<datalist id="texts">
|
Items="@sortedBookingTexts"
|
||||||
@foreach (var text in bookingTexts.OrderBy(t => t))
|
OptionText="@(t => t)"
|
||||||
{
|
OptionValue="@(t => t)"
|
||||||
<option value="@text"></option>
|
@bind-Value="@transaction.Text"
|
||||||
}
|
Autocomplete="ComboboxAutocomplete.Both"
|
||||||
</datalist>
|
Placeholder="Text…"
|
||||||
|
Disabled="@transaction.ReadOnly"/>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>
|
<td>
|
||||||
|
|
|
||||||
|
|
@ -27,6 +27,8 @@ public partial class PendingBookings : ComponentBase
|
||||||
private IReadOnlyList<Account> accounts = [];
|
private IReadOnlyList<Account> accounts = [];
|
||||||
private IReadOnlyList<string> bookingTexts = [];
|
private IReadOnlyList<string> bookingTexts = [];
|
||||||
|
|
||||||
|
private IEnumerable<string> sortedBookingTexts => bookingTexts.OrderBy(t => t);
|
||||||
|
|
||||||
protected override async Task OnInitializedAsync()
|
protected override async Task OnInitializedAsync()
|
||||||
{
|
{
|
||||||
await LoadDataAsync();
|
await LoadDataAsync();
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue