@extends('header.header')

@section('content')
    @if (session('Time Out Offer'))
        <div class="alert alert-danger text-center">
            {{ session('Time Out Offer') }}
        </div>
    @endif

    {{-- start Custom Header Page --}}
    <div class="header pb-8 pt-5 pt-lg-8 d-flex align-items-center" style="min-height: 300px;">
        <!-- Mask -->
        <span class="mask bg-gradient-default opacity-8"></span>
        <!-- Header container -->
        <div class="container-fluid d-flex align-items-center">
            <div class="row">
                <div class="col-lg-12 col-md-12">
                    <h1 class="display-2 text-white">{{__('Create Offer')}}</h1>
                </div>
            </div>
        </div>
    </div>
    {{-- end Custom Header Page --}}

    <!-- Page content -->
    <div class="container-fluid mt--7">
        <div class="row">

            <div class="col-xl-12 order-xl-1">
                <div class="card bg-secondary shadow">
                    <div class="card-header bg-white border-0">
                        <div class="row align-items-center">
                            <div class="col-12">
                                <h3 class="mb-0">{{__('Create Offer')}}</h3>
                            </div>
                        </div>
                    </div>
                    <div class="card-body">
                        <form method="post" action="{{route('offer.store')}}" enctype="multipart/form-data">
                            @csrf
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label class="form-control-label" for="input-phone_number">{{__('Image')}} </label>
                                        <input type="file" id="input-phone_number" name="image" class="form-control @if($errors->has("image")) is-invalid @endif" placeholder="" value="Jesse" accept="image/x-png,image/gif,image/jpeg,image/png,image/jpg,image/svg">
                                    </div>
                                    @error("image")
                                    <div class="input-error">{{$message}}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label class="form-control-label" for="input-=name">{{__('Offer In')}}</label>
                                        <select name="OfferIn"  value="{{inputValue("OfferIn")}}" id="OfferIn" class="form-control @if($errors->has("OfferIn")) is-invalid @endif" >
                                            @if(inputValue('OfferIn') == 1 || inputValue('OfferIn') == null)
                                                <option value="1" selected>Store</option>
                                                <option value="2" >Category</option>
                                                <option value="3" >Item</option>
                                            @elseif(inputValue('OfferIn') == 2)
                                                <option value="1">Store</option>
                                                <option value="2" selected>Category</option>
                                                <option value="3" >Item</option>
                                            @elseif(inputValue('OfferIn') == 3)
                                                <option value="1">Store</option>
                                                <option value="2">Category</option>
                                                <option value="3" selected>Item</option>
                                            @endif
                                        </select>
                                    </div>
                                    @error("OfferIn")
                                    <div class="input-error">{{$message}}</div>
                                    @enderror
                                </div>
                                @if(old('OfferIn') == 1 || old('OfferIn') == null)
                                    <div class="col-lg-6" id="store">
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-=name">{{__('Store')}}</label>
                                            <select name="store" value="{{inputValue("store")}}"  class="form-control @if($errors->has("store")) is-invalid @endif" id="storeVal">
                                                <option selected disabled>Choose Store</option>
                                                @foreach($stores as $store)
                                                    <option value="{{$store->id}}">{{$store->lang->translate_title}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        @error("store")
                                        <div class="input-error">{{"The store field is required when offer in is store"}}</div>
                                        @enderror
                                    </div>
                                @endif

                                @if(old('OfferIn') == 2)
                                    <div class="col-lg-6" id="category" @if(old('OfferIn') == 2) style="display:block;" @endif>
                                        <div class="form-group">
                                            <label class="form-control-label" for="input-=name">{{__('Category')}}</label>
                                            <select name="category" id="" class="form-control @if($errors->has("category")) is-invalid @endif" id="categoryVal">
                                                <option selected disabled>Choose Category</option>
                                                @foreach($categories as $category)
                                                    <option value="{{$category->id}}">{{$category->name_.\Illuminate\Support\Facades\App::getLocale() == "en" ? $category->name_en : $category->name_ar}}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        @error("category")
                                        <div class="input-error">{{"The category field is required when offer in is category"}}</div>
                                        @enderror
                                    </div>
                                @endif
                                <div class="col-lg-6" id="category" style="display:none">
                                    <div class="form-group">
                                        <label class="form-control-label" for="input-=name">{{__('Category')}}</label>
                                        <select name="category" id="" class="form-control @if($errors->has("category")) is-invalid @endif" id="categoryVal">
                                            <option selected disabled>Choose Category</option>
                                            @foreach($categories as $category)
                                                <option value="{{$category->id}}">{{$category->name_.\Illuminate\Support\Facades\App::getLocale() == "en" ? $category->name_en : $category->name_ar}}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    @error("category")
                                    <div class="input-error">{{$message}}</div>
                                    @enderror
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-2">
                                    <td>Date From :<input type="date" name="DateFrom" style="border-radius: 7px;padding: 10px;margin:15px 15px 0px 15px" class="form-control @if($errors->has("DateFrom")) is-invalid @endif" value="{{inputValue("DateFrom")}}"></td>
                                    <td>
                                        @error("DateFrom")
                                        <div class="input-error" style="border-radius: 7px;padding: 10px;margin:0px 15px 15px 15px">{{$message}}</div>
                                        @enderror
                                    </td>
                                </div>
                                <div class="col-lg-2">
                                    <td>Date To :<input type="date" name="DateTo" style="border-radius: 7px;padding: 10px;margin:15px 15px 0px 15px" class="form-control @if($errors->has("DateTo")) is-invalid @endif" value="{{inputValue("DateTo")}}"></td>
                                    <td>
                                        @error("DateTo")
                                        <div class="input-error" style="border-radius: 7px;padding: 10px;margin:0px 15px 15px 15px">{{$message}}</div>
                                        @enderror
                                    </td>
                                </div>

                                <div class="col-lg-2">
                                </div>
                                <div class="col-lg-2" id="offerType">
                                    <td><div style="margin-bottom: 15px">{{__('Offer Value Type')}}:</div>
                                        <select name="offerValueType" class="offerValueType form-control @if($errors->has("offerValueType")) is-invalid @endif">
                                            @if(inputValue('offerValueType') == 1 || inputValue('offerValueType') == null)
                                                <option value="1" selected>By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 2)
                                                <option value="1">By Percentage</option>
                                                <option value="2" selected>By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 3)
                                                <option value="1">By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3" selected>Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 4)
                                                <option value="1">By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4" selected>Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 5)
                                                <option value="1">By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5" selected>Delivery Value</option>
                                            @endif
                                        </select>
                                        @error("offerValueType")
                                        <div class="input-error" style="border-radius: 7px;padding: 10px;margin:0px 15px 15px 15px">{{$message}}</div>
                                        @enderror
                                    </td>
                                </div>
                                <div class="col-lg-2" id="offerTypeItem" style="display:none;">
                                    <td><div style="margin-bottom: 15px">{{__('Offer Value Type')}}:</div>
                                        <select name="offerValueType"  class="offerValueType form-control @if($errors->has("offerValueType")) is-invalid @endif">
                                            @if(inputValue('offerValueType') == 1 || inputValue('offerValueType') == null)
                                                <option value="1" selected>By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 2)
                                                <option value="1">By Percentage</option>
                                                <option value="2" selected>By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 3)
                                                <option value="1">By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3" selected>Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 4)
                                                <option value="1">By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4" selected>Discount Delivery</option>
                                                <option value="5">Delivery Value</option>
                                            @elseif(inputValue('offerValueType') == 5)
                                                <option value="1">By Percentage</option>
                                                <option value="2">By Value</option>
                                                <option value="3">Free Delivery</option>
                                                <option value="4">Discount Delivery</option>
                                                {{--                                               <option value="5" selected>Delivery Value</option>--}}
                                            @endif
                                        </select>
                                    </td>
                                    <td>
                                        @error("offerValueType")
                                        <div class="input-error" style="border-radius: 7px;padding: 10px;margin:0px 15px 15px 15px">{{$message}}</div>
                                        @enderror
                                    </td>
                                </div>

                                @if(old('offerValueType') != 3)
                                    <div class="col-lg-2" id="value">
                                        <td>Value:<input type="number" name="value" class="form-control @if($errors->has("value")) is-invalid @endif" style="border-radius: 7px;padding: 10px;margin: 15px" min="0" placeholder="Value"></td>
                                        @error("value")
                                        <div class="input-error" style="border-radius: 7px;padding: 10px;margin:0px 15px 15px 15px">{{$message}}</div>
                                        @enderror
                                    </div>
                                    <div class="col-lg-6">
                                    </div>
                                    <div class="col-lg-6" id="valueDelivery" style="display: none">
                                        <td>Value:<br><input type="number" name="valueDelivery" class="form-control @if($errors->has("value")) is-invalid @endif" style="border-radius: 7px;padding: 10px;margin: 15px" min="0" placeholder="Value"></td>
                                        @error("valueDelivery")
                                        <div class="input-error" style="border-radius: 7px;padding: 10px;margin:0px 15px 15px 15px">{{$message}}</div>
                                        @enderror
                                    </div>
                                @endif
                            </div>
                            <div class="row">
                                <div  class="col-lg-5 mb-6">
                                    @if(Session::has('message'))

                                        <p class="text-danger">{{Session::get('message') }}</p>

                                    @endif
                                    <table class="table align-items-center table-flush">
                                        <thead class="thead-light">
                                        <tr>
                                            <th>
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" id="selectAllDays">
                                                    <label class="form-check-label" for="days">
                                                        {{__("Day")}}
                                                    </label>
                                                </div>
                                            </th>
                                            <th>{{__("From")}}</th>
                                            <th>{{__("To")}}</th>
                                        </tr>
                                        </thead>
                                        @php
                                            $days = ['Saturday','Sunday','Monday','Tuesday','Wednesday','Thursday','Friday']
 //                                       @endphp
                                        <tbody class="list" id="myTable">
                                        @foreach($days as $index => $day)
                                            <tr>
                                                <td>
                                                    <input class="form-check" type="checkbox"name="day[]" value="{{$day}}">
                                                    <label class="form-check" id="days">
                                                        {{$day}}
                                                    </label>
                                                </td>
                                                <td><input type="time" name="timeFrom[]" style="border-radius: 7px;padding: 10px" class="form-control @if($errors->has("timeFrom.".$index)) is-invalid @endif" value="{{old("timeFrom.".$index)}}"></td>
                                                <td><input type="time" name="timeTo[]" style="border-radius: 7px;padding: 10px" class="form-control @if($errors->has("timeTo.".$index)) is-invalid @endif" value="{{old("timeTo.".$index)}}"></td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                                <div  class="col-lg-7"  @if(old('OfferIn') == 3) style="height:500px;overflow-y: scroll;display:block" @endif style="height:500px;overflow-y: scroll;display: none"  id="itemsTable">
                                    <label class="form-control-label" for="input-=name">{{__('Items Table')}}</label>
                                    <table class="table align-items-center table-flush" id="item">
                                        <thead class="thead-light" >
                                        <tr>
                                            <th>{{__("ID")}}</th>
                                            <th>{{__("Name")}}</th>
                                            <th>{{__("Image")}}</th>
                                            <th>{{__("Price")}}</th>
                                            <th>
                                                <div class="form-check">
                                                    <input class="form-check-input" type="checkbox" id="selectAll">
                                                    <label class="form-check-label" for="flexCheckDefault">
                                                        {{__("Select All")}}
                                                    </label>
                                                </div>
                                            </th>
                                        </tr>
                                        </thead>
                                        <tbody class="list" id="myTable">
                                        @foreach($items as $item)
                                            <tr>
                                                <td>{{$item->id}}</td>
                                                <td>{{$item->lang->getTitleAttribute()}}</td>
                                                <td><img src="{{$item->item_image}}" width="70px" height="70px"></td>
                                                <td>{{$item->price}}</td>
                                                <td>
                                                    <div class="form-check">
                                                        <input class="form-check-input" type="checkbox" name="checked[]" value="{{$item->id}}" id="flexCheckDefault" data-id="{{$item->id}}">
                                                    </div>
                                                </td>
                                            </tr>
                                        @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <hr class="my-4" />
                            <div class="col-lg-4  mt-5 mb-3 m-auto">
                                <button class="btn btn-primary form-control ">{{__('Create')}}</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('js-scripts')
    <script type="text/javascript" src="{{asset("assets/js/plugins/select2.min.js")}}"></script>
    <script type="text/javascript" src="https://cdn.datatables.net/v/dt/dt-1.10.22/datatables.min.js"></script>
    <script type="text/javascript">
        if(document.location.hostname == 'pratikborsadiya.in') {
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
                (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
                m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
            })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
            ga('create', 'UA-72504830-1', 'auto');
            ga('send', 'pageview');
        }
        $('#demoSelect').select2();
    </script>
    <script>
        $('.offerValueType').change(function (){
            let value = $(this).val();
            if(value == 3){
                $('#delivery').css("display","block");
                $('#valueDelivery').css("display","none");
                $('#value').hide();
            }else{
                $('#delivery').css("display","none");
                $('#valueDelivery').css("display","none");
                $('#value').show();
            }
        });
        $('#freeDelivery').change(function (){
            let value = $(this).val();
            console.log(value)
            if(value == 1){
                $('#valueDelivery').css("display","none");
            }else{
                $('#valueDelivery').css("display","block");
            }
        });
        $(document).ready(function() {
            $('#item').DataTable({
                "paging":   false,
                "ordering": false,
                "info":     false
            });
        });
        $('#OfferIn').change(function () {
            let value = $(this).val();
            if(value == 3){
                $('#itemsTable').css("display","block");
                $('#offerTypeItem').css("display","block");
                $('#store').hide();
                $('#category').css("display","none");
                $('#offerType').css("display","none");
                $('#ByPercentageOffer').css("display","none");
            }
            else if(value == 2){
                $('#store').hide();
                $('#category').css("display","block");
                $('#itemsTable').css("display","none");
                $('#offerTypeItem').css("display","none");
                $('#offerType').css("display","block");
            }if(value == 1){
                $('#store').show();
                $('#category').css("display","none");
                $('#itemsTable').css("display","none");
                $('#offerTypeItem').css("display","none");
                $('#offerType').css("display","block");
            }
        })
        $(function() {
            $('#selectAll').click(function() {
                if ($(this).prop('checked')) {
                    $('.form-check-input').prop('checked', true);
                } else {
                    $('.form-check-input').prop('checked', false);
                }
            });
        });
        $(function() {
            $('#selectAllDays').click(function() {
                if ($(this).prop('checked')) {
                    $('.form-check').prop('checked', true);
                } else {
                    $('.form-check').prop('checked', false);
                }
            });
        });
        $('#flexCheckDefault').click(function (){
            $('#valueOffer').css("display","block");
        })
        $("#store").change(function(){
            //Read the fields
            let store = $('#storeVal').val();
            let url = window.location.href;
            $.ajax({
                type: "GET",
                url:  url,
                data:   {"StoreId": store},
                success: function(response)
                {
                    console.log(response);
                    if(response.status == 1){
                        location.reload();
                    }
                },
                error:function(){
                    console.error("you have error");
                }
            });
            //Note: form may not be 'sent'!
            return false;
        });
    </script>
    <script>
        $(function () {
            $('.bs-timepicker').timepicker();
        });
    </script>
@endsection