Add OtpDialogService for mobile-friendly OTP authentication dialog

2025-11-17 02:53:51 +03:30
parent a0c1452a84
commit 52b8298a18
34 changed files with 1495 additions and 279 deletions
@@ -0,0 +1,79 @@
+@attribute [Route(RouteConstants.Store.OrderDetail + "{id:long}")]
+@* Injection is handled in code-behind *@
+
+<PageTitle>جزئیات سفارش</PageTitle>
+
+@if (_loading)
+{
+    <MudContainer MaxWidth="MaxWidth.Medium" Class="py-6">
+        <MudStack AlignItems="AlignItems.Center">
+            <MudProgressCircular Indeterminate="true" Color="Color.Primary" />
+        </MudStack>
+    </MudContainer>
+}
+else if (_order is null)
+{
+    <MudContainer MaxWidth="MaxWidth.Medium" Class="py-6">
+        <MudAlert Severity="Severity.Warning">سفارش یافت نشد.</MudAlert>
+        <MudButton Variant="Variant.Text" StartIcon="@Icons.Material.Filled.ArrowBack" OnClick="() => Navigation.NavigateTo(RouteConstants.Store.Orders)">بازگشت</MudButton>
+    </MudContainer>
+}
+else
+{
+    <MudContainer MaxWidth="MaxWidth.Large" Class="py-6">
+        <MudPaper Elevation="2" Class="pa-4 rounded-lg">
+            <MudStack Spacing="2">
+                <MudText Typo="Typo.h5">سفارش #@_order.Id</MudText>
+                <MudText Typo="Typo.body2" Class="mud-text-secondary">تاریخ: @_order.CreatedAt.ToString("yyyy/MM/dd HH:mm")</MudText>
+                <MudText Typo="Typo.body2">وضعیت: @GetStatusText(_order.Status)</MudText>
+                <MudText Typo="Typo.body2">روش پرداخت: کیف پول</MudText>
+                <MudText Typo="Typo.body2">آدرس: @_order.AddressSummary</MudText>
+                <MudDivider Class="my-2" />
+                <MudHidden Breakpoint="Breakpoint.MdAndUp" Invert="true">
+                <MudTable Items="_order.Items">
+                    <HeaderContent>
+                        <MudTh>محصول</MudTh>
+                        <MudTh>قیمت واحد</MudTh>
+                        <MudTh>تعداد</MudTh>
+                        <MudTh>قیمت کل</MudTh>
+                    </HeaderContent>
+                    <RowTemplate>
+                        <MudTd>
+                            <MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
+                                <MudAvatar Image="@context.ImageUrl" Size="Size.Medium" />
+                                <MudText>@context.Title</MudText>
+                            </MudStack>
+                        </MudTd>
+                        <MudTd>@FormatPrice(context.UnitPrice)</MudTd>
+                        <MudTd>@context.Quantity</MudTd>
+                        <MudTd>@FormatPrice(context.LineTotal)</MudTd>
+                    </RowTemplate>
+                </MudTable>
+                </MudHidden>
+
+                <MudHidden Breakpoint="Breakpoint.MdAndUp">
+                    <MudStack Spacing="2">
+                        @foreach (var it in _order.Items)
+                        {
+                            <MudPaper Class="pa-3 rounded-lg" Outlined="true">
+                                <MudStack Spacing="1">
+                                    <MudStack Row="true" Spacing="2" AlignItems="AlignItems.Center">
+                                        <MudAvatar Image="@it.ImageUrl" />
+                                        <MudText>@it.Title</MudText>
+                                    </MudStack>
+                                    <MudStack Row="true" Justify="Justify.SpaceBetween">
+                                        <MudText Class="mud-text-secondary">@FormatPrice(it.UnitPrice) واحد</MudText>
+                                        <MudText>تعداد: @it.Quantity</MudText>
+                                    </MudStack>
+                                    <MudText>جمع: @FormatPrice(it.LineTotal)</MudText>
+                                </MudStack>
+                            </MudPaper>
+                        }
+                    </MudStack>
+                </MudHidden>
+                <MudDivider Class="my-2" />
+                <MudText Typo="Typo.h6" Align="Align.End">مبلغ کل: @FormatPrice(_order.Total)</MudText>
+            </MudStack>
+        </MudPaper>
+    </MudContainer>
+}