Put games table in a card, use loading indicator

blazor
Pat Hartl 2023-03-03 17:34:50 -06:00
parent 7b6fd7cb0f
commit 68ec83f681
1 changed files with 37 additions and 27 deletions

View File

@ -3,39 +3,49 @@
@inject GameService GameService
@inject NavigationManager NavigationManager
<Table TItem="Game" DataSource="@Games">
<Column TData="string">
<Image Src="@GetIcon(context)" Height="32" Width="32" Preview="false"></Image>
</Column>
<PropertyColumn Property="g => g.Title" Sortable />
<PropertyColumn Property="g => g.SortTitle" Sortable />
<PropertyColumn Property="g => g.ReleasedOn" Format="MM/dd/yyyy" Sortable />
<PropertyColumn Property="g => g.CreatedOn" Format="MM/dd/yyyy hh:mm" Sortable />
<PropertyColumn Property="g => g.CreatedBy" Sortable>
@context.CreatedBy?.UserName
</PropertyColumn>
<PropertyColumn Property="g => g.UpdatedOn" Format="MM/dd/yyyy hh:mm" Sortable />
<PropertyColumn Property="g => g.UpdatedBy" Sortable>
@context.UpdatedBy?.UserName
</PropertyColumn>
<ActionColumn Title="">
<Space>
<SpaceItem>
<Button OnClick="() => Edit(context)">Edit</Button>
</SpaceItem>
</Space>
</ActionColumn>
</Table>
<Card Title="Games">
<Body>
<Table TItem="Game" DataSource="@Games" Loading="@Loading">
<Column TData="string">
<Image Src="@GetIcon(context)" Height="32" Width="32" Preview="false"></Image>
</Column>
<PropertyColumn Property="g => g.Title" Sortable />
<PropertyColumn Property="g => g.SortTitle" Sortable />
<PropertyColumn Property="g => g.ReleasedOn" Format="MM/dd/yyyy" Sortable />
<PropertyColumn Property="g => g.CreatedOn" Format="MM/dd/yyyy hh:mm" Sortable />
<PropertyColumn Property="g => g.CreatedBy" Sortable>
@context.CreatedBy?.UserName
</PropertyColumn>
<PropertyColumn Property="g => g.UpdatedOn" Format="MM/dd/yyyy hh:mm" Sortable />
<PropertyColumn Property="g => g.UpdatedBy" Sortable>
@context.UpdatedBy?.UserName
</PropertyColumn>
<ActionColumn Title="">
<Space Style="display: flex; justify-content: end">
<SpaceItem>
<Button Type="@ButtonType.Text" Icon="@IconType.Outline.Edit" OnClick="() => Edit(context)" />
</SpaceItem>
</Space>
</ActionColumn>
</Table>
</Body>
</Card>
@code {
IEnumerable<Game> Games { get; set; } = new List<Game>();
private string Search { get; set; }
protected override async Task OnInitializedAsync()
bool Loading = true;
protected override void OnAfterRender(bool firstRender)
{
Games = GameService.Get().OrderBy(g => String.IsNullOrWhiteSpace(g.SortTitle) ? g.Title : g.SortTitle).ToList();
if (firstRender)
{
Games = GameService.Get().OrderBy(g => String.IsNullOrWhiteSpace(g.SortTitle) ? g.Title : g.SortTitle).ToList();
StateHasChanged();
Loading = false;
StateHasChanged();
}
}
private string GetIcon(Game game)