@extends('layouts.frontend.frontend_main')

@section('title')
    @lang('frontend_lang.home')
@endsection

@push('styles')
<style>
    .category-item {
        padding: 30px !important;
        height: 100px !important;
    }
</style>
@endpush

@php
    $cart = session()->get('cart');
@endphp


@section('content')
    <!-- Offers Start -->
    @if(count($homeSliders)>0)
        <div class="main-banner-slider">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="owl-carousel offers-banner owl-theme">
                            @foreach($homeSliders as $homeSlider)
                                <div class="item">
                                    <div class="offer-item">
                                        <div class="offer-item-img">
                                            <div class="gambo-overlay"></div>
                                            <img src="{{ asset('home_slider').'/'.$homeSlider->image }}" alt="" style="width: 100%; height: 230px">
                                        </div>
                                        <div class="offer-text-dt">
                                            <a href="#" class="Offer-shop-btn hover-btn">Shop Now</a>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
    <!-- Offers End -->
    <!-- Categories Start -->
    <div class="section145">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="main-title-tt">
                        <div class="main-title-left">
                            <span>@lang('frontend_lang.shop_by')</span>
                            <h2>@lang('frontend_lang.categories')</h2>
                        </div>
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="owl-carousel cate-slider owl-theme">
                        @foreach($allCategories ?? [] as $category)
                            <div class="item">
                                <a href="{{ route('frontend.product.index',['category' => $category->slug]) }}" class="category-item">
                                    {{--<div class="cate-img">--}}
                                        {{--<img src="{{ asset('frontend/images/category/icon-1.svg') }}" alt="">--}}
                                    {{--</div>--}}
                                    <h4>{{ $category->name }}</h4>
                                </a>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Categories End -->

    <!-- Best Values Offers Start -->
    @if(count($productOffers)>0)
        <div class="section145">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="main-title-tt">
                            <div class="main-title-left">
                                <span>Offers</span>
                                <h2>Best Values</h2>
                            </div>
                            <a href="{{ route('frontend.offer.index') }}" class="see-more-btn">See All</a>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="owl-carousel featured-slider owl-theme">
                            @foreach($productOffers as $product)
                                @php
                                    $offerPrice = productOfferPrice($product->id, $product->price)
                                @endphp
                                <div class="item"> 
                                    <div class="product-item offeredproduct">
                                        <a href="{{ route('frontend.product.show',['product' => $product->slug]) }}" class="product-img">
                                            <img src="{{ productImageUrl( $product->sku) }}" alt="">
                                            @if($offerPrice['discount'] > 0)
                                                <span class="offer-badge-discount">{{ $offerPrice['discount'] }}% OFF</span>
                                            @endif
                                        </a>
                                        <div class="product-text-dt">
                                            <h4 title="{{ $product->name }}">{{ $product->name }}</h4>
                                            <div class="product-price">
                                                <i class="fa fa-gbp" aria-hidden="true"></i>
                                                <label class="{{ auth()->guard('web')->user() ? '' : 'blur-price' }}">
                                                        @if(auth()->user())
                                                            @if($offerPrice['amount']> 0)
                                                                {{ $offerPrice['amount'] }} <span> £ {{ $product->price }}</span>
                                                            @else
                                                                {{ $product->price }}
                                                            @endif
                                                        @else
                                                            00
                                                        @endif
                                                </label>

                                                <lable class="product-page-size">
                                                    @if(!empty($product->pack_size))
                                                        | {{ trans('frontend_lang.pkd').$product->pack_size }} @endif
                                                </lable>
                                            </div>
                                            {{--@endif--}}

                                            @if($product->inventory_management == \App\Models\Product::INVENTORY_MANAGEMENT_NO)
                                                <div class="qty-cart">
                                                    <div class="quantity buttons_added">
                                                        <input type="button" value="-" class="minus minus-btn">
                                                        <input type="number" step="1" name="quantity" value="1" max="100" min="1" class="input-text qty text pd-qty">
                                                        <input type="button" value="+" class="plus plus-btn">
                                                    </div>
                                                    <label class="product-sku ">{{ strtoupper(trans('sku')).': '.$product->sku }}</label>
                                                    <span class="cart-icon {{ isset($cart[$product->id])? 'item-added-to-cart' : '' }}"><i class="uil uil-shopping-cart-alt addToCartDetail" data-id="{{ $product->id }}"></i></span>
                                                </div>
                                            @else
                                                <div class="qty-cart justify-content-center">
                                                    <div class="quantity buttons_added  font-weight-bolder out-of-stock">
                                                        @lang('frontend_lang.out_of_stock')
                                                    </div>
                                                    <label class="product-sku " >{{ strtoupper(trans('sku')).': '.$product->sku }}</label>
                                                </div>
                                            @endif
                                            @if(!empty($offerPrice['end_date']))
                                                <div class="offer-div mt-4">
                                                    <p>@lang('frontend_lang.expired_date') {{ $offerPrice['end_date'] }}</p>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
    <!-- Best Values Offers End -->
    <!-- Featured Products Start -->

    @if(count($featuredProducts) > 0)
        <div class="section145">
            <div class="container">
                <div class="row">
                    <div class="col-md-12">
                        <div class="main-title-tt">
                            <div class="main-title-left">
                                <span>For You</span>
                                <h2>Top Featured Products</h2>
                            </div>
                            <a href="{{ route('frontend.product.index',['is_featured' => \App\Models\Product::YES]) }}" class="see-more-btn">See All</a>
                        </div>
                    </div>
                    <div class="col-md-12">
                        <div class="owl-carousel featured-slider owl-theme">
                            @foreach($featuredProducts as $featuredProduct)
                                @php
                                    $offerPrice = productOfferPrice($featuredProduct->id, $featuredProduct->price)
                                @endphp

                                <div class="item">
                                    <div class="product-item">
                                        <a href="{{ route('frontend.product.show',['product' => $featuredProduct->slug]) }}" class="product-img">
                                            <img src="{{ productImageUrl($featuredProduct->sku) }}" alt="">
                                                <span class="offer-badge-1">Featured</span>
                                                @if($offerPrice['discount'] > 0)
                                                    <span class="offer-badge-discount">{{ $offerPrice['discount'] }}% OFF</span>
                                                @endif
                                        </a>
                                        <div class="product-text-dt">
                                            <h4 title="{{ $featuredProduct->name }}">{{ $featuredProduct->name }}</h4>
                                                <div class="product-price">
                                                    <i class="fa fa-gbp" aria-hidden="true"></i>
                                                    <label class="{{ auth()->guard('web')->user() ? '' : 'blur-price' }}">
                                                        @if(auth()->user())
                                                            @if($offerPrice['amount']> 0)
                                                                {{ $offerPrice['amount'] }} <span> £ {{ $featuredProduct->price }}</span>
                                                            @else
                                                                {{ $featuredProduct->price }}
                                                            @endif
                                                        @else
                                                            00
                                                        @endif
                                                    </label>
                                                    <lable class="product-page-size">
                                                        @if(!empty($featuredProduct->pack_size))
                                                            | {{ trans('frontend_lang.pkd').$featuredProduct->pack_size }} @endif
                                                    </lable>
                                                </div>
                                            {{--@endif--}}

                                            @if($featuredProduct->inventory_management == \App\Models\Product::INVENTORY_MANAGEMENT_NO)
                                                <div class="qty-cart">
                                                    <div class="quantity buttons_added">
                                                        <input type="button" value="-" class="minus minus-btn">
                                                        <input type="number" step="1" name="quantity" value="1" max="100" min="1" class="input-text qty text pd-qty">
                                                        <input type="button" value="+" class="plus plus-btn">
                                                    </div>
                                                    <label class="product-sku">{{ strtoupper(trans('sku')).': '.$featuredProduct->sku }}</label>
                                                    <span class="cart-icon {{ isset($cart[$featuredProduct->id])? 'item-added-to-cart' : '' }}"><i class="uil uil-shopping-cart-alt addToCartDetail" data-id="{{ $featuredProduct->id }}"></i></span>
                                                </div>
                                            @else
                                                <div class="qty-cart justify-content-center">
                                                    <div class="quantity buttons_added  font-weight-bolder out-of-stock">
                                                        @lang('frontend_lang.out_of_stock')
                                                    </div>
                                                    <label class="product-sku " >{{ strtoupper(trans('sku')).': '.$featuredProduct->sku }}</label>
                                                </div>
                                            @endif
                                            @if(!empty($offerPrice['end_date']))
                                                <div class="outofstock-div mt-4">
                                                    <p>@lang('frontend_lang.expired_date') {{ $offerPrice['end_date'] }}</p>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
    <div class="section145">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="main-title-tt">
                        <div class="main-title-left">
                            <span>For New</span>
                            <h2>Newly Added Products</h2>
                        </div>
                        <a href="{{ route('frontend.product.index') }}?sort=new" class="see-more-btn">See All</a>
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="owl-carousel featured-slider owl-theme">
                        @foreach($newProducts as $newProduct)
                            @php
                                $offerPrice = productOfferPrice($newProduct->id, $newProduct->price)
                            @endphp
                            <div class="item">
                                <div class="product-item">
                                    <a href="{{ route('frontend.product.show',['product' => $newProduct->slug]) }}" class="product-img">
                                        <img src="{{ productImageUrl( $newProduct->sku)  }}" alt="">
                                        @if($offerPrice['discount'] > 0)
                                            <span class="offer-badge-discount">{{ $offerPrice['discount'] }}% OFF</span>
                                        @endif
                                    </a>
                                    <div class="product-text-dt">
                                        {{--<p>Available<span>(In Stock)</span></p>--}}
                                        <h4 title="{{ $newProduct->name }}">{{ $newProduct->name }}</h4>
                                        {{--@if(auth()->guard('web')->user())--}}
                                        <div class="product-price">
                                            <i class="fa fa-gbp" aria-hidden="true"></i>
                                            <label class="{{ auth()->guard('web')->user() ? '' : 'blur-price' }}">
                                                @if(auth()->user())
                                                    @if($offerPrice['amount']> 0)
                                                        {{ $offerPrice['amount'] }} <span> £ {{ $newProduct->price }}</span>
                                                    @else
                                                        {{ $newProduct->price }}
                                                    @endif
                                                @else
                                                    00
                                                @endif
                                            </label>

                                            <lable class="product-page-size">
                                                @if(!empty($newProduct->pack_size))
                                                    | {{ trans('frontend_lang.pkd').$newProduct->pack_size }} @endif
                                            </lable>
                                        </div>
                                        {{--@endif--}}

                                        @if($newProduct->inventory_management == \App\Models\Product::INVENTORY_MANAGEMENT_NO)
                                        <div class="qty-cart">
                                            <div class="quantity buttons_added">
                                                <input type="button" value="-" class="minus minus-btn">
                                                <input type="number" step="1" name="quantity" value="1" max="100" min="1" class="input-text qty text pd-qty">
                                                <input type="button" value="+" class="plus plus-btn">
                                            </div>
                                            <label class="product-sku">{{ strtoupper(trans('sku')).': '.$newProduct->sku }}</label>
                                            <span class="cart-icon {{ isset($cart[$newProduct->id]) ? 'item-added-to-cart' : '' }}">
                                                <i class="uil uil-shopping-cart-alt addToCartDetail" data-id="{{ $newProduct->id }}"></i>
                                            </span>
                                        </div>
                                        @else
                                            <div class="qty-cart justify-content-center">
                                                <div class="quantity buttons_added  font-weight-bolder out-of-stock">
                                                    @lang('frontend_lang.out_of_stock')
                                                </div>
                                                <label class="product-sku " >{{ strtoupper(trans('sku')).': '.$newProduct->sku }}</label>
                                            </div>
                                        @endif
                                        @if(!empty($offerPrice['end_date']))
                                            <div class="outofstock-div mt-4">
                                                <p>@lang('frontend_lang.expired_date') {{ $offerPrice['end_date'] }}</p>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="section145">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <div class="main-title-tt">
                        <div class="main-title-left">
                            <span>For Demand</span>
                            <h2>Top Demanded Products</h2>
                        </div>
                        <a href="{{ route('frontend.product.index') }}?sort=demanded" class="see-more-btn">See All</a>
                    </div>
                </div>
                <div class="col-md-12">
                    <div class="owl-carousel featured-slider owl-theme">
                        @foreach($products as $product)
                            @php
                                $offerPrice = productOfferPrice($product->id, $product->price)
                            @endphp
                            <div class="item">
                                <div class="product-item">
                                    <a href="{{ route('frontend.product.show',['product' => $product->slug]) }}" class="product-img">
                                        <img src="{{ productImageUrl( $product->sku) }}" alt="">
                                        @if($offerPrice['discount'] > 0)
                                            <span class="offer-badge-discount">{{ $offerPrice['discount'] }}% OFF</span>
                                        @endif
                                    </a>
                                    <div class="product-text-dt">
                                        <h4 title="{{ $product->name }}">{{ $product->name }}</h4>
                                        <div class="product-price">
                                            <i class="fa fa-gbp" aria-hidden="true"></i>
                                            <label class="{{ auth()->guard('web')->user() ? '' : 'blur-price' }}">
                                                @if(auth()->user())
                                                    @if($offerPrice['amount']> 0)
                                                        {{ $offerPrice['amount'] }} <span> £ {{ $product->price }}</span>
                                                    @else
                                                        {{ $product->price }}
                                                    @endif
                                                @else
                                                    00
                                                @endif
                                            </label>

                                            <lable class="product-page-size">
                                                @if(!empty($product->pack_size))
                                                    | {{ trans('frontend_lang.pkd').$product->pack_size }} @endif
                                            </lable>
                                        </div>

                                        @if($product->inventory_management == \App\Models\Product::INVENTORY_MANAGEMENT_NO)
                                        <div class="qty-cart">
                                            <div class="quantity buttons_added">
                                                <input type="button" value="-" class="minus minus-btn">
                                                <input type="number" step="1" name="quantity" value="1" max="100" min="1" class="input-text qty text pd-qty">
                                                <input type="button" value="+" class="plus plus-btn">
                                            </div>
                                            <label class="product-sku ">{{ strtoupper(trans('sku')).': '.$product->sku }}</label>
                                            <span class="cart-icon {{ isset($cart[$product->id])? 'item-added-to-cart' : '' }}"><i class="uil uil-shopping-cart-alt addToCartDetail" data-id="{{ $product->id }}"></i></span>
                                        </div>
                                        @else
                                            <div class="qty-cart justify-content-center">
                                                <div class="quantity buttons_added  font-weight-bolder out-of-stock">
                                                    @lang('frontend_lang.out_of_stock')
                                                </div>
                                                <label class="product-sku " >{{ strtoupper(trans('sku')).': '.$product->sku }}</label>
                                            </div>
                                        @endif
                                        @if(!empty($offerPrice['end_date']))
                                            <div class="outofstock-div mt-4">
                                                <p>@lang('frontend_lang.expired_date') {{ $offerPrice['end_date'] }}</p>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Featured Products End -->
@endsection

@section('js')
@endsection