@extends('layouts.master')

@section('header-title')
	<span class="font-weight-semibold">Supplier Quality</span> - Other Configuration
@endsection

@section('content')


	<div class="card card-main ">
		<div class="card-header header-elements-inline">
			<h4 class="card-title">Supplier Quality Internal Contact</h4>
			<div class="header-elements">
				<div class="list-icons">
		            <a class="list-icons-item" data-action="collapse"></a>
					{{-- <a class="btn btn-outline-primary rounded-round" data-toggle="collapse" href="#info_collapse2"><i class="icon-info22 mr-2"></i>More Info</a> --}}
            	</div>
        	</div>
		</div>

		<div class="card-body">
			<p>Here you can select the titles of the users that are the internal contacts, which are showed in the Scorecard page.</p>
			<div class="collapse" id="info_collapse2">
				<p> 
					• <br>
				</p>			
			</div>
		</div>

		<div class="pb-3">
			<table class="table">
				<thead>
					<tr>
			            <th style="">Plant</th>
			            <th style="width: 600px;">Title</th>
					</tr>
				</thead>
				<tbody>

					@foreach($plants as $plant)
					<tr data-plant_id="{{$plant->id}}">
						<td>{{$plant->name }}</td>
						<td>
							<div>
			                    <select multiple="multiple" class="form-control select select-sqe" data-fouc>
			                    	<option value="" disabled>Select One</option>
			                    	@foreach($titles->where('department.plant_id',$plant->id) as $title)
										@if(in_array($title->id, $internal_contacts[$plant->id] ))
			                    			<option value="{{$title->id}}" selected>{{$title->name}} - {{$title->user->full_name}}</option>
			                    		@else
			                    			<option value="{{$title->id}}">{{$title->name}} - {{$title->user->full_name}}</option>
			                    		@endif
			                    	@endforeach
			                    </select>
							</div>
						</td>
					</tr>
					@endforeach

				</tbody>
			</table>
		</div>
	</div>


	<!-- Scrollable datatable -->
	<div class="card card-main ">
		<div class="card-header header-elements-inline">
			<h4 class="card-title">Background Tasks</h4>
			<div class="header-elements">
				<div class="list-icons">
		            <a class="list-icons-item" data-action="collapse"></a>
            	</div>
        	</div>
		</div>

		<div class="card-body">
			Here you can see all the background tasks that are running on the system, you can activate or deactivate them.
		</div>

		<div class="table-responsive pb-3">
			<table id="background_tasks_table" class="table">
				<thead>
					<tr>
			            <th>Name</th>
			            <th>Description</th>
			            <th style="width: 500px;"><span class="ml-3">Plant Configuration</span></th>
					</tr>
				</thead>
				<tbody>

					@foreach($background_tasks as $task)
					<tr>
						<td>{{$task['name'] }}</td>
						<td>{{$task['description']}}</td>						
						<td>
							<table>
								<tbody>
									@foreach($plants as $plant)
										<tr data-task_id="{{$task['id']}}" data-plant_id="{{$plant->id}}">
											<td>{{$plant->name}}</td>
											<td data-task_field="active">
												<div class="form-check form-check-right form-check-switchery">
													@if($task['plants'][$plant->id]['active'] == true )
														<input type="checkbox" class="form-check-input-switchery" checked data-fouc>
													@else
														<input type="checkbox" class="form-check-input-switchery" data-fouc>
													@endif
													<label class="form-check-label">Active</label>
												</div>													
											</td>
											<td data-task_field="days">
												<div class="text-nowrap d-flex">
													<label class="col-form-label mr-3">Days</label>
													<input type="number" value="{{$task['plants'][$plant->id]['days']}}" class="form-control days-input" style="width: 100px">						
												</div>
											</td>
										</tr>
									@endforeach									
								</tbody>
							</table>
						</td>
					</tr>
					@endforeach

				</tbody>
			</table>
		</div>
	</div>
	<!-- /scrollable datatable -->

	<!-- Scrollable datatable -->
	<div class="card card-main ">
		<div class="card-header header-elements-inline">
			<h4 class="card-title">Automatic QPRs</h4>
			<div class="header-elements">
				<div class="list-icons">
		            <a class="list-icons-item" data-action="collapse"></a>
            	</div>
        	</div>
		</div>

		<div class="card-body">
			Here you can see all the automatic QPRs that are triggered by a bad evaluation, or other aspect.
		</div>

		<div class="table-responsive pb-3">
			<table id="automatic_qprs_table" class="table">
				<thead>
					<tr>
			            <th>Name</th>
			            <th>Description</th>
			            <th style="width: 400px;"><span class="ml-3">Plant Configuration</span></th>
					</tr>
				</thead>
				<tbody>

					@foreach($automatic_qprs as $item)
					<tr>
						<td>{{$item['name'] }}</td>
						<td>{{$item['description']}}</td>						
						<td>
							<table>
								<tbody>
									@foreach($plants as $plant)
										<tr data-item_id="{{$item['id']}}" data-plant_id="{{$plant->id}}">
											<td>{{$plant->name}}</td>
											<td data-item_field="active">
												<div class="form-check form-check-right form-check-switchery">
													@if($item['plants'][$plant->id]['active'] == true )
														<input type="checkbox" class="form-check-input-switchery" checked data-fouc>
													@else
														<input type="checkbox" class="form-check-input-switchery" data-fouc>
													@endif
													<label class="form-check-label">Active</label>
												</div>													
											</td>
										</tr>
									@endforeach									
								</tbody>
							</table>
						</td>
					</tr>
					@endforeach

				</tbody>
			</table>
		</div>
	</div>
	<!-- /scrollable datatable -->

@endsection

@section('plugin-scripts')

	@include('scripts.datatablesjs')

@endsection

@section('app-scripts')

    <script src="{{mix('js/supplierquality/other_configuration.js')}}"></script>

@endsection