AdminPanel/Netina.AdminPanel.PWA/Pages/Home.razor

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

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

<MudStack class="px-0 md:p-5 lg:p-8 w-full h-screen overflow-x-hidden overflow-y-scroll bg-[--mud-palette-background-grey]">
    <MudHidden Breakpoint="Breakpoint.Xs">
        <MudGrid>
            <MudItem xs="12" sm="4" lg="2">
                <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>@ViewModel.PageDto.ProductsCount</b></MudText>
                    <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="4" lg="2">
                <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>@ViewModel.PageDto.BlogsCount</b></MudText>
                    <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="4" lg="2">
                <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>@ViewModel.PageDto.TodayOrdersCount</b></MudText>
                    <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="4" lg="2">
                <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>@ViewModel.PageDto.UnSubmittedOrdersCount</b></MudText>
                    <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="4" lg="2">
                <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-gray-600"><b>@ViewModel.PageDto.BrandsCount</b></MudText>
                    <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>عدد</b></MudText>
                </MudPaper>
            </MudItem>
            <MudItem xs="12" sm="4" lg="2">
                <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-purple-600"><b>@ViewModel.PageDto.SubscribersCount</b></MudText>
                    <MudText Typo="Typo.h6" Align="Align.Center" class="mb-4 -mt-1"><b>نفر</b></MudText>
                </MudPaper>
            </MudItem>
        </MudGrid>
    </MudHidden>
    <MudHidden Breakpoint="Breakpoint.SmAndUp">
        <MudStack Row="true" class="whitespace-nowrap overflow-x-scroll w-screen no-scrollbar">
            
            <MudPaper class="w-fit p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-6 ml-16">تعداد محصولاتــ</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>
            
            <MudPaper class="w-fit p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-6 ml-16">تعداد محصولاتــ</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>
            
            <MudPaper class="w-fit p-3 m-2 rounded-md" Elevation="2">
                <MudText Typo="Typo.body1" class="mb-6 ml-16">تعداد محصولاتــ</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>
        </MudStack>
    </MudHidden>
    <MudGrid>
        <MudItem xs="12" sm="4" md="4">
            <MudStack class="p-2">

                <BaseButtonUi class="w-full rounded-md"
                              Icon="@Icons.Material.Outlined.AddCard"
                              Variant="Variant.Outlined" Color="Color.Default"
                              OnClickCallback="@ViewModel.AddProductClicked"
                              Content="محصول جدید" />
            </MudStack>
        </MudItem>

        <MudItem xs="12" sm="4" md="4">
            <MudStack class="p-2">

                <BaseButtonUi class="w-full rounded-md"
                              Icon="@Icons.Material.Outlined.AddLink"
                              Variant="Variant.Outlined" Color="Color.Default"
                              OnClickCallback="@ViewModel.AddBlogClicked"
                              Content="بلاگ جدید" />
            </MudStack>
        </MudItem>

        <MudItem xs="12" sm="4" md="4">
            <MudStack class="p-2">

                <BaseButtonUi class="w-full rounded-md"
                              Icon="@Icons.Material.Outlined.AddBusiness"
                              Variant="Variant.Outlined" Color="Color.Default"
                              OnClickCallback="@ViewModel.AddBrandClicked"
                              Content="برند جدید" />
            </MudStack>
        </MudItem>
    </MudGrid>

    <MudGrid class="mt-3">
        <MudItem xs="12" md="6">
            <MudStack class="m-2">
                <MudText Typo="Typo.h5"><b>سفارشاتــ تایید نشده</b></MudText>
                <MudPaper class="rounded-md p-3" Elevation="2">
                    <MudDataGrid FixedFooter="true" FixedHeader="true" Striped="true"
                                 T="ProductSDto" 
                                 SortMode="@SortMode.None" Groupable="false">
                        <Columns>
                            <PropertyColumn Title="نام محصول" Property="arg => arg.PersianName" />
                            <PropertyColumn Title="دسته بندی" Property="arg => arg.CategoryName" />
                            <PropertyColumn Title="برند" Property="arg => arg.BrandName" />
                            <PropertyColumn Title="قیمتــ" Property="arg => arg.Cost" />
                            <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" />
                                        <MudIconButton Icon="@Icons.Material.Filled.Delete"
                                                       Size="@Size.Small"
                                                       Variant="@Variant.Outlined"
                                                       Color="@Color.Error" />
                                    </MudStack>
                                </CellTemplate>
                            </TemplateColumn>
                        </Columns>
                        <PagerContent>
                            <MudStack Row="true" class="w-full">

                                <MudPagination Rectangular="true" Variant="Variant.Filled" class="my-4 mx-auto" />
                            </MudStack>

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

        <MudItem xs="12" md="6">
            <MudStack class="m-2">
                <MudText Typo="Typo.h5"><b>سفارشاتــ ارسال نشده</b></MudText>
                <MudPaper class="rounded-md p-3" Elevation="2">

                </MudPaper>
            </MudStack>
        </MudItem>
    </MudGrid>
</MudStack>
@code{

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


}