@extends('shop.app')
@section('content')


<div class="container wow fadeIn">

    <!--Grid row-->
    <div class="row">

        <!--Grid column-->
        <div class="col-md-6 mb-4 my-2">
            <div class="title-left">
                <h3>Podaci za naplatu</h3>
            </div>
            <!--Card-->
            <div class="checkout-data">

                <!--Card content-->
                {!! Form::open(array(
                'url' => route('finish-order'),
                'method' => 'post',
                'class' => 'form-body',
                'id' =>'checkout-form',
                'enctype' => 'multipart/form-data',
                'role'=>'form',
                'files' => true
                )) !!}

                <!--Grid row-->
                <div class="row">
                    <!--Grid column-->
                    <div class="col-md-6 mb-2">

                        <!--firstName-->
                        <div class="md-form ">
                            {!!Form::label('customer_first_name','Ime') !!}
                            {!!Form::text('customer_first_name','',['class'=> 'form-control','value'=>old('customer_first_name')])!!}
                        </div>

                    </div>
                    <!--Grid column-->

                    <!--Grid column-->
                    <div class="col-md-6 mb-2">

                        <!--lastName-->
                        <div class="md-form">
                            {!!Form::label('customer_last__name','Prezime') !!}
                            {!!Form::text('customer_last_name','',['class'=> 'form-control'])!!}
                        </div>

                    </div>
                    <!--Grid column-->

                </div>
                <!--Grid row-->

                <div class="row">
                    <div class="col-md-6 mb-2">
                        <div class="md-form">
                            {!!Form::label('customer_phone_number','Broj telefona') !!}
                            {!!Form::text('customer_phone_number','',['class'=> 'form-control'])!!}
                        </div>
                    </div>

                    <div class="col-md-6 mb-2">
                        <div class="md-form">
                            {!!Form::label('customer_email','Email') !!}
                            {!!Form::text('customer_email','',['class'=> 'form-control'])!!}
                        </div>
                    </div>

                </div>

                <!--address-->
                <div class="md-form mb-5">
                    {!!Form::label('customer_address','Adresa') !!}
                    {!!Form::text('customer_address','',['class'=> 'form-control'])!!}
                </div>


                <!--Grid row-->
                <div class="row">


                    <!--Grid column-->
                    <div class="col-lg-4 col-md-6 mb-4">

                        {!!Form::label('customer_city','Grad') !!}
                        {!!Form::text('customer_city','',['class'=> 'form-control'])!!}

                    </div>
                    <!--Grid column-->

                    <!--Grid column-->
                    <div class="col-lg-4 col-md-6 mb-4">

                        {!!Form::label('customer_zip','Poštanski broj') !!}
                        {!!Form::text('customer_zip','',['class'=> 'form-control'])!!}

                    </div>
                    <!--Grid column-->

                </div>
                <!--Grid row-->

                <hr>

                <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="same-address">
                    <label class="custom-control-label" for="same-address">Shipping address is the same as my
                        billing address</label>
                </div>
                <div class="custom-control custom-checkbox">
                    <input type="checkbox" class="custom-control-input" id="save-info">
                    <label class="custom-control-label" for="save-info">Save this information for next
                        time</label>
                </div>

                <hr>


            </div>
            <!--/.Card-->

        </div>
        <!--Grid column-->

        <!--Grid column-->
        <div class="col-md-6 mb-4 my-2">

            <!-- Heading -->
            <h4 class="d-flex justify-content-between align-items-center mb-3">
                <div class="title-left">
                    <h3>Narudžba</h3>
                </div>
                <span class="badge badge-secondary badge-pill">{{count($cart->cartItems)}}</span>
            </h4>

            <!-- Cart -->
            <ul class="list-group mb-3 z-depth-1">
                @foreach($cart->cartItems as $item)
                <li class="list-group-item d-flex justify-content-between lh-condensed">
                    <div>
                        <h6 class="my-0">{{$item->product->getName()}}</h6>
                    </div>
                    <span class="text-muted">{{$item->product->finalPrice()}}BAM</span>
                </li>
                @endforeach
                 <li class="list-group-item d-flex justify-content-between">
                    <span>Cijena (BAM)</span>
                    <strong>{{getCartTotal()}}</strong>
                </li>
                <li class="list-group-item d-flex justify-content-between">
                    <span>Dostava (BAM)</span>
                    <strong>{{getDeliveryPrice()}}</strong>
                </li>
                @if(getCart()->discount > 0)
                <li class="list-group-item d-flex justify-content-between bg-light">
                    <div class="text-success">
                        <h6 class="my-0">Promo kod</h6>
                    </div>
                    <span class="coupon-discount text-success">- {{getCart()->discount}}%</span>
                </li>
                @endif
                <li class="list-group-item d-flex justify-content-between">
                    <span>Ukupno (BAM)</span>
                    <strong>{{getOrderTotal()}}</strong>
                </li>
            </ul>
            <!-- Cart -->

            <!-- Promo code -->
               
                <div class="input-group coupon-code">
                    <input type="text" class="form-control" id="coupon-value" placeholder="Promo code" aria-label="Recipient's username"
                        aria-describedby="basic-addon2">
                    <div class="input-group-append">
                        <button id="apply-coupon" class="btn btn-secondary btn-md waves-effect m-0" type="button">Iskoristi kupon</button>
                    </div>
                </div>
                <!-- Promo code -->

                
                <div class="d-block my-3">
                    <div class="custom-control custom-radio">
                        <input id="pik_pay" name="payment_method" value="monri" type="radio" class="custom-control-input" checked
                            required>
                        <label class="custom-control-label" for="pik_pay">PikPay</label>
                    </div>
                    <div class="custom-control custom-radio">
                        <input id="cash_on_delivery" name="payment_method" value="pouzece" type="radio" class="custom-control-input"
                            required>
                        <label class="custom-control-label" for="cash_on_delivery">Plaćanje pouzećem</label>
                    </div>
                </div>

                <hr class="mb-4">
                <button class="btn btn-primary btn-lg btn-block" type="submit">Nastavi</button>

                {!! Form::close() !!}

        </div>
        <!--Grid column-->

    </div>
    <!--Grid row-->

</div>

@endsection
@section('scripts')
<script>
     $(document).ready(function () {
        if($(".coupon-discount").length){
            $(".coupon-code").hide();
        }

    $("#apply-coupon").click(function(){
        $(".error-message").hide();
        let ajaxURL = '/use-coupon';
        let coupon = $("#coupon-value").val();
        console.log(coupon);
        let $_token = $("input[name=_token]").val();
        let data = {_token: '{{ csrf_token() }}','coupon':coupon};
         $.ajax({
                    type: 'POST',
                    dataType: 'json',
                    url: ajaxURL,
                    data: data,
                    success: function(data){
                        console.log(data);
                        if (data.success === false) {
                            $(".input-group-append").after('<div class="col-xs-12 col-lg-12 eroor-message"><p class="text-danger">'+data.errors+'</p></div>');                           
                        }else{
                            $('.coupon-discount').text('-'+data.discount+'%');
                             window.location.reload();
                        }
                    },
                    
                });
    });
});
</script>
@endsection