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

u

Browse Source
This commit is contained in:
MeysamMoghaddam
2025-10-07 23:40:43 +03:30
parent 47152ab05e
commit 45999329e7
6 changed files with 629 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/FrontOffice.Main/App.razor
View File

@@ -1,7 +1,6 @@
@using FrontOffice.Main.Utilities
<Router AppAssembly="@typeof(App).Assembly"
OnNavigateAsync="HandleNavigationAsync">
<Router AppAssembly="@typeof(App).Assembly">
<Found Context="routeData">
<RouteView RouteData="@routeData" DefaultLayout="@typeof(MainLayout)" />
</Found>

50
src/FrontOffice.Main/App.razor.cs
View File

@@ -1,54 +1,6 @@
using Blazored.LocalStorage;
using FrontOffice.Main.Utilities;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.Components.Routing;
namespace FrontOffice.Main;
namespace FrontOffice.Main;
public partial class App
{
private const string TokenStorageKey = "auth:token";
[Inject] private ILocalStorageService LocalStorage { get; set; } = default!;
private async Task HandleNavigationAsync(NavigationContext context)
{
var normalizedPath = NormalizePath(context.Path);
if (IsAuthPath(normalizedPath))
return;
var token = await LocalStorage.GetItemAsync<string>(TokenStorageKey);
if (!string.IsNullOrWhiteSpace(token))
return;
var redirect = string.IsNullOrEmpty(normalizedPath) || normalizedPath == "/"
? string.Empty
: $"?redirect={Uri.EscapeDataString(normalizedPath)}";
Navigation.NavigateTo(RouteConstants.Auth.Phone + redirect, forceLoad: true);
}
private static bool IsAuthPath(string? path)
{
if (string.IsNullOrWhiteSpace(path))
return false;
if (Uri.TryCreate(path, UriKind.Absolute, out var absolute))
path = absolute.PathAndQuery;
path = path.TrimStart('/');
return path.StartsWith("auth", StringComparison.OrdinalIgnoreCase);
}
private static string NormalizePath(string? path)
{
if (string.IsNullOrWhiteSpace(path))
return string.Empty;
if (Uri.TryCreate(path, UriKind.Absolute, out var absolute))
path = absolute.PathAndQuery;
return path.StartsWith('/') ? path : "/" + path;
}
}

131
src/FrontOffice.Main/Shared/AuthDialog.razor Normal file
View File

@@ -0,0 +1,131 @@
<MudDialog>
<TitleContent>
<MudText Typo="Typo.h4" Align="Align.Center">@GetDialogTitle()</MudText>
</TitleContent>
<DialogContent>
@if (_currentStep == AuthStep.Phone)
{
<!-- Phone Step -->
<MudText Typo="Typo.body2" Class="mb-4" Align="Align.Center">لطفاً شماره موبایل خود را وارد کنید تا رمز پویا ارسال شود.</MudText>
<MudForm @ref="_phoneForm" Model="_phoneRequest" Validation="@(_phoneRequestValidator.ValidateValue)">
<MudTextField @bind-Value="_phoneRequest.Mobile"
For="@(() => _phoneRequest.Mobile)"
Label="شماره موبایل"
InputType="InputType.Telephone"
InputMode="InputMode.tel"
Variant="Variant.Outlined"
Immediate="true"
Required="true"
RequiredError="وارد کردن شماره موبایل الزامی است."
HelperText="مثال: 09121234567"
Class="mb-2" />
<MudCheckBox T="bool"
Label="شرایط و قوانین را می‌پذیرم"
Class="mb-1" />
@if (!string.IsNullOrWhiteSpace(_errorMessage))
{
<MudAlert Severity="Severity.Error" Dense="true" Elevation="0" Class="mb-2">@_errorMessage</MudAlert>
}
</MudForm>
}
else if (_currentStep == AuthStep.Verify)
{
<!-- Verify Step -->
<MudText Typo="Typo.body2" Class="mb-4" Align="Align.Center">رمز پویا شش رقمی ارسال ‌شده به @_phoneNumber را وارد کنید.</MudText>
<MudForm @ref="_verifyForm" Model="_verifyRequest" Validation="@(_verifyRequestValidator.ValidateValue)">
<MudTextField @bind-Value="_verifyRequest.Code"
For="@(() => _verifyRequest.Code)"
Label="رمز پویا"
InputType="InputType.Telephone"
InputMode="InputMode.tel"
Variant="Variant.Outlined"
Immediate="true"
Required="true"
RequiredError="وارد کردن رمز پویا الزامی است."
HelperText="کد ۶ رقمی"
Class="mb-2"
MaxLength="6" />
@* <MudText Typo="Typo.body1" Align="Align.Center" Class="mb-2">
تلاش باقی‌مانده: @_attemptsLeft از @MaxVerificationAttempts
</MudText> *@
@if (!string.IsNullOrWhiteSpace(_errorMessage))
{
<MudAlert Severity="Severity.Error"
Dense="true"
Elevation="0"
Class="mb-2">
@(_errorMessage)
</MudAlert>
}
@if (!string.IsNullOrWhiteSpace(_infoMessage))
{
<MudAlert Severity="Severity.Success"
Dense="true"
Elevation="0"
Class="mb-2">
@(_infoMessage)
</MudAlert>
}
<MudStack Spacing="2">
<MudButton Variant="Variant.Text"
Color="Color.Secondary"
Disabled="_isBusy"
OnClick="ChangePhoneAsync">
تغییر شماره
</MudButton>
</MudStack>
<MudDivider Class="my-2" />
@if (_resendRemaining > 0)
{
<MudText Typo="Typo.body2" Align="Align.Center" Class="mud-text-secondary">
امکان ارسال مجدد تا @_resendRemaining ثانیه دیگر
</MudText>
}
else
{
<MudButton Variant="Variant.Text"
Color="Color.Primary"
Disabled="_isBusy"
OnClick="ResendOtpAsync">
ارسال مجدد رمز پویا
</MudButton>
}
</MudForm>
}
</DialogContent>
<DialogActions>
<MudButton Variant="Variant.Text"
OnClick="Cancel"
Disabled="_isBusy">لغو</MudButton>
@if (_currentStep == AuthStep.Phone)
{
<MudButton Variant="Variant.Filled"
Color="Color.Primary"
OnClick="SendOtpAsync"
Disabled="_isBusy"
FullWidth="true">
ارسال رمز پویا
</MudButton>
}
else if (_currentStep == AuthStep.Verify)
{
<MudButton Variant="Variant.Filled"
Color="Color.Primary"
OnClick="VerifyOtpAsync"
Disabled="_isBusy || IsVerificationLocked"
FullWidth="true">
تأیید و ورود
</MudButton>
}
</DialogActions>
</MudDialog>

432
src/FrontOffice.Main/Shared/AuthDialog.razor.cs Normal file
View File

@@ -0,0 +1,432 @@
using Blazored.LocalStorage;
using FrontOffice.BFF.User.Protobuf.Protos.User;
using FrontOffice.BFF.User.Protobuf.Validator;
using FrontOffice.Main.Utilities;
using Grpc.Core;
using Microsoft.AspNetCore.Components;
using Microsoft.AspNetCore.WebUtilities;
using MudBlazor;
namespace FrontOffice.Main.Shared;
public partial class AuthDialog : IDisposable
{
private enum AuthStep { Phone, Verify }
private const int DefaultResendCooldown = 120;
public const int MaxVerificationAttempts = 5;
private const string PhoneStorageKey = "auth:phone-number";
private const string RedirectStorageKey = "auth:redirect";
private const string TokenStorageKey = "auth:token";
private const string OtpPurpose = "Login";
private AuthStep _currentStep = AuthStep.Phone;
private CreateNewOtpTokenRequestValidator _phoneRequestValidator = new();
private CreateNewOtpTokenRequest _phoneRequest = new();
private MudForm? _phoneForm;
private VerifyOtpTokenRequestValidator _verifyRequestValidator = new();
private VerifyOtpTokenRequest _verifyRequest = new();
private MudForm? _verifyForm;
private bool _isBusy;
private string? _phoneNumber;
private string? _errorMessage;
private string? _infoMessage;
private Timer? _resendTimer;
private int _resendRemaining;
private int _attemptsLeft = MaxVerificationAttempts;
private CancellationTokenSource? _operationCts;
[Inject] private ILocalStorageService LocalStorage { get; set; } = default!;
[Inject] private UserContract.UserContractClient UserClient { get; set; } = default!;
[CascadingParameter] private MudDialogInstance MudDialog { get; set; } = default!;
[Parameter] public EventCallback OnLoginSuccess { get; set; }
private bool IsVerificationLocked => _attemptsLeft <= 0;
protected override async Task OnInitializedAsync()
{
_phoneRequest.Purpose = OtpPurpose;
_verifyRequest.Purpose = OtpPurpose;
var storedPhone = await LocalStorage.GetItemAsync<string>(PhoneStorageKey);
if (!string.IsNullOrWhiteSpace(storedPhone))
{
_phoneRequest.Mobile = storedPhone;
}
}
private async Task SendOtpAsync()
{
_errorMessage = null;
if (_phoneForm is null)
return;
await _phoneForm.Validate();
if (!_phoneForm.IsValid)
return;
_isBusy = true;
_operationCts?.Cancel();
_operationCts?.Dispose();
_operationCts = new CancellationTokenSource();
try
{
var validationResult = _phoneRequestValidator.Validate(_phoneRequest);
if (!validationResult.IsValid)
{
_errorMessage = string.Join(" ", validationResult.Errors.Select(e => e.ErrorMessage).Distinct());
return;
}
var metadata = await BuildAuthMetadataAsync();
CreateNewOtpTokenResponse response;
if (metadata is not null)
{
response = await UserClient.CreateNewOtpTokenAsync(_phoneRequest, metadata, cancellationToken: _operationCts.Token);
}
else
{
response = await UserClient.CreateNewOtpTokenAsync(_phoneRequest, cancellationToken: _operationCts.Token);
}
if (response?.Success != true)
{
_errorMessage = string.IsNullOrWhiteSpace(response?.Message)
? "ارسال رمز پویا با خطا مواجه شد. لطفاً دوباره تلاش کنید."
: response!.Message;
return;
}
await LocalStorage.SetItemAsync(PhoneStorageKey, _phoneRequest.Mobile);
_phoneNumber = _phoneRequest.Mobile;
_currentStep = AuthStep.Verify;
StartResendCountdown();
}
catch (RpcException rpcEx)
{
_errorMessage = !string.IsNullOrWhiteSpace(rpcEx.Status.Detail)
? rpcEx.Status.Detail
: "ارسال رمز پویا با خطا مواجه شد. لطفاً دوباره تلاش کنید.";
}
catch (OperationCanceledException)
{
}
catch (Exception ex)
{
_errorMessage = ex.Message;
}
finally
{
_isBusy = false;
ClearOperationToken();
await InvokeAsync(StateHasChanged);
}
}
private async Task VerifyOtpAsync()
{
_errorMessage = null;
_infoMessage = null;
if (_verifyForm is null)
return;
await _verifyForm.Validate();
if (!_verifyForm.IsValid)
return;
if (IsVerificationLocked)
{
_errorMessage = "تعداد تلاش‌های مجاز به پایان رسیده است. لطفاً رمز جدید دریافت کنید.";
return;
}
if (string.IsNullOrWhiteSpace(_phoneNumber))
{
_errorMessage = "شماره موبایل یافت نشد. لطفاً دوباره تلاش کنید.";
return;
}
_isBusy = true;
var cancellationToken = PrepareOperationToken();
try
{
_verifyRequest.Mobile = _phoneNumber;
var validationResult = _verifyRequestValidator.Validate(_verifyRequest);
if (!validationResult.IsValid)
{
_errorMessage = string.Join(" ", validationResult.Errors.Select(e => e.ErrorMessage).Distinct());
return;
}
var metadata = await BuildAuthMetadataAsync();
VerifyOtpTokenResponse response;
if (metadata is not null)
{
response = await UserClient.VerifyOtpTokenAsync(_verifyRequest, metadata, cancellationToken: cancellationToken);
}
else
{
response = await UserClient.VerifyOtpTokenAsync(_verifyRequest, cancellationToken: cancellationToken);
}
if (response is null)
{
_errorMessage = "تأیید رمز پویا انجام نشد. لطفاً دوباره تلاش کنید.";
return;
}
if (response.Success)
{
if (!string.IsNullOrWhiteSpace(response.Token))
{
await LocalStorage.SetItemAsync(TokenStorageKey, response.Token);
}
else
{
await LocalStorage.RemoveItemAsync(TokenStorageKey);
}
await LocalStorage.RemoveItemAsync(PhoneStorageKey);
await LocalStorage.RemoveItemAsync(RedirectStorageKey);
_attemptsLeft = MaxVerificationAttempts;
_verifyRequest.Code = string.Empty;
await OnLoginSuccess.InvokeAsync();
MudDialog.Close();
return;
}
RegisterFailedAttempt(string.IsNullOrWhiteSpace(response.Message) ? "کد نادرست است." : response.Message);
}
catch (RpcException rpcEx)
{
await HandleVerificationFailureAsync(rpcEx);
}
catch (OperationCanceledException)
{
}
catch (Exception ex)
{
_errorMessage = ex.Message;
}
finally
{
_isBusy = false;
ClearOperationToken();
await InvokeAsync(StateHasChanged);
}
}
private async Task HandleVerificationFailureAsync(RpcException rpcEx)
{
switch (rpcEx.Status.StatusCode)
{
case StatusCode.PermissionDenied:
case StatusCode.InvalidArgument:
RegisterFailedAttempt(!string.IsNullOrWhiteSpace(rpcEx.Status.Detail)
? rpcEx.Status.Detail
: "کد نادرست است.");
break;
case StatusCode.Unauthenticated:
await ResetAuthenticationAsync();
_errorMessage = "نشست کاربری منقضی شده است. لطفاً دوباره وارد شوید.";
_currentStep = AuthStep.Phone;
break;
case StatusCode.DeadlineExceeded:
case StatusCode.NotFound:
_errorMessage = "کد منقضی شده است. لطفاً رمز جدید دریافت کنید.";
break;
default:
_errorMessage = !string.IsNullOrWhiteSpace(rpcEx.Status.Detail)
? rpcEx.Status.Detail
: "تأیید رمز پویا انجام نشد. لطفاً دوباره تلاش کنید.";
break;
}
}
private void RegisterFailedAttempt(string baseMessage)
{
_attemptsLeft = Math.Max(0, _attemptsLeft - 1);
if (_attemptsLeft > 0)
{
_errorMessage = $"{baseMessage} {_attemptsLeft} تلاش باقی مانده است.";
}
else
{
_errorMessage = $"{baseMessage} تلاش‌های مجاز شما به پایان رسیده است. لطفاً رمز جدید دریافت کنید.";
}
}
private async Task ResendOtpAsync()
{
if (_resendRemaining > 0 || _isBusy || string.IsNullOrWhiteSpace(_phoneNumber))
{
return;
}
_errorMessage = null;
_infoMessage = null;
_isBusy = true;
var cancellationToken = PrepareOperationToken();
try
{
var request = new CreateNewOtpTokenRequest
{
Mobile = _phoneNumber,
Purpose = OtpPurpose
};
var metadata = await BuildAuthMetadataAsync();
CreateNewOtpTokenResponse response;
if (metadata is not null)
{
response = await UserClient.CreateNewOtpTokenAsync(request, metadata, cancellationToken: cancellationToken);
}
else
{
response = await UserClient.CreateNewOtpTokenAsync(request, cancellationToken: cancellationToken);
}
if (response?.Success != true)
{
_errorMessage = string.IsNullOrWhiteSpace(response?.Message)
? "ارسال مجدد رمز پویا با خطا مواجه شد."
: response!.Message;
return;
}
_infoMessage = string.IsNullOrWhiteSpace(response.Message)
? "کد جدید ارسال شد."
: response.Message;
_attemptsLeft = MaxVerificationAttempts;
_verifyRequest.Code = string.Empty;
StartResendCountdown();
}
catch (RpcException rpcEx)
{
await HandleResendFailureAsync(rpcEx);
}
catch (OperationCanceledException)
{
}
catch (Exception ex)
{
_errorMessage = ex.Message;
}
finally
{
_isBusy = false;
ClearOperationToken();
await InvokeAsync(StateHasChanged);
}
}
private async Task HandleResendFailureAsync(RpcException rpcEx)
{
switch (rpcEx.Status.StatusCode)
{
case StatusCode.Unauthenticated:
await ResetAuthenticationAsync();
_errorMessage = "نشست کاربری منقضی شده است. لطفاً دوباره وارد شوید.";
_currentStep = AuthStep.Phone;
break;
default:
_errorMessage = !string.IsNullOrWhiteSpace(rpcEx.Status.Detail)
? rpcEx.Status.Detail
: "ارسال مجدد رمز پویا با خطا مواجه شد.";
break;
}
}
private async Task ChangePhoneAsync()
{
await LocalStorage.RemoveItemAsync(PhoneStorageKey);
_currentStep = AuthStep.Phone;
_phoneNumber = null;
_verifyRequest.Code = string.Empty;
_attemptsLeft = MaxVerificationAttempts;
_resendTimer?.Dispose();
_resendTimer = null;
_resendRemaining = 0;
}
private void StartResendCountdown(int seconds = DefaultResendCooldown)
{
_resendRemaining = seconds;
_resendTimer?.Dispose();
_resendTimer = new Timer(_ =>
{
var remaining = Interlocked.Add(ref _resendRemaining, -1);
if (remaining <= 0)
{
Interlocked.Exchange(ref _resendRemaining, 0);
_resendTimer?.Dispose();
_resendTimer = null;
}
_ = InvokeAsync(StateHasChanged);
}, null, 1000, 1000);
}
private async Task<Metadata?> BuildAuthMetadataAsync()
{
var token = await LocalStorage.GetItemAsync<string>(TokenStorageKey);
if (string.IsNullOrWhiteSpace(token))
{
return null;
}
return new Metadata
{
{ "Authorization", $"Bearer {token}" }
};
}
private async Task ResetAuthenticationAsync()
{
await LocalStorage.RemoveItemAsync(TokenStorageKey);
await LocalStorage.RemoveItemAsync(PhoneStorageKey);
await LocalStorage.RemoveItemAsync(RedirectStorageKey);
}
private CancellationToken PrepareOperationToken()
{
_operationCts?.Cancel();
_operationCts?.Dispose();
_operationCts = new CancellationTokenSource();
return _operationCts.Token;
}
private void ClearOperationToken()
{
_operationCts?.Dispose();
_operationCts = null;
}
private void Cancel()
{
MudDialog.Cancel();
}
public void Dispose()
{
_operationCts?.Cancel();
_operationCts?.Dispose();
_operationCts = null;
_resendTimer?.Dispose();
_resendTimer = null;
}
private string GetDialogTitle() => _currentStep == AuthStep.Phone ? "ورود به حساب کاربری" : "تأیید رمز پویا";
}

46
src/FrontOffice.Main/Shared/MainLayout.razor
View File

@@ -19,15 +19,19 @@
</MudHidden>
<div class="d-flex align-center gap-2">
<MudHidden Breakpoint="Breakpoint.SmAndUp" Invert="true">
<MudImage ObjectFit="ObjectFit.Cover"
ObjectPosition="ObjectPosition.Center"
Width="32"
Height="32"
Class="rounded-circle"
Src="favicon.png" />
</MudHidden>
<MudText Typo="Typo.h6" Class="fw-600">فرصت</MudText>
<MudLink Href="@(RouteConstants.Main.MainPage)" Underline="Underline.None">
<MudStack Row="true" Spacing="3" AlignItems="AlignItems.Center">
<MudHidden Breakpoint="Breakpoint.SmAndUp" Invert="true">
<MudImage ObjectFit="ObjectFit.Cover"
ObjectPosition="ObjectPosition.Center"
Width="32"
Height="32"
Class="rounded-circle"
Src="favicon.png" />
</MudHidden>
<MudText Typo="Typo.h6" Class="fw-600">فرصت</MudText>
</MudStack>
</MudLink>
</div>
<div class="d-none d-md-flex align-center gap-10">
@@ -35,13 +39,19 @@
<MudLink Href="#pricing" Typo="Typo.subtitle1" Class="mud-link">قیمت‌ها</MudLink>
<MudLink Href="#faq" Typo="Typo.subtitle1" Class="mud-link">سوالات متداول</MudLink>
<MudLink Href="#contact" Typo="Typo.subtitle1" Class="mud-link">ارتباط با ما</MudLink>
<MudLink Href="/profile" Typo="Typo.subtitle1" Class="mud-link">پروفایل</MudLink>
</div>
<div class="d-flex align-center gap-2">
<MudHidden Breakpoint="Breakpoint.SmAndUp" Invert="true">
<MudButton Variant="Variant.Outlined" Color="Color.Inherit">ورود</MudButton>
<MudButton Color="Color.Primary">شروع کنید</MudButton>
@if (_isAuthenticated)
{
<MudButton Variant="Variant.Outlined" Color="Color.Inherit" OnClick="NavigateToProfile">پروفایل</MudButton>
}
else
{
<MudButton Variant="Variant.Outlined" Color="Color.Inherit" OnClick="OpenAuthDialog">ورود</MudButton>
<MudButton Color="Color.Primary">شروع کنید</MudButton>
}
</MudHidden>
<MudIconButton OnClick="@ToggleTheme" Edge="Edge.End"
@@ -57,10 +67,16 @@
<MudLink Href="#pricing" Typo="Typo.subtitle1" OnClick="() => _drawerOpen=false">قیمت‌ها</MudLink>
<MudLink Href="#faq" Typo="Typo.subtitle1" OnClick="() => _drawerOpen=false">سوالات متداول</MudLink>
<MudLink Href="#contact" Typo="Typo.subtitle1" OnClick="() => _drawerOpen=false">ارتباط</MudLink>
<MudLink Href="/profile" Typo="Typo.subtitle1" OnClick="() => _drawerOpen=false">پروفایل</MudLink>
<MudDivider Class="my-2" />
<MudButton Variant="Variant.Outlined" Color="Color.Inherit">ورود</MudButton>
<MudButton Color="Color.Primary">شروع کنید</MudButton>
@if (_isAuthenticated)
{
<MudButton Href="/profile" Color="Color.Primary" OnClick="() => _drawerOpen=false">پروفایل</MudButton>
}
else
{
<MudButton Color="Color.Primary" OnClick="() => { _drawerOpen=false; OpenAuthDialog(); }">ورود</MudButton>
}
</MudStack>
</MudDrawer>

33
src/FrontOffice.Main/Shared/MainLayout.razor.cs
View File

@@ -1,26 +1,59 @@
using Blazored.LocalStorage;
using FrontOffice.Main.Utilities;
using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
using MudBlazor;
namespace FrontOffice.Main.Shared;
public partial class MainLayout
{
private const string TokenStorageKey = "auth:token";
private MudThemeProvider _mudThemeProvider;
private bool _isDark;
private bool _drawerOpen;
private bool _isAuthenticated;
private string? _email;
[Inject] private ILocalStorageService LocalStorage { get; set; } = default!;
private void ToggleTheme() => _isDark = !_isDark;
private void ToggleDrawer() => _drawerOpen = !_drawerOpen;
private async void Back()
{
await JSRuntime.InvokeVoidAsync("history.back");
}
protected override async Task OnAfterRenderAsync(bool firstRender)
{
if (firstRender)
{
await JSRuntime.InvokeVoidAsync("changeNavBgOnBodyScroll", "top", null, 1);
await CheckAuthStatus();
StateHasChanged();
}
}
private async Task CheckAuthStatus()
{
var token = await LocalStorage.GetItemAsync<string>(TokenStorageKey);
_isAuthenticated = !string.IsNullOrWhiteSpace(token);
}
private async Task OpenAuthDialog()
{
var dialog = await DialogService.ShowAsync<AuthDialog>("ورود به حساب کاربری");
var result = await dialog.Result;
if (!result.Canceled)
{
await CheckAuthStatus();
StateHasChanged();
}
}
private void NavigateToProfile()
{
Navigation.NavigateTo(RouteConstants.Profile.Index);
}
}