@extends('front.layouts.app', ['title' => 'Daily-Deal'])

@section('content')
    @include('front.layouts.app-header')

    <section class="daily_offer_sec off_bg"
        style="background:rgb(0 0 0 / 60%) url(images/daily_offer.jpg) center / cover no-repeat;background-blend-mode:color; ">

        {{-- <div class="offer_label_wrap">
        <div class="offer_label">
            <img src="images/offr_icn.png" alt="">
            <h3>Offer Of the Day</h3>
        </div>
    </div> --}}

        <div class="container">
            <div class="row">
                @if ($offer)
                    <div class="col col-12">

                        <div class="daily_offer_content">
                            <div class="dod_title">
                                <h2>Deal Of the Day <span></span></h2>
                            </div>

                            <div class="card dod_card">
                                @if ($message = Session::get('success'))
                                    <div class="row">
                                        <div class="col col-12">
                                            <div class="alert alert-success alert-dismissible fade show" role="alert">
                                                {{ $message }}
                                                <button type="button" class="close" data-dismiss="alert"
                                                    aria-label="Close">
                                                    <span aria-hidden="true">&times;</span>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                @endif
                                @if (count($errors) > 0)
                                    <div class="row">
                                        <div class="col col-12">
                                            <div class="alert alert-danger">
                                                <strong>Whoops!</strong> There were some problems with your input.<br><br>
                                                <ul>
                                                    @foreach ($errors->all() as $error)
                                                        <li>{{ $error }}</li>
                                                    @endforeach
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                @endif
                                <div class="row">
                                    <div class="col col-6">
                                        <div class="daily-deal-form">
                                            <div class="contact_title">
                                                <div class="pd_description daily_offer_title">
                                                    <h3> {{ $offer->name }}</h3>
                                                </div>
                                            </div>
                                            <div class="daily_offer_img_wrap">
                                                <img class="daily-deal-img d-block w-100"
                                                    src="{{ url('storage') . '/' . $offer->product_image }}" alt="First slide">
                                            </div>

                                        </div>
                                    </div>
                                    <div class="col col-6  order-3 order-lg-2">
                                        <div class="contact_form_wrap daily-deal-form">
                                            {{-- <div class="contact_title">
                                        <div class="pd_description">
                                            <h3> {{$offer->name}}</h3>
                                        </div>
                                        @if ($offer->description)
                                        <div class="pd_description">
                                            <p> {{$offer->description}}</p>
                                        </div>
                                        @endif
                                        <div class="pd_price_wrap">
                                            <div class="pd_price_inner d-flex">
                                                <h4 class="product_price product_price_new">{{
                                                    config('constant.CURRENCY_SIGN')
                                                    }}{{$offer->offer_price}}</h4>
                                                <h4 class="product_price product_discount">{{
                                                    config('constant.CURRENCY_SIGN')
                                                    }}{{$offer->selling_price}}</h4>
                                            </div>
                                        </div>
                                        <div class="pd_size_wrap">
                                            <div class="pd_size_inner d-flex">
                                                <label for="" class="pd_info_label" style="color:#000">Size:</label>
                                                <ul class="size-ul">
                                                    <!-- {{$offer->description}} -->
                                                    @if (count($offer->productVariants) > 0)
                                                    @foreach ($offer->productVariants as $key => $variant)
                                                    <li class="size-name @if ($key == 0) active @endif"
                                                        data-id="{{$variant->id}}"
                                                        data-price="{{$variant->selling_price}}"
                                                        data-discount_price="{{$variant->discount_price}}">
                                                        <span>{{$variant->size->name}}</span>
                                                    </li>
                                                    @endforeach
                                                    @endif
                                                </ul>
                                            </div>
                                        </div>
                                    </div> --}}
                                            {{--
                                    <hr> --}}
                                            <div class="contact_title">
                                                <div class="pd_description">
                                                    <h3> Inquire Now</h3>
                                                </div>
                                            </div>
                                            <form id="enquire-email" method="POST"
                                                action="{{ route('send-enquire-email') }}">
                                                @csrf
                                                <input type="hidden" name="offer_name" value="{{ $offer->name }}">
                                                <div class="row daily-deal-form-row">
                                                    <div class="col col-12">
                                                        <div class="c_filed">
                                                            <label for="full_name">Your name</label>
                                                            <input type="text" name="name" id="full_name"
                                                                required="" placeholder="Enter name">
                                                        </div>
                                                    </div>
                                                    <div class="col col-6">
                                                        <div class="c_filed">
                                                            <label for="email">Email Address</label>
                                                            <input type="email" name="email" id="email"
                                                                required="" placeholder="Enter email">
                                                        </div>
                                                    </div>
                                                    <div class="col col-6">
                                                        <div class="c_filed">
                                                            <label for="">Phone</label>
                                                            <input type="number" name="phone" id="phone"
                                                                required="" placeholder="Enter phone number">
                                                        </div>
                                                    </div>
                                                    {{-- <div class="col col-6">
                                                <div class="c_filed">
                                                    <label for="quantity">Quantity</label>
                                                    <input type="number" name="quantity" id="subject" required=""
                                                        placeholder="Enter Quantity">
                                                </div>
                                            </div> --}}
                                                    <div class="col col-12">
                                                        <div class="c_filed">
                                                            <label for="notes">Notes</label>
                                                            <textarea name="notes" rows="5" placeholder="Enter Notes"></textarea>
                                                        </div>
                                                    </div>
                                                    <div class="col col-12">
                                                        <div class="c_btn c_btn_red">
                                                            <button type="submit" class="btn-red">Inquire</button>
                                                        </div>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                    <div class="col col-12 order-2 order-lg-3">
                                        @if ($offer->description)
                                            <div class="sb_post_content_inner daily_offer_details_wrap">
                                                {!! nl2br($offer->description) !!}

                                            </div>
                                        @endif
                                    </div>
                                </div>
                                {{-- <div class="row">
                            <div class="col col-12">
                                <div class="dod_product_title">
                                    <h2>{{$offer->name}}</h2>
                                </div>
                            </div>
                            <div class="col col-5">
                                <div class="pd_item_slider">
                                    <div class="pd_item_slider_main_img">
                                        <div class="expand_slider">
                                            <a href="#!" data-fancybox="product-slider" data-src="images/cate_1.png">
                                                <img src="images/expand_arrows.svg" alt="">
                                            </a>
                                        </div>
                                        <div class="pd_item_slider_for">
                                            @if (count($offer->product->productImages) > 0)
                                            @foreach ($offer->product->productImages as $image)
                                            <div class="pd_main_img_item">
                                                <a href="#!" data-fancybox="product-slider"
                                                    data-src="{{url('storage') . '/' . $image->filename}}">
                                                    <img src="{{url('storage') . '/' . $image->filename}}" alt="">
                                                </a>
                                            </div>
                                            @endforeach
                                            @else
                                            <div class="pd_main_img_item">
                                                <a href="#!" data-fancybox="product-slider"
                                                    data-src="{{url('storage') . '/no_image.png'}}">
                                                    <img src="{{url('storage') . '/no_image.png'}}" alt="">
                                                </a>
                                            </div>
                                            @endif

                                        </div>
                                    </div>
                                    <div class="pd_item_slider_thumb_img">
                                        <div class="pd_item_slider_nav">
                                            <div class="pd_thumb_img_item">
                                                <img src="images/cate_1.png" alt="">
                                            </div>
                                            <div class="pd_thumb_img_item">
                                                <img src="images/cate_1.png" alt="">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col col-6">
                                <div class="dod_product_content pd_main_content">
                                    <div class="pd_description">
                                        <p> {{$offer->description}}</p>
                                    </div>
                                    <div class="pd_price_wrap">
                                        <div class="pd_price_inner d-flex">
                                            <label for="" class="pd_info_label">Price:</label>
                                            <h4 class="product_price product_price_new">{{
                                                config('constant.CURRENCY_SIGN')
                                                }}{{$offer->productsVariantFirst->selling_price}}</h4>
                                            <h4 class="product_price product_discount">{{
                                                config('constant.CURRENCY_SIGN')
                                                }}{{$offer->productsVariantFirst->discount_price}}</h4>
                                        </div>
                                    </div>
                                    <div class="pd_size_wrap">
                                        <div class="pd_size_inner d-flex">
                                            <label for="" class="pd_info_label">Size:</label>
                                            <ul class="size-ul">
                                                <!-- {{$offer->description}} -->
                                                @if (count($offer->productVariants) > 0)
                                                @foreach ($offer->productVariants as $key => $variant)
                                                <li class="size-name @if ($key == 0) active @endif"
                                                    data-id="{{$variant->id}}" data-price="{{$variant->selling_price}}"
                                                    data-discount_price="{{$variant->discount_price}}">
                                                    <span>{{$variant->size->name}}</span>
                                                </li>
                                                @endforeach
                                                @endif
                                            </ul>
                                        </div>
                                    </div>
                                    <div class="pd_quantity_wrap">
                                        <div class="pd_quantity_inner d-flex">
                                            <label for="" class="pd_info_label">Quantity:</label>
                                            <div class="quantity_counter">
                                                <span class="quantity_counter_btn offerminus"
                                                    data-id="{{$offer->id}}"><i class="fas fa-minus"></i></span>
                                                <div class="output" id="output{{$offer->id}}">1</div>
                                                <span class="quantity_counter_btn offerplus" data-id="{{$offer->id}}"><i
                                                        class="fas fa-plus"></i></span>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="pd_action_btn">
                                        <ul>
                                            <li>
                                                <div class="c_btn c_btn_red get-deals" data-id="{{$offer->id}}">
                                                    <a href="#!"><i class="fas fa-tags"></i> Get Deal Now</a>
                                                </div>
                                            </li>
                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div> --}}
                            </div>

                            <!-- <div class="row">
                                <div class="col col-5">
                                    <div class="pd_item_slider">
                                        <div class="pd_item_slider_main_img">
                                            <div class="expand_slider">
                                                <a href="#!" data-fancybox="product-slider" data-src="images/cate_1.png">
                                                <img src="images/cate_1.png" alt=""></a>
                                            </div>
                                            <div class="pd_item_slider_for">
                                                <div class="pd_main_img_item">
                                                    <a href="#!" data-fancybox="product-slider" data-src="images/cate_1.png">
                                                        <img src="images/cate_1.png" alt="">
                                                    </a>
                                                </div>
                                                <div class="pd_main_img_item">
                                                    <a href="#!" data-fancybox="product-slider" data-src="images/cate_2.png">
                                                        <img src="images/cate_2.png" alt="">
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div> -->
                            <!-- <h3>New Updates to Our Daily Offers are Coming Soon!</h3> -->
                        </div>
                    </div>
                @else
                    <div class="col col-12">
                        <div class="daily_offer_content">
                            <div class="dod_title">
                                <h2>We will be offering amazing products soon. <span></span></h2>
                            </div>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </section>

    @include('front.layouts.app-footer')
@endsection
@section('custom-js')
    <script type="text/javascript" src="{{ asset('vendor/jsvalidation/js/jsvalidation.js') }}"></script>
    {!! JsValidator::formRequest(\App\Http\Requests\EnquireFormRequest::class, '#enquire-email') !!}
    <script>
        let checkOfferStockUrl = "{{ route('check-offer-stock') }}";
        let getDealUrl = "{{ route('get-deal') }}";
    </script>
@endsection