@page "/discount-products"
@using BackOffice.Services.DiscountProduct
@using BackOffice.Services.DiscountCategory
@using BackOffice.Pages.DiscountShop.Components
@using BackOffice.Common.BaseComponents
@using static BackOffice.Pages.DiscountShop.Components.ProductFormDialog

<BasePageComponent @ref="_basePage" OnClearFilterClick="OnFilterCleared" OnSubmitClick="OnFilterSubmit">
    <Filters>
        <MudItem xs="12" sm="6" md="3">
            <MudTextField T="string" Clearable="true" Label="جستجو"
                          @bind-Value="@_searchQuery" Variant="Variant.Outlined" Margin="Margin.Dense" />
        </MudItem>
        <MudItem xs="12" sm="6" md="3">
            <MudSelect @bind-Value="_categoryFilter"
                       Label="دسته‌بندی"
                       Variant="Variant.Outlined"
                       Margin="Margin.Dense"
                       T="long?"
                       Clearable="true">
                <MudSelectItem T="long?" Value="@((long?)null)">همه</MudSelectItem>
                @foreach (var cat in _categories)
                {
                    <MudSelectItem T="long?" Value="@((long?)cat.Id)">@cat.Title</MudSelectItem>
                }
            </MudSelect>
        </MudItem>
        <MudItem xs="12" sm="6" md="3">
            <MudSelect @bind-Value="_statusFilter"
                       Label="وضعیت"
                       Variant="Variant.Outlined"
                       Margin="Margin.Dense"
                       T="bool?"
                       Clearable="true">
                <MudSelectItem T="bool?" Value="@((bool?)null)">همه</MudSelectItem>
                <MudSelectItem T="bool?" Value="@((bool?)true)">فعال</MudSelectItem>
                <MudSelectItem T="bool?" Value="@((bool?)false)">غیرفعال</MudSelectItem>
            </MudSelect>
        </MudItem>
        <MudItem xs="12" sm="6" md="3">
            <MudSelect @bind-Value="_stockFilter"
                       Label="موجودی"
                       Variant="Variant.Outlined"
                       Margin="Margin.Dense"
                       T="bool?"
                       Clearable="true">
                <MudSelectItem T="bool?" Value="@((bool?)null)">همه</MudSelectItem>
                <MudSelectItem T="bool?" Value="@((bool?)true)">موجود</MudSelectItem>
                <MudSelectItem T="bool?" Value="@((bool?)false)">ناموجود</MudSelectItem>
            </MudSelect>
        </MudItem>
    </Filters>
    <Content>
        <MudDataGrid @ref="_dataGrid" T="DiscountProductDto"
                     ServerData="LoadServerData"
                     Loading="@_loading"
                     Hover="true"
                     Height="calc(100vh - 240px)">
            <ColGroup>
                <col />
                <col />
                <col />
                <col style="width: 58px;" />
            </ColGroup>
            <ToolBarContent>
                <MudText>مدیریت محصولات</MudText>
                <MudSpacer />
                <MudStack Spacing="2" Row="true" Justify="Justify.Center" AlignItems="AlignItems.Center">
                    <MudButton Variant="Variant.Outlined"
                               Color="Color.Secondary"
                               Size="Size.Small"
                               ButtonType="ButtonType.Button"
                               StartIcon="@Icons.Material.Filled.Download"
                               OnClick="ExportToExcel">
                        خروجی Excel
                    </MudButton>
                    <MudButton Variant="Variant.Filled"
                               Color="Color.Primary"
                               Size="Size.Large"
                               ButtonType="ButtonType.Button"
                               OnClick="@(() => OpenCreateDialog())">
                        افزودن
                    </MudButton>
                </MudStack>
            </ToolBarContent>
            <Columns>
                <PropertyColumn Property="x => x.Id" Title="شناسه" />

                <PropertyColumn Property="x => x.Title" Title="عنوان" CellStyle="text-wrap: nowrap;" HeaderStyle="text-wrap: nowrap;">
                    <CellTemplate>
                        <MudStack Row="true" AlignItems="AlignItems.Center">
                            <MudTooltip Text="پیش‌نمایش تصویر">
                                <div @onclick="@(() => OpenImagePreview(context.Item.ImagePath, context.Item.Title))">
                                    <Image Src="@context.Item.ImagePath"
                                           Width="25"
                                           Height="25"
                                           ObjectPosition="ObjectPosition.Center"
                                           ObjectFit="ObjectFit.Fill" />
                                </div>
                            </MudTooltip>
                            @if (string.IsNullOrWhiteSpace(context.Item.Title))
                            {
                                <MudText Typo="Typo.inherit">-</MudText>
                            }
                            else
                            {
                                <MudTooltip Text="@(context.Item.Title)" Arrow="true">
                                    <MudText Typo="Typo.inherit" Style="text-wrap: nowrap;">
                                        @(context.Item.Title.Truncate(20, true))
                                    </MudText>
                                </MudTooltip>
                            }
                        </MudStack>
                    </CellTemplate>
                </PropertyColumn>

                <TemplateColumn Title="قیمت" CellStyle="text-wrap: nowrap;">
                    <CellTemplate>
                        <MudText>@context.Item.Price.ToString("N0") تومان</MudText>
                    </CellTemplate>
                </TemplateColumn>

                <TemplateColumn Title="حداکثر تخفیف" CellStyle="text-wrap: nowrap;">
                    <CellTemplate>
                        <MudChip T="string" Color="Color.Success" Size="Size.Small">@context.Item.MaxDiscountPercent%</MudChip>
                    </CellTemplate>
                </TemplateColumn>

                <TemplateColumn Title="موجودی" CellStyle="text-wrap: nowrap;">
                    <CellTemplate>
                        @if (context.Item.RemainingCount <= 0)
                        {
                            <MudChip T="string" Color="Color.Error" Size="Size.Small">ناموجود</MudChip>
                        }
                        else if (context.Item.RemainingCount < 10)
                        {
                            <MudChip T="string" Color="Color.Warning" Size="Size.Small">@context.Item.RemainingCount</MudChip>
                        }
                        else
                        {
                            <MudChip T="string" Color="Color.Success" Size="Size.Small">@context.Item.RemainingCount</MudChip>
                        }
                    </CellTemplate>
                </TemplateColumn>

                <TemplateColumn Title="وضعیت">
                    <CellTemplate>
                        <MudChip T="string"
                                 Color="@(context.Item.IsActive ? Color.Success : Color.Error)"
                                 Variant="Variant.Filled"
                                 Size="Size.Small">
                            @(context.Item.IsActive ? "فعال" : "غیرفعال")
                        </MudChip>
                    </CellTemplate>
                </TemplateColumn>

                <TemplateColumn StickyLeft="true" Title="عملیات" CellStyle="text-wrap: nowrap;" HeaderStyle="text-wrap: nowrap;">
                    <CellTemplate>
                        <MudStack Row="true" AlignItems="AlignItems.Center">
                            <MudTooltip Text="ویرایش">
                                <MudIconButton Icon="@Icons.Material.Filled.EditNote"
                                               Size="Size.Small"
                                               ButtonType="ButtonType.Button"
                                               OnClick="@(() => OpenEditDialog(context.Item.Id))" />
                            </MudTooltip>

                            <MudTooltip Text="حذف">
                                <MudIconButton Icon="@Icons.Material.Filled.DeleteOutline"
                                               Size="Size.Small"
                                               ButtonType="ButtonType.Button"
                                               OnClick="@(() => DeleteProduct(context.Item.Id))" />
                            </MudTooltip>

                            <MudTooltip Text="گالری تصاویر">
                                <MudIconButton Icon="@Icons.Material.Filled.Collections"
                                               Size="Size.Small"
                                               ButtonType="ButtonType.Button"
                                               OnClick="@(() => OpenGallery(context.Item))" />
                            </MudTooltip>

                            <MudTooltip Text="مدیریت دسته‌بندی (درگ و دراپ)">
                                <MudIconButton Icon="@Icons.Material.Filled.Category"
                                               Size="Size.Small"
                                               ButtonType="ButtonType.Button"
                                               OnClick="@(() => OpenCategoryMapping(context.Item))" />
                            </MudTooltip>

                            <MudTooltip Text="تگ‌های محصول">
                                <MudIconButton Icon="@Icons.Material.Filled.Label"
                                               Size="Size.Small"
                                               ButtonType="ButtonType.Button"
                                               OnClick="@(() => OpenTagAssignment(context.Item))" />
                            </MudTooltip>
                        </MudStack>
                    </CellTemplate>
                </TemplateColumn>
            </Columns>
            <NoRecordsContent>
                <MudAlert Severity="Severity.Info" Dense="true" Variant="Variant.Text" Class="my-4">موردی یافت نشد.</MudAlert>
            </NoRecordsContent>
            <PagerContent>
                <MudDataGridPager T="DiscountProductDto" PageSizeOptions="@(new int[] { 20, 50, 100 })"
                                  InfoFormat="سطر {first_item} تا {last_item} از {all_items}"
                                  RowsPerPageString="تعداد در صفحه" />
            </PagerContent>
        </MudDataGrid>
    </Content>
</BasePageComponent>
