@attribute [Route(RouteConstants.Profile.Wallet)]

<PageTitle>کیف پول</PageTitle>

<MudContainer MaxWidth="MaxWidth.Large" Class="py-6">
    <MudStack Spacing="3">
        <PageHeader Title="کیف پول" BackHref="@RouteConstants.Profile.Index" />

        <MudGrid Spacing="2">
            <MudItem xs="12" sm="6" md="4">
                <MudPaper Elevation="2" Class="pa-4 rounded-lg">
                    <MudText Typo="Typo.subtitle2" Class="mud-text-secondary">موجودی اصلی</MudText>
                    <MudText Typo="Typo.h4" Color="Color.Primary">@_balances.Credit</MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="6" md="4">
                <MudPaper Elevation="2" Class="pa-4 rounded-lg">
                    <MudText Typo="Typo.subtitle2" Class="mud-text-secondary">پاداش تیمی</MudText>
                    <MudText Typo="Typo.h4" Color="Color.Success">@_balances.Network</MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="6" md="4">
                <MudPaper Elevation="2" Class="pa-4 rounded-lg">
                    <MudText Typo="Typo.subtitle2" Class="mud-text-secondary">موجودی اعتباری</MudText>
                    <MudText Typo="Typo.h4" Color="Color.Warning">@_balances.Discount</MudText>
                </MudPaper>
            </MudItem>
        </MudGrid>

        <!-- دکمه دسترسی سریع به درخواست برداشت -->
        <MudButton Variant="Variant.Filled" 
                   Color="Color.Warning" 
                   Size="Size.Large"
                   FullWidth="true"
                   StartIcon="@Icons.Material.Filled.RequestPage"
                   Href="@RouteConstants.Profile.WithdrawalRequests"
                   Class="rounded-lg">
            درخواست‌های برداشت
        </MudButton>

        <!-- دکمه شارژ کیف‌پول اعتباری -->
        <MudButton Variant="Variant.Filled" 
                   Color="Color.Info" 
                   Size="Size.Large"
                   FullWidth="true"
                   StartIcon="@Icons.Material.Filled.CreditCard"
                   Href="@RouteConstants.Profile.ChargeDiscountWallet"
                   Class="rounded-lg">
            شارژ کیف‌پول اعتباری
        </MudButton>

        <MudPaper Elevation="2" Class="pa-4 rounded-lg">
            <MudText Typo="Typo.h6" Class="mb-2">تراکنش‌ها و مسیرهای شارژ</MudText>

            <MudGrid Spacing="2" Class="mb-3">
                <MudItem xs="6" md="4">
                    <MudTextField @bind-Value="_filterReferenceId"
                                  Label="شناسه ارجاع"
                                  Variant="Variant.Outlined"
                                  Adornment="Adornment.Start"
                                  AdornmentIcon="@Icons.Material.Filled.Search"
                                  FullWidth="true" />
                </MudItem>
                <MudItem xs="6" md="4">
                    <MudSelect T="string" @bind-Value="_filterType" Label="نوع تراکنش" Variant="Variant.Outlined" FullWidth="true">
                        <MudSelectItem T="string" Value="@("all")">همه</MudSelectItem>
                        <MudSelectItem T="string" Value="@("in")">ورودی (شارژ)</MudSelectItem>
                        <MudSelectItem T="string" Value="@("out")">خروجی (برداشت/خرید)</MudSelectItem>
                    </MudSelect>
                </MudItem>
                <MudItem xs="12" md="4" Class="d-flex align-end">
                    <MudButton Variant="Variant.Outlined" 
                               OnClick="ApplyFilters" 
                               StartIcon="@Icons.Material.Filled.FilterList"
                               FullWidth="true">
                        اعمال فیلتر
                    </MudButton>
                </MudItem>
            </MudGrid>

            <MudHidden Breakpoint="Breakpoint.MdAndUp" Invert="true">
                <MudTable Items="_txs" Dense="true" Hover="true" Striped="true">
                    <HeaderContent>
                        <MudTh>تاریخ</MudTh>
                        <MudTh>اصلی (تغییرات / مانده)</MudTh>
                        <MudTh>پاداش تیمی (تغییرات / مانده)</MudTh>
                        <MudTh>اعتباری (تغییرات / مانده)</MudTh>
                        <MudTh>شناسه ارجاع</MudTh>
                        <MudTh>توضیحات</MudTh>
                    </HeaderContent>
                    <RowTemplate>
                        <MudTd DataLabel="تاریخ">
                            <MudText Typo="Typo.caption">@context.Date</MudText>
                        </MudTd>
                        <MudTd DataLabel="اصلی">
                            <MudStack Spacing="0">
                                <MudText Color="@(context.CreditChange > 0 ? Color.Success : context.CreditChange < 0 ? Color.Error : Color.Default)" Typo="Typo.body2">
                                    @(context.CreditChange != 0 ? (context.CreditChange > 0 ? "+" : "") + FormatPrice(context.CreditChange) : "-")
                                </MudText>
                                <MudText Typo="Typo.caption" Class="mud-text-secondary">@FormatPrice(context.CreditBalance)</MudText>
                            </MudStack>
                        </MudTd>
                        <MudTd DataLabel="پاداش تیمی">
                            <MudStack Spacing="0">
                                <MudText Color="@(context.NetworkChange > 0 ? Color.Success : context.NetworkChange < 0 ? Color.Error : Color.Default)" Typo="Typo.body2">
                                    @(context.NetworkChange != 0 ? (context.NetworkChange > 0 ? "+" : "") + FormatPrice(context.NetworkChange) : "-")
                                </MudText>
                                <MudText Typo="Typo.caption" Class="mud-text-secondary">@FormatPrice(context.NetworkBalance)</MudText>
                            </MudStack>
                        </MudTd>
                        <MudTd DataLabel="اعتباری">
                            <MudStack Spacing="0">
                                <MudText Color="@(context.DiscountChange > 0 ? Color.Success : context.DiscountChange < 0 ? Color.Error : Color.Default)" Typo="Typo.body2">
                                    @(context.DiscountChange != 0 ? (context.DiscountChange > 0 ? "+" : "") + FormatPrice(context.DiscountChange) : "-")
                                </MudText>
                                <MudText Typo="Typo.caption" Class="mud-text-secondary">@FormatPrice(context.DiscountBalance)</MudText>
                            </MudStack>
                        </MudTd>
                        <MudTd DataLabel="شناسه">@context.Channel</MudTd>
                        <MudTd DataLabel="توضیحات">@context.Description</MudTd>
                    </RowTemplate>
                </MudTable>
            </MudHidden>

            <MudHidden Breakpoint="Breakpoint.MdAndUp">
                <MudStack Spacing="2">
                    @foreach (var tx in _txs)
                    {
                        <MudPaper Class="pa-3 rounded-lg" Outlined="true" Elevation="1">
                            <MudStack Spacing="2">
                                <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                                    <MudText Typo="Typo.caption" Class="mud-text-secondary">@tx.Date</MudText>
                                    <MudText Typo="Typo.caption" Class="mud-text-secondary">شناسه: @tx.Channel</MudText>
                                </MudStack>
                                
                                <MudDivider />
                                
                                <MudStack Row="true" Spacing="2" Justify="Justify.SpaceBetween">
                                    <!-- کیف پول اصلی -->
                                    <MudPaper Class="pa-2 flex-grow-1" Outlined="true">
                                        <MudStack Spacing="1" AlignItems="AlignItems.Center">
                                            <MudText Typo="Typo.caption" Color="Color.Primary">اصلی</MudText>
                                            <MudText Color="@(tx.CreditChange > 0 ? Color.Success : tx.CreditChange < 0 ? Color.Error : Color.Default)" Style="font-weight: 600; font-size: 0.75rem;">
                                                @(tx.CreditChange != 0 ? (tx.CreditChange > 0 ? "+" : "") + FormatPrice(tx.CreditChange) : "-")
                                            </MudText>
                                            <MudText Typo="Typo.caption" Class="mud-text-secondary" Style="font-size: 0.7rem;">@FormatPrice(tx.CreditBalance)</MudText>
                                        </MudStack>
                                    </MudPaper>
                                    
                                    <!-- پاداش تیمی -->
                                    <MudPaper Class="pa-2 flex-grow-1" Outlined="true">
                                        <MudStack Spacing="1" AlignItems="AlignItems.Center">
                                            <MudText Typo="Typo.caption" Color="Color.Success">پاداش تیمی</MudText>
                                            <MudText Color="@(tx.NetworkChange > 0 ? Color.Success : tx.NetworkChange < 0 ? Color.Error : Color.Default)" Style="font-weight: 600; font-size: 0.75rem;">
                                                @(tx.NetworkChange != 0 ? (tx.NetworkChange > 0 ? "+" : "") + FormatPrice(tx.NetworkChange) : "-")
                                            </MudText>
                                            <MudText Typo="Typo.caption" Class="mud-text-secondary" Style="font-size: 0.7rem;">@FormatPrice(tx.NetworkBalance)</MudText>
                                        </MudStack>
                                    </MudPaper>
                                    
                                    <!-- کیف پول اعتباری -->
                                    <MudPaper Class="pa-2 flex-grow-1" Outlined="true">
                                        <MudStack Spacing="1" AlignItems="AlignItems.Center">
                                            <MudText Typo="Typo.caption" Color="Color.Warning">اعتباری</MudText>
                                            <MudText Color="@(tx.DiscountChange > 0 ? Color.Success : tx.DiscountChange < 0 ? Color.Error : Color.Default)" Style="font-weight: 600; font-size: 0.75rem;">
                                                @(tx.DiscountChange != 0 ? (tx.DiscountChange > 0 ? "+" : "") + FormatPrice(tx.DiscountChange) : "-")
                                            </MudText>
                                            <MudText Typo="Typo.caption" Class="mud-text-secondary" Style="font-size: 0.7rem;">@FormatPrice(tx.DiscountBalance)</MudText>
                                        </MudStack>
                                    </MudPaper>
                                </MudStack>
                                
                                <MudText Typo="Typo.body2">@tx.Description</MudText>
                            </MudStack>
                        </MudPaper>
                    }
                </MudStack>
            </MudHidden>
        </MudPaper>
    </MudStack>
</MudContainer>
