131 lines
6.4 KiB
Plaintext
131 lines
6.4 KiB
Plaintext
@page "/login"
|
||
@rendermode InteractiveServer
|
||
@attribute [AllowAnonymous]
|
||
@inject NavigationManager Nav
|
||
@inject ISnackbar Snackbar
|
||
|
||
<PageTitle>Anmelden – Timetracker</PageTitle>
|
||
|
||
<MudContainer MaxWidth="MaxWidth.Small" Class="mt-16">
|
||
<MudStack AlignItems="AlignItems.Center" Spacing="4">
|
||
|
||
@* ── Logo / Header ── *@
|
||
<MudStack AlignItems="AlignItems.Center" Spacing="1">
|
||
<MudIcon Icon="@Icons.Material.Filled.AccessTime"
|
||
Style="font-size:4rem; color:#1565C0" />
|
||
<MudText Typo="Typo.h4" Style="font-weight:700; color:#1565C0">Timetracker</MudText>
|
||
</MudStack>
|
||
|
||
<MudPaper Elevation="4" Class="pa-6 rounded-xl" Style="width:100%">
|
||
<MudTabs @bind-ActivePanelIndex="_activeTab" Rounded="true" Centered="true" Color="Color.Primary">
|
||
|
||
@* ── Login ── *@
|
||
<MudTabPanel Text="Anmelden">
|
||
<MudStack Spacing="3" Class="mt-4">
|
||
@if (_error != null && _activeTab == 0)
|
||
{
|
||
<MudAlert Severity="Severity.Error" Dense="true">@_error</MudAlert>
|
||
}
|
||
<form action="/auth/login" method="post">
|
||
<MudStack Spacing="3">
|
||
<MudTextField @bind-Value="_loginUsername"
|
||
Label="Benutzername"
|
||
Variant="Variant.Outlined"
|
||
Adornment="Adornment.Start"
|
||
AdornmentIcon="@Icons.Material.Filled.Person"
|
||
name="username"
|
||
AutoFocus="true" />
|
||
<MudTextField @bind-Value="_loginPassword"
|
||
Label="Passwort"
|
||
Variant="Variant.Outlined"
|
||
Adornment="Adornment.Start"
|
||
AdornmentIcon="@Icons.Material.Filled.Lock"
|
||
InputType="@(_showLoginPw ? InputType.Text : InputType.Password)"
|
||
AdornmentAriaLabel="Passwort anzeigen"
|
||
name="password"
|
||
OnAdornmentClick="@(() => _showLoginPw = !_showLoginPw)" />
|
||
<MudButton ButtonType="ButtonType.Submit"
|
||
Variant="Variant.Filled"
|
||
Color="Color.Primary"
|
||
FullWidth="true"
|
||
Size="Size.Large"
|
||
StartIcon="@Icons.Material.Filled.Login">
|
||
Anmelden
|
||
</MudButton>
|
||
</MudStack>
|
||
</form>
|
||
</MudStack>
|
||
</MudTabPanel>
|
||
|
||
@* ── Registrieren ── *@
|
||
<MudTabPanel Text="Registrieren">
|
||
<MudStack Spacing="3" Class="mt-4">
|
||
@if (_error != null && _activeTab == 1)
|
||
{
|
||
<MudAlert Severity="Severity.Error" Dense="true">@_error</MudAlert>
|
||
}
|
||
<form action="/auth/register" method="post">
|
||
<MudStack Spacing="3">
|
||
<MudTextField @bind-Value="_regUsername"
|
||
Label="Benutzername"
|
||
Variant="Variant.Outlined"
|
||
Adornment="Adornment.Start"
|
||
AdornmentIcon="@Icons.Material.Filled.Person"
|
||
name="username"
|
||
HelperText="Mindestens 3 Zeichen" />
|
||
<MudTextField @bind-Value="_regPassword"
|
||
Label="Passwort"
|
||
Variant="Variant.Outlined"
|
||
Adornment="Adornment.Start"
|
||
AdornmentIcon="@Icons.Material.Filled.Lock"
|
||
InputType="@(_showRegPw ? InputType.Text : InputType.Password)"
|
||
AdornmentAriaLabel="Passwort anzeigen"
|
||
name="password"
|
||
HelperText="Mindestens 6 Zeichen"
|
||
OnAdornmentClick="@(() => _showRegPw = !_showRegPw)" />
|
||
<MudButton ButtonType="ButtonType.Submit"
|
||
Variant="Variant.Filled"
|
||
Color="Color.Secondary"
|
||
FullWidth="true"
|
||
Size="Size.Large"
|
||
StartIcon="@Icons.Material.Filled.PersonAdd">
|
||
Konto erstellen
|
||
</MudButton>
|
||
</MudStack>
|
||
</form>
|
||
</MudStack>
|
||
</MudTabPanel>
|
||
|
||
</MudTabs>
|
||
</MudPaper>
|
||
</MudStack>
|
||
</MudContainer>
|
||
|
||
@code {
|
||
private int _activeTab = 0;
|
||
private string? _error;
|
||
private string _loginUsername = "";
|
||
private string _loginPassword = "";
|
||
private string _regUsername = "";
|
||
private string _regPassword = "";
|
||
private bool _showLoginPw;
|
||
private bool _showRegPw;
|
||
|
||
[SupplyParameterFromQuery(Name = "error")]
|
||
public string? ErrorParam { get; set; }
|
||
|
||
[SupplyParameterFromQuery(Name = "tab")]
|
||
public string? TabParam { get; set; }
|
||
|
||
protected override void OnParametersSet()
|
||
{
|
||
_error = ErrorParam switch
|
||
{
|
||
"invalid" => "Benutzername oder Passwort falsch.",
|
||
not null => Uri.UnescapeDataString(ErrorParam),
|
||
_ => null
|
||
};
|
||
_activeTab = TabParam == "register" ? 1 : 0;
|
||
}
|
||
}
|