@extends('modules.head') @section('contenido')

@include('modules.modal_loading')

<h3>
    <a class="ruta" class="" href="{{url('/orders')}}">{{ Lang::get('messages.screen_addOrder_tag1')}} </a>
    <span class="separador-ruta">|</span>
    <a class="ruta" class="" href="{{url('/orders/add')}}">{{ Lang::get('messages.screen_addOrder_tag2')}}</a>
</h3>

<div class="content-box-form">
    <div class="box box-form">
        <div class="box-header with-border">
            <h3 class="box-title">{{Lang::get('messages.screen_addOrder_tag2')}}</h3>
            <!-- /.box-tools -->
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <div class="box-tools boxTypeOrder">
                <div class="row1-boxTypeOrder">
                    <label class="label-boxTypeOrder">{{ Lang::get('messages.screen_addOrder_tag3')}}</label>
                </div>
                <div class="row2-boxTypeOrder">
                    <input type="text" value="{{$order_id}}" id="order_id_copy" hidden>
                    <select class="form-control select_type_order" name="select_type_order" id="select_type_order">
                        <option value="" selected="selected">{{ Lang::get('messages.screen_addOrder_tag4')}}</option>
                        @foreach($types as $type)
                        <option value="{{$type->id}}">{{$type->name}}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <!-- /.form -->


            <div class="content-form" id="content-form">

            </div>
        </div>
    </div>
</div>
@include('modal_direction')

<link rel="stylesheet" href="{{asset('js/plugins/iCheck/all.css')}}">
<script src="{{ asset('js/jQuery/jquery-2.2.3.min.js') }}"></script>
<script src="{{ asset('js/direction.js') }}"></script>
<script src="https://maps.googleapis.com/maps/api/js?key={{env('GOOGLE_MAPS_API_KEY')}}&libraries=places,geometry" async
    defer></script>
<script src="{{ asset('js/orders.js') }}"></script>
<script src="{{ asset('js/bootstrap/js/bootstrap.min.js') }}"></script>
<script src="{{ asset('js/plugins/input-mask/jquery.inputmask.js')}}"></script>
<script src="{{ asset('js/plugins/input-mask/jquery.inputmask.date.extensions.js')}}"></script>
<script src="{{ asset('js/plugins/input-mask/jquery.inputmask.extensions.js')}}"></script>
<script type="text/javascript">
    $(document).ready(function () {
      localStorage.setItem("arrayProducts", "");
      window.needToConfirmT = true;
      window.onbeforeunload = confirmExit;

      function confirmExit() {
        if (window.needToConfirmT){
          return 'Are you sure you want to leave?';
        }
      }
    });
    function setNeedConfirmT(value){
      window.needToConfirmT = value;
    }
    // $(window).bind('beforeunload', function(){
    //   return 'Are you sure you want to leave?';
    // });
</script>
@if ($order_id)
    <script>
        let order = '{{$order}}';
        order = JSON.parse(order.replace(/&quot;/g,'"'));
        console.log(order);
        $("#select_type_order").val(5);
        $("#select_type_order").change();
        setTimeout(() => {
            $("#document").val(order.client?.document);
            $("#user_id").val(order.client?.first_name);
            $("#user_id").attr("data-id",order.client?.id);
            $("#last_name").val(order.client?.last_name);
            $("#email").val(order.client?.email);
            $("#phone").val(order.client?.phone);
            $("#select-delivery_man").val(order.delivery_man?.id);
            $("#select-delivery_man").change();
            $("#payment_type_id").val(order.payment_type?.id);
            $("#payment_type_id").change();
            $("#city_id").val(order.address.city?.id);
            $("#city_id").change();
            $("#sucursal").val(order.sucursal?.id);
            $("#sucursal").change();
            $("#reference").val(order.order_reference);
            $("#confirm_reference").val(order.order_reference);
            $.ajax({
                url: "/clients/getDirections/" + order.client.id,
                type: "GET",
                contentType: "application/json",
                headers: {
                    "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr(
                        "content"
                    ),
                    "Content-Type": "application/json",
                },
                success: function (res){
                    //console.log(res);
                    createSelectDirections(res);
                    $("#address_id").val(order.address.id);
                    $("#address_id").change();
                }
            });
            for(i in order.order_products)
            {
                $.ajax({
                    url: "/products/autocomplete?term=" + order.order_products[i].products.plu,
                    type: "GET",
                    contentType: "application/json",
                    headers: {
                        "X-CSRF-TOKEN": $(
                            'meta[name="csrf-token"]'
                        ).attr("content"),
                        "Content-Type": "application/json",
                    },
                    success: function (r) {
                        var product = JSON.parse(r);
                        console.log(product);
                        $("#product").val(product[0].value);
                        $("#product").attr("data-id", product[0].id);
                        $("#product").attr("data-price", product[0].price);
                        $("#product").attr("data-plu", product[0].plu);
                        $("#product").attr("data-maxU", product[0].max_units_per_order);
                        $("#product").attr("data-product", product[0].data);
                        addAttibuttes(product[0].product_attributes,'hidden',35);
                        addProduct();
                    }
                });
            }

        }, 1000);
    </script>
@endif
@endsection