Correct style and add loader
All checks were successful
Game Ideas build for PR / build_blazor_app (pull_request) Successful in 49s

This commit is contained in:
Maxime Adler
2025-04-15 11:13:32 +02:00
parent 1b7a43e2ac
commit ab0ab54f61
13 changed files with 93 additions and 50 deletions

View File

@@ -1,4 +1,5 @@
@using Blazored.FluentValidation
@using GameIdeas.BlazorApp.Shared.Components.CircleLoader
@using GameIdeas.BlazorApp.Shared.Components.SelectSearch
@using GameIdeas.BlazorApp.Shared.Components.Slider
@using GameIdeas.Shared.Dto
@@ -22,14 +23,14 @@
<div class="input-game">
<div class="label">@ResourcesKey.Developers :</div>
<SelectSearch TItem="DeveloperDto" Theme="Theme" GetLabel="@(i => i.Name)" QuickAdd=true
Items="Categories?.Developers" @bind-Values=GameDto.Developers
AddItem="@(str => new DeveloperDto() { Name = str })" />
Items="Categories?.Developers" @bind-Values=GameDto.Developers
AddItem="@(str => new DeveloperDto() { Name = str })" />
</div>
<div class="input-game">
<div class="label">@ResourcesKey.Publishers :</div>
<SelectSearch TItem="PublisherDto" Theme="Theme" GetLabel="@(i => i.Name)" QuickAdd=true
Items="Categories?.Publishers" @bind-Values=GameDto.Publishers
AddItem="@(str => new PublisherDto() { Name = str })" />
Items="Categories?.Publishers" @bind-Values=GameDto.Publishers
AddItem="@(str => new PublisherDto() { Name = str })" />
</div>
</div>
<div class="container">
@@ -42,21 +43,21 @@
<div class="input-game">
<div class="label">@ResourcesKey.Properties :</div>
<SelectSearch TItem="PropertyDto" Theme="Theme" GetLabel="@(i => i.Label)" QuickAdd=true
Items="Categories?.Properties" @bind-Values=GameDto.Properties
AddItem="@(str => new PropertyDto() { Label = str })" />
Items="Categories?.Properties" @bind-Values=GameDto.Properties
AddItem="@(str => new PropertyDto() { Label = str })" />
</div>
<div class="input-game">
<div class="label">@ResourcesKey.Tags :</div>
<SelectSearch TItem="TagDto" Theme="Theme" GetLabel="@(i => i.Label)" QuickAdd=true
Items="Categories?.Tags" @bind-Values=GameDto.Tags
AddItem="@(str => new TagDto() { Label = str })" />
Items="Categories?.Tags" @bind-Values=GameDto.Tags
AddItem="@(str => new TagDto() { Label = str })" />
</div>
<div class="input-game">
<div class="label">@ResourcesKey.Platforms :</div>
<SelectSearch TItem="PlatformDto" Theme="Theme" GetLabel="@(i => i.Label)" QuickAdd=true
Items="Categories?.Platforms" @bind-Values=GameDto.Platforms
AddItem="@(str => new PlatformDto() { Label = str })" />
Items="Categories?.Platforms" @bind-Values=GameDto.Platforms
AddItem="@(str => new PlatformDto() { Label = str })" />
</div>
@foreach (var platform in GameDto.Platforms ?? [])
@@ -75,13 +76,18 @@
<div class="bottom-container">
<ValidationSummary class="invalid-content" />
<div class="buttons">
<button type="reset" class="cancel" @onclick=HandleOnCancel>
@ResourcesKey.Reset
</button>
<button type="submit" class="submit">
@ResourcesKey.Save
</button>
<div class="buttons">
<button type="reset" class="cancel" @onclick=HandleOnCancel disabled="@IsLoading">
@ResourcesKey.Reset
</button>
<button type="submit" class="submit" disabled="@IsLoading">
@ResourcesKey.Save
</button>
</div>
</div>
</div>
</EditForm>
</EditForm>
@if (IsLoading)
{
<CircleLoader />
}

View File

@@ -20,22 +20,18 @@ public partial class GameCreationForm
private EditContext? EditContext;
private readonly SelectTheme Theme = SelectTheme.Creation;
private readonly SliderParams SliderParams = new() { Gap = 1, Min = 1, Max = 5 };
private bool IsLoading = true;
protected override async Task OnInitializedAsync()
{
EditContext = new(GameDto);
if (Popup != null)
{
Popup.StateChanged += async (_, isOpen) => await HandlePopupStateChanged();
}
await base.OnInitializedAsync();
}
private async Task HandlePopupStateChanged()
protected override async Task OnAfterRenderAsync(bool firstRender)
{
await Js.InvokeVoidAsync("resizeGameForm");
}
private void HandleOnCancel()
@@ -50,6 +46,10 @@ public partial class GameCreationForm
return;
}
IsLoading = true;
await GameGateway.CreateGame(GameDto);
IsLoading = false;
}
}

View File

@@ -78,7 +78,6 @@
height: 28px;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
@@ -98,6 +97,7 @@
}
.buttons {
margin-left: auto;
height: 100%;
display: flex;
flex-direction: row;
@@ -112,4 +112,9 @@
color: var(--white);
font-weight: bold;
padding: 0 10px;
cursor: pointer;
}
.buttons button:hover {
background: var(--violet-selected);
}

View File

@@ -24,6 +24,6 @@
<AdvancedGameFilter @bind-GameFilter=GameFilter Categories="Categories" />
</div>
<Popup @ref=ManualAddPopup BackdropFilterClicked="HandleBackdropManualAddClicked">
<Popup @ref=ManualAddPopup BackdropFilterClicked="HandleBackdropManualAddClicked" Closable=false>
<GameCreationForm Categories="Categories" />
</Popup>