319 lines
20 KiB
Plaintext
319 lines
20 KiB
Plaintext
@attribute [Route(RouteConstants.Profile.Index)]
|
|
@inject ISnackbar Snackbar
|
|
|
|
<PageTitle>پروفایل کاربری</PageTitle>
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large" Class="py-6">
|
|
<MudGrid Spacing="4">
|
|
<!-- Profile Header -->
|
|
<MudItem xs="12">
|
|
<MudPaper Elevation="4" Class="pa-6">
|
|
<MudStack Spacing="4">
|
|
<MudStack Row="true" Spacing="3" AlignItems="AlignItems.Center">
|
|
<MudAvatar Size="Size.Large" Color="Color.Primary">
|
|
<MudIcon Icon="@Icons.Material.Filled.Person" Size="Size.Large" />
|
|
</MudAvatar>
|
|
<div>
|
|
<MudText Typo="Typo.h5">@($"{_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>
|
|
</div>
|
|
</MudStack>
|
|
|
|
<!-- Referral Code Section -->
|
|
<MudDivider />
|
|
<MudStack Spacing="3">
|
|
<MudStack Row="true" AlignItems="AlignItems.Center">
|
|
<MudText Typo="Typo.subtitle1">کد دعوت شما</MudText>
|
|
<MudSpacer />
|
|
<MudButton Variant="Variant.Filled"
|
|
Color="Color.Primary"
|
|
StartIcon="@Icons.Material.Filled.Share"
|
|
OnClick="ShareReferralCode">
|
|
اشتراکگذاری
|
|
</MudButton>
|
|
</MudStack>
|
|
<MudText Typo="Typo.body2" Class="mud-text-secondary">
|
|
این کد را با دوستان خود به اشتراک بگذارید تا از خریدهای آنها پاداش دریافت کنید.
|
|
</MudText>
|
|
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<MudTextField @bind-Value="_userProfile.ReferralCode"
|
|
Label="کد دعوت"
|
|
Variant="Variant.Outlined"
|
|
ReadOnly="true"
|
|
Class="flex-grow-1"
|
|
Adornment="Adornment.End"
|
|
AdornmentIcon="@Icons.Material.Filled.ContentCopy"
|
|
OnAdornmentClick="CopyReferralCode" />
|
|
</MudStack>
|
|
|
|
@if (!string.IsNullOrWhiteSpace(_copyMessage))
|
|
{
|
|
<MudText Typo="Typo.caption" Color="Color.Success">@(_copyMessage)</MudText>
|
|
}
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudPaper>
|
|
</MudItem>
|
|
|
|
<!-- Profile Content -->
|
|
<MudItem xs="12">
|
|
<MudPaper Elevation="4" Class=" ">
|
|
<MudTabs Elevation="0" Rounded="true" ApplyEffectsToContainer="true" Class="px-4 pt-4">
|
|
<!-- Personal Information Tab -->
|
|
<MudTabPanel Text="اطلاعات شخصی" Icon="@Icons.Material.Filled.Person">
|
|
<div class="pa-4">
|
|
<MudForm @ref="_personalForm" Model="_updateUserRequest" Validation="@(_personalValidator.ValidateValue)">
|
|
<MudGrid Spacing="3">
|
|
<MudItem xs="12" md="6">
|
|
<MudTextField @bind-Value="_updateUserRequest.FirstName"
|
|
For="@(() => _updateUserRequest.FirstName)"
|
|
Label="نام"
|
|
Variant="Variant.Outlined" />
|
|
</MudItem>
|
|
|
|
<MudItem xs="12" md="6">
|
|
<MudTextField @bind-Value="_updateUserRequest.LastName"
|
|
For="@(() => _updateUserRequest.LastName)"
|
|
Label="نام خانوادگی"
|
|
Variant="Variant.Outlined" />
|
|
</MudItem>
|
|
|
|
<MudItem xs="12" md="6">
|
|
<MudTextField @bind-Value="_updateUserRequest.NationalCode"
|
|
For="@(() => _updateUserRequest.NationalCode)"
|
|
Label="کد ملی"
|
|
Variant="Variant.Outlined"
|
|
InputType="InputType.Text" />
|
|
</MudItem>
|
|
|
|
<MudItem xs="12" md="6">
|
|
<MudDatePicker Label="تاریخ تولد"
|
|
@bind-Date="_date"
|
|
OpenTo="OpenTo.Year"
|
|
Variant="Variant.Outlined"
|
|
Culture="@Extensions.GetPersianCulture()"
|
|
TitleDateFormat="dddd, dd MMMM" />
|
|
</MudItem>
|
|
</MudGrid>
|
|
|
|
<MudStack Row="true" Spacing="2" Justify="Justify.FlexEnd" Class="mt-4">
|
|
<MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="SavePersonalInfo" Disabled="_isPersonalSaving">
|
|
ذخیره تغییرات
|
|
</MudButton>
|
|
</MudStack>
|
|
</MudForm>
|
|
</div>
|
|
</MudTabPanel>
|
|
|
|
<!-- Address Management Tab -->
|
|
<MudTabPanel Text="آدرسها" Icon="@Icons.Material.Filled.LocationOn">
|
|
<div class="pa-4">
|
|
<MudStack Spacing="4">
|
|
<!-- Add New Address Button -->
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudText Typo="Typo.subtitle1" >آدرسهای شما</MudText>
|
|
<MudButton Variant="Variant.Filled"
|
|
Color="Color.Primary"
|
|
StartIcon="@Icons.Material.Filled.Add"
|
|
OnClick="OpenAddAddressDialog">
|
|
افزودن آدرس جدید
|
|
</MudButton>
|
|
</MudStack>
|
|
|
|
<!-- Address List -->
|
|
@if (_isLoadingAddresses)
|
|
{
|
|
<MudStack AlignItems="AlignItems.Center" Class="py-8">
|
|
<MudProgressCircular Color="Color.Primary" Indeterminate="true" Size="Size.Large" />
|
|
<MudText Typo="Typo.body1" Class="mud-text-secondary mt-2">در حال بارگذاری آدرسها...</MudText>
|
|
</MudStack>
|
|
}
|
|
else if (_addresses.Any())
|
|
{
|
|
<MudStack Spacing="3">
|
|
@foreach (var address in _addresses)
|
|
{
|
|
<MudPaper Elevation="2" Class="pa-4 rounded-xl " Outlined="true">
|
|
<MudStack Spacing="3">
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Start">
|
|
<MudStack Spacing="1">
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<MudText Typo="Typo.h6" >@address.Title</MudText>
|
|
@if (address.IsDefault)
|
|
{
|
|
<MudChip T="string" Color="Color.Success" Variant="Variant.Filled" Size="Size.Small">پیشفرض</MudChip>
|
|
}
|
|
</MudStack>
|
|
<MudText Typo="Typo.body2" Class="mud-text-secondary">@(address.Address)</MudText>
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">کد پستی: @(address.PostalCode)</MudText>
|
|
</MudStack>
|
|
|
|
<MudMenu Icon="@Icons.Material.Filled.MoreVert" Size="Size.Small" AnchorOrigin="Origin.TopRight">
|
|
<MudMenuItem OnClick="@(() => OpenEditAddressDialog(address))">ویرایش</MudMenuItem>
|
|
@if (!address.IsDefault)
|
|
{
|
|
<MudMenuItem OnClick="@(() => SetAsDefaultAddress(address.Id))">تنظیم به عنوان پیشفرض</MudMenuItem>
|
|
}
|
|
<MudDivider />
|
|
<MudMenuItem OnClick="@(() => DeleteAddress(address.Id))" Class="mud-text-error">حذف</MudMenuItem>
|
|
</MudMenu>
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudPaper>
|
|
}
|
|
</MudStack>
|
|
}
|
|
else
|
|
{
|
|
<MudStack AlignItems="AlignItems.Center" Class="py-8">
|
|
<MudIcon Icon="@Icons.Material.Filled.LocationOff" Size="Size.Large" Color="Color.Default" />
|
|
<MudText Typo="Typo.body1" Class="mud-text-secondary mt-2">هنوز آدرسی ثبت نکردهاید.</MudText>
|
|
<MudButton Variant="Variant.Outlined"
|
|
Color="Color.Primary"
|
|
StartIcon="@Icons.Material.Filled.Add"
|
|
OnClick="OpenAddAddressDialog"
|
|
Class="mt-2">
|
|
افزودن اولین آدرس
|
|
</MudButton>
|
|
</MudStack>
|
|
}
|
|
</MudStack>
|
|
</div>
|
|
</MudTabPanel>
|
|
|
|
<!-- Organization Chart Tab -->
|
|
<MudTabPanel Text="شجرهنامه" Icon="@Icons.Material.Filled.AccountTree">
|
|
<div class="pa-4">
|
|
<OrganizationChart />
|
|
</div>
|
|
</MudTabPanel>
|
|
|
|
<!-- Account Settings Tab -->
|
|
<MudTabPanel Text="تنظیمات حساب" Icon="@Icons.Material.Filled.Settings">
|
|
<div class="pa-4">
|
|
|
|
<MudStack Spacing="4">
|
|
<!-- Notification Settings -->
|
|
<MudPaper Outlined="true" Class="pa-4 rounded-lg">
|
|
<MudText Typo="Typo.subtitle1" Class="mb-3">اعلانها</MudText>
|
|
<MudStack Spacing="2">
|
|
<MudSwitch T="bool"
|
|
@bind-Value="_updateUserRequest.EmailNotifications"
|
|
Color="Color.Primary"
|
|
Label="اعلانهای ایمیلی" />
|
|
<MudSwitch T="bool"
|
|
@bind-Value="_updateUserRequest.SmsNotifications"
|
|
Color="Color.Primary"
|
|
Label="اعلانهای پیامکی" />
|
|
<MudSwitch T="bool"
|
|
@bind-Value="_updateUserRequest.PushNotifications"
|
|
Color="Color.Primary"
|
|
Label="اعلانهای پوش" />
|
|
</MudStack>
|
|
</MudPaper>
|
|
@*
|
|
<!-- Privacy Settings -->
|
|
<MudPaper Outlined="true" Class="pa-4 rounded-lg">
|
|
<MudText Typo="Typo.subtitle1" Class="mb-3">حریم خصوصی</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">زبان و تم</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.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">
|
|
<MudText Typo="Typo.h6" Class="mb-4">آمار حساب کاربری</MudText>
|
|
|
|
<MudGrid Spacing="3">
|
|
<MudItem xs="12" md="6" lg="3">
|
|
<MudPaper Elevation="3" Class="pa-4 text-center rounded-xl ">
|
|
<MudIcon Icon="@Icons.Material.Filled.DateRange" Size="Size.Large" Color="Color.Primary" Class="mb-2" />
|
|
<MudText Typo="Typo.h4">@_userProfile.JoinDate</MudText>
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">تاریخ عضویت</MudText>
|
|
</MudPaper>
|
|
</MudItem>
|
|
|
|
<MudItem xs="12" md="6" lg="3">
|
|
<MudPaper Elevation="3" Class="pa-4 text-center rounded-xl ">
|
|
<MudIcon Icon="@Icons.Material.Filled.Login" Size="Size.Large" Color="Color.Success" Class="mb-2" />
|
|
<MudText Typo="Typo.h4">@_userProfile.LastLogin</MudText>
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">آخرین ورود</MudText>
|
|
</MudPaper>
|
|
</MudItem>
|
|
|
|
<MudItem xs="12" md="6" lg="3">
|
|
<MudPaper Elevation="3" Class="pa-4 text-center rounded-xl ">
|
|
<MudIcon Icon="@Icons.Material.Filled.Group" Size="Size.Large" Color="Color.Info" Class="mb-2" />
|
|
<MudText Typo="Typo.h4">@_userProfile.TotalReferrals</MudText>
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">معرفها</MudText>
|
|
</MudPaper>
|
|
</MudItem>
|
|
|
|
<MudItem xs="12" md="6" lg="3">
|
|
<MudPaper Elevation="3" Class="pa-4 text-center rounded-xl ">
|
|
<MudIcon Icon="@Icons.Material.Filled.Star" Size="Size.Large" Color="Color.Warning" Class="mb-2" />
|
|
<MudText Typo="Typo.h4">@_userProfile.Level</MudText>
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">سطح کاربری</MudText>
|
|
</MudPaper>
|
|
</MudItem>
|
|
</MudGrid>
|
|
|
|
<!-- Account Status -->
|
|
<MudPaper Elevation="2" Class="pa-4 mt-4 rounded-xl ">
|
|
<MudText Typo="Typo.subtitle1" Class="mb-3">وضعیت حساب</MudText>
|
|
<MudStack Spacing="2">
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<MudIcon Icon="@Icons.Material.Filled.CheckCircle" Size="Size.Small" Color="Color.Success" />
|
|
<MudText Typo="Typo.body2">حساب تأیید شده</MudText>
|
|
</MudStack>
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<MudIcon Icon="@Icons.Material.Filled.CheckCircle" Size="Size.Small" Color="Color.Success" />
|
|
<MudText Typo="Typo.body2">ایمیل تأیید شده</MudText>
|
|
</MudStack>
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<MudIcon Icon="@Icons.Material.Filled.CheckCircle" Size="Size.Small" Color="Color.Success" />
|
|
<MudText Typo="Typo.body2">شماره موبایل تأیید شده</MudText>
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudPaper>
|
|
</div>
|
|
</MudTabPanel>
|
|
*@
|
|
</MudTabs>
|
|
</MudPaper>
|
|
</MudItem>
|
|
</MudGrid>
|
|
</MudContainer> |