Enhance user authentication and management: add unverified user check, update error messages, and improve user interface for better usability
All checks were successful
Build And Push Dev Docker Image / docker (push) Successful in 1m52s

This commit is contained in:
troogs
2026-04-26 10:28:31 +02:00
parent 54effa67ac
commit 870930914e
4 changed files with 195 additions and 145 deletions

View File

@@ -6,111 +6,131 @@
@inherits FoodsharingSiegen.Server.BaseClasses.FsBase
@code {
private RenderFragment PopupTitleTemplate(PopupTitleContext<User> value)
{
var header = "Benutzer erstellen";
if (value.EditState == DataGridEditState.Edit) header = "Benutzer bearbeiten";
return builder =>
{
builder.OpenElement(0, "span");
builder.AddContent(1, header);
builder.CloseElement();
};
}
}
<PageTitle>Benutzerverwaltung - @AppSettings.Terms.Title</PageTitle>
<h2>Benutzerverwaltung <span style="font-size: .5em; line-height: 0;">Admin</span></h2>
<div class="my-2">
<Button Color="Color.Primary" Disabled="@(SelectedUser == null)" Clicked="async () => await PasswordModal?.Show(SelectedUser!)!"><i class="fa-solid fa-key"></i>&nbsp;setzen</Button>
<div class="d-flex justify-content-between align-items-center mb-3">
<h2>Benutzerverwaltung <span style="font-size: .5em; line-height: 0;">Admin</span></h2>
<Button Color="Color.Success" Clicked="CreateNewUser">
<Icon Name="IconName.Add" /> Benutzer erstellen
</Button>
</div>
<DataGrid TItem="User"
@ref="UserDataGrid"
Data="@UserList"
CommandMode="DataGridCommandMode.Commands"
EditMode="DataGridEditMode.Popup"
PopupTitleTemplate="PopupTitleTemplate"
RowInserted="RowInserted"
RowUpdated="RowUpdated"
PageSize="50"
@bind-SelectedRow="SelectedUser"
RowDoubleClicked="arg => UserDataGrid?.Edit(arg.Item)!"
Editable
Responsive="true">
<DataGridColumns>
<DataGridCommandColumn TItem="User" Width="100px" CellClass="@(_ => "px-0 d-flex align-items-center justify-content-center")">
<NewCommandTemplate>
<Button Size="Size.ExtraSmall" Color="Color.Success" Clicked="@context.Clicked" Class="mr-1" Style="min-width: auto;">
<i class="oi oi-plus"></i>
</Button>
</NewCommandTemplate>
<EditCommandTemplate>
<Button Size="Size.ExtraSmall" Color="Color.Secondary" Clicked="@context.Clicked" Class="mr-1" Style="min-width: auto;">
<i class="oi oi-pencil"></i>
</Button>
</EditCommandTemplate>
<DeleteCommandTemplate>
<Button Size="Size.ExtraSmall" Color="Color.Danger" Clicked="() => RemoveUserAsync(context.Item)" Class="mr-1" Style="min-width: auto;">
<i class="oi oi-trash"></i>
</Button>
</DeleteCommandTemplate>
<ClearFilterCommandTemplate>
<Button Size="Size.ExtraSmall" Color="Color.Danger" Clicked="@context.Clicked" Style="min-width: auto;">
<i class="o"></i> <i class="fas fa-trash"></i>
</Button>
</ClearFilterCommandTemplate>
</DataGridCommandColumn>
<DataGridCheckColumn TItem="User" Field="@nameof(User.Verified)" Caption="Verifiziert" Editable="true" Width="100px">
<DisplayTemplate>
<Check TValue="bool" Checked="context.Verified" Disabled="true" ReadOnly="true"/>
</DisplayTemplate>
</DataGridCheckColumn>
<DataGridColumn TItem="User" Field="@nameof(User.Type)" Caption="Typ" Editable="true" Width="200px">
<EditTemplate>
<Select TValue="UserType" SelectedValue="@((UserType)context.CellValue)" SelectedValueChanged="@(v => context.CellValue = v)">
@foreach (var enumValue in Enum.GetValues<UserType>())
{
<SelectItem TValue="UserType" Value="enumValue">@enumValue</SelectItem>
}
</Select>
</EditTemplate>
</DataGridColumn>
<DataGridColumn TItem="User" Field="@nameof(User.Name)" Caption="Name" Editable="true" Width="250px"></DataGridColumn>
<DataGridColumn TItem="User" Field="@nameof(User.Mail)" Caption="E-Mail" Editable="true"></DataGridColumn>
<DataGridColumn TItem="User" Field="@nameof(User.GroupsList)" Caption="Gruppen" Editable="true">
<EditTemplate>
<Autocomplete TItem="UserGroup"
TValue="UserGroup"
Size="Size.ExtraSmall"
Data="@UserGroups"
TextField="@(( item ) => item.ToString())"
ValueField="@(( item ) => item)"
SelectionMode="AutocompleteSelectionMode.Multiple"
SelectedValues="@((List<UserGroup>) context.CellValue)"
SelectedValuesChanged="@(v => { context.CellValue = v.ToList(); })"
@bind-SelectedTexts="SelectedCompanyTexts">
</Autocomplete>
<small>Verfügbar: @string.Join(", ", Enum.GetValues<UserGroup>())</small>
</EditTemplate>
<DisplayTemplate>
@if (string.IsNullOrWhiteSpace(context.Groups))
{
<span style="font-style: italic;">Keine Gruppen</span>
}
else
{
<span>@string.Join(", ", context.GroupsList)</span>
}
</DisplayTemplate>
</DataGridColumn>
</DataGridColumns>
</DataGrid>
<div class="user-grid" style="max-width: 1000px;">
@if (SortedUsers != null)
{
@foreach (var user in SortedUsers)
{
<Card Class="user-card">
<CardBody>
<CardTitle Size="4">@user.Name</CardTitle>
<CardSubtitle Class="mb-2 text-muted">@user.Mail</CardSubtitle>
<CardText>
Typ:
@if (user.Type == UserType.Unverified)
{
<span style="color: red" class="fw-bold">@user.Type</span>
}
else if (user.Type == UserType.Admin)
{
<span style="color: blue" class="fw-bold">@user.Type</span>
}
else
{
@user.Type
}
</CardText>
<div class="mb-3">
@if (user.GroupsList != null && user.GroupsList.Any())
{
@foreach(var group in user.GroupsList)
{
<Badge Color="Color.Primary" Class="me-1" Style="font-size: 0.8em;">@group.ToString()</Badge>
}
}
else
{
<span class="text-muted" style="font-style: italic; font-size: 0.8em;">Keine Gruppen</span>
}
</div>
</CardBody>
<CardFooter Class="d-flex justify-content-between">
<div>
<Button Color="Color.Primary" Size="Size.Small" Class="me-2" Clicked="() => EditUser(user)"><Icon Name="IconName.Edit" /></Button>
<Button Color="Color.Info" Size="Size.Small" Clicked="() => SetPassword(user)"><i class="fa-solid fa-key"></i></Button>
</div>
<Button Color="Color.Danger" Size="Size.Small" Clicked="() => RemoveUserAsync(user)"><Icon Name="IconName.Delete" /></Button>
</CardFooter>
</Card>
}
}
</div>
<style>
.user-grid {
display: grid;
grid-template-columns: repeat(1, 1fr);
gap: 1rem;
}
@@media (min-width: 700px) {
.user-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@@media (min-width: 1070px) {
.user-grid {
grid-template-columns: repeat(3, 1fr);
}
}
</style>
<Modal @ref="editUserModal">
<ModalContent Centered>
<ModalHeader>
<ModalTitle>@(IsEditing ? "Benutzer bearbeiten" : "Benutzer erstellen")</ModalTitle>
<CloseButton />
</ModalHeader>
<ModalBody>
@if (EditModel != null)
{
<Field>
<FieldLabel>Name</FieldLabel>
<TextEdit @bind-Text="EditModel.Name" />
</Field>
<Field>
<FieldLabel>E-Mail</FieldLabel>
<TextEdit @bind-Text="EditModel.Mail" />
</Field>
<Field>
<FieldLabel>Typ</FieldLabel>
<Select TValue="UserType" SelectedValue="EditModel.Type" SelectedValueChanged="@(v => EditModel.Type = v)">
@foreach (var enumValue in Enum.GetValues<UserType>())
{
<SelectItem TValue="UserType" Value="enumValue">@enumValue</SelectItem>
}
</Select>
</Field>
<Field>
<FieldLabel>Gruppen</FieldLabel>
<Autocomplete TItem="UserGroup"
TValue="UserGroup"
Data="@UserGroups"
TextField="@(( item ) => item.ToString())"
ValueField="@(( item ) => item)"
SelectionMode="AutocompleteSelectionMode.Multiple"
SelectedValues="@EditModel.GroupsList"
SelectedValuesChanged="@(v => { EditModel.GroupsList = v.ToList(); })"
@bind-SelectedTexts="SelectedGroupTexts">
</Autocomplete>
<small>Verfügbar: @string.Join(", ", Enum.GetValues<UserGroup>())</small>
</Field>
}
</ModalBody>
<ModalFooter>
<Button Color="Color.Secondary" Clicked="() => editUserModal?.Hide()">Abbrechen</Button>
<Button Color="Color.Primary" Clicked="SaveUser">Speichern</Button>
</ModalFooter>
</ModalContent>
</Modal>
<SetPasswordModal @ref="PasswordModal" OnPasswortSet="OnPasswordSet"></SetPasswordModal>