@inject ISnackbar Snackbar
@inject IRestWrapper RestWrapper
@inject IUserUtility UserUtility
@inject IDialogService DialogService

<MudDialog DisableSidePadding="true" class="mx-auto">
    <DialogContent>
        <MudContainer class="max-h-[30rem]" Style="overflow-y: scroll">
            <MudStack>
                <MudDivider class="-mt-3" />
                <MudStack Spacing="0">
                    <MudText Typo="Typo.h6"><b>اطلاعات کلی</b></MudText>
                    <MudText Typo="Typo.caption">اطلاعات کلی سکشن را با دقت وارد کنید</MudText>
                </MudStack>

                <MudGrid>
                    <MudItem sm="12" md="6" lg="4">
                        <MudTextField T="string" Label="عنوان سکشن" @bind-Value="@ViewModel.PageDto.Title" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12" md="6" lg="4">
                        <MudTextField T="string" Label="عنوان دکمه" @bind-Value="@ViewModel.PageDto.CTAText" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12" md="6" lg="4">
                        <MudTextField T="string" Label="آدرس دکمه" @bind-Value="@ViewModel.PageDto.CTARoute" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12">
                        <MudTextField T="string" Label="توضیحاتــ" @bind-Value="@ViewModel.PageDto.Description" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12" md="4">

                        <MudSelect Variant="Variant.Outlined" T="BasePageSectionType"
                                   ToStringFunc="type => type.ToDisplay()"
                                   Label="نوع سکشن"
                                   @bind-Value="@ViewModel.PageDto.Type">
                            @foreach (var state in Enum.GetValues(typeof(BasePageSectionType)).Cast<BasePageSectionType>())
                            {
                                <MudSelectItem T="BasePageSectionType" Value="state"></MudSelectItem>
                            }
                        </MudSelect>
                    </MudItem>
                    <MudItem sm="12" md="8">
                        <MudTextField T="string" Label="کوئری" @bind-Value="@ViewModel.PageDto.Query" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>

                </MudGrid>

                <MudStack Spacing="0">
                    <MudText Typo="Typo.h6"><b>ایتم ها</b></MudText>
                    <MudText Typo="Typo.caption">ایتم های سکشن را به دستی میتوانید تغییر دهید</MudText>
                </MudStack>
                <MudGrid>
                    <MudItem sm="12" md="5">
                        <MudTextField T="string" Label="عنوان ایتم" @bind-Value="@ViewModel.SelectedSectionItem.Title" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12" md="7">
                        <MudTextField T="string" Label="توضیحات ایتم" @bind-Value="@ViewModel.SelectedSectionItem.Description" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12" md="8">
                        <MudTextField T="string" Label="ادرس ایتم" @bind-Value="@ViewModel.SelectedSectionItem.Url" Variant="Variant.Outlined"></MudTextField>
                    </MudItem>
                    <MudItem sm="12" md="4">
                        <MudStack Row="true" class="mt-3">
                            @if (ViewModel.IsFileSelected)
                            {
                                <MudButton Variant="Variant.Filled" Size="Size.Large" Color="Color.Info" OnClick="@ViewModel.SelectFileAsync">تغییر عکس</MudButton>
                            }
                            else
                            {
                                <MudButton Variant="Variant.Outlined" Size="Size.Large" Color="Color.Info" OnClick="@ViewModel.SelectFileAsync">انتخاب عکس</MudButton>
                            }

                            <MudButton Variant="Variant.Outlined" Size="Size.Large" Color="Color.Success" OnClick="@ViewModel.AddItem">افزودن</MudButton>
                        </MudStack>
                    </MudItem>

                    <MudItem sm="12">
                        <MudDataGrid Items="@ViewModel.PageDto.SectionItems"
                                     T="SectionItem"
                                     Elevation="0"
                                     Outlined="true"
                                     Bordered="true"
                                     Striped="true"
                                     Filterable="false"
                                     SortMode="@SortMode.None"
                                     Groupable="false">
                            <Columns>
                                <PropertyColumn T="SectionItem" TProperty="string" Property="x => x.Title" Title="عنوان" />
                                <PropertyColumn T="SectionItem" TProperty="string" Property="x => x.Url" Title="آدرس" />
                                <TemplateColumn T="SectionItem" CellClass="d-flex justify-end">
                                    <CellTemplate>
                                        <MudStack Row>
                                            <MudButton DisableElevation="true"
                                                       Size="@Size.Small"
                                                       Variant="@Variant.Filled"
                                                       OnClick="()=>ViewModel.PageDto.SectionItems.Remove(context.Item)"
                                                       Color="@Color.Error"
                                                       StartIcon="@Icons.Material.Outlined.Delete">حذف</MudButton>
                                        </MudStack>
                                    </CellTemplate>
                                </TemplateColumn>
                            </Columns>
                        </MudDataGrid>
                    </MudItem>
                </MudGrid>

            </MudStack>
        </MudContainer>
    </DialogContent>
    <DialogActions>
        <MudStack Row="true" class="w-full mx-4 mb-2">

            @if (ViewModel.IsEditing)
            {
                <BaseButtonUi class="w-64 rounded-md" IsProcessing="@ViewModel.IsProcessing"
                              Icon="@Icons.Material.Outlined.Check"
                              Variant="Variant.Filled" Color="Color.Success"
                              Content="ثبت ویرایش" OnClickCallback="@ViewModel.Submit" />
            }
            else
            {
                <BaseButtonUi class="w-64 rounded-md" IsProcessing="@ViewModel.IsProcessing"
                              Icon="@Icons.Material.Outlined.Check"
                              Variant="Variant.Filled" Color="Color.Success"
                              Content="تایید" OnClickCallback="@ViewModel.Submit" />
            }
            <MudSpacer />
            <MudButton Variant="Variant.Outlined" Size="Size.Large" Color="Color.Error" OnClick="@ViewModel.Cancel">بستن</MudButton>
        </MudStack>
    </DialogActions>
</MudDialog>
@code {

    [CascadingParameter]
    MudDialogInstance MudDialog { get; set; }

    [Parameter]
    public BasePageSection? Page { get; set; }

    public PageSectionActionDialogBoxViewModel ViewModel { get; set; }

    protected override async Task OnInitializedAsync()
    {
        if (Page == null)
            ViewModel = new PageSectionActionDialogBoxViewModel(Snackbar, RestWrapper, UserUtility, DialogService, MudDialog);
        else
            ViewModel = new PageSectionActionDialogBoxViewModel(Snackbar, RestWrapper, UserUtility, DialogService, MudDialog, Page);
        await ViewModel.InitializeAsync();
        await base.OnInitializedAsync();
    }
}