@using BackOffice.Services.Content
@using BackOffice.Common.BaseComponents

<MudDialog>
    <DialogContent>
        <MudStack Spacing="2">
            <MudStack Row="true" Justify="Justify.SpaceBetween" AlignItems="AlignItems.Center">
                <MudText Typo="Typo.subtitle1">تصاویر صفحه «@PageTitle»</MudText>
                <MudButton Variant="Variant.Filled"
                           Color="Color.Primary"
                           Size="Size.Small"
                           StartIcon="@Icons.Material.Filled.Add"
                           OnClick="AddImage">
                    افزودن تصویر
                </MudButton>
            </MudStack>

            @if (!Images.Any())
            {
                <MudAlert Severity="Severity.Info" Dense="true" Variant="Variant.Text" Class="my-4">
                    تصویری ثبت نشده است.
                </MudAlert>
            }
            else
            {
                <MudDataGrid T="PageImageItemDto"
                             Items="Images"
                             Hover="true"
                             Dense="true"
                             Elevation="0">
                    <Columns>
                        <TemplateColumn Title="تصویر" Sortable="false">
                            <CellTemplate>
                                @if (!string.IsNullOrWhiteSpace(context.Item.ThumbnailPath))
                                {
                                    <Image Src="@context.Item.ThumbnailPath" Width="48" Height="48" ObjectFit="ObjectFit.Cover" />
                                }
                                else if (!string.IsNullOrWhiteSpace(context.Item.ImagePath))
                                {
                                    <Image Src="@context.Item.ImagePath" Width="48" Height="48" ObjectFit="ObjectFit.Cover" />
                                }
                                else
                                {
                                    <MudIcon Icon="@Icons.Material.Filled.ImageNotSupported" Size="Size.Medium" />
                                }
                            </CellTemplate>
                        </TemplateColumn>
                        <PropertyColumn Property="x => x.ImageGroup" Title="گروه" />
                        <PropertyColumn Property="x => x.Title" Title="عنوان" />
                        <PropertyColumn Property="x => x.SortOrder" Title="ترتیب" />
                        <PropertyColumn Property="x => x.IsActive" Title="وضعیت">
                            <CellTemplate>
                                <MudChip T="string"
                                         Color="@(context.Item.IsActive ? Color.Success : Color.Error)"
                                         Size="Size.Small">
                                    @(context.Item.IsActive ? "فعال" : "غیرفعال")
                                </MudChip>
                            </CellTemplate>
                        </PropertyColumn>
                        <TemplateColumn Title="عملیات" Sortable="false">
                            <CellTemplate>
                                <MudStack Row="true" Spacing="1">
                                    <MudTooltip Text="ویرایش">
                                        <MudIconButton Icon="@Icons.Material.Filled.Edit"
                                                       Size="Size.Small"
                                                       Color="Color.Primary"
                                                       OnClick="@(() => EditImage(context.Item))" />
                                    </MudTooltip>
                                    <MudTooltip Text="حذف">
                                        <MudIconButton Icon="@Icons.Material.Filled.Delete"
                                                       Size="Size.Small"
                                                       Color="Color.Error"
                                                       OnClick="@(() => DeleteImage(context.Item))" />
                                    </MudTooltip>
                                </MudStack>
                            </CellTemplate>
                        </TemplateColumn>
                    </Columns>
                </MudDataGrid>
            }
        </MudStack>
    </DialogContent>
    <DialogActions>
        <MudButton Color="Color.Default" Variant="Variant.Text" OnClick="Close">
            بستن
        </MudButton>
    </DialogActions>
</MudDialog>
