UI
Some checks failed
Tech / explore-gitea-actions (push) Has been cancelled

This commit is contained in:
SpecialX
2025-08-31 11:29:26 +08:00
parent 017cc2169c
commit c59762a392
65 changed files with 3996 additions and 330 deletions

View File

@@ -1,96 +1,96 @@
@page "/register"
@using System.ComponentModel.DataAnnotations
@using Microsoft.AspNetCore.Components
@using Entities.Contracts
@using System.Globalization;
@inject ISnackbar Snackbar
<div class="d-flex flex-grow-1 page-container">
<MudText Typo="Typo.h2"> Create Account </MudText>
<div class="d-flex mud-paper-80-percent-centered w-75">
<MudPaper Class="d-flex flex-grow-1 ma-0 pa-0" style="background-color:transparent; min-height:100%" Elevation="0">
<EditForm Model="@_userForRegistration" OnValidSubmit="Register" FormName="RegistrationForm">
<DataAnnotationsValidator />
<MudGrid>
<MudItem xs="12" sm="7">
<MudCard>
<MudCardContent>
<MudTextField Label="Name" HelperText="Max. 8 characters"
@bind-Value="_userForRegistration.Name" For="@(() => _userForRegistration.Email)" />
<MudTextField Label="Email" Class="mt-3"
@bind-Value="_userForRegistration.Email" For="@(() => _userForRegistration.Email)" />
<MudTextField Label="Password" HelperText="Choose a strong password" Class="mt-3"
@bind-Value="_userForRegistration.Password" For="@(() => _userForRegistration.Password)" InputType="InputType.Password" />
<MudTextField Label="Password" HelperText="Repeat the password" Class="mt-3"
@bind-Value="_userForRegistration.ConfirmPassword" For="@(() => _userForRegistration.ConfirmPassword)" InputType="InputType.Password" />
<MudRadioGroup T="UserRoles" Label="Roles" @bind-Value="_userForRegistration.Roles">
@foreach (UserRoles item in Enum.GetValues(typeof(UserRoles)))
{
if (item != UserRoles.Administrator)
{
<MudRadio Value="@item">@item.ToString()</MudRadio>
}
}
</MudRadioGroup>
<MudStack Row="true">
<MudGrid Class="d-flex flex-grow-1" style="background-color:transparent; min-height:100%">
<MudItem xs="12" sm="4" style="background-color:transparent">
<MudPaper Class="d-flex flex-column align-start justify-start mud-width-full h-100 pa-8" Elevation="0" Style="background-color:transparent">
<MudText Style="color:#ffffff" Typo="Typo.h4">TechHelper</MudText>
<MudText Style="color:#ffffff" Typo="Typo.body2">快速注册,开始你的管理之旅。</MudText>
<MudSpacer />
<MudText Style="color:#ffffff" Typo="Typo.h4">学而不思则罔,</MudText>
<MudText Style="color:#ffffff" Typo="Typo.h4"> 思而不学则殆。</MudText>
<MudImage Alt="Hello World" Fluid="true" Src="ref/UnFinish.png" />
</MudPaper>
</MudItem>
<MudTextField Label="Class"
HelperText="Enter a class number between 1 and 14."
Class="mt-3"
@bind-Value="_userForRegistration.Class"
For="@(() => _userForRegistration.Class)"
InputType="InputType.Number"
Required="true"
RequiredError="Class is required." />
<MudItem xs="12" sm="8" style="background-color:transparent">
<MudTextField Label="Grade"
HelperText="Enter a grade number between 1 and 6."
Class="mt-3"
@bind-Value="_userForRegistration.Grade"
For="@(() => _userForRegistration.Grade)"
InputType="InputType.Number"
Required="true"
RequiredError="Grade is required." />
</MudStack>
<MudPaper Class="d-flex flex-row flex-grow-1 justify-center rounded-xl px-20 mud-height-full">
<EditForm Model="@_userForRegistration" OnValidSubmit="Register" FormName="RegistrationForm" class="w-100">
<DataAnnotationsValidator />
<MudPaper Class="d-flex flex-column flex-grow-1 rounded-xl px-5 justify-content-center pt-15 w-100 " Elevation="0" Outlined="false">
<MudText Typo="Typo.h5"> <b>注册账户</b> </MudText>
<MudTextField Label="Name" HelperText="Max. 8 characters"
@bind-Value="_userForRegistration.Name" For="@(() => _userForRegistration.Email)" />
<MudTextField Label="Email" Class="mt-3"
@bind-Value="_userForRegistration.Email" For="@(() => _userForRegistration.Email)" />
<MudTextField Label="Password" HelperText="Choose a strong password" Class="mt-3"
@bind-Value="_userForRegistration.Password" For="@(() => _userForRegistration.Password)" InputType="InputType.Password" />
<MudTextField Label="Password" HelperText="Repeat the password" Class="mt-3"
@bind-Value="_userForRegistration.ConfirmPassword" For="@(() => _userForRegistration.ConfirmPassword)" InputType="InputType.Password" />
<MudChipSet T="UserRoles" @bind-SelectedValue="_userForRegistration.Roles" CheckMark SelectionMode="SelectionMode.SingleSelection" Class="w-100">
<MudChip Text="Student" Color="Color.Primary" Value="@UserRoles.Student">Student</MudChip>
<MudChip Text="Teacher" Color="Color.Secondary" Value="@UserRoles.Teacher">Teacher</MudChip>
</MudChipSet>
<MudTextField Label="Phone Number"
HelperText="Enter your phone number (optional, 7-20 digits)."
Class="mt-3"
@bind-Value="_userForRegistration.PhoneNumber"
For="@(() => _userForRegistration.PhoneNumber)"
InputType="InputType.Telephone" /> <MudTextField Label="Home Address"
HelperText="Enter your home address (optional, max 200 characters)."
Class="mt-3"
@bind-Value="_userForRegistration.HomeAddress"
For="@(() => _userForRegistration.HomeAddress)"
Lines="3" />
</MudCardContent>
<MudCardActions>
<MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Class="ml-auto">Register</MudButton>
</MudCardActions>
</MudCard>
</MudItem>
<MudItem xs="12" sm="5">
<MudPaper Class="pa-4 mud-height-full">
<MudText Typo="Typo.subtitle2">Validation Summary</MudText>
@if (success)
{
<MudText Color="Color.Success">Success</MudText>
}
else
{
<MudText Color="@Color.Error">
<ValidationSummary />
</MudText>
}
</MudPaper>
</MudItem>
<MudItem xs="12">
<MudText Typo="Typo.body2" Align="Align.Center">
Fill out the form correctly to see the success message.
</MudText>
</MudItem>
</MudGrid>
</EditForm>
<MudStack Row="true">
<MudSelect T="GradeEnum" Value="grade" Label="Select Grade" AdornmentColor="Color.Secondary" ValueChanged="HandleSelectedValuesChanged">
@foreach (GradeEnum item in Enum.GetValues(typeof(GradeEnum)))
{
<MudSelectItem Value="@item">@item</MudSelectItem>
}
</MudSelect>
<MudSelect T="byte" Value="selectclass" Label="Select Class" AdornmentColor="Color.Secondary" ValueChanged="HandleListSelectedValuesChanged">
@foreach (byte item in Classes)
{
<MudSelectItem Value="@item">@item</MudSelectItem>
}
</MudSelect>
</MudStack>
<MudStack Row=true Class="align-content-center justify-content-start my-3">
<MudCheckBox @bind-Value="Basic_CheckBox2" Color="Color.Primary"></MudCheckBox>
<MudText Typo="Typo.body2" Align=Align.Center Class="align-content-center"> 点击注册,即表示你同意我们的服务条款和隐私政策。 </MudText>
</MudStack>
<MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Class="w-100 mx-0 my-3 justify-content-center rounded-pill">LOGIN</MudButton>
<MudText Typo="Typo.body2" Class="justify-content-center mx-auto mt-5" Color="Color.Dark">
已有账户?
<a href="/login" style="color: blue;">Sign up</a>
</MudText>
</MudPaper>
</EditForm>
</MudPaper>
</MudItem>
</MudGrid>
</MudPaper>
</div>
</div>