groceries/Groceries/Transactions/NewTransactionItemsPage.razor

@using Groceries.Data
@using Microsoft.EntityFrameworkCore

@layout Layout

@inject IDbContextFactory<AppDbContext> DbContextFactory

<PageTitle>Groceries &ndash; New Transaction</PageTitle>

<h1>New Transaction</h1>

<div class="form-field">
    @Transaction.CreatedAt.ToShortDateString() @Transaction.CreatedAt.ToLongTimeString() &ndash; @store
</div>

<form method="post">
    <section class="card form-field">
        <div class="card__header row">
            <h2 class="row__fill">Items</h2>
            <div class="button-group dropdown">
                <a class="button button--primary" href="/transactions/new/items/new" autofocus data-turbo-frame="modal">
                    New item
                </a>
                <button class="button button--primary dropdown__toggle" type="button" popovertarget="newItemMenu"></button>
                <ul class="dropdown__menu" id="newItemMenu" popover>
                    <li>
                        <a class="button dropdown__item" href="/transactions/new/items/new?unit=kg" data-turbo-frame="modal">
                            New loose item
                        </a>
                    </li>
                </ul>
            </div>
        </div>

        <div class="card__content card__content--table">
            <Table Items="Transaction.Items.AsQueryable()" HeaderClass="table__header--compact" CellClass="table__cell--compact">
                <ChildContent>
                    <TemplateTableColumn Title="Name" Fill="true" Context="item">
                        <div class="line-clamp-4">@itemNames.GetValueOrDefault(item.ItemId)</div>
                    </TemplateTableColumn>
                    <PropertyTableColumn Property="i => i.Price" CompositeFormat='i => i.Unit == null ? "{0:c}" : ("{0:c}/" + i.Unit)' />
                    <PropertyTableColumn Property="i => i.Quantity" CompositeFormat='i => i.Unit == null ? "{0:f0}" : ("{0:f3}" + i.Unit)'>
                        <HeaderContent>
                            <abbr title="Quantity">Qty</abbr>
                        </HeaderContent>
                    </PropertyTableColumn>
                    <PropertyTableColumn Property="i => i.Amount" Format="c" />
                    <TemplateTableColumn Context="item">
                        <a class="link" href="/transactions/new/items/edit/@item.ItemId" data-turbo-frame="modal">
                            Edit
                        </a>
                    </TemplateTableColumn>
                </ChildContent>
                <FooterContent>
                    <tr>
                        <td class="table__cell table__cell--compact table__cell--total" colspan="3">Subtotal</td>
                        <td class="table__cell table__cell--compact table__cell--total table__cell--align-end">
                            @Transaction.Items.Sum(item => item.Amount).ToString("c")
                        </td>
                        <td class="table__cell table__cell--compact"></td>
                    </tr>
                </FooterContent>
            </Table>
        </div>
    </section>

    <div class="row">
        <button class="button button--primary" type="submit" disabled="@(Transaction.Items.Count == 0)">Next</button>
        <a class="button" href="/transactions/new">Back</a>
    </div>
</form>

@code {
    private string store = string.Empty;
    private Dictionary<Guid, string> itemNames = new();

    [Parameter]
    public required Transaction Transaction { get; set; }

    protected override async Task OnParametersSetAsync()
    {
        using var dbContext = DbContextFactory.CreateDbContext();

        store = await dbContext.Stores
            .Where(store => store.Id == Transaction.StoreId)
            .Select(store => string.Concat(store.Retailer!.Name, " ", store.Name))
            .SingleAsync();

        var itemIds = Transaction.Items.Select(item => item.ItemId);
        itemNames = await dbContext.Items
            .Where(item => itemIds.Contains(item.Id))
            .ToDictionaryAsync(item => item.Id, item => string.Concat(item.Brand, " ", item.Name));
    }
}