@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>
   OPERATIONS MANAGEMENT SYSTEM

  </h1>

 </section>

 <section class="content">

  <!-- Default box -->
  <div class="box">
   <div class="box-header with-border">
    <h3 class="box-title"><span style="color:green; font-weight: bolder;">TRUCKLIST FOR
      {{ strtoupper($trucklist->consignee->name) }}<br> ON {{ $trucklist->date }}</span> <br></h3>
    <div class="box-tools pull-right">
     <a class="btn btn-danger" href="{{ route('trucklist.index') }}">Back to Transactions</a>

    </div>
   </div>
   @include('includes.messages')
   <form role="form" method="post" action="{{ route('store.factory.truck', $trucklist) }}"
    enctype="multipart/form-data" id="truckForm">
    {{ csrf_field() }}
    <div class="box-body">
     <div class="col-md-6">

      <div class="col-md-8">
       <div class="form-group">
        <label for="truck_no"> Truck number:</label>
        <input type="text" class="form-control" id="truck_no" name="truck_no" placeholder="truck number"
         autocomplete="off" required>
        <input type="hidden" id="trucklist_id" value="{{ $trucklist->id }}">
       </div>
       <div class="form-group">
        <label for="transporter_name"> Name of Transporter:</label>
        <input type="text" class="form-control" id="transporter_name" name="transporter_name"
         placeholder="Transporter" required>
       </div>

       <div class="form-group">
        <label for="bags"> Bags</label>
        <input type="number" class="form-control" id="bags" name="bags" placeholder="eg. 500" step="1">
        <input type="hidden" id="chk_status">
       </div>

       <!-- /.box-body -->
       <div class="box-footer">

        <button type="submit" class="btn btn-primary" id="submit_form">Submit</button>
       </div>
      </div>

     </div>
     <div class="col-md-6 table-responsive">
      <table class="table-bordered table-striped table-condensed table">
       <tr>
        <th>TRUCK NO.</th>
        <th>TRANSPORTER</th>
        <th>CAPACITY</th>
        <th>EDIT</th>
       </tr>
       @foreach ($trucklist->trucks as $truck)
        <tr>
         <td>{{ $truck->truck_no }}</td>
         <td>{{ $truck->transporter }}</td>
         <td>{{ $truck->capacity }}</td>
         <td><a href="{{ route('edit.factory.truck', $truck) }}" class="btn btn-primary"
           @if (optional($truck->evac_trucks()->first())->transaction_code != null) disabled @endif oncontextmenu="return false">EDIT</a></td>
        </tr>
       @endforeach
      </table>
     </div>
     <input type="hidden" id="chk_status">
     <!-- /.box-body -->
     <div class="box-footer">
      {{-- <button type="submit" class="btn btn-primary">Submit</button> --}}
     </div>
    </div>
   </form>
   <!-- /.box-footer-->
  </div>
  <!-- /.box -->

 </section>
@endsection

@section('more-scripts')
 <script src="{{ asset('admin/bower_components/datatables.net/js/jquery.dataTables.min.js') }}"></script>
 <script src="{{ asset('admin/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js') }}"></script>
 <script src="{{ asset('admin/bower_components/select2/dist/js/select2.full.min.js') }}"></script>
 <script>
  $(function() {

   $('.select2').select2();

   $.ajaxSetup({

    headers: {

     'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')

    }

   });

   $('#truck_no').on('blur', function(event) {
    //event.preventDefault();
    var truck = $('#truck_no').val();
    var tklist_id = parseInt($('#trucklist_id').val());
    $.ajax({
     type: "POST",
     url: '{{ url('get_truck_count') }}',
     data: {
      truck: truck,
      tklist_id: tklist_id
     },
     success: function(data) {
      //alert(data);
      console.log(data)
      data = parseInt(data);
      $('#chk_status').val(data);
     }
    });
    /* Act on the event */
   });


   $('#truckForm').on('submit', function(e) {
    //e.preventDefault();
    chk_status = $('#chk_status').val();
    if (chk_status == 1) {
     alert('Truck number registered already!!!')
     return false;
    } else
     return true;

   });

   $('#truckForm').submit(function() {
    $("#submit_form", this)
     .html("Please Wait...")
     .attr('disabled', 'disabled');
    return true;
   });
  });
 </script>
@endsection