@extends('admin.layout.app')

@section('more-head')
 <link rel="stylesheet" type="text/css" href="{{ asset('admin/bower_components/select2/dist/css/select2.min.css') }}">
 <link rel="stylesheet" href="{{ asset('admin/dist/css/AdminLTE.min.css') }}">
@endsection

@section('main-content')
 <section class="content-header">
  <h1>
   Local Delivery
  </h1>

 </section>

 <section class="content">

  <!-- Default box -->
  <div class="box">
   <div class="box-header with-border">
    <h3 class="box-title">Local Delivery </h3>

    <div class="box-tools pull-right">
     <button type="button" class="btn btn-box-tool" data-widget="collapse" data-toggle="tooltip" title="Collapse">
      <i class="fa fa-minus"></i></button>

    </div>
   </div>
   @include('includes.messages')
   <form role="form" method="post" action="{{ route('multi.local.store') }}" enctype="multipart/form-data"
    id="myFormId">
    {{ csrf_field() }}
    <div class="box-body">
     <div class="col-md-offset-0 col-md-6">
      <div class="col-md-8">

       <div class="form-group">
        <label for="consignee_id"> Select Consignee</label>
        <select id="consignee_id" class="form-control select2" data-placeholder="Select Consignee" style="width: 100%;"
         name="consignee_id" required>
         <option value="" selected disabled>Select Consignee</option>
         @foreach ($consignees as $consignee)
          <option value="{{ $consignee->id }}">{{ $consignee->name }}</option>
         @endforeach

        </select>
       </div>
       <div class="form-group">
        <label for="status">Delivery Status</label>
        <select name="status" id="status" class="form-control select2" style="width: 100%;" required>
         <option value=""selected disabled>Select Status</option>
         <option value="normal">Normal</option>
         <option value="excess">Excess</option>
         <option value="loan">Loan</option>
        </select>
       </div>

       <div class="form-group loan">
        <label for="loan_type">Loan Type</label>
        <select name="loan_type" id="loan_type" class="form-control select2 loan_req" style="width: 100%;" required>
         <option value="">Select Loan Type</option>
         <option value="Annual_Syndicated">Annual Syndicated</option>
         <option value="AFDB">AFDB</option>
         <option value="MTLF">MTLF</option>
        </select>
       </div>

       <div class="form-group">
        <label for="previous_invoice_number"> Previous Invoice Number</label>
        <input type="text" style="color: red; font-weight: bold;" class="form-control" id="previous_invoice_number"
         name="previous_invoice_number" placeholder="GC Number  " disabled>
        <input type="hidden" name="buyer" id="buyer">
       </div>

       {{-- <div class="form-group normal">
        <label for="consignee_prefix"> Buyer Prefix</label>
        <input type="text" class="form-control byprefix" id="consignee_prefix" name="consignee_prefix"
         placeholder="Buyer Prefix">
       </div> --}}

       <div class="form-group">
        <label for="basic-url">Invoice Number</label>
        <div class="input-group">
         <span class="input-group-addon" id="basic-addon3">GC: </span>
         <div class="form-inline">
          <input type="text" class="form-control" id="invoice_number" name="invoice_number" placeholder="xxxx/xxxx"
           maxlength="9" minlength="9" aria-describedby="basic-addon3" required>
          <input type="hidden" name="invoice_type" id="invoice_type" value="local">
         </div>
        </div>
       </div>

       <div class="form-group">
        <label for="invoice_date"> Invoice date</label>
        <input type="date" class="form-control" name="invoice_date" id="invoice_date" required>
        <input type="hidden" name="invoice_type" id="invoice_type" value="local">
       </div>

       {{-- <div class="col-md-8">
       <div class="form-group">
        <label for="insurance_number"> Insurance Number</label>
        <input type="text" class="form-control" id="insurance_number" name="insurance_number"
         placeholder="shipment  ">
       </div>

      </div> --}}

       {{-- <div class="col-md-8">
       <div class="form-group">
        <label for="bl_rate"> Freight Exchange Rate</label>
        <input type="number" step="0.0001" class="form-control" id="bl_rate" name="bl_rate"
         placeholder="shipment  bl_rate ">
       </div>

      </div> --}}

       {{-- <div class="form-group">
       <div class="col-md-8">
        <label for="vessel_id" class="col-md-4 control-label"><br>Select vessel:</label>
        <select id="vessel_id" class="form-control select2" data-placeholder="Select Roles" style="width: 100%;"
         name="vessel_id">
         @foreach ($vessels as $vessel)
          <option value="{{ $vessel->id }}">{{ $vessel->name }}</option>
         @endforeach

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

       <div class="form-group">

        <label for="shippingmode_id">Select Shipping Mode:</label>
        <select id="shippingmode_id" class="form-control select2" data-placeholder="Select Shipping Mode"
         style="width: 100%;" name="shippingmode_id" required>
         <option value="" selected disabled>Select Shipping Mode</option>
         @foreach ($shippingmodes as $shippingmode)
          <option value="{{ $shippingmode->id }}">{{ $shippingmode->name }}</option>
         @endforeach

        </select>
       </div>
       {{--
        <div class="form-group">
         <label for="bill_of_laden_number"> Bill of Laden number</label>
         <input type="text" class="form-control" id="bill_of_laden_number" name="bill_of_laden_number"
          placeholder="shipment  bill_of_laden_number">
        </div> --}}

       {{-- <div class="form-group">
         <label for="bill_of_laden_date"> Bill of Laden Date</label>
         <input type="date" class="form-control" name="bill_of_laden_date" id="bill_of_laden_date">
        </div> --}}

       <div class="form-group">
        <label for="loadingport_id">Select Loading Port:</label>
        <select id="loadingport_id" class="form-control select2" data-placeholder="Select Loading Port"
         style="width: 100%;" name="loadingport_id" required>
         <option value="" selected disabled>Select Loading Port</option>
         @foreach ($loadingports as $loadingport)
          <option value="{{ $loadingport->id }}">{{ $loadingport->name }}</option>
         @endforeach

        </select>
       </div>

       <div class="form-group">
        <label for="consignor_id"> Select Consignor</label>
        <select id="consignor_id" class="form-control select2" data-placeholder="Select Roles" style="width: 100%;"
         name="consignor_id" required>
         @foreach ($consignors as $consignor)
          <option value="{{ $consignor->id }}">{{ $consignor->name }}</option>
         @endforeach

        </select>
       </div>

       <div class="form-group bank_acct">

        <label for="bank"> Select Account Number</label>
        <select id="bank" class="form-control select2 details" data-placeholder="Select Account Number"
         style="width: 100%;" name="bank" required>
         <option value="">Select Account Number:</option>
         @foreach ($bank_details as $bank_detail)
          <option value="{{ $bank_detail->id }}">{{ $bank_detail->bank_name }}({{ $bank_detail->bank_acct_no }})
          </option>
         @endforeach

        </select>
       </div>

       <div class="form-group">
        <label for="name"> Remarks</label>
        <textarea class="form-control" name="remarks" id="remarks" style="height: 100px;"></textarea>

       </div>

       <div class="form-group">
        <label for="name"> Additional Remarks</label>
        <textarea class="form-control" name="additional_remarks" id="additional_remarks" style="height: 100px;"></textarea>
       </div>

       {{-- <div class="form-group">

        <label for="warehouse_charges" >Applicable Warehouse Charges:</label>
        <select id="warehouse_charges" class="form-control select2" data-placeholder="Select Roles"
         style="width: 100%;" name="warehouse_charges">
         <option value="no" selected>No</option>
         <option value="yes">Yes</option>
        </select>
       </div> --}}
       <div class="form-group">
        <label for="novated" class="col-md-4 control-label"><br>Novated Contract:</label>
        <select id="novated" class="form-control select2" data-placeholder="" style="width: 100%;" name="novated">
         <option value="no" selected>No</option>
         <option value="yes">Yes</option>
        </select>
       </div>

       <div class="form-group novated_buyer_id">
        <label for="novated_buyer_id" class="col-md-4 control-label"><br>Select Buyer:</label>
        <select id="novated_buyer_id" class="form-control select2 buyer" data-placeholder="Select Novated Buyer"
         style="width: 100%;" name="novated_buyer_id" required>
         <option value="" selected disabled>Select Consignee</option>
         @foreach ($consignees as $consignee)
          <option value="{{ $consignee->id }}">{{ $consignee->name }}</option>
         @endforeach

        </select>
       </div>
       <div class="form-group">
        <label for="prepayment" class="col-md-4 control-label">Pre-Payment:</label>
        <select id="prepayment" class="form-control select2" data-placeholder="Select Roles" style="width: 100%;"
         name="prepayment">
         <option value="no" selected>No</option>
         <option value="yes">Yes</option>
        </select>
       </div>

       <div class="form-group">
        <label for="premium_status">Premium applicable:</label>
        <select id="premium_status" class="form-control select2" data-placeholder="Select Roles" style="width: 100%;"
         name="premium_status">
         <option value="no" selected>No</option>
         <option value="yes">Yes</option>
        </select>
       </div>

       <div id="premium_details">
        <div class="form-group bl">
         <label for="premium_ex_rate"><br> Freight Exchange Rate</label>
         <input type="number" step="0.0001" class="form-control" id="premium_ex_rate" name="premium_ex_rate"
          placeholder="premium_ex_rate ">
        </div>

        <div class="form-group">

         <label for="premium"> Select Premium:</label>
         <select id="premium" class="form-control select2" data-placeholder=" Select Premium" style="width: 100%;"
          name="premium">
          <option value="0" id="loading" disabled>Select Premium</option>

         </select>

        </div>

       </div>

       <!-- /.box-body -->
       <div class="box-footer">
        <button type="submit" id="verify_submit" class="btn btn-primary">Submit</button>
       </div>
      </div>
     </div>
   </form>
   <!-- /.box-footer-->
  </div>
  <!-- /.box -->

 </section>
@endsection

@section('more-scripts')
 <!-- Select2 -->
 <script src="{{ asset('admin/bower_components/select2/dist/js/select2.full.min.js') }}"></script>

 <script>
  $(function() {
   //alert('hello world');
   $('.novated_buyer_id').hide();
   $('.buyer').removeAttr('required');
   $('#premium_details').hide();
   $('.loan').hide();
   $('.loan_req').removeAttr('required');
   $('.normal').hide();
   $('.byprefix').removeAttr('required');
   $('.bank_acct').hide();
   $('.details').removeAttr('required');
   $('#premium_status').on('change', function() {
    val = this.value;

    //alert(val)
    if (val === "yes") {
     //alert("working")

     $('#premium_details').show()

     contract_id = $('#contract_id').val();
     //alert(contract_id)

     $.ajax({
      url: "{{ url('get_premium_options') }}",
      type: "PUT",
      data: {
       contract_id: contract_id,
      },
      success: function(data) {
       $('#premium').html(data);
       console.log(data);
      }
     })


    } else {
     $('#premium_details').hide()
    }
   });

   $('#status').on('change', function(event) {
    event.preventDefault();
    /* Act on the event */
    status = $(this).val();
    buyer = $('#buyer').val();
    if (status == 'loan') {
     $('.loan').show();
     $('.loan_req').prop('required', true);
     $('.normal').hide();
     $('.byprefix').removeAttr('required');
     $('.bank_acct').hide();
     $('.details').removeAttr('required');

    } else if (status == 'normal') {
     $('.bank_acct').show();
     $('.details').prop('required', true);
     $('.normal').show();
     $('.byprefix').prop('required', true);
     $('.loan').hide();
     $('.loan_req').removeAttr('required');


    } else if (status == 'excess') {
     $('.normal').show();
     $('.byprefix').prop('required', true);
     $('.loan').hide();
     $('.loan_req').removeAttr('required');
     $('.bank_acct').show();
     $('.details').prop('required', true);


    } else {
     $('.loan').hide();
     $('.loan_req').removeAttr('required');
     $('.normal').hide();
     $('.byprefix').removeAttr('required');
     $('.bank_acct').hide();
     $('.details').removeAttr('required');


    }
    //alert(val);
    $.ajax({
      url: "{{ url('get_delivery_status') }}",
      type: "PUT",
      data: {
       status: status,
       buyer: buyer,

      },
     })
     .done(function(data) {
      console.log(data);
      console.log("checked");
      $('#previous_invoice_number').val(data);
     })


   });

   $('#novated').on('change', function(event) {
    event.preventDefault();
    /* Act on the event */
    novated = $('#novated').val();
    if (novated == 'yes') {
     $('.novated_buyer_id').show();
     $('.buyer').prop('required', true);
    } else {
     $('.novated_buyer_id').hide();
     $('.buyer').removeAttr('required');
    }

   });

   $('#consignee_id').on('change', function(event) {
    event.preventDefault();
    /* Act on the event */
    consignee_id = $('#consignee_id').val();
    $('#buyer').val(consignee_id)

   });

   $('.select2').select2()

   $('#myFormId').submit(function() {
    $("#verify_submit", this)
     .html("Please Wait...")
     .attr('disabled', 'disabled');
    return true;
   });

  })
 </script>
@endsection