@extends('layouts.app')
@section('title') Add Order @endsection

@section('css')
    <link href="{{asset('vendors/sweetalert2/dist/sweetalert2.min.css')}}" rel="stylesheet" type="text/css"/>
    <link href="{{asset('assets/css/flatpickr.min.css')}}" rel="stylesheet" type="text/css"/>

@endsection
@section('content')

    <!-- begin:: Subheader -->
    <div class="kt-subheader   kt-grid__item" id="kt_subheader">
        <div class="kt-subheader__main">
            <h3 class="kt-subheader__title">
                New Order</h3>
            <span class="kt-subheader__separator kt-hidden"></span>
        </div>
    </div>

    <!-- end:: Subheader -->

    <!-- begin:: Content -->
    <div class="kt-content  kt-grid__item kt-grid__item--fluid" id="kt_content">

        <div class="kt-portlet kt-portlet--mobile">
            <div class="kt-portlet__head kt-portlet__head--lg">
                <div class="kt-portlet__head-label">
										<span class="kt-portlet__head-icon">
											<i class="kt-font-brand flaticon-cart red"></i>
										</span>
                    <h3 class="kt-portlet__head-title">
                        Add Order
                    </h3>
                </div>

            </div>
            <div class="kt-portlet__body">
                <div class="error-alert" style="display:none"></div>
                <form class="kt-form kt-form--label-right" id="order_form">
                    @csrf
                    <div class="kt-portlet__body">

                        <div class="form-group row">
                            <div class="col-md-12">
                                <div class="form-group">
                                    <label>Payment</label>
                                    <div class="kt-radio-inline">
                                        <label class="kt-radio">
                                            <input type="radio" value="Cash" name="payment_type" checked> Cash
                                            <span></span>
                                        </label>
                                        <label class="kt-radio">
                                            <input type="radio" value="E-Transfers" name="payment_type"> E-Transfers
                                            <span></span>
                                        </label>
                                        <label class="kt-radio">
                                            <input type="radio" value="Western Union" name="payment_type"> Western Union
                                            <span></span>
                                        </label>
                                        <label class="kt-radio">
                                            <input type="radio" value="PayPal" name="payment_type"> PayPal
                                            <span></span>
                                        </label>
                                        <label class="kt-radio">
                                            <input type="radio" value="Visa" name="payment_type"> Visa
                                            <span></span>
                                        </label>
                                        <label class="kt-radio">
                                            <input type="radio" value="Master" name="payment_type"> Master
                                            <span></span>
                                        </label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-12">
                                <div class="western">
                                    <div class="row">
                                        <div class="col-lg-3 mb-3">
                                            <label for="receiver_name">Receiver Name:</label>
                                            <input type="text" id="receiver_name" class="form-control"
                                                   name="receiver_name">
                                        </div>

                                        <div class="col-lg-3 mb-3">
                                            <label for="recept">Receipt:</label>
                                            <input type="file" id="recept" class="form-control" name="recept">
                                        </div>
                                    </div>
                                </div>
                                <div class="paypal">
                                    <div class="row">
                                        <div class="col-lg-3 mb-3">
                                            <label for="sender_email">Sender Email:</label>
                                            <input type="text" id="sender_email" class="form-control"
                                                   name="sender_email">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            {{--                            <div class="col-md-12 mb-3">--}}
                            {{--                                <label for="products">Products:</label>--}}
                            {{--                                <select class="form-control kt-select2 multi-select2" id="products" name="products[]"--}}
                            {{--                                        multiple="multiple">--}}

                            {{--                                    @foreach($products as $product)--}}
                            {{--                                        <option data-price="{{$product->price}}"--}}
                            {{--                                                value="{{$product->id}}">{{$product->name .' ('. $product->price .'JD) ' }}</option>--}}
                            {{--                                    @endforeach--}}

                            {{--                                </select>--}}
                            {{--                            </div>--}}

                            <div class="col-md-12 mb-3">
                                <label for="products">Products:</label>
                                <div class="new-product">

                                    <div class="row">
                                        <div class="col-md-5 ">
                                            <div class="form-group m-form__group">
                                                <label for="" class="">Product</label>
                                                <select name="products[]" id="" class="form-control select2 products"
                                                        data-dependent="product-details">
                                                    <option value="">Select Product</option>
                                                    @foreach($products as $product)
                                                        <option data-price="{{$product->price}}"
                                                                value="{{$product->id}}">{{'('. $product->id .') '.$product->name .' ('. $product->price .'JD) -'.$product->category[0]->name}}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
                                        <div class="col-md-3">
                                            <div class="form-group m-form__group">
                                                <label for="quantity">Quntity:</label>
                                                <input type="text" id="quantity" class="form-control quantity"
                                                       name="quantity[]" required>
                                                <input type="hidden" id="price" class="form-control" value="0">
                                            </div>
                                        </div>
                                        <div class="col-md-1">
                                            <div class="form-group m-form__group">
                                                <button type="button" class="btn new-row"><i class="flaticon-plus"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                {{--                                <div class="new-product"></div>--}}
                            </div>

                            <div class="col-md-2 mb-3">
                                <label for="exchangeable">Exchangeable?</label>
                                <div>
                                    <span class="kt-switch kt-switch--outline kt-switch--icon kt-switch--success">
															<label>
																<input type="checkbox" id="exchangeable"
                                                                       name="exchangeable" value="1">
																<span></span>
															</label>
														</span>
                                </div>
                            </div>
                            <div class="col-md-10 mb-3">
                                <label for="exchangeable_products">Exchangeable products:</label>
                                <select class="form-control kt-select2 multi-select2" id="exchangeable_products"
                                        name="exchangeable_products[]" multiple="multiple" disabled>

                                    @foreach($exchangeable_products as $exchangeable_product)
                                        <option data-price="{{$exchangeable_product->exchangeable_price}}"
                                                value="{{$exchangeable_product->id}}">{{$exchangeable_product->name .' ('. $exchangeable_product->exchangeable_price .'JD) '}}</option>
                                    @endforeach

                                </select>
                            </div>

                            <div class="col-lg-4 mb-3">
                                <label for="user">User:</label>
                                <div class="kt-input-icon kt-input-icon--right">
                                    <input type="text" name="inputSearch"  class="form-control" placeholder="Search..." id="inputSearch">
                                    <span class="kt-input-icon__icon kt-input-icon__icon--right" id="userSearch">
															<span><i class="la la-search"></i></span>
														</span>
                                </div>

{{--                                <select name="user" id="user" class="form-control user select2">--}}
{{--                                    <option>Choose user</option>--}}
{{--                                    @foreach($users as $user)--}}
{{--                                        <option value="{{$user->id}}" data-name="{{$user->name}}" data-phone="{{$user->phone}}" data-address="{{$user->address}}" data-city="{{$user->city}}" data-district="{{$user->district}}">{{$user->name}}</option>--}}
{{--                                    @endforeach--}}
{{--                                </select>--}}
                            </div>

                            <div class="col-lg-4 mb-3">
                                <label for="name">Name:</label>
                                <input type="hidden" id="user" class="form-control" name="user">
                                <input type="text" id="name" class="form-control" name="name">
                            </div>
                            <div class="col-lg-4 mb-3">
                                <label for="phone">Phone Number:</label>
                                <input type="text" id="phone" class="form-control" name="phone">
                            </div>
                            <div class="col-lg-4 mb-3">
                                <label for="city">City:</label>
                                <select name="city" id="city" class="form-control city select2"
                                        data-dependent="district">
                                    @php $cities = \App\City::getCities()@endphp
                                    <option>Choose City</option>
                                    @foreach($cities as $city)
                                        <option value="{{$city->name}}" data-id="{{$city->id}}">{{$city->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-lg-4 mb-3">
                                <label for="district">District:</label>
                                <select name="district" id="district" class="form-control select2">
                                    <option value="">District</option>
                                </select>
                            </div>
                            <div class="col-lg-4 mb-3">
                                <label for="address">Address:</label>
                                <input type="text" id="address" class="form-control" name="address">
                            </div>
                            <div class="col-lg-2 mb-3">
                                <label for="delivery_fee">Delivery Fee:</label>
                                <input type="text" class="delivery_fee form-control" id="delivery_fee"
                                       STYLE="background-color: #f7f8fa" ; name="delivery_fee" value="0">
                                {{--                                <input type="hidden" id="delivery_fee" class="delivery_fee form-control"--}}
                                {{--                                       name="delivery_fee" value="0">--}}

                            </div>
                            <div class="col-lg-3 mb-3">
                                <label for="delivery_time">Delivery time:</label>
                                <input type="text" class="delivery_time form-control" disabled name="">
                                <input type="hidden" id="delivery_time" class="delivery_time form-control"
                                       name="delivery_time">
                            </div>
                            <div class="col-lg-2 mb-3">
                                <label for="processing_fee">Processing Fee:</label>
                                <input type="text" class="processing_fee form-control" id="processing_fee"
                                       STYLE="background-color: #f7f8fa" ; name="processing_fee" value="0">

                            </div>
                            <div class="col-lg-2 mb-3">
                                <label for="discount">Discount:</label>
                                <input type="text" id="discount" class="form-control" name="discount" value="0">
                            </div>
                            <div class="col-lg-3 mb-3">
                                <label for="total">Total:</label>
                                <input type="text" id="total" class="form-control" disabled>
                            </div>
                            <div class="col-lg-4 mb-3">
                                <label for="assignto">Assign to:</label>
                                <select name="assignto" id="assignto" class="form-control select2">
                                    <option>Choose driver</option>
                                    @foreach($drivers as $driver)
                                        <option value="{{$driver->id}}">{{$driver->name}}</option>
                                    @endforeach
                                </select>
                            </div>

                            <div class="col-lg-12 mb-3">
                                <label for="note">Note:</label>
                                <textarea class="form-control" id="note" name="note"></textarea>
                            </div>
                        </div>


                    </div>
                    <div class="kt-portlet__foot">
                        <div class="kt-form__actions">
                            <div class="row">
                                <div class="col-lg-6">
                                    <button type="button" class="btn red-btn btn-save">Save</button>
                                    <div class="loadingMask">
                                        <img src="{{asset('assets/images/loader.gif')}}" alt="">
                                    </div>
                                </div>

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

    </div>

    <!-- end:: Content -->

    <!--begin::Modal-->


    <!--end::Modal-->
@endsection
@section('js')
    <script src="{{asset('assets/js/demo1/pages/crud/forms/widgets/select2.js')}}" type="text/javascript"></script>
    <script>
        $(document).ready(function () {




            var products_price = 0;

            var  public_delivery_fee = 0;

            var userSearch = function () {
                $('#userSearch').click(function () {
                    if ( $('#inputSearch').val() != '') {
                        var inputSearch = $('#inputSearch').val();

                        var _token = $('input[name="_token"]').val();
                        $.ajax({
                            url: "{{route('users.getUser')}}",
                            method: "POST",
                            data: {user: inputSearch, _token: _token},
                            success: function (result) {

                             alert(result);
                                $('#user').val(result["id"]);
                                $('#name').val(result["name"]);
                                $('#phone').val(result["phone"]);
                                $('#address').val(result["address"]);
                            }


                        })
                    }
                });


            };
            userSearch();
            var quantity = function () {

                $(".quantity").on('keyup', function () {

                    var products_ex_price = 0;
                    var price = 0,
                        qnty = 0,
                        total = 0;
                    $('.products :selected').each(function() {
                        price = $(this).data("price");
                        products_price += price;
                        qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                        total += parseInt(qnty) * parseFloat(price);
                    });
                    $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                        products_ex_price += $(itema).data("price");
                    });
                    if ($('#exchangeable').is(':checked')) {
                        products_ex_price = products_ex_price;
                    } else {
                        products_ex_price = 0;
                    }
                    var delivery_fee = $('#delivery_fee').val();
                    var discount = $('#discount').val();
                    var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                    var payment = $("input[name='payment_type']:checked").val();
                    var processing_fee = 0;
                    if(payment == "Master" || payment == "Visa"){
                        processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                        total_total =  total_total + processing_fee;
                    }
                    $("#processing_fee").val(processing_fee);
                    $("#total").val(total_total);

                })
            };

            quantity();

            $("input[name='payment_type']").on('change', function (e) {
                var payment = $("input[name='payment_type']:checked").val();

                if (payment == "PayPal") {
                    $('.paypal').show();
                    $('.western').hide();
                } else if (payment == "Western Union") {
                    $('.paypal').hide();
                    $('.western').show();
                } else {
                    $('.paypal').hide();
                    $('.western').hide();
                }

                if(payment == "Master" || payment == "Visa"){
                    $('.delivery_fee').val(0);
                    var products_ex_price = 0;
                    var delivery_fee = $('#delivery_fee').val();
                    var discount = $('#discount').val();
                    var price = 0,
                        qnty = 0,
                        total = 0;
                    $('.products :selected').each(function() {
                        price = $(this).data("price");
                        products_price += price;
                        qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                        total += parseInt(qnty) * parseFloat(price);
                    });
                    $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                        products_ex_price += $(itema).data("price");
                    });
                    if ($('#exchangeable').is(':checked')) {
                        products_ex_price = products_ex_price;
                    } else {
                        products_ex_price = 0;
                    }

                    var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;

                       var processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                       var final_total = total_total + processing_fee;

                       $("#processing_fee").val(processing_fee);
                       $("#total").val(final_total);

                }
                else{
                    $('.delivery_fee').val(public_delivery_fee);
                    var products_ex_price = 0;
                    var delivery_fee = $('#delivery_fee').val();
                    var discount = $('#discount').val();
                    var price = 0,
                        qnty = 0,
                        total = 0;
                    $('.products :selected').each(function() {
                        price = $(this).data("price");
                        products_price += price;
                        qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                        total += parseInt(qnty) * parseFloat(price);
                    });
                    $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                        products_ex_price += $(itema).data("price");
                    });
                    if ($('#exchangeable').is(':checked')) {
                        products_ex_price = products_ex_price;
                    } else {
                        products_ex_price = 0;
                    }
                    var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                    var processing_fee = 0;

                    $("#processing_fee").val(processing_fee);

                    $("#total").val(total_total);
                }
            });


            var change_product = function () {
                $(".products").on('change', function (e) {
                    var products_price = 0,
                        products_ex_price = 0,
                        price = 0,
                        total = 0,
                        totalPrice = 0,
                        qnty = 0;
                    $('.products :selected').each(function() {
                        price = $(this).data("price");
                        products_price += price;
                        qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                        total += parseInt(qnty) * parseFloat(price);
                    });
                    $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                        products_ex_price += $(itema).data("price");
                    });
                    if ($('#exchangeable').is(':checked')) {
                        products_ex_price = products_ex_price;
                    } else {
                        products_ex_price = 0;
                    }
                    var delivery_fee = $('#delivery_fee').val();
                    var discount = $('#discount').val();

                    var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;

                    var payment_type = $("input[name='payment_type']:checked").val();
                    var processing_fee = 0;

                    if(payment_type == "Master" || payment_type == "Visa"){
                        processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                        total_total =  total_total + processing_fee;
                    }
                    $("#processing_fee").val(processing_fee);
                    $("#total").val(total_total);
                });
            }
            change_product();

            $("#exchangeable_products").on('change', function (e) {
                //var products_price = 0;
                var products_ex_price = 0,
                    price = 0,
                    qnty = 0,
                    total = 0;
                $('.products :selected').each(function() {
                    price = $(this).data("price");
                    products_price += price;
                    qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                    total += parseInt(qnty) * parseFloat(price);
                });
                $.each($(this).find(":selected"), function (j, itema) {
                    products_ex_price += $(itema).data("price");
                });
                if ($('#exchangeable').is(':checked')) {
                    products_ex_price = products_ex_price;
                } else {
                    products_ex_price = 0;
                }
                var delivery_fee = $('#delivery_fee').val();
                var discount = $('#discount').val();
                var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                var payment = $("input[name='payment_type']:checked").val();
                var processing_fee = 0;
                if(payment == "Master" || payment == "Visa"){
                    processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                    total_total =  total_total + processing_fee;
                }
                $("#processing_fee").val(processing_fee);
                $("#total").val(total_total);
            });
            $('#exchangeable').on('change', function (e) {
                //var products_price = 0;
                var products_ex_price = 0;
                var delivery_fee = $('#delivery_fee').val();
                var discount = $('#discount').val();
                var price = 0,
                    qnty = 0,
                    total = 0;
                $('.products :selected').each(function() {
                    price = $(this).data("price");
                    products_price += price;
                    qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                    total += parseInt(qnty) * parseFloat(price);
                });
                $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                    products_ex_price += $(itema).data("price");
                });
                if ($(this).is(':checked')) {
                    $('#exchangeable_products').prop("disabled", false);
                    products_ex_price = products_ex_price;

                } else {
                    $('#exchangeable_products').prop("disabled", true);
                    products_ex_price = 0;
                }
                var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                var payment = $("input[name='payment_type']:checked").val();
                var processing_fee = 0;
                if(payment == "Master" || payment == "Visa"){
                    processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                    total_total =  total_total + processing_fee;
                }
                $("#processing_fee").val(processing_fee);
                $("#total").val(total_total);
            });
            $('#delivery_fee').on('keyup', function (e) {
                //  var products_price = 0;
                var products_ex_price = 0;
                var delivery_fee = $(this).val();
                public_delivery_fee =  delivery_fee;
                var discount = $('#discount').val();
                var price = 0,
                    qnty = 0,
                    total = 0;
                $('.products :selected').each(function() {
                    price = $(this).data("price");
                    products_price += price;
                    qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                    total += parseInt(qnty) * parseFloat(price);
                });
                $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                    products_ex_price += $(itema).data("price");
                });
                if ($('#exchangeable').is(':checked')) {
                    products_ex_price = products_ex_price;
                } else {
                    products_ex_price = 0;
                }
                var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                var payment = $("input[name='payment_type']:checked").val();
                var processing_fee = 0;
                if(payment == "Master" || payment == "Visa"){
                    processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                    total_total =  total_total + processing_fee;
                }
                $("#processing_fee").val(processing_fee);
                $("#total").val(total_total);
            });
            $('#discount').on('keyup', function (e) {
                //  var products_price = 0;
                var products_ex_price = 0;
                var discount = $(this).val();
                var delivery_fee = $('#delivery_fee').val();
                public_delivery_fee =  delivery_fee;
                var price = 0,
                    qnty = 0,
                    total = 0;
                $('.products :selected').each(function() {
                    price = $(this).data("price");
                    products_price += price;
                    qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                    total += parseInt(qnty) * parseFloat(price);
                });
                $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                    products_ex_price += $(itema).data("price");
                });
                if ($('#exchangeable').is(':checked')) {
                    products_ex_price = products_ex_price;
                } else {
                    products_ex_price = 0;
                }
                var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                var payment = $("input[name='payment_type']:checked").val();
                var processing_fee = 0;
                if(payment == "Master" || payment == "Visa"){
                    processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                    total_total =  total_total + processing_fee;
                }
                $("#processing_fee").val(processing_fee);
                $("#total").val(total_total);
            });
            $('.city').change(function () {
                if ($(this).find(':selected').attr('data-id') != '') {
                    var select = $(this).attr("id");
                    var value = $(this).find(':selected').attr('data-id');
                    var dependent = $(this).data('dependent');
                    var _token = $('input[name="_token"]').val();
                    $.ajax({
                        url: "{{route('getDistrict')}}",
                        method: "POST",
                        data: {select: select, value: value, _token: _token, dependent: dependent},
                        success: function (result) {
                            $('#' + dependent).html(result);
                            var d_price = (($('#district').find(':selected').data('price')));
                            var d_time = (($('#district').find(':selected').data('time')));

                            public_delivery_fee =  d_price;
                            var payment = $("input[name='payment_type']:checked").val();
                            if(payment == "Master" || payment == "Visa") {
                                d_price = 0;
                            }
                            $('.delivery_fee').val(d_price);
                            $('.delivery_time').val(d_time);

                            // var products_price = 0;
                            var products_ex_price = 0;
                            var delivery_fee = $('#delivery_fee').val();

                            var price = 0,
                                qnty = 0,
                                total = 0;
                            $('.products :selected').each(function() {
                                price = $(this).data("price");
                                products_price += price;
                                qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                                total += parseInt(qnty) * parseFloat(price);
                            });
                            $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                                products_ex_price += $(itema).data("price");
                            });
                            if ($('#exchangeable').is(':checked')) {
                                products_ex_price = products_ex_price;
                            } else {
                                products_ex_price = 0;
                            }
                            var discount = $('#discount').val();

                            var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                            var payment = $("input[name='payment_type']:checked").val();
                            var processing_fee = 0;
                            if(payment == "Master" || payment == "Visa"){
                                 processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                                total_total =  total_total + processing_fee;
                            }
                            $("#processing_fee").val(processing_fee);
                            $("#total").val(total_total);
                        }

                    })
                }
            });
            $('#district').change(function () {
                var d_price = (($(this).find(':selected').data('price')));
                var d_time = (($(this).find(':selected').data('time')));
                public_delivery_fee =  d_price;
                var payment = $("input[name='payment_type']:checked").val();
                if(payment == "Master" || payment == "Visa") {
                    d_price = 0;
                }
                $('.delivery_fee').val(d_price);
                $('.delivery_time').val(d_time);
                var products_ex_price = 0;
                var delivery_fee = $('#delivery_fee').val();

                var price = 0,
                    qnty = 0,
                    total = 0;
                $('.products :selected').each(function() {
                    price = $(this).data("price");
                    products_price += price;
                    qnty = $(this).parent().parent().parent().parent().find('.quantity').val();
                    total += parseInt(qnty) * parseFloat(price);
                });
                $.each($('#exchangeable_products').find(":selected"), function (j, itema) {
                    products_ex_price += $(itema).data("price");
                });
                if ($('#exchangeable').is(':checked')) {
                    products_ex_price = products_ex_price;
                } else {
                    products_ex_price = 0;
                }
                var discount = $('#discount').val();
                var total_total =  ((total - parseFloat(products_ex_price)) + parseInt(delivery_fee)) - discount;
                var payment = $("input[name='payment_type']:checked").val();
                var processing_fee = 0;
                if(payment == "Master" || payment == "Visa"){
                    processing_fee = Math.round((total_total * 25 / 1000)*100)/100;

                    total_total =  total_total + processing_fee;
                }
                $("#processing_fee").val(processing_fee);
                $("#total").val(total_total);


            });

            var create_order = function () {
                $('.btn-save').on("click", function () {
                    $(".loadingMask").css('display', 'inline-block');

                    $(".loadingMask").css('display', 'inline-block');

                    $.ajax({
                        method: "post",
                        beforeSend: function () {
                            $(".loadingMask").css('display', 'inline-block');
                        },
                        url: "{{route('orders.store')}}",

                        data:
                            new FormData($("#order_form")[0])
                        ,
                        headers: {
                            'X-CSRF-TOKEN': $('input[name="_token"]').val()
                        },
                        async: true,
                        processData: false,
                        contentType: false,
                        success: function (data) {
                            //  wait.resolve();
                            $(".loadingMask").css('display', 'none');
                            if (data.errors) {
                                $('.error-alert p').remove();
                                $('.error-alert').show();
                                jQuery.each(data.errors, function (key, value) {
                                    $('.error-alert').append('<p>' + value + '</p>');
                                    $("body, html").animate({scrollTop: 0}, 100);
                                });
                            } else {
                                $('.error-alert p').remove();
                                $('.error-alert').hide();
                                swal.fire({
                                    type: 'success',
                                    title: 'Added successfully',
                                    confirmButtonText: 'Ok!',
                                }).then(function (result) {
                                    if (result.value) {
                                        window.location = "{{route('orders.index')}}"
                                    }
                                });
                            }
                        },
                        error: function () {
                            $(".loadingMask").css('display', 'none');
                            alert("Error, Please try again");
                        }
                    });


                });
            };
            $('.new-row').on('click', function () {

                $('.new-product').append(` <div class="row">


                                <div class="col-md-5">
                                    <div class="form-group m-form__group">
                                        <label for="" class="">Product</label>
                                        <select name="products[]" id="" class="form-control m-input m-select2 products"
                                                data-dependent="product-details">
                                            <option value="">Select Product</option>
                                            @foreach($products as $product)
                    <option data-price="{{$product->price}}"
                                                        value="{{$product->id}}">{{'('. $product->id .') '.$product->name .' ('. $product->price .'JD) -'.$product->category[0]->name }}</option>
                                            @endforeach
                    </select>
                </div>
            </div>
            <div class="col-md-3">
                <div class="form-group m-form__group">
                <label for="quantity">Quntity:</label>
                <input type="text" id="quantity" class="form-control quantity" name="quantity[]" required>
                <input type="hidden" id="price" class="form-control" value="0">
                </div>
            </div>
            <div class="col-md-1">
                <div class="form-group m-form__group">
                    <button type="button" class="btn remove-row"><i class="flaticon-delete"></i></button>
                </div>
            </div>
        </div>`);
             $('.m-select2').select2();

                remove_row();
                change_product();
                quantity();

            });
            var remove_row = function () {
                $('.remove-row').on('click', function () {
                    $(this).parent().parent().parent().remove();
                })
            };
            create_order();

            var user_change = function () {
                $('#user').change(function () {
                    var name = (($(this).find(':selected').data('name')));
                    var phone = (($(this).find(':selected').data('phone')));
                    var address = (($(this).find(':selected').data('address')));
                    var city = (($(this).find(':selected').data('phone')));
                    var district = (($(this).find(':selected').data('address')));
                    $('#name').val(name);
                    $('#phone').val(phone);
                    $('#address').val(address);
                    $('#city').val(city);
                    $('#district').val(district);

                });


            };
            user_change();


        });


    </script>
@endsection