This commit is contained in:
SpecialX
0
TechHelper.Client/Pages/Author/Component.razor
Normal file
0
TechHelper.Client/Pages/Author/Component.razor
Normal file
@@ -1,48 +1,59 @@
|
||||
@page "/login"
|
||||
|
||||
<MudText Typo="Typo.h2"> Login Account </MudText>
|
||||
<div class="d-flex flex-column flex-grow-1 page-containerr">
|
||||
|
||||
<EditForm Model="@_userForAuth" OnValidSubmit="Logining" FormName="LoginingForm">
|
||||
<DataAnnotationsValidator />
|
||||
<MudGrid>
|
||||
<MudItem xs="12" sm="7">
|
||||
<MudCard>
|
||||
<MudCardContent>
|
||||
<MudTextField Label="Email" Class="mt-3"
|
||||
@bind-Value="_userForAuth.Email" For="@(() => _userForAuth.Email)" />
|
||||
<MudTextField Label="Password" HelperText="Choose a strong password" Class="mt-3"
|
||||
@bind-Value="_userForAuth.Password" For="@(() => _userForAuth.Password)" InputType="InputType.Password" />
|
||||
</MudCardContent>
|
||||
<MudCardActions>
|
||||
<MudButton ButtonType="ButtonType.Submit" Variant="Variant.Filled" Color="Color.Primary" Class="ml-auto">Register</MudButton>
|
||||
</MudCardActions>
|
||||
<div class="d-flex mud-paper-80-percent-centeredd w-75">
|
||||
<MudPaper Class="d-flex flex-grow-1 ma-0 pa-0" style="background-color:transparent; min-height:100%" Elevation="0">
|
||||
|
||||
<div class="nav-item px-3">
|
||||
<NavLink class="nav-link" href="forgotpassword">
|
||||
<span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span>Forgot Password
|
||||
</NavLink>
|
||||
</div>
|
||||
</MudCard>
|
||||
</MudItem>
|
||||
<MudItem xs="12" sm="5">
|
||||
<MudPaper Class="pa-4 mud-height-full">
|
||||
<MudText Typo="Typo.subtitle2">Validation Summary</MudText>
|
||||
@if (!ShowRegistrationErrors)
|
||||
{
|
||||
<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>
|
||||
<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>
|
||||
|
||||
<MudItem xs="12" sm="8" style="background-color:transparent">
|
||||
|
||||
<MudPaper Class="d-flex flex-row flex-grow-1 justify-center rounded-xl px-0 mud-height-full" >
|
||||
|
||||
<EditForm Model="@_userForAuth" OnValidSubmit="Logining" FormName="LoginingForm" class="w-100">
|
||||
<DataAnnotationsValidator />
|
||||
<MudPaper Class="d-flex flex-column flex-grow-1 rounded-xl px-15 justify-content-center pt-15 w-100 " Elevation="0" Outlined="false">
|
||||
<MudText Typo="Typo.h5"> <b>登录账户</b> </MudText>
|
||||
<MudTextField Label="Email" Class="mt-3"
|
||||
@bind-Value="_userForAuth.Email" For="@(() => _userForAuth.Email)" />
|
||||
<MudTextField Label="Password" HelperText="Choose a strong password" Class="mt-3"
|
||||
@bind-Value="_userForAuth.Password" For="@(() => _userForAuth.Password)" InputType="InputType.Password" />
|
||||
|
||||
|
||||
<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="/register" style="color: blue;">Sign in</a>
|
||||
</MudText>
|
||||
</MudPaper>
|
||||
|
||||
</EditForm>
|
||||
|
||||
</MudPaper>
|
||||
|
||||
</MudItem>
|
||||
</MudGrid>
|
||||
</MudPaper>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -16,6 +16,8 @@ namespace TechHelper.Client.Pages.Author
|
||||
[Inject]
|
||||
public NavigationManager NavigationManager { get; set; }
|
||||
|
||||
|
||||
public bool Basic_CheckBox2 { get; set; } = true;
|
||||
public bool ShowRegistrationErrors { get; set; }
|
||||
public string Error { get; set; }
|
||||
|
||||
|
||||
29
TechHelper.Client/Pages/Author/Login.razor.css
Normal file
29
TechHelper.Client/Pages/Author/Login.razor.css
Normal file
@@ -0,0 +1,29 @@
|
||||
.page-containerr {
|
||||
width: 100%;
|
||||
height: 100%; /* <20>ӿڸ߶ȣ<DFB6>ȷ<EFBFBD><C8B7><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>㹻<EFBFBD>ĸ߶<C4B8><DFB6><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ԫ<EFBFBD><D4AA> */
|
||||
display: flex;
|
||||
flex-direction: column; /* <20><>ֱ<EFBFBD><D6B1><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ԫ<EFBFBD><D4AA> */
|
||||
align-items: center; /* ˮƽ<CBAE><C6BD><EFBFBD><EFBFBD> */
|
||||
justify-content: center; /* <20><>ֱ<EFBFBD><D6B1><EFBFBD><EFBFBD> */
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.mud-paper-full-width {
|
||||
width: 80%; /* <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>һ<EFBFBD><D2BB>paper<65>Ŀ<EFBFBD><C4BF><EFBFBD> */
|
||||
height: auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.mud-paper-80-percent-centeredd {
|
||||
width: 80%;
|
||||
min-height: 80%;
|
||||
padding: 0px;
|
||||
margin: 0 auto;
|
||||
background-color: #959dff;
|
||||
border: 1px solid #ccc;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 40px;
|
||||
justify-content: center;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
@@ -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>
|
||||
|
||||
@@ -5,6 +5,7 @@ using MudBlazor;
|
||||
using System.Text.RegularExpressions;
|
||||
using TechHelper.Features;
|
||||
using Entities.Contracts;
|
||||
using TechHelper.Client.Services;
|
||||
|
||||
namespace TechHelper.Client.Pages.Author
|
||||
{
|
||||
@@ -12,14 +13,19 @@ namespace TechHelper.Client.Pages.Author
|
||||
{
|
||||
|
||||
private UserForRegistrationDto _userForRegistration = new UserForRegistrationDto();
|
||||
|
||||
private GradeEnum grade = GradeEnum.Unknown;
|
||||
[Inject]
|
||||
public IAuthenticationClientService AuthenticationService { get; set; }
|
||||
|
||||
[Inject]
|
||||
public NavigationManager NavigationManager { get; set; }
|
||||
[Inject]
|
||||
public IClassServices ClassServices { get; set; }
|
||||
|
||||
|
||||
public bool Basic_CheckBox2 { get; set; } = true;
|
||||
public byte selectclass { get; set; } = 0;
|
||||
public List<byte> Classes { get; set; } = new List<byte>();
|
||||
|
||||
public bool ShowRegistrationErrors { get; set; }
|
||||
public string[] Errors { get; set; }
|
||||
@@ -51,6 +57,25 @@ namespace TechHelper.Client.Pages.Author
|
||||
[Inject]
|
||||
public IEmailSender emailSender { get; set; }
|
||||
|
||||
private async void HandleSelectedValuesChanged(GradeEnum selectedValues)
|
||||
{
|
||||
grade = selectedValues;
|
||||
Snackbar.Add("<22><><EFBFBD>ȴ<EFBFBD>,<2C><><EFBFBD>ڻ<EFBFBD>ȡ<EFBFBD><C8A1><EFBFBD>꼶<EFBFBD>༶", Severity.Info);
|
||||
var result = await ClassServices.GetGradeClasses((byte)selectedValues);
|
||||
if (result.Status)
|
||||
{
|
||||
Classes = result.Result as List<byte> ?? new List<byte>();
|
||||
Snackbar.Add("<22><>ȡ<EFBFBD>ɹ<EFBFBD>", Severity.Success);
|
||||
return;
|
||||
}
|
||||
Snackbar.Add("<22><>ȡʧ<C8A1><CAA7>", Severity.Error);
|
||||
}
|
||||
private void HandleListSelectedValuesChanged(byte selectedValues)
|
||||
{
|
||||
selectclass = selectedValues;
|
||||
|
||||
}
|
||||
|
||||
public async void SendEmail()
|
||||
{
|
||||
string eamilTo = "1928360026@qq.com";
|
||||
|
||||
29
TechHelper.Client/Pages/Author/Registration.razor.css
Normal file
29
TechHelper.Client/Pages/Author/Registration.razor.css
Normal file
@@ -0,0 +1,29 @@
|
||||
.page-container {
|
||||
width: 100%;
|
||||
height: 100%; /* <20>ӿڸ߶ȣ<DFB6>ȷ<EFBFBD><C8B7><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>㹻<EFBFBD>ĸ߶<C4B8><DFB6><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ԫ<EFBFBD><D4AA> */
|
||||
display: flex;
|
||||
flex-direction: column; /* <20><>ֱ<EFBFBD><D6B1><EFBFBD><EFBFBD><EFBFBD><EFBFBD>Ԫ<EFBFBD><D4AA> */
|
||||
align-items: center; /* ˮƽ<CBAE><C6BD><EFBFBD><EFBFBD> */
|
||||
justify-content: center; /* <20><>ֱ<EFBFBD><D6B1><EFBFBD><EFBFBD> */
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.mud-paper-full-width {
|
||||
width: 80%; /* <20><><EFBFBD><EFBFBD><EFBFBD><EFBFBD>һ<EFBFBD><D2BB>paper<65>Ŀ<EFBFBD><C4BF><EFBFBD> */
|
||||
height: auto;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.mud-paper-80-percent-centered {
|
||||
width: 80%;
|
||||
min-height: 80%;
|
||||
padding: 0px;
|
||||
margin: 0 auto;
|
||||
background-color: #959dff;
|
||||
border: 1px solid #ccc;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-radius: 40px;
|
||||
justify-content: center;
|
||||
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
Reference in New Issue
Block a user