masoodafar-web
22203fd8f4
Build and Deploy to Kubernetes / build-and-deploy (push) Successful in 6m18s
- Store/Products.razor: aspect-ratio:1/1 instead of height:60% - DiscountStore/Products.razor: same square ratio - Store/ProductDetail.razor: aspect-ratio:1/1 instead of max-height:400px - DiscountStore/ProductDetail.razor: ObjectFit.Cover + aspect-ratio:1/1 - Store/Cart.razor: rounded-lg instead of rounded-circle (desktop+mobile) - Store/CheckoutSummary.razor: rounded-lg + ObjectFit.Cover - Store/OrderDetail.razor: rounded-lg + ObjectFit.Cover (desktop+mobile) - DiscountStore/Cart.razor: rounded-lg + ObjectFit.Cover (desktop+mobile) - DiscountStore/Checkout.razor: rounded-lg + ObjectFit.Cover
206 lines
13 KiB
Plaintext
206 lines
13 KiB
Plaintext
@attribute [Route(RouteConstants.Store.Cart)]
|
|
@* Injection is handled in code-behind *@
|
|
|
|
<PageTitle>سبد خرید</PageTitle>
|
|
|
|
<MudContainer MaxWidth="MaxWidth.Large" Class="py-6">
|
|
<MudStack Spacing="3">
|
|
<PageHeader Title="سبد خرید" BackHref="@RouteConstants.Store.Products" />
|
|
|
|
@if (CartData.Items.Count == 0)
|
|
{
|
|
<MudAlert Severity="Severity.Info">سبد خرید شما خالی است.</MudAlert>
|
|
<MudButton Variant="Variant.Outlined" StartIcon="@Icons.Material.Filled.ArrowBack"
|
|
OnClick="() => Navigation.NavigateTo(RouteConstants.Store.Products)">بازگشت به محصولات
|
|
</MudButton>
|
|
}
|
|
else
|
|
{
|
|
<MudHidden Breakpoint="Breakpoint.MdAndUp" Invert="true">
|
|
<MudPaper Elevation="1" Class="pa-4 rounded-lg">
|
|
<MudTable Items="CartData.Items">
|
|
<HeaderContent>
|
|
<MudTh>محصول</MudTh>
|
|
<MudTh>قیمت واحد</MudTh>
|
|
<MudTh>تعداد</MudTh>
|
|
<MudTh>قیمت کل</MudTh>
|
|
<MudTh></MudTh>
|
|
</HeaderContent>
|
|
<RowTemplate>
|
|
<MudTd>
|
|
<MudStack Spacing="1">
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<AppImage Path="@GetProductImageUrl(context.ImageUrl)" Alt="@context.Title"
|
|
ImgWidth="64" ImgHeight="64" Class="rounded-lg" ObjectFit="ObjectFit.Cover" />
|
|
<MudText>@context.Title</MudText>
|
|
</MudStack>
|
|
@if (context.Discount > 0 || !string.IsNullOrWhiteSpace(context.Created) || !string.IsNullOrWhiteSpace(context.Description))
|
|
{
|
|
<MudStack Spacing="1">
|
|
@if (context.Discount > 0)
|
|
{
|
|
<MudChip T="string" Color="Color.Error" Variant="Variant.Outlined"
|
|
Size="Size.Small">@($"{context.Discount}% تخفیف")</MudChip>
|
|
}
|
|
@if (!string.IsNullOrWhiteSpace(context.Description))
|
|
{
|
|
<MudText Typo="Typo.caption"
|
|
Class="mud-text-secondary">@context.Description</MudText>
|
|
}
|
|
@if (!string.IsNullOrWhiteSpace(context.Created))
|
|
{
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">تاریخ
|
|
افزودن: @context.Created</MudText>
|
|
}
|
|
</MudStack>
|
|
}
|
|
</MudStack>
|
|
</MudTd>
|
|
<MudTd>@FormatPrice(context.UnitPrice)</MudTd>
|
|
<MudTd>
|
|
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
|
|
<MudIconButton Icon="@Icons.Material.Filled.Remove"
|
|
Color="Color.Default"
|
|
OnClick="@(() => DecrementQty(context.ProductId))"/>
|
|
<MudText>@context.Quantity</MudText>
|
|
<MudIconButton Icon="@Icons.Material.Filled.Add"
|
|
Color="Color.Default"
|
|
OnClick="@(() => IncrementQty(context.ProductId))"/>
|
|
</MudStack>
|
|
</MudTd>
|
|
<MudTd>@FormatPrice(context.LineTotal)</MudTd>
|
|
<MudTd>
|
|
<MudIconButton Icon="@Icons.Material.Filled.Delete" Color="Color.Error"
|
|
OnClick="() => Remove(context.cartId)"/>
|
|
</MudTd>
|
|
</RowTemplate>
|
|
</MudTable>
|
|
</MudPaper>
|
|
</MudHidden>
|
|
|
|
<MudHidden Breakpoint="Breakpoint.MdAndUp">
|
|
<MudStack Spacing="2">
|
|
@foreach (var item in CartData.Items)
|
|
{
|
|
<MudPaper Class="pa-3 rounded-lg w-100-mobile" Outlined="true">
|
|
<MudStack Spacing="1">
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
|
|
<AppImage Path="@GetProductImageUrl(item.ImageUrl)" Alt="@item.Title"
|
|
ImgWidth="50" ImgHeight="50" Class="rounded-lg" ObjectFit="ObjectFit.Cover" />
|
|
<MudText Typo="Typo.subtitle2">@item.Title</MudText>
|
|
</MudStack>
|
|
@if (item.Discount > 0)
|
|
{
|
|
<MudChip T="string" Color="Color.Error" Variant="Variant.Outlined"
|
|
Size="Size.Small">@($"{item.Discount}% ")</MudChip>
|
|
}
|
|
</MudStack>
|
|
|
|
@if (item.Discount > 0 || !string.IsNullOrWhiteSpace(item.Created) || !string.IsNullOrWhiteSpace(item.Description))
|
|
{
|
|
<MudStack Spacing="1">
|
|
|
|
@* @if (!string.IsNullOrWhiteSpace(item.Description)) *@
|
|
@* { *@
|
|
@* <MudText Typo="Typo.caption" *@
|
|
@* Class="mud-text-secondary">@item.Description</MudText> *@
|
|
@* } *@
|
|
@* @if (!string.IsNullOrWhiteSpace(item.Created)) *@
|
|
@* { *@
|
|
@* <MudText Typo="Typo.caption" Class="mud-text-secondary">تاریخ افزودن: @item.Created</MudText> *@
|
|
@* } *@
|
|
</MudStack>
|
|
}
|
|
|
|
<MudStack Spacing="1">
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudText Class="mud-text-secondary">@FormatPrice(item.UnitPrice) واحد</MudText>
|
|
<MudStack Row="true" AlignItems="AlignItems.Center" Spacing="1">
|
|
<MudIconButton
|
|
Icon="@(item.Quantity <= 1 ? Icons.Material.Filled.Delete : Icons.Material.Filled.Remove)"
|
|
Color="Color.Default"
|
|
OnClick="@(() => DecrementQty(item.ProductId))"/>
|
|
<MudText>@item.Quantity</MudText>
|
|
<MudIconButton Icon="@Icons.Material.Filled.Add"
|
|
Color="Color.Default"
|
|
OnClick="@(() => IncrementQty(item.ProductId))"/>
|
|
</MudStack>
|
|
</MudStack>
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudText>جمع: @FormatPrice(item.LineTotal)</MudText>
|
|
<MudIconButton Icon="@Icons.Material.Filled.Delete"
|
|
Color="Color.Error"
|
|
OnClick="() => Remove(item.cartId)"/>
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudPaper>
|
|
}
|
|
</MudStack>
|
|
</MudHidden>
|
|
@if (DeviceDetector.IsMobile())
|
|
{
|
|
<MudStack Spacing="1" Class="mobile-actions-stack px-5">
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudText Typo="Typo.body2">جمع کالاها:</MudText>
|
|
<MudText Typo="Typo.body2">@FormatPrice(CartData.Total) تومان</MudText>
|
|
</MudStack>
|
|
@if (VAT.IsEnabled)
|
|
{
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">مالیات (@VAT.VatPercentage%):</MudText>
|
|
<MudText Typo="Typo.caption" Class="mud-text-secondary">@FormatPrice(VATAmount) تومان</MudText>
|
|
</MudStack>
|
|
}
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
|
|
<MudText Typo="Typo.h6" Class="fw-bold">مبلغ قابل پرداخت:</MudText>
|
|
<MudText Typo="Typo.h6" Color="Color.Primary" Class="fw-bold">@FormatPrice(TotalWithVAT) تومان</MudText>
|
|
</MudStack>
|
|
</MudStack>
|
|
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween" Spacing="2" Class="mobile-actions-stack">
|
|
<MudButton Variant="Variant.Filled" Color="Color.Primary"
|
|
OnClick="() => Navigation.NavigateTo(RouteConstants.Store.Products)">افزودن محصول
|
|
</MudButton>
|
|
<MudButton Variant="Variant.Filled" Color="Color.Success" OnClick="ProceedCheckout"
|
|
StartIcon="@Icons.Material.Filled.CreditCard">ادامه خرید
|
|
</MudButton>
|
|
</MudStack>
|
|
}
|
|
else
|
|
{
|
|
<MudPaper Class="pa-4 rounded-lg" Style="background-color: var(--mud-palette-background-grey);">
|
|
<MudStack Spacing="1">
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween">
|
|
<MudText Typo="Typo.body2">جمع کالاها:</MudText>
|
|
<MudText Typo="Typo.body2">@FormatPrice(CartData.Total) تومان</MudText>
|
|
</MudStack>
|
|
@if (VAT.IsEnabled)
|
|
{
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween">
|
|
<MudText Typo="Typo.body2" Class="mud-text-secondary">مالیات بر ارزش افزوده (@VAT.VatPercentage%):</MudText>
|
|
<MudText Typo="Typo.body2" Class="mud-text-secondary">@FormatPrice(VATAmount) تومان</MudText>
|
|
</MudStack>
|
|
}
|
|
<MudDivider Class="my-1" />
|
|
<MudStack Row="true" Justify="Justify.SpaceBetween">
|
|
<MudText Typo="Typo.subtitle1" Class="fw-bold">مبلغ قابل پرداخت:</MudText>
|
|
<MudText Typo="Typo.subtitle1" Color="Color.Primary" Class="fw-bold">@FormatPrice(TotalWithVAT) تومان</MudText>
|
|
</MudStack>
|
|
</MudStack>
|
|
</MudPaper>
|
|
|
|
<MudStack Row="true" Justify="Justify.FlexEnd" Spacing="2" Class="mt-3">
|
|
<MudButton Variant="Variant.Outlined" Color="Color.Primary"
|
|
OnClick="() => Navigation.NavigateTo(RouteConstants.Store.Products)">افزودن محصول
|
|
</MudButton>
|
|
<MudButton Variant="Variant.Filled" Color="Color.Success" OnClick="ProceedCheckout"
|
|
StartIcon="@Icons.Material.Filled.CreditCard">ادامه فرایند خرید
|
|
</MudButton>
|
|
</MudStack>
|
|
}
|
|
}
|
|
</MudStack>
|
|
</MudContainer>
|