@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">EVACUATE FROM STACK</h3>
			

			<div class="box-tools pull-right">
				<a class="btn btn-danger" href="{{ route('shed.evacs.view') }}">Back to Transactions</a>

			</div>
		</div>
		 @include('includes.messages')
		<div class="box-body">
			<div class="nav-tabs-custom">
				<ul class="nav nav-tabs">
					
					<li class="active"><a href="#tab_1" data-toggle="tab" aria-expanded="true">VIEW EVACUATION REQUEST</a></li>

				</ul>
			</div>
			<div class="tab-content">
				
				<div class="tab-pane active" id="tab_1">
					
					
					<div class=" col-md-6">
						<form role="form" method="post" action="{{ route('store.truck.evacs.shed',$evac_truck) }}" enctype="multipart/form-data">
							{{csrf_field()}} {{method_field('POST')}}

							
							<div class="col-md-8">
								<div class="form-group">
									<label for="stack_id"> Select Stack:</label>
									<select style="width: 100%;" name="stack_id" id="stack_id" class="form-control select2">
										<option value="0" selected disabled>Select Stack</option>
										@foreach ($stacks as $stack)
										<option value="{{$stack->id}}">{{strtoupper($stack->stack_name)}} ({{ (($stack->waybill_stacks->sum('bags_quantity_added') -  $stack->waybill_stacks->sum('bags_quantity_evacuated')))}} bags available) </option>
										@endforeach
									</select>
									<br> <br>
								</div>
								
								<div class="form-group">
									<label for="date_evacuated"> Date Evacuated:</label>
									<input type="date" class="form-control" id="date_evacuated" name="date_evacuated" placeholder="date_evacuated">
								</div>

								<div class="form-group">
									<label for="cmcwaybill_no"> CMC Waybill number:</label>
									<input type="text" class="form-control" id="cmcwaybill_no" name="cmcwaybill_no" placeholder="cmcwaybill_no">
								</div>
								<br>
								<div class="form-group">
									<label for="bags_quantity_evacuated">Quantity of Bags Evacuated</label>
									<input type="number" class="form-control" id="bags_quantity_evacuated" name="bags_quantity_evacuated" placeholder="eg. 500" step="1">
								</div>

								<input type="hidden" value="{{$ta}}" name="ta" id="ta"> 

								<div class="form-group">
									<label for="season_id"> Select Season:</label>
									<select style="width: 100%;" name="season_id" class="form-control select2">
										<option value="0" 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">
									<label for="category_id"> Select Category:</label>
									<select style="width: 100%;" name="category_id" class="form-control select2">
										<option value="0" selected disabled>Select Category</option>
										@foreach ($categorys as $category)
										<option value="{{$category->id}}">{{$category->name}}</option>
										@endforeach
									</select>
									<br> <br>
								</div>

								<div class="form-group">
									<label for="grade"> Select grade:</label>
									<select style="width: 100%;" name="grade" class="form-control select2">
										<option value="0" selected disabled>Select grade</option>
										<option value="I">I</option>
										<option value="II">II</option>
										<option value="SS">SS</option>
									</select>
									<br> <br>
								</div>

								<input type="hidden" name="wpo_evacuation_id" value="{{$wpo_evacuation->id}}">

								<div class="form-group">
									<button id="verify_submit" type="submit" class="btn btn-primary">Submit</button>
								</div>
							</div>

						</form>
					</div>
					<div class="col-md-6 table-responsive">
						<table class="table table-bordered table-striped">
							<thead>
								<tr>
									<th>DESCRIPTION</th>
									<th>Bags</th>
									<th>Tonnes</th>
								</tr>
							</thead>
							<tbody>
								<tr style="color: red; font-weight: bold;">
									<td> REQUESTED </td>
									<td> {{$ta * 16}}</td>
									<td>{{$ta}} </td>
								</tr>
								<tr style="color: green; font-weight: bold;">
									<td> EVACUATED </td>
									<td>{{$total_bags_evavuated}}</td>
									<td> {{$total_bags_evavuated /16}}</td>
								</tr>
								<tr>
									<td style="color: black; font-weight: bold;">DIFFERENCE</td>
									<td>{{ $bate = (($ta * 16) - $total_bags_evavuated)}}</td>
									<td>{{$ta - ($total_bags_evavuated /16)}}</td>
								</tr>
								<tr>
									<td></td>
									<td></td>
									<td></td>
								</tr>
							</tbody>
							<tfoot>
								<tr>
									<th></th>
									<th>TRUCK NUMBER</th>
									<th>TRANS. CODE</th>
								</tr>
								<tr>
									<td></td>
									<td style="color: darkcyan; font-weight: bold;">{{strtoupper($evac_truck->trucklist->truck_no)}}</td>
									<td style="color: purple; font-weight: bold;">{{strtoupper($evac_truck->transaction_code)}}</td>
								</tr>
								
							</tfoot>
						</table>
						<input type="hidden"  name="ba" id="ba" value="{{$bate}}"> 
					</div>
					
				</div>
				
			</div>
		</div>
				
			<!-- /.box-body -->
			
	</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();

    $('#stack_id').on('change', function(event) {
    	//event.preventDefault();
    	/* Act on the event */
    	val = $(this).val();
    	//alert(val);
    	token = $("input[name='_token']").val();
    	//alert(token);
    	$.ajax({
    		url: "{{ route('get.bags.available')}}",
    		type: 'GET',
    		dataType: 'json',
    		data: {'stack_id':val, '_token':token},
    	})
    	.done(function(data) {
    		 //$('#ba').val(data.bags_available);
    		 //bal = $('#ba').val();
    		 //alert(bal);
    		console.log(data);
    	})
    	.fail(function() {
    		console.log("error");
    	})
    	.always(function() {
    		console.log("complete");
    	});
    	
    });

    $('#bags_quantity_evacuated').on('input',function(event) {
    		  value = $(this).val();
    		  ba = $('#ba').val();
    		  //wnob = $('#wnob').val();
    		  
              tr = ba;
    		  //tr = wnob - tnobs;
    		  
    		max_value = tr;
    		
    		if ((value !== '') && (value.indexOf('.') === -1)) {
        
        		$(this).val(Math.max(Math.min(value, max_value), -max_value));

   			 }


    	});

    $('#verify_submit').click(function(event) {
    	bags_quantity_added = $('#bags_quantity_evacuated').val();
    	//
    	//return false;
    	if (bags_quantity_added == 0 || bags_quantity_added =='' ) {
    		alert('Number of bags to evacuate cannot be zero!!');
    		return false;

    	}
    	else
    		return true;
    });
    
   
  })
</script>

@endsection