lanpartytools
/
LANCommander
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 17 Activity

Fix styling for Settings pages. Use loading indicator on users and avoid blocking UI thread while loading them

blazor
Pat Hartl 2023-03-03 17:34:27 -06:00
parent 830edf3e55
commit 7b6fd7cb0f
3 changed files with 71 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
LANCommander/Pages/Settings/General.razor
View File

@ -4,23 +4,24 @@
@inject SettingService SettingService
@inject IMessageService MessageService
<Card Title="General">
<Body>
<Text>IGDB Credentials</Text>
<Text>In order to use IGDB metadata, you need a Twitch developer account. <a href="https://api-docs.igdb.com/#account-creation" target="_blank">Click here</a> for more details.</Text>
<Form Model="Settings">
<FormItem Label="Client ID">
<Input @bind-Value="context.IGDBClientId" />
</FormItem>
<FormItem Label="Client Secret">
<InputPassword @bind-Value="context.IGDBClientSecret" />
</FormItem>
<FormItem>
<Button OnClick="Save" Icon="@IconType.Fill.Save">Save</Button>
</FormItem>
</Form>
</Body>
</Card>
<PageHeader Title="General" />
<div style="padding: 0 24px;">
<Text>IGDB Credentials</Text>
<Text>In order to use IGDB metadata, you need a Twitch developer account. <a href="https://api-docs.igdb.com/#account-creation" target="_blank">Click here</a> for more details.</Text>
<Form Model="Settings" Layout="@FormLayout.Vertical">
<FormItem Label="Client ID">
<Input @bind-Value="context.IGDBClientId" />
</FormItem>
<FormItem Label="Client Secret">
<InputPassword @bind-Value="context.IGDBClientSecret" />
</FormItem>
<FormItem>
<Button OnClick="Save" Icon="@IconType.Fill.Save">Save</Button>
</FormItem>
</Form>
</div>
@code {
private LANCommanderSettings Settings;

20
LANCommander/Pages/Settings/SettingsLayout.razor
View File

@ -1,15 +1,21 @@
@inherits LayoutComponentBase
@layout MainLayout
<GridRow>
<GridCol Span="6">
<Menu Mode=@MenuMode.Vertical>
<Layout Class="site-layout-background" Style="padding: 24px 0;">
<Sider Class="site-layout-background" Width="200">
<Menu Mode=@MenuMode.Inline Style="height: 100%">
<MenuItem RouterLink="/Settings/General">General</MenuItem>
<MenuItem RouterLink="/Settings/Users">Users</MenuItem>
</Menu>
</GridCol>
</Sider>
<GridCol Span="18">
<Content>
@Body
</GridCol>
</GridRow>
</Content>
</Layout>
<style>
.site-layout-background {
background: #fff;
}
</style>

70
LANCommander/Pages/Settings/Users.razor
View File

@ -5,41 +5,48 @@
@inject RoleManager<Role> RoleManager
@inject IMessageService MessageService
<Card Title="Users">
<Body>
<Table TItem="UserViewModel" DataSource="@UserList">
<PropertyColumn Property="u => u.UserName" />
<PropertyColumn Property="u => u.Roles">
@String.Join(", ", context.Roles)
</PropertyColumn>
<PropertyColumn Property="u => u.SavesSize">
@ByteSizeLib.ByteSize.FromBytes(context.SavesSize)
</PropertyColumn>
<ActionColumn>
<Space>
<SpaceItem>
@if (!context.Roles.Any(r => r == "Administrator"))
{
<Button OnClick="() => PromoteUser(context)">Promote</Button>
}
else
{
<Button OnClick="() => DemoteUser(context)">Demote</Button>
}
</SpaceItem>
</Space>
</ActionColumn>
</Table>
</Body>
</Card>
<PageHeader Title="Users" />
<div style="padding: 0 24px;">
<Table TItem="UserViewModel" DataSource="@UserList" Loading="@(Loading)">
<PropertyColumn Property="u => u.UserName" Title="Username" />
<PropertyColumn Property="u => u.Roles">
@String.Join(", ", context.Roles)
</PropertyColumn>
<PropertyColumn Property="u => u.SavesSize" Title="Saves">
@ByteSizeLib.ByteSize.FromBytes(context.SavesSize)
</PropertyColumn>
<ActionColumn>
<Space Style="display: flex; justify-content: end">
<SpaceItem>
@if (!context.Roles.Any(r => r == "Administrator"))
{
<Button OnClick="() => PromoteUser(context)" Type="@ButtonType.Primary">Promote</Button>
}
else
{
<Button OnClick="() => DemoteUser(context)" Danger>Demote</Button>
}
</SpaceItem>
</Space>
</ActionColumn>
</Table>
</div>
@code {
private ICollection<UserViewModel> UserList { get; set; }
private string Search { get; set; }
ICollection<UserViewModel> UserList { get; set; }
bool Loading = true;
protected override async Task OnInitializedAsync()
{
await RefreshUserList();
UserList = new List<UserViewModel>();
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
await RefreshUserList();
}
private async Task RefreshUserList()
@ -63,6 +70,9 @@
SavesSize = saveSize
});
}
Loading = false;
StateHasChanged();
}
private async Task PromoteUser(UserViewModel user)