@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') }}">
 <link rel="stylesheet" href="{{ asset('admin/bower_components/datatables.net-bs/css/dataTables.bootstrap.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">Shed Waybills</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('store.factory.waybill', $shed_evac) }}"
    enctype="multipart/form-data" id="myFormId">
    {{ csrf_field() }}
    <div class="box-body">
     <div class="col-md-offset-1 col-md-6">
      <div class="col-md-8">

       <div class="form-group">
        <div class="">
         <label for="type" class="control-label"><br>Type of Waybill:</label>
         <select id="type" class="form-control select2" data-placeholder="Type of Waybill" style="width: 100%;"
          name="type" required>
          <option value="factory">Factory</option>
         </select>
        </div>
        <br>
       </div>

       <div class="form-group contract">

        <label for="contract_id"> Select Contract (MK) Number:</label>
        <select id="contract_id" class="form-control select2 required" data-placeholder=" Select Contract Number"
         style="width: 100%;" name="contract_id" required>
         <option value="{{ $shed_evac->wpo_evacuation->contract_id }}">{{ $shed_evac->wpo_evacuation->contract->number }}
          (MK {{ $shed_evac->wpo_evacuation->sales_advice->mk_number }})</option>

        </select>
        <br><br>

       </div>

       <div class="form-group sl">

        <label for="evac_truck_id"> Select Transaction Code:</label>
        <select id="evac_truck_id" class="form-control select2" data-placeholder=" Select Transaction Code"
         style="width: 100%;" name="evac_truck_id" required>
         <option value="" selected>Select Truck:</option>
         @foreach ($evac_trucks as $evac_truck)
          <option value="{{ $evac_truck->id }}">{{ strtoupper($evac_truck->transaction_code) }}
           ({{ $evac_truck->truck->truck_no }})
          </option>
         @endforeach

        </select>
        <br><br>

       </div>

       <div class="form-group">
        <label for="waybill_no"> Waybill Number:</label>
        <input type="text" class="form-control" id="waybill_no" name="waybill_no" placeholder="Waybill No." required>
       </div>

       {{-- <div class="form-group">
        <label for="waybill_date"> Waybill Date:</label>
        <input type="date" class="form-control" id="waybill_date" name="waybill_date" placeholder="Waybill No."
         required>
       </div> --}}

       @php
        $bags_assigned = $shed_evac->tonnage_assigned * 16;
        $bags_fullfilled = $shed_evac->stack_records?->sum('bags_quantity_evacuated');
        $bags_remaining = $bags_assigned - $bags_fullfilled;
       @endphp
       <div class="form-group">
        <label for="quantity">
         <div>Quantity Left: <span id="lb" style="color: red; font-weight: bold;"></span></div> Quantity on
         Waybill:
        </label>
        <input type="number" class="form-control" id="quantity" name="quantity" placeholder="No. of Bags" required>
        <input type="hidden" id="bags_remaining" value="{{ $bags_remaining }}">
       </div>

       <div class="form-group">
        <div class="">
         <label for="unit_of_measure" class="control-label"><br>Unit of Measure:</label>
         <select id="unit_of_measure" class="form-control select2" data-placeholder="Unit of Measure"
          style="width: 100%;" name="unit_of_measure" required>
          <option value="bags" selected>Bags</option>

         </select>
        </div>
        <br>
       </div>

       <div class="form-group">
        <div class="">
         <label for="category_id" class="control-label"><br>Category: </label>
         <select id="category_id" class="form-control select2" data-placeholder="Category" style="width: 100%;"
          name="category_id" required>
          <option value="" selected>Select:</option>
          <option value="">N/A</option>
          @foreach ($categorys as $category)
           <option value="{{ $category->id }}">{{ $category->name }} ({{ $category->season->name }})</option>
          @endforeach

         </select>
        </div>
        <br>
       </div>

       {{-- 		<div class="form-group">
									<label for="season_id"> Select Season utilized:</label>
									<select style="width: 100%;" name="season_id" class="form-control select2" required>
										<option value="" selected disabled>Select Season</option>
										@foreach ($seasons as $season)
										<option value="{{$season->id}}">{{$season->name}}</option>
										@endforeach
									</select>
									<br> <br>
								</div> --}}

       <div class="form-group">
        <div class="">
         <label for="grade" class="control-label"><br>Grade:</label>
         <select id="grade" class="form-control select2" data-placeholder="Grade" style="width: 100%;"
          name="grade" required>
          <option value="N/A">N/A</option>
          <option value="I" selected>I</option>
          <option value="II">II</option>
          <option value="SS">SS</option>

         </select>
        </div>
        <br>
       </div>

       {{-- <div class="form-group">
        <div class="">
         <label for="cocoa_type" class="control-label"><br>Cocoa Type:</label>
         <select id="cocoa_type" class="form-control select2" data-placeholder="cocoa_type" style="width: 100%;"
          name="cocoa_type">
          <option value="">N/A</option>
          @foreach ($cocoa_types as $cocoa_type)
           <option value="{{ $cocoa_type->id }}">{{ strtoupper($cocoa_type->type_name) }}
           </option>
          @endforeach
         </select>
        </div>
        <br>
       </div> --}}
       {{-- <div class="form-group hise">
        <div class="">
         <label for="specialty" class="control-label"><br>Specialty Type:</label>
         <select id="specialty" class="form-control select2 spe" data-placeholder="specialty" style="width: 100%;"
          name="specialty">
          <option value="">N/A</option>
          @foreach ($mini_shed_stacks as $mini_shed_stack)
           <option value="{{ $mini_shed_stack->specialty_type_id }}">
            {{ strtoupper(App\Model\specialty_type::find($mini_shed_stack->specialty_type_id)?->specialty_name) }}
           </option>
           </option>
          @endforeach
          <input type="hidden" id="client_count" name="client_count">
         </select>
        </div>
        <br>
       </div> --}}

       {{-- <div class="form-group client">
        <div class="">
         <label for="client" class="control-label"><br>client Type:</label>
         <select id="client" class="form-control select2 clt" data-placeholder="client" style="width: 100%;"
          name="client">
          <option value="">N/A</option>
          @foreach ($client_types as $client_type)
           <option value="{{ $client_type->id }}">{{ strtoupper($client_type->name) }}
           </option>
          @endforeach
         </select>
        </div>
        <br>
       </div> --}}

       {{-- <div class="form-group client">
        <div class="">
         <label for="client">Client. </label>
         <select id="client" class="form-control select2 clt" data-placeholder="Select Client"
          style="width: 100%;" name="client">
          <option value="0" id="loading" disabled>Select Client Type</option>

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

       <div class="form-group">
        <label for="clerk"> Clerk:</label>
        <input type="text" class="form-control" id="clerk" name="clerk" placeholder="Clerk" required>
       </div>
       <br>
       @if (Auth::user()->shed_id == 48)
        <div class="form-group">
         <label for="gang"> Gang:</label>
         <input type="text" class="form-control" id="gang" name="gang" placeholder="Gang" required>
        </div>
        <br>
       @endif
       <div class="form-group">
        <label for="description">Description: </label>
        <textarea class="form-control" id="description" name="description" placeholder="" rows="4"></textarea>
       </div>

      </div>

     </div>
    </div>

    <!-- /.box-body -->
    <div class="box-footer">
     <button type="submit" class="btn btn-primary" id="verify_submit">Submit</button>
    </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');
   $('.hise').hide();
   $('.spe').removeAttr('required');
   $('.client').hide();
   $('.clt').removeAttr('required');
   $('.select2').select2();


   $('#cocoa_type').on('change', function(event) {
    event.preventDefault();
    /* Act on the event */
    cocoa_type = $('#cocoa_type').val();
    if (cocoa_type == 1) {
     $('.hise').hide();
     $('.spe').removeAttr('required');

    } else {
     $('.hise').show();
     $('.spe').prop('required', true);
    }
   });

   $('#specialty').on('change', function(event) {
    event.preventDefault();
    specialty_type = $('#specialty').val();
    var token = $('input[name="_token"]').val();

    $.ajax({
     url: '{{ url('client_count') }}',
     type: 'get',
     data: {
      token: token,
      specialty_type: specialty_type
     },
     success: function(data) {
      console.log(data);
      $('#client_count').html(data);
      val = parseInt(data);

      if (val == 0) {
       $('.client').hide();
       $('.clt').removeAttr('required');
      } else {
       $('.client').show();
       $('.clt').prop('required', true);
       var token = $('input[name="_token"]').val();

       $.ajax({
        url: '{{ url('specialty_client_options') }}',
        type: 'get',
        data: {
         token: token,
         special: special
        },
        success: function(data) {

         console.log(data);

         $('#client').html(data);

        }
       });
      }
     }
    });

   });

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

   bags_remaining = $('#bags_remaining').val();
   $('#lb').html(bags_remaining);
   $('#lb').val(bags_remaining);

   $('#quantity').on('input', function(event) {
    value = $(this).val();
    lb = $('#lb').val();
    lb = parseInt(lb);

    max_value = lb;
    if ((value !== '') && (value.indexOf('.') === -1)) {

     $(this).val(Math.max(Math.min(value, max_value), -max_value));

    }
   });

   $('#verify_submit').on('click', function(event) {
    amount = $('#quantity').val();

    if (amount == 0 || amount == '') {
     alert('Quantity cannot be Zero!!');
     return false;

    } else
     return true;



   });
  })
 </script>
@endsection