admin/FrontOffice
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor AuthDialog to remove captcha handling and improve dialog display options

Browse Source
This commit is contained in:
masoodafar-web
2025-11-14 10:49:46 +03:30
parent 07ea8f0f47
commit e86cb7aa47
6 changed files with 133 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/FrontOffice.Main/Pages/RegisterWizard.razor
View File

@@ -5,7 +5,7 @@
<section class="py-12 wizard-section">
<MudContainer MaxWidth="MaxWidth.Large">
<MudGrid Spacing="4" Justify="Justify.Center">
<MudItem xs="12" md="5">
<MudItem xs="12" md="5" Class="d-none d-sm-block">
<MudStack Spacing="2" Class="mb-6">
<MudChip T="string" Color="Color.Secondary" Variant="Variant.Filled" Class="mb-2">ثبت‌نام سه
مرحله‌ای</MudChip>
@@ -15,7 +15,7 @@
<MudText Typo="Typo.body1" Class="mud-text-secondary">
اطلاعات اولیه را وارد کنید، مشخصات هویتی را تکمیل کنید و بعد از مطالعه قوانین و دانلود قرارداد،
درخواست خود را ارسال کنید.
</MudText>
</MudText>
</MudStack>
<MudPaper Elevation="1" Class="pa-4 rounded-xl gradient-border">
@@ -56,7 +56,7 @@
}
else
{
<MudStack Spacing="3">
<MudStack Spacing="3" >
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
<MudText Typo="Typo.h4">ویزارد ثبت‌نام</MudText>
<MudChip T="string" Color="Color.Info" Variant="Variant.Outlined" Size="Size.Small">۳ مرحله
@@ -68,11 +68,11 @@
<MudProgressLinear Color="Color.Primary" Indeterminate="true" />
}
<MudStepper @bind-ActiveIndex="_activeStep" Elevation="0" DisableClick="true" Class="mb-4">
<MudStepper @bind-ActiveIndex="_activeStep" Elevation="0" DisableClick="true" Class="mb-4 " id="registration-stepper">
<ChildContent>
<MudStep Label="تأیید موبایل" Icon="@Icons.Material.Filled.Smartphone">
@* Inline AuthDialog with captcha enabled *@
<AuthDialog @ref="_authDialog" InlineMode="true" EnableCaptcha="true" HideCancelButton="true" OnLoginSuccess="@(async () => { OnPhoneVerified(); })" />
<AuthDialog @ref="_authDialog" InlineMode="true" HideCancelButton="true" OnLoginSuccess="@(async () => { OnPhoneVerified(); })" />
</MudStep>
<MudStep Label="اطلاعات هویتی" Icon="@Icons.Material.Filled.Badge">

4
src/FrontOffice.Main/Pages/RegisterWizard.razor.cs
View File

@@ -142,6 +142,10 @@ public partial class RegisterWizard
_updateUserRequest.FirstName = _model.FirstName;
_updateUserRequest.LastName = _model.LastName;
_updateUserRequest.NationalCode = _model.NationalCode.PersianToEnglish();
Console.WriteLine(_updateUserRequest.FirstName);
Console.WriteLine(_updateUserRequest.LastName);
Console.WriteLine(_updateUserRequest.NationalCode);
await UserContract.UpdateUserAsync(request: _updateUserRequest);
Snackbar.Add("اطلاعات شخصی با موفقیت ذخیره شد.", Severity.Success);
return true;

8
src/FrontOffice.Main/Shared/AuthDialog.razor
View File

@@ -8,7 +8,7 @@
}
else
{
<MudDialog>
<MudDialog >
<TitleContent>
<MudText Typo="Typo.h4" Align="Align.Center">@GetDialogTitle()</MudText>
</TitleContent>
@@ -72,8 +72,8 @@ else
HelperText="مثال: 09121234567"
Class="mb-2" />
@if (EnableCaptcha)
{
@* @if (EnableCaptcha) *@
@* { *@
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="2" Class="mt-2 mb-2">
<MudPaper Elevation="1" Class="captcha-box d-flex align-center justify-center" Style="min-width:100px;min-height:48px;">
<MudText Typo="Typo.h5">@_captchaCode</MudText>
@@ -85,7 +85,7 @@ else
<MudTextField Label="کد کپچا" Placeholder="کد نمایش داده شده" Immediate="true"
Variant="Variant.Outlined" @bind-Value="_captchaInput" Required="true"
RequiredError="لطفاً کد کپچا را وارد کنید." />
}
@* } *@
<MudCheckBox T="bool"
Label="شرایط و قوانین را می‌پذیرم"

22
src/FrontOffice.Main/Shared/AuthDialog.razor.cs
View File

@@ -11,7 +11,7 @@ namespace FrontOffice.Main.Shared;
public partial class AuthDialog : IDisposable
{
[Parameter] public bool HideCancelButton { get; set; }
[Parameter] public bool EnableCaptcha { get; set; }
// [Parameter] public bool EnableCaptcha { get; set; }
[Parameter] public bool InlineMode { get; set; }
public enum AuthStep { Phone, Verify }
@@ -48,7 +48,8 @@ public partial class AuthDialog : IDisposable
[Inject] private ILocalStorageService LocalStorage { get; set; } = default!;
[Inject] private UserContract.UserContractClient UserClient { get; set; } = default!;
[CascadingParameter] private IDialogReference? MudDialog { get; set; }
[CascadingParameter]
private IMudDialogInstance MudDialog { get; set; }
[Parameter] public EventCallback OnLoginSuccess { get; set; }
@@ -59,16 +60,17 @@ public partial class AuthDialog : IDisposable
_phoneRequest.Purpose = OtpPurpose;
_verifyRequest.Purpose = OtpPurpose;
if (EnableCaptcha)
{
// if (EnableCaptcha)
// {
GenerateCaptcha();
}
// }
var storedPhone = await LocalStorage.GetItemAsync<string>(PhoneStorageKey);
if (!string.IsNullOrWhiteSpace(storedPhone))
{
_phoneRequest.Mobile = storedPhone;
}
await LocalStorage.RemoveItemAsync(TokenStorageKey);
}
private void GenerateCaptcha()
@@ -87,14 +89,14 @@ public partial class AuthDialog : IDisposable
if (!_phoneForm.IsValid)
return;
if (EnableCaptcha)
{
// if (EnableCaptcha)
// {
if (string.IsNullOrWhiteSpace(_captchaInput) || !string.Equals(_captchaInput.Trim(), _captchaCode, StringComparison.OrdinalIgnoreCase))
{
_errorMessage = "کد کپچا صحیح نیست.";
return;
}
}
// }
_isBusy = true;
_operationCts?.Cancel();
@@ -368,7 +370,7 @@ public partial class AuthDialog : IDisposable
_resendTimer?.Dispose();
_resendTimer = null;
_resendRemaining = 0;
if (EnableCaptcha)
// if (EnableCaptcha)
GenerateCaptcha();
}
@@ -420,7 +422,7 @@ public partial class AuthDialog : IDisposable
private void Cancel()
{
if (!InlineMode)
MudDialog?.Close(DialogResult.Cancel());
MudDialog?.Close();
}
public void Dispose()

4
src/FrontOffice.Main/Utilities/AuthDialogService.cs
View File

@@ -6,6 +6,7 @@ namespace FrontOffice.Main.Utilities;
public class AuthDialogService
{
private readonly IDialogService _dialogService;
private readonly DialogOptions _maxWidth = new() { MaxWidth = MaxWidth.Medium, FullWidth = true, };
public AuthDialogService(IDialogService dialogService)
{
@@ -14,7 +15,8 @@ public class AuthDialogService
public async Task ShowAuthDialogAsync()
{
var dialog = await _dialogService.ShowAsync<Shared.AuthDialog>("ورود به حساب کاربری");
var dialog = await _dialogService.ShowAsync<Shared.AuthDialog>("ورود به حساب کاربری",_maxWidth);
var result = await dialog.Result;
if (!result.Canceled)

119
src/FrontOffice.Main/wwwroot/css/site.css
View File

@@ -72,23 +72,106 @@ html, body {
}
/* Typography variants override to match previous settings */
.mud-typography-h1 { font-family: var(--app-font-family); font-size: 2rem; font-weight: 700; line-height: 1.70; letter-spacing: normal; }
.mud-typography-h2 { font-family: var(--app-font-family); font-size: 1.875rem; font-weight: 700; line-height: 1.65; letter-spacing: normal; }
.mud-typography-h3 { font-family: var(--app-font-family); font-size: 1.5rem; font-weight: 700; line-height: 1.60; letter-spacing: normal; }
.mud-typography-h4 { font-family: var(--app-font-family); font-size: 1.25rem; font-weight: 700; line-height: 1.55; letter-spacing: normal; }
.mud-typography-h5 { font-family: var(--app-font-family); font-size: 1.125rem; font-weight: 700; line-height: 1.50; letter-spacing: normal; }
.mud-typography-h6 { font-family: var(--app-font-family); font-size: 1rem; font-weight: 700; line-height: 1.45; letter-spacing: normal; }
.mud-typography-h1 {
font-family: var(--app-font-family);
font-size: 2rem;
font-weight: 700;
line-height: 1.70;
letter-spacing: normal;
}
.mud-typography-subtitle1 { font-family: var(--app-font-family); font-size: 1rem; font-weight: 500; line-height: 1.62; letter-spacing: normal; }
.mud-typography-subtitle2 { font-family: var(--app-font-family); font-size: 0.875rem; font-weight: 500; line-height: 1.60; letter-spacing: normal; }
.mud-typography-h2 {
font-family: var(--app-font-family);
font-size: 1.875rem;
font-weight: 700;
line-height: 1.65;
letter-spacing: normal;
}
.mud-typography-body1 { font-family: var(--app-font-family); font-size: 1rem; font-weight: 400; line-height: 1.85; letter-spacing: normal; }
.mud-typography-body2 { font-family: var(--app-font-family); font-size: 0.875rem; font-weight: 400; line-height: 1.80; letter-spacing: normal; }
.mud-typography-h3 {
font-family: var(--app-font-family);
font-size: 1.5rem;
font-weight: 700;
line-height: 1.60;
letter-spacing: normal;
}
.mud-typography-caption { font-family: var(--app-font-family); font-size: 0.75rem; font-weight: 400; line-height: 1.60; letter-spacing: normal; }
.mud-typography-overline { font-family: var(--app-font-family); font-size: 0.75rem; font-weight: 500; line-height: 1.60; letter-spacing: normal; }
.mud-typography-h4 {
font-family: var(--app-font-family);
font-size: 1.25rem;
font-weight: 700;
line-height: 1.55;
letter-spacing: normal;
}
.mud-typography-h5 {
font-family: var(--app-font-family);
font-size: 1.125rem;
font-weight: 700;
line-height: 1.50;
letter-spacing: normal;
}
.mud-typography-h6 {
font-family: var(--app-font-family);
font-size: 1rem;
font-weight: 700;
line-height: 1.45;
letter-spacing: normal;
}
.mud-typography-subtitle1 {
font-family: var(--app-font-family);
font-size: 1rem;
font-weight: 500;
line-height: 1.62;
letter-spacing: normal;
}
.mud-typography-subtitle2 {
font-family: var(--app-font-family);
font-size: 0.875rem;
font-weight: 500;
line-height: 1.60;
letter-spacing: normal;
}
.mud-typography-body1 {
font-family: var(--app-font-family);
font-size: 1rem;
font-weight: 400;
line-height: 1.85;
letter-spacing: normal;
}
.mud-typography-body2 {
font-family: var(--app-font-family);
font-size: 0.875rem;
font-weight: 400;
line-height: 1.80;
letter-spacing: normal;
}
.mud-typography-caption {
font-family: var(--app-font-family);
font-size: 0.75rem;
font-weight: 400;
line-height: 1.60;
letter-spacing: normal;
}
.mud-typography-overline {
font-family: var(--app-font-family);
font-size: 0.75rem;
font-weight: 500;
line-height: 1.60;
letter-spacing: normal;
}
.mud-button-label {
text-transform: none;
}
.mud-button-label { text-transform: none; }
/*#endregion*/
/*#region Layout Styles*/
@@ -111,6 +194,7 @@ html, body {
.mud-main-content > div:first-child {
flex: 1;
}
/*#endregion*/
/*#region Footer Styles*/
@@ -244,6 +328,7 @@ html, body {
.mud-theme-dark .stats-grid .mud-paper {
background: linear-gradient(135deg, var(--mud-palette-dark-surface) 0%, var(--mud-palette-dark-surface-variant) 100%);
}
/*#endregion*/
/*#region Registration Wizard*/
.wizard-section {
@@ -259,7 +344,7 @@ html, body {
border-radius: 16px;
border: 1px solid transparent;
background: linear-gradient(var(--mud-palette-surface), var(--mud-palette-surface)) padding-box,
linear-gradient(135deg, rgba(123, 97, 255, 0.4), rgba(255, 140, 189, 0.4)) border-box;
linear-gradient(135deg, rgba(123, 97, 255, 0.4), rgba(255, 140, 189, 0.4)) border-box;
}
.captcha-box {
@@ -282,5 +367,11 @@ html, body {
padding: 1.5rem !important;
}
}
/*#endregion*/
/*#endregion*/
@media (max-width: 768px) {
#registration-stepper .mud-stepper-content {
padding: 0 10px !important;
}
}