This commit is contained in:
MeysamMoghaddam
2025-10-12 23:21:30 +03:30
parent f69cdf4a05
commit 6585c8014a
2 changed files with 202 additions and 114 deletions

View File

@@ -8,123 +8,159 @@
<!-- Profile Header --> <!-- Profile Header -->
<MudItem xs="12"> <MudItem xs="12">
<MudPaper Elevation="4" Class="mud-elevation-4 pa-6 rounded-2xl mud-theme-surface"> <MudPaper Elevation="4" Class="mud-elevation-4 pa-6 rounded-2xl mud-theme-surface">
<MudStack Row="true" Spacing="3" AlignItems="AlignItems.Center"> <MudStack Spacing="4">
<MudAvatar Size="Size.Large" Color="Color.Primary"> <MudStack Row="true" Spacing="3" AlignItems="AlignItems.Center">
<MudIcon Icon="@Icons.Material.Filled.Person" Size="Size.Large" /> <MudAvatar Size="Size.Large" Color="Color.Primary">
</MudAvatar> <MudIcon Icon="@Icons.Material.Filled.Person" Size="Size.Large" />
<div> </MudAvatar>
<MudText Typo="Typo.h5" Class="mud-typography-subtitle1">@_userProfile.FirstName @_userProfile.LastName</MudText> <div>
<MudText Typo="Typo.body2" Class="mud-text-secondary">@_userProfile.Mobile</MudText> <MudText Typo="Typo.h5" Class="mud-typography-subtitle1">@($"{_userProfile.FirstName} {_userProfile.LastName}")</MudText>
<MudText Typo="Typo.body2" Class="mud-text-secondary">@(_userProfile.Mobile)</MudText>
<MudText Typo="Typo.caption" Class="mud-text-secondary">عضو از @(_userProfile.MobileVerifiedAt?.ToDateTime().MiladiToJalali())</MudText> <MudText Typo="Typo.caption" Class="mud-text-secondary">عضو از @(_userProfile.MobileVerifiedAt?.ToDateTime().MiladiToJalali())</MudText>
</div> </div>
</MudStack> </MudStack>
</MudPaper>
</MudItem>
<!-- Profile Content --> <!-- Referral Code Section -->
<MudItem xs="12"> <MudDivider />
<MudPaper Elevation="4" Class="mud-elevation-4 rounded-2xl mud-theme-surface"> <MudStack Spacing="3">
<MudTabs Elevation="0" Rounded="true" ApplyEffectsToContainer="true" Class="px-4 pt-4"> <MudStack Row="true" AlignItems="AlignItems.Center">
<!-- Personal Information Tab --> <MudText Typo="Typo.subtitle1" Class="mud-typography-subtitle1">کد دعوت شما</MudText>
<MudTabPanel Text="اطلاعات شخصی" Icon="@Icons.Material.Filled.Person"> <MudSpacer />
<div class="pa-4"> <MudButton Variant="Variant.Filled"
<MudForm @ref="_personalForm" Model="_userProfile" Validation="@((Func<object, IEnumerable<FluentValidation.Results.ValidationFailure>>)((model) => _personalValidator.Validate((UserProfile)model).Errors))"> Color="Color.Primary"
<MudGrid Spacing="3"> StartIcon="@Icons.Material.Filled.Share"
<MudItem xs="12" md="6"> OnClick="ShareReferralCode">
<MudTextField @bind-Value="_updateUserRequest.FirstName" اشتراک‌گذاری
For="@(() => _updateUserRequest.FirstName)" </MudButton>
Label="نام" </MudStack>
Variant="Variant.Outlined" <MudText Typo="Typo.body2" Class="mud-text-secondary">
Required="true" این کد را با دوستان خود به اشتراک بگذارید تا از خریدهای آنها پاداش دریافت کنید.
RequiredError="وارد کردن نام الزامی است." /> </MudText>
</MudItem>
<MudItem xs="12" md="6"> <MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
<MudTextField @bind-Value="_updateUserRequest.LastName" <MudTextField @bind-Value="_userProfile.ReferralCode"
For="@(() => _updateUserRequest.LastName)" Label="کد دعوت"
Label="نام خانوادگی" Variant="Variant.Outlined"
Variant="Variant.Outlined" ReadOnly="true"
Required="true" Class="flex-grow-1"
RequiredError="وارد کردن نام خانوادگی الزامی است." /> Adornment="Adornment.End"
</MudItem> AdornmentIcon="@Icons.Material.Filled.ContentCopy"
OnAdornmentClick="CopyReferralCode" />
</MudStack>
<MudItem xs="12" md="6"> @if (!string.IsNullOrWhiteSpace(_copyMessage))
<MudTextField @bind-Value="_updateUserRequest.NationalCode" {
For="@(() => _updateUserRequest.NationalCode)" <MudText Typo="Typo.caption" Color="Color.Success">@(_copyMessage)</MudText>
Label="کد ملی" }
Variant="Variant.Outlined" </MudStack>
InputType="InputType.Text" /> </MudStack>
</MudItem> </MudPaper>
</MudGrid> </MudItem>
<MudStack Row="true" Spacing="2" Justify="Justify.FlexEnd" Class="mt-4"> <!-- Profile Content -->
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="SavePersonalInfo" Disabled="_isPersonalSaving"> <MudItem xs="12">
ذخیره تغییرات <MudPaper Elevation="4" Class="mud-elevation-4 rounded-2xl mud-theme-surface">
</MudButton> <MudTabs Elevation="0" Rounded="true" ApplyEffectsToContainer="true" Class="px-4 pt-4">
</MudStack> <!-- Personal Information Tab -->
</MudForm> <MudTabPanel Text="اطلاعات شخصی" Icon="@Icons.Material.Filled.Person">
</div> <div class="pa-4">
</MudTabPanel> <MudForm @ref="_personalForm" Model="_userProfile" Validation="@((Func<object, IEnumerable<FluentValidation.Results.ValidationFailure>>)((model) => _personalValidator.Validate((UserProfile)model).Errors))">
<MudGrid Spacing="3">
<MudItem xs="12" md="6">
<MudTextField @bind-Value="_updateUserRequest.FirstName"
For="@(() => _updateUserRequest.FirstName)"
Label="نام"
Variant="Variant.Outlined"
Required="true"
RequiredError="وارد کردن نام الزامی است." />
</MudItem>
<!-- Account Settings Tab --> <MudItem xs="12" md="6">
@* <MudTabPanel Text="تنظیمات حساب" Icon="@Icons.Material.Filled.Settings"> <MudTextField @bind-Value="_updateUserRequest.LastName"
<div class="pa-4"> For="@(() => _updateUserRequest.LastName)"
<MudText Typo="Typo.h6" Class="mb-4 mud-typography-subtitle1">تنظیمات حساب</MudText> Label="نام خانوادگی"
Variant="Variant.Outlined"
Required="true"
RequiredError="وارد کردن نام خانوادگی الزامی است." />
</MudItem>
<MudStack Spacing="4"> <MudItem xs="12" md="6">
<!-- Notification Settings --> <MudTextField @bind-Value="_updateUserRequest.NationalCode"
<MudPaper Outlined="true" Class="pa-4 rounded-lg"> For="@(() => _updateUserRequest.NationalCode)"
<MudText Typo="Typo.subtitle1" Class="mb-3 fw-600">اعلان‌ها</MudText> Label="کد ملی"
<MudStack Spacing="2"> Variant="Variant.Outlined"
<MudSwitch T="bool" @bind-Checked="_settings.EmailNotifications" Label="اعلان‌های ایمیلی" /> InputType="InputType.Text" />
<MudSwitch T="bool" @bind-Checked="_settings.SmsNotifications" Label="اعلان‌های پیامکی" /> </MudItem>
<MudSwitch T="bool" @bind-Checked="_settings.PushNotifications" Label="اعلان‌های پوش" /> </MudGrid>
</MudStack>
</MudPaper>
<!-- Privacy Settings --> <MudStack Row="true" Spacing="2" Justify="Justify.FlexEnd" Class="mt-4">
<MudPaper Outlined="true" Class="pa-4 rounded-lg"> <MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="SavePersonalInfo" Disabled="_isPersonalSaving">
<MudText Typo="Typo.subtitle1" Class="mb-3 fw-600">حریم خصوصی</MudText> ذخیره تغییرات
<MudStack Spacing="2"> </MudButton>
<MudSwitch T="bool" @bind-Checked="_settings.ProfileVisibility" Label="نمایش پروفایل عمومی" />
<MudSwitch T="bool" @bind-Checked="_settings.ShowOnlineStatus" Label="نمایش وضعیت آنلاین" />
</MudStack>
</MudPaper>
<!-- Language & Theme -->
<MudPaper Outlined="true" Class="pa-4 rounded-lg">
<MudText Typo="Typo.subtitle1" Class="mb-3 fw-600">زبان و تم</MudText>
<MudGrid Spacing="3">
<MudItem xs="12" md="6">
<MudSelect @bind-Value="_settings.Language" Label="زبان" Variant="Variant.Outlined">
<MudSelectItem Value="@("fa")">فارسی</MudSelectItem>
<MudSelectItem Value="@("en")">English</MudSelectItem>
</MudSelect>
</MudItem>
<MudItem xs="12" md="6">
<MudSelect @bind-Value="_settings.Theme" Label="تم" Variant="Variant.Outlined">
<MudSelectItem Value="@("light")">روشن</MudSelectItem>
<MudSelectItem Value="@("dark")">تیره</MudSelectItem>
<MudSelectItem Value="@("auto")">خودکار</MudSelectItem>
</MudSelect>
</MudItem>
</MudGrid>
</MudPaper>
<MudStack Row="true" Spacing="2" Justify="Justify.FlexEnd">
<MudButton Variant="Variant.Outlined" Color="Color.Secondary" OnClick="CancelSettingsChanges">
لغو
</MudButton>
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="SaveSettings" Disabled="_isSettingsSaving">
ذخیره تنظیمات
</MudButton>
</MudStack>
</MudStack> </MudStack>
</div> </MudForm>
</MudTabPanel> *@ </div>
</MudTabPanel>
<!-- Statistics Tab --> <!-- Account Settings Tab -->
@* <MudTabPanel Text="آمار و اطلاعات" Icon="@Icons.Material.Filled.BarChart"> @* <MudTabPanel Text="تنظیمات حساب" Icon="@Icons.Material.Filled.Settings">
<div class="pa-4">
<MudText Typo="Typo.h6" Class="mb-4 mud-typography-subtitle1">تنظیمات حساب</MudText>
<MudStack Spacing="4">
<!-- Notification Settings -->
<MudPaper Outlined="true" Class="pa-4 rounded-lg">
<MudText Typo="Typo.subtitle1" Class="mb-3 fw-600">اعلان‌ها</MudText>
<MudStack Spacing="2">
<MudSwitch T="bool" @bind-Checked="_settings.EmailNotifications" Label="اعلان‌های ایمیلی" />
<MudSwitch T="bool" @bind-Checked="_settings.SmsNotifications" Label="اعلان‌های پیامکی" />
<MudSwitch T="bool" @bind-Checked="_settings.PushNotifications" Label="اعلان‌های پوش" />
</MudStack>
</MudPaper>
<!-- Privacy Settings -->
<MudPaper Outlined="true" Class="pa-4 rounded-lg">
<MudText Typo="Typo.subtitle1" Class="mb-3 fw-600">حریم خصوصی</MudText>
<MudStack Spacing="2">
<MudSwitch T="bool" @bind-Checked="_settings.ProfileVisibility" Label="نمایش پروفایل عمومی" />
<MudSwitch T="bool" @bind-Checked="_settings.ShowOnlineStatus" Label="نمایش وضعیت آنلاین" />
</MudStack>
</MudPaper>
<!-- Language & Theme -->
<MudPaper Outlined="true" Class="pa-4 rounded-lg">
<MudText Typo="Typo.subtitle1" Class="mb-3 fw-600">زبان و تم</MudText>
<MudGrid Spacing="3">
<MudItem xs="12" md="6">
<MudSelect @bind-Value="_settings.Language" Label="زبان" Variant="Variant.Outlined">
<MudSelectItem Value="@("fa")">فارسی</MudSelectItem>
<MudSelectItem Value="@("en")">English</MudSelectItem>
</MudSelect>
</MudItem>
<MudItem xs="12" md="6">
<MudSelect @bind-Value="_settings.Theme" Label="تم" Variant="Variant.Outlined">
<MudSelectItem Value="@("light")">روشن</MudSelectItem>
<MudSelectItem Value="@("dark")">تیره</MudSelectItem>
<MudSelectItem Value="@("auto")">خودکار</MudSelectItem>
</MudSelect>
</MudItem>
</MudGrid>
</MudPaper>
<MudStack Row="true" Spacing="2" Justify="Justify.FlexEnd">
<MudButton Variant="Variant.Outlined" Color="Color.Secondary" OnClick="CancelSettingsChanges">
لغو
</MudButton>
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="SaveSettings" Disabled="_isSettingsSaving">
ذخیره تنظیمات
</MudButton>
</MudStack>
</MudStack>
</div>
</MudTabPanel> *@
<!-- Statistics Tab -->
@* <MudTabPanel Text="آمار و اطلاعات" Icon="@Icons.Material.Filled.BarChart">
<div class="pa-4"> <div class="pa-4">
<MudText Typo="Typo.h6" Class="mb-4 mud-typography-subtitle1">آمار حساب کاربری</MudText> <MudText Typo="Typo.h6" Class="mb-4 mud-typography-subtitle1">آمار حساب کاربری</MudText>
@@ -183,8 +219,8 @@
</div> </div>
</MudTabPanel> </MudTabPanel>
*@ *@
</MudTabs> </MudTabs>
</MudPaper> </MudPaper>
</MudItem> </MudItem>
</MudGrid> </MudGrid>
</MudContainer> </MudContainer>

View File

@@ -1,9 +1,8 @@
using FluentValidation; using FluentValidation;
using FrontOffice.BFF.Package.Protobuf.Protos.Package;
using FrontOffice.BFF.User.Protobuf.Protos.User; using FrontOffice.BFF.User.Protobuf.Protos.User;
using FrontOffice.Main.Utilities;
using Mapster; using Mapster;
using Microsoft.AspNetCore.Components; using Microsoft.AspNetCore.Components;
using Microsoft.JSInterop;
using MudBlazor; using MudBlazor;
using System.ComponentModel.DataAnnotations; using System.ComponentModel.DataAnnotations;
using Severity = MudBlazor.Severity; using Severity = MudBlazor.Severity;
@@ -22,6 +21,8 @@ public partial class Index
private bool _isPersonalSaving; private bool _isPersonalSaving;
private bool _isSettingsSaving; private bool _isSettingsSaving;
private string _copyMessage = string.Empty;
private readonly UserProfileValidator _personalValidator = new(); private readonly UserProfileValidator _personalValidator = new();
protected override async Task OnAfterRenderAsync(bool firstRender) protected override async Task OnAfterRenderAsync(bool firstRender)
@@ -36,11 +37,20 @@ public partial class Index
private async Task LoadUserProfile() private async Task LoadUserProfile()
{ {
_userProfile = await UserContract.GetUserAsync(request: new()); try
_updateUserRequest = _userProfile.Adapt<UpdateUserRequest>(); {
_userProfile = await UserContract.GetUserAsync(request: new());
_updateUserRequest = _userProfile.Adapt<UpdateUserRequest>();
}
catch (Exception ex)
{
// Handle the case when user is not authenticated or API fails
_userProfile = new GetUserResponse();
}
StateHasChanged(); StateHasChanged();
} }
private async Task LoadAccountSettings() private async Task LoadAccountSettings()
{ {
// TODO: Load settings from API // TODO: Load settings from API
@@ -117,6 +127,48 @@ public partial class Index
Snackbar.Add("تغییرات تنظیمات لغو شد.", Severity.Info); Snackbar.Add("تغییرات تنظیمات لغو شد.", Severity.Info);
} }
private async Task CopyReferralCode()
{
try
{
await JSRuntime.InvokeVoidAsync("navigator.clipboard.writeText", $"{Navigation.BaseUri}?ref={_userProfile.ReferralCode}");
_copyMessage = "کد دعوت کپی شد!";
Snackbar.Add("کد دعوت در کلیپ‌بورد کپی شد.", Severity.Success);
// Clear message after 3 seconds
await Task.Delay(3000);
_copyMessage = string.Empty;
await InvokeAsync(StateHasChanged);
}
catch (Exception ex)
{
Snackbar.Add("خطا در کپی کردن کد دعوت.", Severity.Error);
}
}
private async Task ShareReferralCode()
{
var shareText = $"کد دعوت من در فرصت: {_userProfile.ReferralCode}\nبرای عضویت از این لینک استفاده کنید: {Navigation.BaseUri}?ref={_userProfile.ReferralCode}";
try
{
// Try to use Web Share API if available
await JSRuntime.InvokeVoidAsync("navigator.share",
new
{
title = "کد دعوت فرصت",
text = shareText,
url = $"{Navigation.BaseUri}?ref={_userProfile.ReferralCode}"
});
}
catch
{
// Fallback: copy to clipboard
await JSRuntime.InvokeVoidAsync("navigator.clipboard.writeText", $"{Navigation.BaseUri}?ref={_userProfile.ReferralCode}");
Snackbar.Add("لینک دعوت در کلیپ‌بورد کپی شد.", Severity.Success);
}
}
public class UserProfile public class UserProfile
{ {
[Required(ErrorMessage = "نام الزامی است")] [Required(ErrorMessage = "نام الزامی است")]