@attribute [Route(RouteConstants.Commission.Dashboard)]
@attribute [Route(RouteConstants.Commission.History)]
@using FrontOffice.Main.Utilities
@using FrontOffice.Main.Shared
@using MudBlazor

<PageTitle>پاداش‌های من</PageTitle>

<MudContainer MaxWidth="MaxWidth.Large" Class="py-6">
    <MudStack Spacing="3">
        <PageHeader Title="پاداش‌های من" BackHref="@RouteConstants.Profile.Index" />

        <!-- فیلترها -->
        <MudPaper Elevation="2" Class="pa-3 rounded-lg">
            <MudGrid Spacing="2">
                <MudItem xs="12" sm="6" md="4">
                    <WeekSelector @ref="_weekSelector"
                                  @bind-Value="_selectedWeekDefinition"
                                  Label="انتخاب هفته"
                                  Placeholder="جستجوی هفته..."
                                  Variant="Variant.Outlined"
                                  Dense="false"
                                  Clearable="true"
                                  OnlyActive="false" />
                </MudItem>
                <MudItem xs="12" sm="6" md="4">
                    <MudSelect T="string" @bind-Value="_filterStatus" Label="وضعیت" Variant="Variant.Outlined">
                        <MudSelectItem T="string" Value="@string.Empty">همه</MudSelectItem>
                        <MudSelectItem T="string" Value="@("Pending")">در انتظار</MudSelectItem>
                        <MudSelectItem T="string" Value="@("Paid")">پرداخت شده</MudSelectItem>
                        <MudSelectItem T="string" Value="@("WithdrawalRequested")">درخواست برداشت</MudSelectItem>
                        <MudSelectItem T="string" Value="@("Withdrawn")">برداشت شده</MudSelectItem>
                        <MudSelectItem T="string" Value="@("PaymentFailed")">شکست خورده</MudSelectItem>
                        <MudSelectItem T="string" Value="@("Cancelled")">لغو شده</MudSelectItem>
                    </MudSelect>
                </MudItem>
                <MudItem xs="12" sm="12" md="4">
                    <MudStack Row="true" Spacing="2" Style="height: 100%;" AlignItems="AlignItems.End">
                        <MudButton Variant="Variant.Filled" Color="Color.Primary" OnClick="ApplyFiltersAsync" StartIcon="@Icons.Material.Filled.FilterList" FullWidth="true">
                            اعمال فیلتر
                        </MudButton>
                        <MudButton Variant="Variant.Outlined" OnClick="ClearFiltersAsync" StartIcon="@Icons.Material.Filled.Clear" FullWidth="true">
                            پاک کردن
                        </MudButton>
                    </MudStack>
                </MudItem>
            </MudGrid>
        </MudPaper>

        @if (_isLoading)
        {
            <LoadingState Message="در حال دریافت پاداش‌ها..." />
        }
        else
        {
            <!-- آمار خلاصه -->
            @if (_payouts.Any())
            {
                <MudGrid Spacing="2">
                    <MudItem xs="6" sm="4">
                        <MudPaper Elevation="2" Class="pa-3 rounded-lg text-center">
                            <MudText Typo="Typo.caption" Class="mud-text-secondary">کل پاداش</MudText>
                            <MudText Typo="Typo.h6" Color="Color.Success">@GetTotalEarnings()</MudText>
                        </MudPaper>
                    </MudItem>
                    <MudItem xs="6" sm="4">
                        <MudPaper Elevation="2" Class="pa-3 rounded-lg text-center">
                            <MudText Typo="Typo.caption" Class="mud-text-secondary">تعداد</MudText>
                            <MudText Typo="Typo.h6" Color="Color.Primary">@_totalCount</MudText>
                        </MudPaper>
                    </MudItem>
                    <MudItem xs="12" sm="4">
                        <MudPaper Elevation="2" Class="pa-3 rounded-lg text-center">
                            <MudText Typo="Typo.caption" Class="mud-text-secondary">میانگین هفتگی</MudText>
                            <MudText Typo="Typo.h6" Color="Color.Info">@GetAverageWeekly()</MudText>
                        </MudPaper>
                    </MudItem>
                </MudGrid>
            }

            <!-- لیست پاداش‌ها -->
            @if (_payouts.Any())
            {
                <!-- جدول - دسکتاپ -->
                <MudHidden Breakpoint="Breakpoint.SmAndDown">
                    <MudPaper Elevation="2" Class="pa-0 rounded-lg">
                        <MudTable Items="_payouts" Hover="true" Striped="true" Dense="true" FixedHeader="true" Height="400px">
                            <HeaderContent>
                                <MudTh>هفته</MudTh>
                                <MudTh>امتیاز</MudTh>
                                <MudTh>مبلغ (تومان)</MudTh>
                                <MudTh>وضعیت</MudTh>
                                <MudTh>تاریخ</MudTh>
                                <MudTh>جزئیات</MudTh>
                            </HeaderContent>
                            <RowTemplate>
                                <MudTd DataLabel="هفته">
                                    <MudChip T="string" Color="Color.Primary" Size="Size.Small" Variant="Variant.Outlined">@context.WeekDisplayName</MudChip>
                                </MudTd>
                                <MudTd DataLabel="امتیاز">@context.BalancesEarned</MudTd>
                                <MudTd DataLabel="مبلغ">
                                    <MudText Color="Color.Success"><strong>@context.AmountFormatted</strong></MudText>
                                </MudTd>
                                <MudTd DataLabel="وضعیت">
                                    <MudChip T="string" Color="@GetStatusColor(context.StatusColor)" Size="Size.Small">@context.StatusText</MudChip>
                                </MudTd>
                                <MudTd DataLabel="تاریخ">@context.DatePersian</MudTd>
                                <MudTd DataLabel="جزئیات">
                                    <MudIconButton Size="Size.Small"
                                                   Icon="@Icons.Material.Filled.Visibility"
                                                   Color="Color.Info"
                                                   Href="@($"{RouteConstants.Commission.WeeklyBalance}?week={context.WeekDefinitionId}")" />
                                </MudTd>
                            </RowTemplate>
                        </MudTable>
                    </MudPaper>
                </MudHidden>

                <!-- کارت‌ها - موبایل -->
                <MudHidden Breakpoint="Breakpoint.SmAndDown" Invert="true">
                    <MudStack Spacing="2">
                        @foreach (var payout in _payouts)
                        {
                            <MudPaper Class="pa-3 rounded-lg" Outlined="true">
                                <MudStack Spacing="1">
                                    <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                                        <MudChip T="string" Color="Color.Primary" Size="Size.Small" Variant="Variant.Outlined">@payout.WeekDisplayName</MudChip>
                                        <MudChip T="string" Color="@GetStatusColor(payout.StatusColor)" Size="Size.Small">@payout.StatusText</MudChip>
                                    </MudStack>
                                    <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                                        <MudText Typo="Typo.h6" Color="Color.Success">@payout.AmountFormatted</MudText>
                                        <MudText Typo="Typo.caption" Class="mud-text-secondary">امتیاز: @payout.BalancesEarned</MudText>
                                    </MudStack>
                                    <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                                        <MudText Typo="Typo.caption" Class="mud-text-secondary">@payout.DatePersian</MudText>
                                        <MudButton Size="Size.Small"
                                                   Variant="Variant.Text"
                                                   Color="Color.Info"
                                                   EndIcon="@Icons.Material.Filled.ChevronLeft"
                                                   Href="@($"{RouteConstants.Commission.WeeklyBalance}?week={payout.WeekDefinitionId}")">
                                            جزئیات
                                        </MudButton>
                                    </MudStack>
                                </MudStack>
                            </MudPaper>
                        }
                    </MudStack>
                </MudHidden>

                <!-- Pagination -->
                <MudPaper Elevation="0" Class="pa-2">
                    <MudStack Row="true" Justify="Justify.Center" AlignItems="AlignItems.Center">
                        <MudPagination Count="@GetTotalPages()" Selected="_pageNumber" SelectedChanged="OnPageChangedAsync" Color="Color.Primary" Size="Size.Small" />
                    </MudStack>
                </MudPaper>
            }
            else
            {
                <MudAlert Severity="Severity.Info" Variant="Variant.Outlined">
                    پاداشی برای نمایش وجود ندارد.
                </MudAlert>
            }

            <!-- دکمه گزارش هفتگی -->
            <MudButton Variant="Variant.Outlined" 
                       Color="Color.Info" 
                       StartIcon="@Icons.Material.Filled.BarChart"
                       Href="@RouteConstants.Commission.WeeklyBalance"
                       FullWidth="true">
                مشاهده گزارش هفتگی
            </MudButton>
        }
    </MudStack>
</MudContainer>