@extends('layouts.master')

@section('header-title')
	<span class="font-weight-semibold">Delivery Schedule </span>- Current Orders
@endsection

@section('content')


	<div class="card card-main">
		<div class="card-header header-elements-inline">
			<div class="mx-auto">
				<h3 class="card-title mt-2 font-weight-semibold">Current Orders</h3>
			</div>
			<div class="header-elements">
				<div class="list-icons">
					{{-- <a class="btn btn-outline-primary rounded-round" data-toggle="collapse" href="#info_collapse"><i class="icon-info22 mr-2"></i>More Info</a> --}}
            	</div>
        	</div>					
		</div>
		<div class="card-body">
			{{-- <p>Here you can see all the listings uploaded, and its history .</p> --}}
			<div class="collapse" id="info_collapse">
				<p> 
					• <br>
					• <br>
				</p>	
			</div>
			<form id="search_data_form">
				<div class="d-flex flex-wrap align-items-center">
					<div class="mx-2">
						<label class="col-form-label">Plant</label>
	                    <select required name="plant_id" class="form-control select" data-fouc>
	                    </select>
					</div>
					@if($user->is_internal)
					<div class="mx-2" style="min-width: 350px;">
						<label class="col-form-label">Supplier</label>
	                    <select name="supplier_plant_id" class="form-control select" data-fouc>
	                        <option value="">Select One</option>
	                    </select>
					</div>
					@endif
					<div class="mx-2 mt-4 pt-1">
						<button data-style="zoom-in" type="submit" class="btn bg-primary btn-ladda btn-ladda-spinner mr-2"><i class="icon-search4 mr-2"></i> Search</button>
					</div>
					<div class="mx-2 mt-4 pt-1">
						@component('components.button', ['type'=>'download'])@endcomponent
					</div>					
				</div>
			</form>
		</div>
		<div class="card-body pb-0">
			<div class="alert alert-info text-left border-0">
				- Columns with <span class="text-primary-800 font-weight-semibold"> background in blue color </span> are the firm period. Following columns are forecast quantities.<br>
				- Firm Period will still have changes, these should be within the period and not to exceed a certain %, monitor each release to have the most updated information.<br>
				- <span class="font-weight-semibold">Urgent Column: </span> Orders in this column are additional to x date quantity.<br>
				- All products shipped must be PPAP approved.<br>
				- The day is according to Katcon Plant's Timezone.

			</div>
		</div>

		<div class="table-responsive border-0">
			<table id="main_datatable" class="table table-hover main-datatable datatable-header-basic text-center">
				<thead>
					<tr>
						@if($user->is_internal)
						<th>Listing Id</th>
						@endif
						<th>Supplier</th>
						<th>Uploaded By</th>
						<th>Uploaded Date</th>
						<th>Part No.</th>
						<th>Description</th>
						<th>Units</th>
						<th>Plant</th>
						<th>EXW</th>
						<th>Service Part</th>
						<th>Standard Pack</th>
						@foreach($current_orders->custom_columns as $key => $value)
							<th>{{$key}}</th>
						@endforeach
						<th>Priority</th>
						<th>Transit</th>
						<th >Urgent</th>
						@php
							$firm_period = $current_orders->orders->first() ? $current_orders->orders->first()->created_at->addMonths(1)->endOfDay() : false;
						@endphp
						@foreach($current_orders->dates_quantity_columns as $key => $value)
							@php
								$class = '';
								$text = 'Forecast';
								if($firm_period){
									if(\Carbon\Carbon::createFromFormat('d/m/Y',$key)->lte($firm_period))
									{
										$text = 'Firm Period';
										$class = 'alpha-primary text-primary-800 font-weight-semibold';
									}
								}
							@endphp
							<th class="{{$class}}">{{$key}}<br>{{$text}}</th>
						@endforeach
						<th class="alpha-slate text-slate-800 font-weight-semibold">Total General</th>
			        </tr>		        
				</thead>
				<tfoot class="footer-searchable">
					<tr>
						@if($user->is_internal)
						<td>Listing Id</td>
						@endif						
						<td>Supplier</td>
						<td>Uploaded By</td>
						<td>Uploaded Date</td>
						<td>Part No.</td>
						<td>Description</td>
						<td>Units</td>
						<td>Plant</td>
						<td>EXW</td>
						<td>Service Part</td> 
						<td>Standard Pack</td>
						@foreach($current_orders->custom_columns as $key => $value)
						<td>{{$key}}</td>
						@endforeach
						<td>Priority</td>
						<td>Transit</td>
						<td style="background-color: white!important;">Urgent</td>
						@foreach($current_orders->dates_quantity_columns as $key => $value)
						<td style="background-color: white!important;">{{$key}}</td>
						@endforeach
						<td style="background-color: white!important;">Total General</td>
			        </tr>
				</tfoot>
			</table>
		</div>
	</div>


@endsection

@section('plugin-scripts')

	@include('scripts.datatablesjs')

@endsection


@section('app-scripts')
	<script type="text/javascript">
		const PLANT_ID = {{$plant_id}};
		const CURRENT_ORDERS = {!! json_encode($current_orders) !!};
		const SUPPLIER_PLANT_ID = {{$supplier_plant_id}};
	</script>
	<script src="{{mix('js/deliveryschedule/current_orders.js')}}"></script>

@endsection