128 lines
3.6 KiB
Plaintext
128 lines
3.6 KiB
Plaintext
@page "/"
|
|
@inject ProductAPIConsumer productService
|
|
@inject CategoryAPIConsumer categoryService
|
|
|
|
|
|
<!-- Carousel Section -->
|
|
<div class="h-screen w-full">
|
|
@if (CarouselData != null && CarouselData.Any())
|
|
{
|
|
<Carousal Data="CarouselData"></Carousal>
|
|
}
|
|
</div>
|
|
|
|
<!-- Random Products Section -->
|
|
|
|
<section class="flex flex-col container px-6 py-20 mx-auto gap-20 dark:bg-gray-900">
|
|
|
|
<h1 class=" font-semibold text-center capitalize dark:text-white text-white text-6xl">@Loc["Production_Lines"]
|
|
</h1>
|
|
|
|
<div class="grid grid-cols-2 gap-5 flex-wrap overflow-x-scroll">
|
|
@foreach (var bundle in RandomBundles)
|
|
{
|
|
<BundleComp Bundle="bundle"></BundleComp>
|
|
}
|
|
</div>
|
|
|
|
<div class="flex flex-row w-full mx-auto ">
|
|
<a href="/shop?IsBundle=true" class="btn btn-primary mx-auto">@Loc["See_More"]</a>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<section class=" flex flex-col container px-6 py-20 mx-auto gap-20 dark:bg-gray-900 ">
|
|
|
|
<h1 class=" font-semibold text-center capitalize dark:text-white text-white text-6xl">@Loc["Our_Categories"]
|
|
</h1>
|
|
|
|
<div class="grid grid-cols-4 gap-3 xl:gap-12 lg:grid-cols-4">
|
|
@foreach (var category in RandomCategories.Take(4))
|
|
{
|
|
<CategoryComp Category="category"></CategoryComp>
|
|
}
|
|
</div>
|
|
|
|
<div class="flex flex-row w-full mx-auto ">
|
|
<a href="/shop/categories" class="btn btn-primary mx-auto">@Loc["See_More"]</a>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
|
|
<section class="flex flex-col gap-1">
|
|
<h2 class="text-center text-5xl text-white ">@Loc["Our_Products"]</h2>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 justify-between gap-8 flex-wrap p-7 md:p-14 lg:p-20">
|
|
@foreach (var product in RandomProducts.Take(3))
|
|
{
|
|
<ProductComp4 Product="product"></ProductComp4>
|
|
}
|
|
</div>
|
|
|
|
<div class="flex flex-row w-full text-center ">
|
|
<a href="/shop" class="btn btn-primary mx-auto">@Loc["See_More"]</a>
|
|
</div>
|
|
|
|
</section>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
::-webkit-scrollbar {
|
|
width: 0;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
-webkit-box-shadow: inset 0 0 0px rgba(0, 0, 0, 0.3);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: transparent;
|
|
outline: 1px solid transparent;
|
|
}
|
|
</style>
|
|
|
|
@code {
|
|
List<ProductVM> RandomProducts = new();
|
|
List<ProductVM> RandomBundles = new();
|
|
List<CategoryVM> RandomCategories = new();
|
|
List<(string Text, string ImageUrl)> CarouselData = new();
|
|
|
|
protected override async Task OnInitializedAsync()
|
|
{
|
|
// Populate Carousel with Data
|
|
CarouselData = new List<(string Text, string ImageUrl)>
|
|
{
|
|
(Loc["Welcome_to_Our_Shop"], "https://img.daisyui.com/images/stock/photo-1507358522600-9f71e620c44e.webp"),
|
|
(Loc["Best_Quality_Products"], "https://img.daisyui.com/images/stock/photo-1559181567-c3190ca9959b.webp"),
|
|
(Loc["Amazing_Deals"], "https://img.daisyui.com/images/stock/photo-1601004890684-d8cbf643f5f2.webp")
|
|
};
|
|
|
|
RandomProducts = (await productService.FetchProduct(new ProductFilter { Random = true }, new Pagination()
|
|
{
|
|
PageSize = 3,
|
|
CurrentPage = 1
|
|
})).Item1;
|
|
|
|
// Fetch real bundles
|
|
var bundleResult = (await productService.FetchProduct(new ProductFilter { IsBundle = true, Random = true }, new
|
|
Pagination
|
|
{
|
|
PageSize = 4,
|
|
CurrentPage = 1
|
|
})).Item1;
|
|
RandomBundles = bundleResult;
|
|
|
|
RandomCategories = (await categoryService.FetchCategory(new CategoryFilter { Random = true }, new Pagination()
|
|
{
|
|
CurrentPage = 1,
|
|
PageSize = 4
|
|
})).Item1;
|
|
}
|
|
} |