@page "/orders"
@attribute [Microsoft.AspNetCore.Authorization.Authorize]

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

<MudStack class="w-full p-8 h-screen bg-[--mud-palette-background-grey]">

    <MudGrid>
        <MudItem sm="6" lg="3">
            <MudPaper class="p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-4">سفارشات امروز</MudText>
                <MudText Typo="Typo.h3" Align="Align.Center" class="text-amber-600"><b>1124</b></MudText>
                <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
            </MudPaper>
        </MudItem>
        <MudItem sm="6" lg="3">
            <MudPaper class="p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-4">سفارشات در انتظار تایید</MudText>
                <MudText Typo="Typo.h3" Align="Align.Center" class="text-blue-600"><b>845</b></MudText>
                <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
            </MudPaper>
        </MudItem>
        <MudItem sm="6" lg="3">
            <MudPaper class="p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-4">تغییر نسبت هفته پیش</MudText>
                <MudText Typo="Typo.h3" Align="Align.Center" class="text-lime-600"><b>125</b></MudText>
                <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
            </MudPaper>
        </MudItem>
        <MudItem sm="6" lg="3">
            <MudPaper class="p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-4">تغییر نسبت به ماه پیش</MudText>
                <MudText Typo="Typo.h3" Align="Align.Center" class="text-rose-600"><b>10</b></MudText>
                <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
            </MudPaper>
        </MudItem>
    </MudGrid>
    <MudGrid>
        <MudItem xs="12">
            
            <MudPaper>
                <MudDataGrid FixedFooter="true" FixedHeader="true" Striped="true"
                             T="BlogSDto" Items="@ViewModel.PageDto" CurrentPage="@ViewModel.CurrentPage"
                             RowsPerPage="20" Filterable="false" Loading="@ViewModel.IsProcessing"
                             SortMode="@SortMode.None" Groupable="false">

                    <ToolBarContent>
                        <MudTextField T="string" Placeholder="جست جو بر اساس کد پیگیری" Adornment="Adornment.Start" Immediate="true"
                                      Clearable="true"
                                      ValueChanged="@ViewModel.SearchChanged"
                                      AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" class="my-auto"
                                      OnAdornmentClick="@ViewModel.SearchAsync"></MudTextField>
                    </ToolBarContent>
                    <Columns>
                        <PropertyColumn Title="کد پیگیری" Property="arg => arg.Title"/>
                        <PropertyColumn Title="مبلغ" Property="arg => arg.CategoryName"/>
                        <PropertyColumn Title="تاریخ پرداخت" Property="arg => arg.ReadingTime"/>
                        <TemplateColumn CellClass="d-flex justify-end">
                            <CellTemplate>
                                <MudStack Row="true">
                                    <MudIconButton Icon="@Icons.Material.Filled.Edit"
                                                   Size="@Size.Small"
                                                   Variant="@Variant.Outlined"
                                                   Color="@Color.Info"
                                                   OnClick="async () => await ViewModel.EditBlogClicked(context.Item)"/>
                                    <MudIconButton Icon="@Icons.Material.Filled.Delete"
                                                   Size="@Size.Small"
                                                   Variant="@Variant.Outlined"
                                                   OnClick="async () => await ViewModel.DeleteBlogAsync(context.Item.Id)"
                                                   Color="@Color.Error"/>
                                </MudStack>
                            </CellTemplate>
                        </TemplateColumn>
                    </Columns>
                    <PagerContent>
                        <MudStack Row="true" class="w-full">

                            <MudPagination Rectangular="true" Variant="Variant.Filled" Count="@ViewModel.PageCount"
                                           SelectedChanged="@ViewModel.ChangePageAsync" class="my-4 mx-auto"/>
                        </MudStack>

                    </PagerContent>
                </MudDataGrid>
            </MudPaper>
        </MudItem>
    </MudGrid>
</MudStack>

@code
{
    public BlogsPageViewModel ViewModel { get; set; }
    protected override async Task OnInitializedAsync()
    {
        ViewModel = new BlogsPageViewModel(NavigationManager, Snackbar, UserUtility, RestWrapper, DialogService);
        await ViewModel.InitializeAsync();
        await base.OnInitializedAsync();
    }
}