@extends('Frontend.layout.main')

@section('content')



@include('Frontend.inc.banners')
<div class="container">
    <div class="row">
        <div class="col-12">
            <div class="bannerTxt">
                <!-- <h1 class="stretched text-white">About Us</h1> -->
            </div>
        </div>
    </div>
</div>
</section>
<div id="shpCart"></div>




<section class="moments-section py-5 mt-0 mt-md-3" data-aos="fade-up">
    <div class="container">
        <div class="row">
            <div class="col-md-8 mb-4">
                <div class="row mb-4">
                    <div class="col-12">
                        <h4 class="stretched text-uppercase text-default">Delivery Address</h4>
                    </div>
                </div>
                <form method="post" action="{{ url('/cart/confirm') }}">

                    @csrf


                    <div class="col-md-12">
                        <!-- <h4 class="my-3"> Delivery Address</h4> -->

                        <div class="row">
                            <div class="form-group col-md-6">
                                <label for="exampleFormControlInput1">Name</label>
                                <input type="text" class="form-control name" name="name" 
                                    placeholder="Name" required="">
                                    @auth
                                    <input type="email" class="form-control email d-none" name="email"  value="{{auth()->user()->email}}" placeholder="name@example.com" required="">
                                    @else
                                    <input type="email" class="form-control email d-none" name="email"  value="{{ app('request')->input('email') }}" placeholder="name@example.com">
                                    @endauth

                            </div>

                          {{--  <!-- <div class="form-group col-md-6">
                                        <label for="exampleFormControlInput1">Email address</label>
                                        <input type="email" class="form-control email" name="email" id="exampleFormControlInput1" value="{{ app('request')->input('email') }}" placeholder="name@example.com" required="">
                                    </div> -->
                                    --}}
                            <div class="form-group col-md-6">   
                                <label for="exampleFormControlInput1">Phone</label>
                                <div class="row">
                                    <div class="col-sm-3 col-xs-3">
                                        <input type="text" class="form-control " id="" name="country_code" value="+971"
                                            readonly="" required="">

                                    </div>
                                    <div class="col-sm-9 col-xs-9">
                                        <input type="number" class="form-control " id="phone" name="phone"
                                            onkeypress="if(this.value.length>=9) return false;"
                                            placeholder="9 digit number" required="">

                                    </div>
                                </div>

                            </div>
                            <div class="form-group col-md-6">

                                <label for="exampleFormControlInput1">Delivery Date</label>
                                <input type="text" class="form-control " name="delivery_date"
                                    id="datepicker" onkeydown="return false" required="">

                            </div>

                            <div class="form-group col-md-6">

                                <label for="exampleFormControlInput1">Emirate</label>
                                <select class="form-control" name="location_id" id="location" required>
                                    <option value="" shipping-charge ="0" >Select Delivery Location</option>
                                    @foreach($delivery_location as $location)
                                        <option value="{{ $location->id }}"  shipping-charge ="{{$location->delivery_charge}}" >{{ $location->title }} </option>
                                    @endforeach
                                </select>
                                <span></span>

                            </div>

                            <div class="form-group col-md-12">
                                <label for="exampleFormControlTextarea1">Address</label>
                                <textarea class="form-control" id="exampleFormControlTextarea1" name="address" rows="3"
                                    required=""></textarea>
                            </div>
                            <div class="form-group col-md-12">
                    <input type="checkbox" id="terms" class="checkbox" name="terms-and-condition" value="1"
                        required>
                        <input class="d-none" id="discount_input" name="discount-code">
                    &nbsp; <label for="vehicle1">I agree to the <a
                            href="{{ url('/terms-and-conditions') }}">terms and conditions</a>
                    </label>
                </div>

                        </div>
                    </div>



                    <div class="col-md-10">
            <div class="row mt-4">
                <div class="col-12 d-flex justify-content-between">
                    <a href="{{ url('/products') }}"><i class="fas fa-long-arrow-alt-left"></i>
                        Continue Shopping</a>

                    <button type="submit" id="submit" class="btn btn-primary">Confirm</button>
                </div>
            </div>
        </div>
                </form>
            </div>

            <div class="col-md-4">
                        <div class="sideBar">
                            <div class="row mb-4">
                                <div class="col-12">
                                    <h4 class="stretched text-uppercase text-default">Your Orders ({{count($products)}})</h4>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-12 px-4">



                        @php 
                        $subtotal =0;
                        @endphp


                        @foreach($products as $key => $product_id)
                        
                        
                        @php

                            $product = App\Http\Controllers\Frontend\CartController::getProduct($product_id);
                            $quantity= isset($quantities[$key])?$quantities[$key]:1;
                            $size_id = isset($sizes[$key])?$sizes[$key]:0;

                                if($size_id != 0){

                                    $price = App\Http\Controllers\Frontend\CartController::getPrice($size_id);
                                    $size =App\Http\Controllers\Frontend\CartController::getSize($size_id);
                                }
                                else{

                                    $price  = $product->price;
                                    $size  = $product->a_size;

                                }

                                $productAllSizes = App\Http\Controllers\Frontend\CartController::getAllSize($product_id)
                              @endphp

                                    <div class="row cart-table">
                                        <div class="col-md-12">
                                            <div class="d-flex">
                                                <div class="checkoutImg">
                                                    <img src="{{env('ASSET_URL')}}storage/products/{{$product->filename}}" class="img-fluid"  alt="add-image"/>
                                                </div>
                                                <div>
                                                    <h6>{{ $product->title}}</h6>
                                                    <p class="small">{{strip_tags(substr($product->long_description,0,75))}}</p>
                                                    <ul class="cartSpec">
                                                        <li>Qty : {{$quantity}}</li>
                                                        <li>Size: {{$size}}</li>
                                                    </ul>
                                                    <p>AED {{$price}}</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                        @php 
                                               $subtotal =$subtotal + ($quantity * $price);
                                        @endphp
                                                
                                  @endforeach

                                     <div class="row">
                                        <div class="col-12 disc-container">
                                            <div class="input-group mb-2 mt-3">
                                                <input type="text" class="form-control" id="discount-code" placeholder="Enter promo code">
                                                <div class="input-group-append">
                                                    <button class="btn btn-register btn-primary apply-code" type="button">Apply</button>
                                                </div>

                                            </div>
                                            <span id="discount-error" class="text-danger">Invalid promotional code </span>

                                        </div>
                                    </div> 
                                    <input type="" class="d-none" id="sub_total" value={{$subtotal}}>
                                    <div class="row mb-1 mt-3">
                                        <div class="col-md-12 text-right total">
                                            Sub Total : <span class="totPrice"> AED {{ $subtotal}}</span>

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>


                    </div>
        </div>
</section>


@endsection
@section('script')

<script>

    var is_discount=false;
    var discount=0;

$(document).ready(function(){
    

    $('#discount-error').hide();
    $('#location').trigger('change');

})


        $('.apply-code').click(function(){

         $(this).html( 'Apply <i class="spinner fa fa-spinner fa-spin"></i>');

        var discount_code = $('#discount-code').val();
            discount_code = discount_code.trim();

        if (discount_code.length != 8) {

              $(this).html( 'Apply');

              $('#discount-error').show();

              return 0;

            }
             else if (discount_code.substring(0, 3) != 'CJ-') {

                $('#discount-error').show();
                $(this).html( 'Apply');
                return 0;

              }

              $(this).attr('disabled',true);

              baseurl = "{{url('/')}}";

              $('#discount-error').hide();

              $.ajax({

                    url: baseurl+'/verifycode/'+discount_code,
                    success: function (response) {  
                    $(this).attr('disabled',false); 
                    $('.disc-container').empty();
                    is_discount =true;
                    $('#discount_input').val(discount_code);
                    $('#location').trigger('change');

                    },
                    error: function (e) { 

                        $('.apply-code').attr('disabled',false);
                         $('.apply-code').html('Apply');
                        $('#discount-error').show();
                        console.log(e);

                        }
                })

        })


    $('#location').change(function(){
        

        temp ='';
        var subTotal = parseFloat($('#sub_total').val());
        var shipping_charge  = parseFloat($('#location option:selected').attr('shipping-charge'));

        if(is_discount){
            discount =subTotal*0.15;
            temp ='Discount : <span class="totPrice"> AED '+discount +'</span><br>';
        }


        var vat = parseFloat((subTotal + shipping_charge - discount)*0.05).toFixed(2);

        var total = shipping_charge + subTotal + parseFloat(vat) - parseFloat(discount);
        total = parseFloat(total).toFixed(2);

        $('.total').empty();
        
      
        var output = 'Sub Total : <span class="totPrice"> AED '+subTotal +'</span><br>'+temp+' Shipping Charge : <span class="totPrice">AED '+shipping_charge+'</span><br>'+
        'VAT : <span class="totPrice">AED '+vat+'</span><br><b style="font-size:14px; color:#333"> Grand Total : <span class="totPrice">AED '+total+'</span></b>'

        $('.total').append(output);


        
    })


    $('#submit').click(function (e) {

        var phone = $('#phone').val();

        if (phone.length != 9) {

            alert('Please enter a valid 9 digit phone number');
            e.preventDefault();
        }



    });

</script>

<script src="https://code.jquery.com/ui/1.13.0/jquery-ui.js"></script>

<script>
    $(function () {

        $("#datepicker").datepicker({
            minDate: '0D',
            maxDate: '+12D',
        });


    });

</script>

@endsection