@extends('page')

@section('content')


<!-- Content Header (Page header) -->
  <section class="content-header">
    <div class="container-fluid">
      <div class="row mb-2">
        <div class="col-sm-6">
          <h1>Edit Order # {{$order->id}}</h1>
        </div>
        <div class="col-sm-6">
          <ol class="breadcrumb float-sm-right">
            <li class="breadcrumb-item"><a href="{{ route('orders.index') }}">List Orders</a></li>
            <li class="breadcrumb-item active">Order Details</li>
          </ol>
        </div>
      </div>
    </div><!-- /.container-fluid -->
  </section>

  @if (count($errors) > 0)
    <div class="alert alert-danger">
        <strong>Whoops!</strong> There were some problems with your input.<br><br>
        <ul>
        @foreach ($errors->all() as $error)
            <li>{{ $error }}</li>
        @endforeach
        </ul>
    </div>
  @endif

<!-- Main content -->
  <section class="content">
    <div class="container-fluid">
      <div class="row">
        <div class="col-9">
          <div class="card card-info  card-outline">
            <div class="row" style="padding: 1.25rem 1.25rem 0 1.25rem;">
                  
                    <div class="col-xs-5 col-sm-5 col-md-5">
                      <div class="form-group">
                          <h6><b>PLACED BY  : </b> @if($company->id == 1 && $order->print_status == 1 && $order->companyCreator) {{$order->companyCreator->name}}  @else {{$order->creator->name}} @endif</h6>
                      </div>
                      <div class="form-group">
                          <h6><b>VERIFIER : </b> @if($company->id == 1 && $order->print_status == 1 && $order->companyVerifier) {{$order->companyVerifier->name}}  @else {{$order->userVerifier->name }} @endif</h6>
                      </div>

                      <div class="form-group">
                          <h6><b>APPROVER : </b> @if($company->id == 1 && $order->print_status == 1 && $order->companyApprover) {{$order->companyApprover->name}}  @else {{$order->approver->name }} @endif</h6>
                      </div>
                    </div>

                  
                    <div class="col-xs-5 col-sm-5 col-md-5">
                      <div class="form-group">
                          <label>STATUS : </label>
                            @if($order->status == -1 && $order->print_status == 0 )
                                <small class="badge badge-danger">Approver Rejection</small>
                            @elseif($order->status == 0  && $order->print_status == 0 )
                                <small class="badge badge-danger">Rejected</small>
                            @elseif($order->status == 1 &&  $order->print_status == 0)
                                <small class="badge badge-primary">Veification Pending</small>
                            @elseif($order->status == 2 &&  $order->print_status == 0)
                                <small class="badge badge-secondary">Verified</small>
                            @elseif($order->status == 3 &&  $order->print_status == 0)
                                <small class="badge badge-info">Approved</small>
                            @elseif($order->status == 4 &&  $order->print_status == 0)
                                <small class="badge badge-success">Printed</small>'
                            @elseif($order->company_print_status == -1 && $order->print_status == 1 )
                                <small class="badge badge-danger">Company Approver Rejection</small>
                            @elseif($order->company_print_status == 0  && $order->print_status == 1 )
                                <small class="badge badge-danger">Company Rejected</small>
                            @elseif($order->company_print_status == 1 &&  $order->print_status == 1)
                                <small class="badge badge-primary">
                                @if($company->id  != 1)
                                    Transfered to getOroigin
                                @elseif($order->company_verifier && $order->company_approver )
                                  Veification Pending
                                @else
                                    New Order
                                @endif
                                </small>
                            @elseif($order->company_print_status == 2 &&  $order->print_status == 1)
                                <small class="badge badge-secondary">
                                    Verified
                                </small>
                            
                            @elseif($order->company_print_status == 3 &&  $order->print_status == 1)
                                <small class="badge badge-info">
                                    Approved
                                </small>                            
                            @elseif($order->company_print_status == 4 &&  $order->print_status == 1)
                                <small class="badge badge-success">Printed</small>
                            @endif
                      </div>

                      <div class="form-group">
                          <h6><b>ORDER DATE : </b>{{date('d-m-Y', strtotime($order->date))}}</h6>
                      </div>
                    </div>
              </div>

            <!-- /.card-header -->
            {!! Form::model($order, ['method' => 'PATCH','route' => ['orders.update', $order->id],'files'=> true, 'id' => 'order_edit_form']) !!}

              @php $x     = 1; @endphp
              @if($order->products)
                @if($order->order_placed == Auth::user()->id)
                  <!-- <div class="card-body">      -->
                    <div class="row" style="padding: 1.25rem 1.25rem 0 1.25rem;">
                      <div class="col-sm-9 col-md-9 col-xs-9">
                        <label>Product Name:<span class="form-compulsory"> * </span></label>
                      </div>
                      <div class="col-sm-3 col-md-3 col-xs-3">
                        <label>Label Count:<span class="form-compulsory"> * </span></label>
                      </div>
                    </div> 
                  <div class="card-body"  style="padding-top: 0px; padding-bottom: 0px;">
                    <div class="input_fields_wrap">
                    @if($order->order_placed == Auth::user()->id)

                        <div class="row " >
                            <div class="col-xs-9 col-sm-9 col-md-9">
                                <div class="form-group">
                                    
                                    {!! Form::text('product_name[]', null, array('placeholder' => 'Product Name','class' => 'form-control form-control-sm product-name', 'id' => 'tags_create')) !!}
                                      <input type="hidden" id="product_temp_image" value="">
                                      <input type="hidden" id="product_temp_details" value="">
                                      <input type="hidden" id="product_temp_description" value="">
                                      <input type="hidden" id="product_temp_brand_name" value="">
                                      <input type="hidden" id="product_temp_model_number" value="">
                                      <input type="hidden" id="product_temp_category" value="">

                                    <span style="display:none; color: red;" id="product_error_msg"></span>
                                </div>
                            </div>
                            <div class="col-xs-2 col-sm-2 col-md-2">
                                <div class="form-group">
                                    {!! Form::number('label_count[]', null, array('placeholder' => 'Count','class' => 'form-control form-control-sm product-label', 'id' => 'label_count', 'min'=>"1")) !!}
                                    <input name="product_id[]" type="hidden" id= 'product_id'>

                                  <span style="display:none; color: red;" id="label_count_msg">Please Choose Label Count</span>
                                </div>
                            </div>
                            <div class="col-xs-1 col-sm-1 col-md-1 text-left">
                                <div class="form-group  add_field_button">
                                    <i class="fa fa-plus" aria-hidden="true"></i>
                                </div>
                            </div>
                        </div>   
                      @endif


                    @foreach($order->products as $dkey =>  $details)
                        
                      <div class="row marT10 marB10" >
                          <div class="col-xs-9 col-sm-9 col-md-9">
                            <div class="list_prod_box">
                              <div class="form-group  pro_displaybox_form">
                                  <div class="img_wrap " style="float:left">
                                      <img src="{{asset('../storage/app/images/'.$details->products->product_image)}}" width="60"/>
                                  </div> 
                                  <div class="col-md-11" style="float:left">
                                      <div class="pro_details_box">
                                          <div class="prod_code">{{$details->products->product_code}}</div>
                                          <div class="separator">|</div>
                                          <div class="prod_name">{{$details->products->product_name}}</div>
                                          <div class="separator">|</div>  
                                          <div class="prod_brand">{{$details->products->brand_name}}</div>
                                          <div class="separator">|</div>
                                          <div class="prod_modeln">{{$details->products->model_number}}</div>
                                          @if($details->products->category)
                                              <div class="separator">|</div>
                                              <div class="prod_category">{{$details->products->category->category}}</div>
                                          @endif
                                      </div>
                                      <div style="font-size:13px;">{{$details->products->description}}</div> 
                                  </div>
                              </div>
                            </div> 
                          </div>
                          <div class="col-xs-2 col-sm-2 col-md-2">
                              <div class="form-group">
                                <input placeholder="Label Count" class="form-control product-label" id="prid{{$x}}" name="label_count[]" value="{{$details->label_count}}" type="number" min="1">
                                <input type="hidden" name="product_id[]" class="product_ids" value="{{$details->products->id}}">
                              </div>
                          </div>
                          <div class="col-xs-1 col-sm-1 col-md-1 text-left">
                            <div class="form-group remove_field" style="padding-top:5px;">
                                <i class="fa fa-minus fa-1x" aria-hidden="true"></i>
                            </div >
                          </div>
                      </div>
                        {{--
                        <div class="row">
                          <div class="col-xs-9 col-sm-9 col-md-9">
                            <div class="form-group">
                              <input placeholder="Product Name" disabled class="form-control form-control-sm product-name" id="p_name{{$x}}" name="product_name[]" type="text" autocomplete="off" value="{{$details->products->product_name}}" >
                            </div>
                          </div>
                          <div class="col-xs-2 col-sm-2 col-md-2">
                            <div class="form-group">
                              <input placeholder="Label Count" class="form-control form-control-sm product-label" id="prid{{$x}}" name="label_count[]" value="{{$details->label_count}}" type="number" min="1">
                              <input type="hidden" name="product_id[]" class="product_ids" value="{{$details->products->id}}"></div>
                            </div>
                            <div class="col-xs-1 col-sm-1 col-md-1 text-right"> <div class="form-group remove_field">
                                  <i class="fa fa-minus fa-1x" aria-hidden="true"></i>
                                </div></div>
                        </div>
                        --}}
                        @php $x++; @endphp                  
                    @endforeach
                  </div>
                </div>
                @else
                    @if($order)
                      <table class="table table-responsive table-bordered table-striped dataTable dtr-inline" cellspacing="0"  width="100%">
                          <thead> 
                            <tr>
                              <th>#</th>
                              <th>Product Details</th>
                              <th>Label Count</th>
                              <th></th>
                            </tr>
                          </thead>
                      @foreach($order->products as $dkey =>  $details) 
                            <tbody>
                              <tr>
                                <td>{{$x}}</td>
                                <td class="pro_displaybox_form">
                                    <div class="img_wrap " style="float:left">
                                        <img src="{{asset('../storage/app/images/'.$details->products->product_image)}}" width="60"/>
                                    </div> 
                                    <div class="col-md-11" style="float:left">
                                        <div class="pro_details_box">
                                            <div class="prod_code">{{$details->products->product_code}}</div>
                                            <div class="separator">|</div>
                                            <div class="prod_name">{{$details->products->product_name}}</div>
                                            <div class="separator">|</div>  
                                            <div class="prod_brand">{{$details->products->brand_name}}</div>
                                            <div class="separator">|</div>
                                            <div class="prod_modeln">{{$details->products->model_number}}</div>
                                            @if($details->products->category)
                                                <div class="separator">|</div>
                                                <div class="prod_category">{{$details->products->category->category}}</div>
                                            @endif
                                        </div>
                                        <div style="font-size:13px;">{{$details->products->description}}</div> 
                                    </div>
                                </td>
                                <td>{{$details->label_count}}</td>
                                <td>
                                    <button type="button" data-order-id="{{$details->products->id}}" product-data='{{json_encode($details->products)}}' class="order_preview btn btn-info">Preview</button>
                                </td>
                              </tr>

                            </tbody>
                      @php $x++; @endphp
                      @endforeach
                      </table>
                    @endif             
                @endif
              @endif

              <div class="row card-body submit-section">
                  <div class="col-xs-12 col-sm-12 col-md-12" id='form-tit'>
                    <h5><span style="padding-right: 0px;"></span></h5>
                  </div>
                  @if($company->id ==  $order->company_id)
                    <div class="col-xs-6 col-sm-6 col-md-6">
                      <div class="form-group">
                          <label>Verifier:<span class="form-compulsory"> * </span></label>
                          @php $temp_verifier    = []; @endphp
                          <select name="verifier" class='form-control'  id="order_verifier">
                              <option value=""> -- Select --</option>
                              @foreach($verifiers as $id => $verifier)
                                <option value="{{$verifier->id}}" @if($verifier->id == $order->verifier || $verifier->id == old('verifier'))  selected="selected" @endif>{{$verifier->name}}</option>                                
                              @endforeach
                          </select>
                            <span style="display:none; color: red;" id="msg_order_verifier"></span>
                                                </div>
                    </div>
                    <div class="col-xs-6 col-sm-6 col-md-6">
                      <div class="form-group">
                          <label>Approver:<span class="form-compulsory"> * </span></label>
                          @php $temp_approver    = []; @endphp

                          <select name="approver" class='form-control'  id="order_approver">
                              <option value=""> -- Select --</option>
                              @foreach($approvers as $id => $approver)
                                <option value="{{$approver->id}}" @if($approver->id == $order->signatory || $approver->id == old('approver'))  selected="selected" @endif>{{$approver->name}}</option>                                
                              @endforeach
                          </select>
                          <span style="display:none; color: red;" id="msg_order_approver"></span>
                                                    <input type="hidden" id= 'product_id'>
                      </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12" style="float:left;">
                        <div class="form-group">
                            <label>Note</label>
                            {!! Form::textarea('order_note', $order->note, array('placeholder' => 'Order Note','class' => 'form-control form-control-sm', 'id' => 'tags_create', 'rows' => '2')) !!}
                        </div>
                    </div>
                  @else
                    <div class="col-xs-6 col-sm-6 col-md-6">
                      <div class="form-group">
                          <label>Verifier:<span class="form-compulsory"> * </span></label>
                          @php $temp_verifier    = []; @endphp

                          <select name="verifier" class='form-control'  id="order_verifier">
                              <option value=""> -- Select --</option>
                              @foreach($verifiers as $id => $verifier)
                                <option value="{{$verifier->id}}" @if($verifier->id == $order->company_verifier || $verifier->id == old('verifier'))  selected="selected" @endif>{{$verifier->name}}</option>                                
                              @endforeach
                          </select>
                            <span style="display:none; color: red;" id="msg_order_verifier"></span>
                                                </div>
                    </div>
                    <div class="col-xs-6 col-sm-6 col-md-6">
                      <div class="form-group">
                          <label>Approver:<span class="form-compulsory"> * </span></label>
                          @php $temp_approver    = []; @endphp
                          <select name="approver" class='form-control' id="order_approver">
                              <option value=""> -- Select --</option>
                              @foreach($approvers as $id => $approver)
                                <option value="{{$approver->id}}" @if($approver->id == $order->company_approver || $approver->id == old('approver'))  selected="selected" @endif>{{$approver->name}}</option>                                
                              @endforeach
                          </select>
                          <span style="display:none; color: red;" id="msg_order_approver"></span>
                                                    <input type="hidden" id= 'product_id'>
                      </div>
                    </div>
                    <div class="col-xs-12 col-sm-12 col-md-12" style="float:left;">
                        <div class="form-group">
                            <label>Note</label>
                            {!! Form::textarea('order_note', ($order->company_order_note?$order->company_order_note:''), array('placeholder' => 'Order Note','class' => 'form-control form-control-sm', 'id' => 'tags_create', 'rows' => '2')) !!}
                        </div>
                    </div>
                  @endif


                      <div class="col-xs-6 col-sm-6 col-md-6 text-left"> 
                            <a href="{{ url()->previous() }}"> <button class="btn btn-secondary">Back </button> </a>
                      </div>

                      <div class="col-xs-6 col-sm-6 col-md-6 text-right"> 

                        @if($company->id ==  $order->company_id)
                          <button type="submit" id="order_edit_btn" class="btn btn-primary">Update</button>
                        @else
                          <button type="submit" id="order_edit_btn" class="btn btn-primary">Update</button>
                          <input type="hidden" name="order_update_company" value="1">
                        @endif
                      </div>
              </div>
            {!! Form::close() !!}
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
        </div>
        <div class="col-3">
          @include('components.dashboard.vertical')
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->


      <div class="modal fade show" id="modal-product-details" style="" aria-modal="true" role="dialog">
        <div class="modal-dialog modal-lg "> 
          <div class="modal-content">  
              <div class="modal-header"> 
                  <!-- <h4 class="modal-title" id="product-model-name">Product</h4> -->
                  <div id="product_details_div">
                    
                  </div>
                  <button type="button" class="close close-model" data-dismiss="modal" aria-label="Close">
                      <span aria-hidden="true">×</span>
                  </button>
              </div>
              <div class="modal-body" style="height: 200px;">
                  <div class="row">
                    
                    <div class="col-md-6" >
                      <h5>Label</h5>
                        <div id="wrapper">
                            <img id="overlayImage" src="{{asset('../storage/app/qr_code/qr.png')}}" alt="overlay image"> <!--Overlay QRcode comes here-->
                            <img id="product-model-label" src="" alt="product label"> <!--Uploaded  Image comes here-->
                        </div>
                    </div>
                    <div class="col-md-6">
                      <h5>Label 2</h5>
                        <div id="wrapper2">
                            <img id="overlayImage2" src="{{asset('../storage/app/qr_code/qr.png')}}" alt="overlay image"> <!--Overlay QRcode comes here-->
                            <img id="product-model-label2" src="" alt="product label"> <!--Uploaded  Image comes here-->
                        </div>
                    </div>
                    <div class="col-md-12">  &nbsp;
                    </div>
                  </div>                  
              </div>

              <div class="row" style="display:none"> 
                <input type="number" class="form-control form-control-sm" name="qrcode_size" id="qrcodeSize"  value="" min="0" max="">
                <input type="number" class="form-control form-control-sm" name="qrcode_top" id="overlayTop" min="0" max="" value="">
                <input type="number" class="form-control form-control-sm" name="qrcode_left" id="overlayLeft" min="0" max="" value="">
                <input type="number" class="form-control form-control-sm" name="qrcode_left" id="product_id" min="0" max="" value="">

                <input type="number" class="form-control form-control-sm" name="qrcode_size" id="qrcodeSize2"  value="" min="0" max="">
                <input type="number" class="form-control form-control-sm" name="qrcode_top" id="overlayTop2" min="0" max="" value="">
                <input type="number" class="form-control form-control-sm" name="qrcode_left" id="overlayLeft2" min="0" max="" value="">


              </div>
              <div class="modal-footer justify-content-between">
                  <button type="button" class="btn btn-default close-model" data-dismiss="modal">Close</button>
              </div>
          </div>
        </div>
      </div>




    </div>
    <!-- /.container-fluid -->
  <script>

  $(document).ready(function() {
      var max_fields = '{{count($products)+1}}'; //maximum input boxes allowed
      var wrapper = $(".input_fields_wrap"); //Fields wrapper
      var add_button = $(".add_field_button"); //Add button ID

      var x = '{{$x}}'; //initlal text box count
      var availableAttributes = <br />
<b>Warning</b>:  Undefined variable $products in <b>/home/getorigin/public_html/new/resources/views/orders/edit.blade.php</b> on line <b>463</b><br />
null;

      $(add_button).click(function (e) { //on add input button click
            e.preventDefault();
            $('#label_count_msg').hide();
            $('#product_error_msg').hide();

            if (x < max_fields) {
                
                var p_name          = $('#tags_create').val();
                var p_id            = $('#product_id').val();
                var p_label_count   = $('#label_count').val();

                var product_image   = $('#product_temp_image').val();
                var product_details = $('#product_temp_details').val();
                var product_desc    = $('#product_temp_description').val();

                var brand_name      = $('#product_temp_brand_name').val();
                var model_number    = $('#product_temp_model_number').val();
                var category        = $('#product_temp_category').val();


                if(p_name== ''){
                    $('#product_error_msg').html('Please Choose a Product!');                    
                    $('#product_error_msg').show();
                    return;
                }
                if(p_label_count < 1){
                    $('#label_count_msg').show();
                    return;
                }
                var choosed_products= 0;
                $('.product_ids').each(function (){
                  if(this.value == p_id){
                      choosed_products++;
                  }                  
                })
                if(choosed_products > 0){

                  $('#product_error_msg').html('Product Already Choosed!');
                  $('#product_error_msg').show();

                  return;
                }
                if(x == 1){
                  
                  //$('.users-selection').parent().parent().show();
                }
                x++;
                var el = '<div class="row marT10 marB10"><div class="col-xs-9 col-sm-9 col-md-9">'+
                      '<div class="list_prod_box"><div class="form-group pro_displaybox_form">'+
                        '<div class="img_wrap " style="float:left"><img src="'+product_image+'" width="60"/></div>'+
                        '<div class="col-md-11" style="float:left">';
                          if(product_details != ''){
                            el +='<div class="pro_details_box">'+product_details;
                          }
                          if(brand_name != ''){
                              el += '<div class="separator">|</div>'+
                              '<div class="prod_brand">'+brand_name+'</div>';
                          }
                          if(model_number != ''){
                              el += '<div class="separator">|</div>'+
                              '<div class="prod_modeln">'+model_number+'</div>';
                          }
                          if(category != ''){
                              el +='<div class="separator">|</div>'+
                              '<div class="prod_category">'+category+'</div>';
                          }
                            el += '</div>';
                          if(product_desc != ''){
                            el += '<div style="font-size:13px;">'+product_desc+'</div>';
                          }
                        el += '</div>'+
                      '</div>'+

                      '</div></div><div class="col-xs-2 col-sm-2 col-md-2">'+
                        '<div class="form-group">'+
                          '<input placeholder="Label Count" class="form-control product-label" id="prid' + (x - 1) + '" name="label_count[]" value="'+p_label_count+'" type="number" min="1">'+
                          '<input type="hidden" name="product_id[]" class="product_ids" value="'+p_id+'">'+
                        '</div>'+
                      '</div>'+
                      '<div class="col-xs-1 col-sm-1 col-md-1 text-left">'+
                        '<div class="form-group remove_field" style="padding-top:5px;"> '+
                          '<i class="fa fa-minus fa-1x" aria-hidden="true"></i>'+
                      '</div >'+
                    '</div>'+
                  '</div>';

                $('#tags_create').val('');
                $('#product_id').val('');
                $('#label_count').val('');

                $('#product_temp_image').val('');
                $('#product_temp_details').val('');
                $('#product_temp_description').val('');
                $('#product_temp_brand_name').val('');
                $('#product_temp_model_number').val('');
                $('#product_temp_category').val('');

                $(wrapper).append(el);
            }
        });

   
      $(wrapper).on("click", ".remove_field", function(e) {
          e.preventDefault();
          $(this).parent().parent('div').remove();
          x--;
      })

      
      $( function() {
          var products              = [];
            var availableAttributes = <br />
<b>Warning</b>:  Undefined variable $products in <b>/home/getorigin/public_html/new/resources/views/orders/edit.blade.php</b> on line <b>576</b><br />
null;
            var image_url           = '{{asset("../storage/app/images/")}}';
            $.each(availableAttributes, function( index, value ) {
                products.push({
                  id            : value.id,
                  label         : '<div class="prod_code">'+value.product_code+'</div><div class="separator">|</div><div class="prod_name">'+value.product_name+'</div>',
                  p_name        : value.product_name,
                  desc          : value.description,
                  code          : value.product_code,
                  brand_name    : value.brand_name,
                  model_number  : value.model_number,
                  category      : value.category.category,
                  image         : image_url+'/'+value.product_image,
                }); 
            });
          
          $( "#tags_create" ).autocomplete({
            minLength: 1,
            source: products,
            focus: function( event, ui ) {
              $( "#tags_create" ).val( ui.item.p_name );
              return false;
            },
            select: function( event, ui ) {
                $('#tags_create').val(ui.item.p_name);
                $('#product_id').val(ui.item.id);

                $('#product_temp_details').val(ui.item.label);
                $('#product_temp_description').val(ui.item.desc);
                $('#product_temp_brand_name').val(ui.item.brand_name);
                $('#product_temp_model_number').val(ui.item.model_number);
                $('#product_temp_category').val(ui.item.category);
                $('#product_temp_image').val(ui.item.image);


                if($(".product-name").length >= 1){
                  $('.users-selection').parent().parent().show();
                  $('.hidden_section').show();

                }
                return false;
            },
            open: function() {
              $("ul.ui-menu").width( $(this).innerWidth() );
            } 
          })
          .autocomplete( "instance" )._renderItem = function( ul, item ) {
              var temp_product_html = '<div class="row"><div class="col-md-3" style="float:left"><img src="'+item.image+'" width="60" style="border-radius:5px;"/></div> <div class="col-md-9" style="float:left"><div class="pro_details_box">'+item.label;
                if(item.brand_name != ''){
                  temp_product_html += '<div class="separator">|</div>'+
                                '<div class="prod_brand">'+item.brand_name+'</div>';
                }
                if(item.model_number != ''){
                  temp_product_html += '<div class="separator">|</div>'+
                                '<div class="prod_modeln">'+item.model_number+'</div>';
                }
                if(item.category != ''){
                  temp_product_html += '<div class="separator">|</div>'+
                      '<div class="prod_category">'+item.category+'</div>';
                }
                temp_product_html += '</div>';
                if(item.desc != ''){
                  temp_product_html +='<div style="font-size:13px;">'+item.desc+'</div>'+
                              '</div></div>';
                }
                return $( "<li>" ).append(temp_product_html).appendTo( ul );
          };
        } );
      
        $('#order_edit_btn').click(function(e){
            e.preventDefault();
            var order_flag                      = 0;
            $('#label_count_msg').hide();
            $('#product_error_msg').hide();
            $('#msg_order_approver').hide();
            $('#msg_order_verifier').hide();

            var order_approver = $("#order_approver option:selected").val();
            if(order_approver == "")
            {
                $("#msg_order_approver").show();
                $("#msg_order_approver").html("Please select Approver");
                order_flag++;
            }

            var order_verifier = $("#order_verifier option:selected").val();
            if(order_verifier == "")
            { 
                $("#msg_order_verifier").show();
                $("#msg_order_verifier").html("Please select Verifier");
                order_flag++;
            }

            if($(".product-name").last().val() != ''){
              if($(".product-label").last().val() == ''){
                $('#label_count_msg').show();
                order_flag++;
              }
            }

            var p_name          = $('#tags_create').val();
            if(p_name == ''){
              $('#product_id').val('');
            }

            var p_id            = $('#product_id').val();
            var p_label_count   = $('#label_count').val();

            var choosed_products= 0;
            $('.product_ids').each(function (){
              if(this.value == p_id){
                  choosed_products++;
              }                  
            })
            if(choosed_products > 0){
              $('#product_error_msg').html('Product Already Choosed!');
              $('#product_error_msg').show();
              order_flag++;
            }

            $('.product-name').each(function (){
              if($(this).val() == '' ){
                if(!$(this).attr('id') == 'tags_create'){
                  $('#product_error_msg').html('Choose a Product');
                  $('#product_error_msg').show();
                  $(this).focus();
                  order_flag++;
                }
              }
            });

            if(order_flag == 0){
              $('#order_edit_form .btn').prop("disabled", true);
              $("#order_edit_btn").html('<i class="fa fa-spinner fa-spin"></i>');
              $('#order_edit_form').submit();
              //alert(order_flag);
            } 
        });


        $('.users-selection').click(function(e) {
            e.preventDefault();
            if($(".product-name").last().val() != ''){
              if($(".product-label").last().val() == ''){
                alert('Please Add Label Count');
                return;
              }
            }

            var p_name          = $('#tags_create').val();
            if(p_name == ''){
              $('#product_id').val('');
            }

            var p_id            = $('#product_id').val();
            var p_label_count   = $('#label_count').val();

                  var choosed_products= 0;
            $('.product_ids').each(function (){
              if(this.value == p_id){
                  choosed_products++;
              }                  
            })
            if(choosed_products > 0){
              alert('Product Already Choosed!');
              return;
            }

            var product_flag    = 0;
            $('.product-name').each(function (){
              if($(this).val() == '' ){
                if(!$(this).attr('id') == 'tags_create'){
                  alert('Choose a Product');
                  $(this).focus();
                  product_flag++;
                  return;
                }
                //break;
              }
            });
            if(product_flag == 0){
              $('#product_form').submit();
            }
            
        });


        $('.order_preview').click(function() {
            var image_url           = '{{asset("storage/app/")}}'

            var product_details     = JSON.parse($(this).attr('product-data'));

            $('#qrcodeSize').val(product_details.qrcode_size);
            $('#overlayTop').val(product_details.qrcode_top);
            $('#overlayLeft').val(product_details.qrcode_left);
            $('#product_id').val(product_details.id);

            $('#product-model-name').html(product_details.product_name);
            //$('#product-model-image').attr('src',image_url+'/images/'+product_details.product_image);
            $('#product-model-label').attr('src',image_url+'/product_label/'+product_details.product_label);

            $('#qrcodeSize2').val(product_details.qrcode_size2);
            $('#overlayTop2').val(product_details.qrcode_top2);
            $('#overlayLeft2').val(product_details.qrcode_left2);
            $('#product-model-label2').attr('src',image_url+'/product_label2/'+product_details.product_label2);

            var   product_details_html    = '<div class="col-md-3" style="float:left">'+
                '<img src="'+image_url+'/images/'+product_details.product_image+'" width="60"/>'+
            '</div>'+
            '<div class="col-md-9" style="float:left">'+
                '<div class="pro_details_box">';
                  if(product_details.product_code != ''){
                    product_details_html += '<div class="prod_code">'+product_details.product_code+'</div>';
                  }
                  if(product_details.product_name != ''){
                    product_details_html +='<div class="separator">|</div>'+
                    '<div class="prod_name">'+product_details.product_name+'</div>';
                  }
                  if(product_details.brand_name != ''){
                    product_details_html += '<div class="separator">|</div>  '+
                    '<div class="prod_brand">'+product_details.brand_name+'</div>';
                  }
                  if(product_details.model_number != ''){
                    '<div class="separator">|</div>'+
                    '<div class="prod_modeln">'+product_details.model_number+'</div>';
                  }
                    if(product_details.category){
                        product_details_html    +='<div class="separator">|</div>';
                        product_details_html    +='<div class="prod_category">'+product_details.category.category+'</div>';
                    }
                product_details_html    +='</div>';
                if(product_details.description != ''){
                  product_details_html    +='<div style="font-size:13px;">'+product_details.description+'</div> ';
                }
            product_details_html    +='</div>';

            $('#product_details_div').html(product_details_html);
            
            $('#modal-product-details').modal('show');

            productLabel();
        });

      function productLabel(){

            var product_id=$("#product_id").val();
            var top = $("#overlayTop").val();
            var left = $("#overlayLeft").val();
            var qrcodeSize = $("#qrcodeSize").val();

            var top2 = $("#overlayTop2").val();
            var left2 = $("#overlayLeft2").val();
            var qrcodeSize2 = $("#qrcodeSize2").val();


            if(product_id !=null) {
                $("#overlayImage").css({
                    "top": top + "px",
                    "left": left + "px",
                    "width": qrcodeSize + "px",
                    "height": qrcodeSize + "px"
                    
                });

                $("#overlayImage2").css({
                    "top": top2 + "px",
                    "left": left2 + "px",
                    "width": qrcodeSize2 + "px",
                    "height": qrcodeSize2 + "px"
                    
                });
            }
        }
    });
  </script>
@endsection