@extends('layouts.admin')
@section('header-content')
    <style>
        .image-height{
            border: solid;
            height: 140px;
        }
    </style>
@endsection
@section('content')
            <div class="container-detached">
                <div class="content-detached">
                    <!-- Tab content -->
                    <div class="tab-content">
                        <div class="tab-pane fade in active" id="profile">
                            <!-- Item Details -->
                            <div class="panel panel-flat">
                                <div class="panel-heading">
                                    <h6 class="panel-title">Order Details</h6>
                                    <div class="heading-elements">
                                        <ul class="icons-list">
                                            <li><a data-action="collapse"></a></li>
                                        </ul>
                                    </div>
                                </div>

                                <div class="panel-body">
                                    <form method="POST"
                                          action="{{ url('orders'.(empty($order) ? '': '/' . $order->id)) }}"
                                          enctype="multipart/form-data">
                                        {!! csrf_field() !!}
                                         <div class="row">
                                             <div class="col-md-4 col-sm-4">
                                                 <div class="form-group {{ $errors->has('booked_by') ? ' has-error' : '' }}">
                                                     <label>Booked By</label>
                                                     <select class="select-search" name="booked_by" id="booked_by">
                                                         @foreach($users as $user)
                                                             <option value="{{$user->id}}" @if (old('booked_by') == $user->id || isset($order) && $order->booked_by==$user->id) selected="selected" @endif
                                                             >{{$user->firstname.' '.$user->lastname}}
                                                             </option>
                                                         @endforeach
                                                     </select>
                                                     @if ($errors->has('booked_by'))
                                                         <span class="help-block"><strong>{{ $errors->first('booked_by') }}</strong></span>
                                                     @endif
                                                 </div>
                                             </div>
                                             <input type="hidden" name="country_id" id="country_id" value="0" >
                                             <div class="col-md-4 col-sm-4">
                                                 <div class="form-group {{ $errors->has('shop') ? ' has-error' : '' }}">
                                                     <label>Customer</label>
                                                     <select class="select-search" name="shop" id="shop" disabled>

                                                     </select>
                                                     <input type="hidden" id="old_customer" value="{{ @$order->shop_id}}">
                                                     @if ($errors->has('shop'))
                                                         <span class="help-block"><strong>{{ $errors->first('shop') }}</strong></span>
                                                     @endif
                                                 </div>
                                             </div>
                                             <div class="col-md-4 col-sm-4">
                                                 <div class="form-group {{ $errors->has('price') ? ' has-error' : '' }}">
                                                     <label>Price <span class="text-danger">*</span></label>
                                                     <input type="text" name="price" value="{{old('price', @$order->price)}}" id="price" placeholder="Price" class="form-control">
                                                     @if ($errors->has('price'))
                                                         <span class="help-block"><strong>{{ $errors->first('price') }}</strong></span>
                                                     @endif
                                                 </div>
                                             </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group {{ $errors->has('discount') ? ' has-error' : '' }}">
                                                    <label>Discount</label>
                                                    <input type="text" name="discount" value="{{old('discount', @$order->discount)}}" id="discount2" placeholder="Discount" class="form-control">
                                                    @if ($errors->has('discount'))
                                                        <span class="help-block"><strong>{{ $errors->first('discount') }}</strong></span>
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group {{ $errors->has('payment') ? ' has-error' : '' }}">
                                                    <label>Payment <span class="text-danger">*</span></label>
                                                    <input type="text" name="payment" value="{{old('payment', @$order->payment)}}" id="payment" placeholder="Payment" class="form-control">
                                                    @if ($errors->has('payment'))
                                                        <span class="help-block"><strong>{{ $errors->first('payment') }}</strong></span>
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group {{ $errors->has('date_to_deliver') ? ' has-error' : '' }}">
                                                    <label>Delivery Date <span class="text-danger">*</span></label>
                                                    <input type="date" name="date_to_deliver" value="{{old('date_to_deliver', @$order->date_to_deliver)}}" placeholder="Delivery Date" class="form-control">
                                                    @if ($errors->has('date_to_deliver'))
                                                        <span class="help-block"><strong>{{ $errors->first('date_to_deliver') }}</strong></span>
                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-4 col-sm-4">
                                                <label>Delivery Time</label>
                                                <div class="input-group bootstrap-timepicker timepicker">
                                                    <input id="timepicker1" type="text" name="delivery_time" value="{{old('date_to_deliver', @$order->delivery_time)}}" class="form-control input-small">
                                                    <span class="input-group-addon"><i class="glyphicon glyphicon-time"></i></span>
                                                </div>
                                            </div>
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group">
                                                    <label>Type</label>
                                                    <select class="select" name="type">
                                                        <option value="Query" {{ old('type', @$order->type) == 'Query' ? 'selected="selected"':'' }}>
                                                            Query
                                                        </option>
                                                        <option value="Cash" {{ old('type', @$order->type) == 'Cash' ? 'selected="selected"':'' }}>
                                                            Cash
                                                        </option>
                                                        <option value="Credit" {{ old('type', @$order->type) == 'Credit' ? 'selected="selected"':'' }}>
                                                            Credit
                                                        </option>
                                                        <option value="Sample" {{ old('type', @$order->type) == 'Sample' ? 'selected="selected"':'' }}>
                                                            Sample
                                                        </option>
                                                    </select>
                                                </div>
                                            </div>
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group">
                                                    <label>Status</label>
                                                    <select class="select" name="status">
                                                        <option value="Booked" {{ old('status', @$order->status) == 'Booked' ? 'selected="selected"':'' }}>
                                                            Booked
                                                        </option>
                                                        <option value="Confirmed" {{ old('status', @$order->status) == 'Confirmed' ? 'selected="selected"':'' }}>
                                                            Confirmed
                                                        </option>
                                                        <option value="Processed" {{ old('status', @$order->status) == 'Processed' ? 'selected="selected"':'' }}>
                                                            Processed
                                                        </option>
                                                        <option value="Ready" {{ old('status', @$order->status) == 'Ready' ? 'selected="selected"':'' }}>
                                                            Ready
                                                        </option>
                                                        <option value="Delivered" {{ old('status', @$order->status) == 'Delivered' ? 'selected="selected"':'' }}>
                                                            Delivered
                                                        </option>
                                                        <option value="Cleared" {{ old('status', @$order->status) == 'Cleared' ? 'selected="selected"':'' }}>
                                                            Cleared
                                                        </option>
                                                        <option value="Rejected" {{ old('status', @$order->status) == 'Rejected' ? 'selected="selected"':'' }}>
                                                            Rejected
                                                        </option>
                                                        <option value="Cancelled" {{ old('status', @$order->status) == 'Cancelled' ? 'selected="selected"':'' }}>
                                                            Cancelled
                                                        </option>
                                                        <option value="Returned" {{ old('type', @$order->type) == 'Returned' ? 'selected="selected"':'' }}>
                                                            Returned
                                                        </option>
                                                    </select>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group {{ $errors->has('latitude') ? ' has-error' : '' }}">
                                                    <label>Latitude</label>
                                                    <input type="text" name="latitude" value="{{old('latitude', @$order->latitude)}}" placeholder="Latitude" class="form-control">
                                                    @if ($errors->has('latitude'))
                                                        <span class="help-block"><strong>{{ $errors->first('latitude') }}</strong></span>
                                                    @endif
                                                </div>
                                            </div>
                                            <div class="col-md-4 col-sm-4">
                                                <div class="form-group {{ $errors->has('longitude') ? ' has-error' : '' }}">
                                                    <label>Longitude</label>
                                                    <input type="text" name="longitude" value="{{old('longitude', @$order->longitude)}}" placeholder="Longitude" class="form-control">
                                                    @if ($errors->has('longitude'))
                                                        <span class="help-block"><strong>{{ $errors->first('longitude') }}</strong></span>
                                                    @endif
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row ">
                                            <div class="text-right">
                                                <button type="button" class="btn btn-primary btn-labeled" id="calculate_amount"><b><i class="icon-paperplane"></i></b>Calculate Order Amount</button>
                                            </div>
                                        </div>
                                        <div class="row input_fields_wrap">
                                            <button type="button" class="btn bg-teal-400 btn-labeled btn-rounded add_field_button"><b><i class="icon-stack2"></i></b> Add Product</button>
                                            <br><br>
                                            <div class="col-md-12">
                                                <div  class="col-md-3 col-sm-3">
                                                    <label>Products</label>
                                                </div>
                                                <div  class="col-md-1 col-sm-1 ">

                                                </div>
                                                <div  class="col-md-2 col-sm-2">
                                                    <label>Quantity</label>
                                                </div>
                                                <div  class="col-md-2 col-sm-2">
                                                    <label>Actual Price (Dozen)</label>
                                                </div>
                                                <div  class="col-md-2 col-sm-2 scheme_pak" style="display: none">
                                                    <label>Scheme</label>
                                                </div>
                                                <div  class="col-md-2 col-sm-2 scheme_aed">
                                                    <label>Discount Price (Dozen)</label>
                                                </div>
                                                <div  class="col-md-2 col-sm-2">
                                                    <label>Action</label>
                                                </div>
                                            </div>
                                            @php    $old_product_categories=array(); @endphp
                                            @if(!empty($order))

                                                @foreach($order->products->toarray() as $key=>$value)
                                                    @php
                                                    if(isset($order->products[$key]->products)){
                                                     $is_scheme=$order->products[$key]->products->is_scheme;
                                                        $scheme_quantity=$order->products[$key]->products->scheme_quantity;
                                                        $scheme_free_quantity=$order->products[$key]->products->scheme_free_quantity;
                                                          if($is_scheme){
                                                              $scheme=$scheme_quantity.'+'.$scheme_free_quantity;
                                                          }else{
                                                              $scheme='No Scheme';
                                                          }

                                                    }
                                                    if(count($value['order_product_categories'])>0){
                                                    foreach ($value['order_product_categories'] as $index=>$category){
                                                    $old_product_categories[$key]['type'][$index]['id']=$category['id'];
                                                    $old_product_categories[$key]['type'][$index]['order_product_id']=$category['order_product_id'];
                                                    $old_product_categories[$key]['type'][$index]['product_category_id']=$category['product_category_id'];
                                                    $old_product_categories[$key]['type'][$index]['quantity']=$category['quantity'];
                                                    }}

                                                    @endphp

                                                    <div class="col-md-12">
                                                        <div  class="col-md-3 col-sm-3">
                                                            <div class="form-group">
                                                                <select class="select product" name="products[{{$key}}][product]" data-index="{{$key}}">
                                                                    @foreach($products as $item)
                                                                        <option @if ($value['product_id'] == $item->id) selected="selected" @endif value="{{$item->id}}"
                                                                        >{{$item->name}}
                                                                        </option>
                                                                    @endforeach
                                                                </select>
                                                            </div>
                                                        </div>
                                                        <div class="col-md-1 col-sm-1 "><button type="button" class="btn btn-default btn-xm facial{{$key}}" data-toggle="modal" data-target="#facial{{$key}}" @if($value['product_id']!=12)style="display: none;" @endif>+ </button></div>
                                                        <div  class="col-md-2 col-sm-2">
                                                            <div class="form-group">
                                                                <input type="hidden"  name="products[{{$key}}][id]" value="{{old('price', @$value['id'])}}"class="form-control">
                                                                <input type="number" min="1" name="products[{{$key}}][quantity]" value="{{old('price', @$value['quantity'])}}"class="form-control" @if($value['product_id']==12)style="display: none;" @endif>
                                                            </div>
                                                        </div>
                                                        <div class="col-md-2 col-sm-2"><input type="number" name="products[{{$key}}][actual_price]" value="{{old('price', @$value['product_actual_price'])}}" class="form-control actual_price{{$key}}" readonly @if($value['product_id']==12)style="display: none;" @endif></div>
                                                        <div class="col-md-2 col-sm-2 scheme_pak">
                                                            <input type="hidden"  name="products[{{$key}}][is_scheme]" value="{{$is_scheme}}" class="form-control is_scheme{{$key}}">
                                                            <input type="hidden" min="1"  name="products[{{$key}}][scheme_quantity]" value="{{$scheme_quantity}}" class="form-control scheme_quantity{{$key}}">
                                                            <input type="hidden" min="1"  name="products[{{$key}}][scheme_free_quantity]" value="{{$scheme_free_quantity}}" class="form-control scheme_free_quantity{{$key}}">
                                                            <input type="text" name="products[{{$key}}][scheme]" value="{{$scheme}}" class="form-control" ></div>
                                                        <div class="col-md-2 col-sm-2 scheme_aed"><input type="number" name="products[{{$key}}][discount_price]" value="{{old('price', @$value['product_discounted_price'])}}" class="form-control " ></div>
                                                        <div class="col-md-2 col-sm-2"><a href="#" class="remove_field">Remove</a></div>
                                                    </div>
                                                @endforeach
                                            @endif
                                            @if(!isset($key) || empty($key))
                                                                                            @endif
                                            <input type="hidden" id="package_item" value="{{$key+1}}">
                                            <div id="new_item">
                                            </div>
                                        </div>
                                        <div class="row input_fields_wrap2">
                                            <button type="button" class="btn bg-teal-400 btn-labeled btn-rounded add_field_button2"><b><i class="icon-stack2"></i></b> Add More Order Images</button>
                                            <br><br>
                                            @if(!empty($order))
                                                @foreach($order->OrderImages->toarray() as $key2=>$value)
                                                    <div class="">
                                                        <input type="hidden" name="old_images_id[{{$key2}}]" value="{{$value['id']}}">
                                                        <div class="col-md-4 col-sm-4 " align="center">
                                                            @if(isset($value['image']) && !empty($value['image']))
                                                                <img src="{{$value['image']}}" class="image-height" style="height: 150px;!important;"   alt=""><br>
                                                                <a href="#" class="remove_field2">Remove</a>
                                                            @endif
                                                        </div>
                                                    </div>
                                                @endforeach
                                            @endif
                                            @if(!isset($key2) || empty($key2))
                                                                                            @endif

                                            <input type="hidden" id="shop_image" value="{{$key2}}">
                                            <div id="new_item">
                                            </div>
                                        </div>
                                        <div class="model_popup">


                                        </div>
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="form-group">
                                                    <label>Remarks</label>
                                                    <textarea cols="10" rows="10" name="remarks" class="wysihtml5 wysihtml5-min form-control" placeholder="Enter Remarks ...">
                                                        {{old('remarks', @$order->remarks)}}
									               </textarea>
                                                </div>
                                            </div>
                                        </div>
                                        <input type="hidden" id="order_product_value">
                                        <div class="text-right">
                                            @if(!empty($order)) {!! method_field('PUT') !!} @endif
                                            {{ csrf_field() }}
                                            <button type="submit" class="btn btn-primary">
                                                @if(empty($order)) Save @else Update
                                                @endif  <i class="icon-arrow-right14 position-right"></i></button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                            <!-- /Item Details -->
                        </div>
                    </div>
                    <!-- /tab content -->

                </div>
            </div>
            <!-- /detached content -->
@endsection

@section('footer-content')
    <script>
        $(document).ready(function() {
            $('#booked_by').trigger("change");
        });
        $(document).ready(function() {
            setTimeout(function () {
                $('.product').trigger('change');
            }, 1000);
        });
    </script>
    <!-- Theme JS files -->
    <script type="text/javascript" src="{{asset('assets/js/core/libraries/jasny_bootstrap.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/forms/selects/select2.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/forms/styling/uniform.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/ui/moment/moment.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/ui/fullcalendar/fullcalendar.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/pages/form_select2.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/visualization/echarts/echarts.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/editors/wysihtml5/wysihtml5.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/editors/wysihtml5/toolbar.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/editors/wysihtml5/parsers.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/editors/wysihtml5/locales/bootstrap-wysihtml5.ua-UA.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/plugins/notifications/jgrowl.min.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/pages/editor_wysihtml5.js')}}"></script>
    <script type="text/javascript" src="{{asset('assets/js/pages/user_profile_tabbed.js')}}"></script>

    {{--Time Picker--}}
    <link href="{{asset('css/bootstrap-timepicker.min.css')}}" rel="stylesheet" />
    <script src="{{asset('js/bootstrap-timepicker.min.js')}}"></script>
    {{--End Time picker--}}
    <script type="text/javascript">
        $('#timepicker1').timepicker({
            showInputs: false,
            defaultTime: null
        });

    </script>
    <script>
        var old_product_categories = null;
    </script>
{{--Append Product--}}
    <script  type="text/javascript">
        $(document).ready(function() {
            var max_fields      = 40; //maximum input boxes allowed
            var wrapper         = $(".input_fields_wrap"); //Fields wrapper
            var add_button      = $(".add_field_button"); //Add button ID
//            var package_item = $('#package_item').val()+1;
            var x = 1; //initlal text box count
            $(add_button).click(function(e){ //on add input button click
                var shop = $('#shop').val();
                var product = $('#product').val();
                $('#package_item').val( function(i, oldval) {
                    return parseInt( oldval, 10) + 1;
                });

                e.preventDefault();
                $.ajax({
                    url: '{{url('/all-products/')}}',
                    type: 'GET',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    success: function (result) {
                        if(result.length >0) {
                            var package_item = parseInt($('#package_item').val());
                            var country_id = parseInt($('#country_id').val());
                            if(x < max_fields){ //max input box allowed
                                x++; //text box increment
                                if(country_id==1){
                                    $(wrapper).append('<div class="col-md-12 "><div  class="col-md-3 col-sm-3"><div class="form-group"><select class="select sub_item'+ package_item +' form-control product" name="products[' + package_item + '][product]" data-index="' + package_item + '"></select></div></div>' +
                                            '<div class="col-md-1 col-sm-1 "><button type="button" class="btn btn-default btn-xm facial' + package_item + '" data-toggle="modal" data-target="#facial' + package_item + '">+ </button></div>' +
                                            '<div  class="col-md-2 col-sm-2"><div class="form-group"> <input type="number" min="1" placeholder="Quantity" name="products[' + package_item + '][quantity]" value="1" class="form-control quantity'+ package_item +'"></div></div>' +
                                            '<div  class="col-md-2 col-sm-2"><div class="form-group"> <input type="number" min="1" placeholder="Actual price " name="products[' + package_item + '][actual_price]" class="form-control actual_price' + package_item + '" readonly></div></div>' +
                                            '<div  class="col-md-2 col-sm-2 scheme_pak"><div class="form-group"> <input type="hidden" min="1" placeholder="Discount Price (Optional)" name="products[' + package_item + '][is_scheme]" value="" class="form-control is_scheme'+ package_item +'">' +
                                            '<input type="hidden" min="1"  name="products[' + package_item + '][scheme_quantity]" value="" class="form-control scheme_quantity'+ package_item +'">' +
                                            '<input type="hidden" min="1"  name="products[' + package_item + '][scheme_free_quantity]" value="" class="form-control scheme_free_quantity'+ package_item +'">' +
                                            '<input type="text"    value="" class="form-control scheme'+ package_item +'" readonly></div></div><div class="col-md-2 col-sm-2"><a href="#" class="remove_field" ><input type="hidden"  class="remove_fieldd" value="'+ package_item +'">Remove</a></div></div>'); //add input box

                                    $('.model_popup').append('<div id="facial' + package_item + '" class="modal fade"></div>');
                                }else{
                                    $(wrapper).append('<div class="col-md-12"><div  class="col-md-3 col-sm-3"><div class="form-group"><select class="select sub_item'+ package_item +' form-control product" name="products[' + package_item + '][product]" data-index="' + package_item + '"></select></div></div>' +
                                            '<div class="col-md-1 col-sm-1 "><button type="button" class="btn btn-default btn-xm facial' + package_item + '" data-toggle="modal" data-target="#facial' + package_item + '">+ </button></div>' +
                                            '<div  class="col-md-2 col-sm-2"><div class="form-group quantityaed' + package_item + '"> <input type="number" min="1" placeholder="Quantity" name="products[' + package_item + '][quantity]" value="1" class="form-control"></div></div>' +
                                            '<div  class="col-md-2 col-sm-2"><div class="form-group"> <input type="number" min="1" placeholder="Actual price " name="products[' + package_item + '][actual_price]" class="form-control actual_price' + package_item + '" readonly></div></div>' +
                                            '<div  class="col-md-2 col-sm-2 scheme_aed"><div class="form-group schemee_aed"> <input type="number" min="1" placeholder="Discount Price (Optional)" name="products[' + package_item + '][discount_price]" class="form-control scheme_aed'+ package_item +' schemee_aed'+ package_item +'"></div></div><div class="col-md-2 col-sm-2"><a href="#" class="remove_field">Remove</a></div></div>'); //add input box
                                    $('.model_popup').append('<div id="facial' + package_item + '" class="modal fade"></div>');
                                }
                                   }
                        }
                        $('.sub_item'+ package_item)
                                .find('option')
                                .remove()
                                .end();
                        $(result).each(function (index, element) {

                            $('.sub_item'+ package_item).append(
                                    $('<option >', {value: element.id} ) .text(element.name)
                            );
                        });
                        $('.product').trigger('change');
                    },
                    error: function () {
                    }
                });
            });

            $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
                var val=parseInt($('.remove_fieldd').val());
                $('#facialmodel'+val).remove();
                e.preventDefault(); $(this).parent().parent('div').remove(); x--;
                $('#package_item').val( function(i, oldval) {
                    return parseInt( oldval, 10)- 1;
                });
            })
        });
        $(document).on("change", '.product', function () {
            var country_id=$('#country_id').val();
            var product =$(this).val();
            var id = $(this).data().index;
            var shop = $("#shop").val();
            $('.facial'+id).hide();
//            if( product==12){
            if(country_id==1 && product==12){
                $('.quantity'+id).hide();
                $('.actual_price'+id).hide();
                $('.is_scheme'+id).hide();
                $('.scheme_quantity'+id).hide();
                $('.scheme_free_quantity'+id).hide();
                $('.scheme'+id).hide();
                $('.facial'+id).show();
                $.ajax({
                    url: '{{url('/product-categories/')}}/'+product,
                    type: 'GET',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    success: function (data) {

                        if ($('#facial'+id).length==0)
                        {
                            $('.model_popup').append('<div id="facial' + id + '" class="modal fade"></div>');
                        }
                        if ($('#facialmodel'+id).length==0)
                        {
                            $('#facial'+id).append('<div class="modal-dialog" id="facialmodel'+id+'"><div class="modal-content"><div class="modal-header"><h1 class="modal-title"></h1></div>' +
                                    '<div class="modal-body"> <div class="table-responsive"><table class="table table-bordered table-framed table-hover"><thead><tr><th>Name</th><th>Quantity</th><th>Price (Dozen)</th></tr></thead > <tbody id="facialtable'+id+'"> </tbody>' +
                                    '</div><div class="modal-footer"></div></div></div>');
                            $(data).each(function (index, element) {
                                var type_old_id=0;
                                var type_quantity=null;

                                if(typeof old_product_categories[id] !='undefined' && old_product_categories[id]['type']){
                                    $(old_product_categories[id]['type']).each(function (index2, element2) {
                                        if(element.id==element2.product_category_id){
                                            type_quantity=element2.quantity;
                                            type_old_id=element2.id;
                                            return false;
                                        }
                                        type_quantity=null;
                                        type_old_id=0;
                                    });
                                }
                               $('#facialtable'+id).append('<tr>'+index+'<td><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][old_id]" value="'+type_old_id+'"><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][id]" value="'+element.id+'">'+element.name+'</td><td><input type="number" class="form-control" name="products[' + id + '][type]['+index+'][quantity]" value="'+type_quantity+'"></td><td><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][price]" value="'+12*(element.product_prices[0].retail_price)+'"> '+12*(element.product_prices[0].retail_price)+'</td> </tr>');
                            });
                        }
                    },
                    error: function () {
                    }
                });
            }else if(product==12){
                $('.quantity'+id).hide();
                $('.actual_price'+id).hide();
                $('.is_scheme'+id).hide();
                $('.scheme_quantity'+id).hide();
                $('.scheme_free_quantity'+id).hide();
                $('.scheme'+id).hide();
                $('.schemee_aed'+id).hide();
                $('.quantityaed'+id).hide();
                $('.facial'+id).show();
                $.ajax({
                    url: '{{url('/product-categories/')}}/'+product,
                    type: 'GET',
                    contentType: 'application/json; charset=utf-8',
                    dataType: 'json',
                    success: function (data) {

                        if ($('#facial'+id).length==0)
                        {
                            $('.model_popup').append('<div id="facial' + id + '" class="modal fade"></div>');
                        }
                        if ($('#facialmodel'+id).length==0)
                        {
                            $('#facial'+id).append('<div class="modal-dialog" id="facialmodel'+id+'"><div class="modal-content"><div class="modal-header"><h1 class="modal-title"></h1></div>' +
                                    '<div class="modal-body"> <div class="table-responsive"><table class="table table-bordered table-framed table-hover"><thead><tr><th>Name</th><th>Quantity</th><th>Price (Dozen)</th></tr></thead > <tbody id="facialtable'+id+'"> </tbody>' +
                                    '</div><div class="modal-footer"></div></div></div>');
                            $(data).each(function (index, element) {
                                var type_old_id=0;
                                var type_quantity=null;
                                if(typeof old_product_categories[id] !='undefined' && old_product_categories[id]['type']){
                                    $(old_product_categories[id]['type']).each(function (index2, element2) {
                                        if(element.id==element2.product_category_id){
                                            type_quantity=element2.quantity;
                                            type_old_id=element2.id;
                                            return false;
                                        }
                                        type_quantity=null;
                                        type_old_id=0;
                                    });
                                }
                               $('#facialtable'+id).append('<tr>'+index+'<td><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][old_id]" value="'+type_old_id+'"><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][id]" value="'+element.id+'">'+element.name+'</td><td><input type="number" class="form-control" name="products[' + id + '][type]['+index+'][quantity]" value="'+type_quantity+'"></td><td><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][price]" value="'+12*(element.product_prices[0].retail_price)+'"> '+12*(element.product_prices[0].retail_price)+'</td></tr>');
//                               $('#facialtable'+id).append('<tr>'+index+'<td><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][old_id]" value="'+type_old_id+'"><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][id]" value="'+element.id+'">'+element.name+'</td><td><input type="number" class="form-control" name="products[' + id + '][type]['+index+'][quantity]" value="'+type_quantity+'"></td><td><input type="hidden" class="form-control" name="products[' + id + '][type]['+index+'][price]" value="'+12*(element.product_prices[0].retail_price)+'"> '+12*(element.product_prices[0].retail_price)+'</td><td ><input style="width: 100px;" type="number" class="form-control" name="products[' + id + '][type]['+index+'][discount_price]"]" ></td> </tr>');
                            });
                        }
                    },
                    error: function () {
                    }
                });
            }else{
                $('.quantity'+id).show();
                $('.actual_price'+id).show();
                $('.is_scheme'+id).show();
                $('.scheme_quantity'+id).show();
                $('.scheme_free_quantity'+id).show();
                $('.scheme'+id).show();
                $('.facial'+id).show();
                $.ajax({
                    url: '{{url('/product-with-customer-price/')}}/',
                    type: 'GET',
                    contentType: 'application/json; charset=utf-8',
                    data:{"shop_id":shop,"product_id":product},
                    dataType: 'json',
                    success: function (data) {
                        $('.actual_price'+id).val(data.actual_price);
                        $('.is_scheme'+id).val(data.is_scheme);
                        $('.scheme_quantity'+id).val(data.scheme_quantity);
                        $('.scheme_free_quantity'+id).val(data.scheme_free_quantity);
                        $('.scheme'+id).val(data.scheme);
                    },
                    error: function () {
                    }
                });
            }
        });
        $(document).on("change", '#booked_by', function () {
            var id =$(this).val();
            $.ajax({
                url: '{{url('/sales_officer_customers/')}}/'+id,
                type: 'GET',
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',
                success: function (data) {
                    $inputValues = $("#old_customer").val();
                    $('#shop')
                            .find('option')
                            .remove()
                            .end();
                    $(data.shops).each(function (index, element) {
                        $('#shop').removeAttr("disabled")
                        $('#shop').append(
                                $('<option >', {value: element.id} ) .text(element.name)
                        );
                        if (element.id == $inputValues) {
                            $("#shop option[value='" + $inputValues + "']").prop("selected", "selected");
                        }
                    });
                    if(data.country==1){
                        $('#country_id').val(1);
                        $('.scheme_aed').hide();
                        $('.scheme_pak').show();
                    }else{
                        $('#country_id').val(0);
                        $('.scheme_aed').show();
                        $('.scheme_pak').hide();
                    }
                },
                error: function () {
                }

            });
        });
        $(document).on("click", '#calculate_amount', function () {
            var cal=[];
            var a=0;
            var b=0;
            var quantity;
            var actual_price;
            var discount_price;
            var is_scheme;
            var scheme_quantity;
            var scheme_free_quantity;
            var type_id;
            var type_quantity=0;
            var type_price;
            var country_id=$('#country_id').val();
            if(country_id==1){
                for(var x=0;x<50;x++){
                    $('input[name^="products['+x+']"]').each(function(index,value) {
                        if ($(this).attr('name').indexOf('products['+x+']') > -1) {
                            if($(this).attr('name').indexOf('products['+x+'][quantity]') > -1){
                                cal[x]={};
                                cal[x]["quantity"]=parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][actual_price]') > -1){
                                cal[x]['actual_price']=parseFloat($(this).val())/12;
                            }
                            if($(this).attr('name').indexOf('products['+x+'][is_scheme]') > -1){
                                cal[x]['is_scheme']=parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][scheme_quantity]') > -1){
                                cal[x]['scheme_quantity']=parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][scheme_free_quantity]') > -1){
                                cal[x]['scheme_free_quantity']= parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][type][0][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][1][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][2][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][3][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][4][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][5][id]') > -1 ||  $(this).attr('name').indexOf('products['+x+'][type][6][id]') > -1){
                            }
                            if(($(this).attr('name').indexOf('products['+x+'][type][0][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][1][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][2][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][3][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][4][quantity]') > -1 )|| ($(this).attr('name').indexOf('products['+x+'][type][5][quantity]') > -1) || ( $(this).attr('name').indexOf('products['+x+'][type][6][quantity]') > -1) ){
                                if($(this).val()!='' )
                                    type_quantity=parseInt($(this).val())+type_quantity;
                                cal[x]['quantity']=  type_quantity
                            }
                            if($(this).attr('name').indexOf('products['+x+'][type][0][price]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][1][price]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][2][price]') > -1  || $(this).attr('name').indexOf('products['+x+'][type][3][price]') > -1  || $(this).attr('name').indexOf('products['+x+'][type][4][price]') > -1  || $(this).attr('name').indexOf('products['+x+'][type][5][price]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][6][price]') > -1 ){
                                cal[x]['actual_price']= parseInt($(this).val())/12;
                            }
                        }
                    });
                }
                var total_order_price=0;
                cal.forEach(function(item) {
                    if( item.quantity &&  item.actual_price && item.quantity!='' && item.actual_price!=''){
                        var main_quantity=parseInt(item.quantity);
                        total_order_price= parseInt(total_order_price)+(parseInt(main_quantity)* parseFloat(item.actual_price))
                    }
                });
                $("#price").val(total_order_price);
                $("#payment").val(total_order_price);
            }else{
//                $('input[name^="products"]').each(function() {
//                    if ($(this).attr('name').indexOf('id') == -1) {
//                        if (a === 0) {
//                            a = 1;
//                            quantity = parseInt($(this).val());
//                        } else if (a === 1) {
//                            a = 2;
//                            actual_price = parseFloat($(this).val());
//                        } else if (a === 2) {
//                            a = 0;
//                            discount_price = parseInt($(this).val());
//                            cal.push({
//                                "quantity": quantity,
//                                "actual_price": actual_price/12,
//                                "discount_price": discount_price
//                            });
//                        }
//                    }
//                });
                for(var x=0;x<50;x++){
                    $('input[name^="products['+x+']"]').each(function(index,value) {
                        if ($(this).attr('name').indexOf('products['+x+']') > -1) {
                            if($(this).attr('name').indexOf('products['+x+'][quantity]') > -1){
                                cal[x]={};
                                cal[x]["quantity"]=parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][actual_price]') > -1){
                                cal[x]['actual_price']=parseFloat($(this).val())/12;
                            }

                            if($(this).attr('name').indexOf('products['+x+'][discount_price]') > -1){
                                cal[x]['discount_price']=parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][scheme_free_quantity]') > -1){
                                cal[x]['scheme_free_quantity']= parseInt($(this).val());
                            }
                            if($(this).attr('name').indexOf('products['+x+'][type][0][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][1][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][2][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][3][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][4][id]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][5][id]') > -1 ||  $(this).attr('name').indexOf('products['+x+'][type][6][id]') > -1){
                            }
                            if(($(this).attr('name').indexOf('products['+x+'][type][0][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][1][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][2][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][3][quantity]') > -1) || ($(this).attr('name').indexOf('products['+x+'][type][4][quantity]') > -1 )|| ($(this).attr('name').indexOf('products['+x+'][type][5][quantity]') > -1) || ( $(this).attr('name').indexOf('products['+x+'][type][6][quantity]') > -1) ){
                                if($(this).val()!='' )
                                    type_quantity=parseInt($(this).val())+type_quantity;
                                cal[x]['quantity']=  type_quantity
                            }
                            if($(this).attr('name').indexOf('products['+x+'][type][0][price]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][1][price]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][2][price]') > -1  || $(this).attr('name').indexOf('products['+x+'][type][3][price]') > -1  || $(this).attr('name').indexOf('products['+x+'][type][4][price]') > -1  || $(this).attr('name').indexOf('products['+x+'][type][5][price]') > -1 || $(this).attr('name').indexOf('products['+x+'][type][6][price]') > -1 ){
                                cal[x]['actual_price']= parseInt($(this).val())/12;
                            }
                        }
                    });
                }
                var total_order_price=0;
                console.log(cal);
                cal.forEach(function(item) {
                    if( item.quantity &&  item.actual_price && item.quantity!='' && item.actual_price!=''){
                        if(item.discount_price && item.discount_price!=''){
                            total_order_price=parseInt(total_order_price)+(parseInt(item.quantity)* parseFloat(item.discount_price))
                        }else{
                            total_order_price= parseInt(total_order_price)+(parseInt(item.quantity)* parseFloat(item.actual_price))
                        }
                    }
                });
                $("#price").val(total_order_price);
                $("#payment").val(total_order_price);
            }

        });
    </script>
    <script>
        $(document).on("change", '#discount2', function () {
            var value =parseInt($(this).val());
            var price =parseInt($("#price").val());
            var discount=price*(value/100);
            var amount=price-discount;
            $("#payment").val(amount);
        });
    </script>
    <script  type="text/javascript">
        $(document).ready(function() {
            var max_fields      = 40; //maximum input boxes allowed
            var wrapper         = $(".input_fields_wrap2"); //Fields wrapper
            var add_button      = $(".add_field_button2"); //Add button ID
            var x = 1; //initlal text box count
            $(add_button).click(function(e){ //on add input button click
//                var package_item = $('#package_item').val()+1;
                $('#shop_image').val( function(i, oldval) {
                    return parseInt( oldval, 10) + 1;
                });
                e.preventDefault();
                if(x < max_fields){ //max input box allowed
                    var product_item = parseInt($('#shop_image').val());
                    x++; //text box increment
                    $(wrapper).append('<div ><div  class="col-md-4 col-sm-4" align="center"><div class="form-group"><input type="file" class="image-height" name="image' + product_item + '" class=""><a href="#" class="remove_field">Remove</a> </div></div> '); //add input box
                }
            });
            $(wrapper).on("click",".remove_field2", function(e){ //user click on remove text
                e.preventDefault(); $(this).parent().parent('div').remove(); x--;
            })
        });
    </script>

@endsection