@extends('layouts.index')

@section('header')
<div class="row align-items-center py-4">
	<div class="col-lg-6 col-7">
		<h6 class="h2 text-white d-inline-block mb-0"> {{$title}} </h6>
		<nav aria-label="breadcrumb" class="d-none d-md-inline-block ml-md-4">
			<ol class="breadcrumb breadcrumb-links breadcrumb-dark">
				<li class="breadcrumb-item"><a href="{{url($url)}}"><i class="fas fa-home"></i></a></li>
				<li class="breadcrumb-item active" aria-current="page">{{$menu}}</li>
			</ol>
		</nav>
	</div>
</div>
@endsection

@section('content')
<div class="row">
	<div class="col-xl-12">
		<div class="card">
			<div class="card-header">
				<div class="card-header border-0">
				  <h3 class="mb-2">Antrian Driver & Kendaraan</h3>

				  <h5 class="mb-0">Kendaraan Ready : {{ $jumlahArmadaAbsen }}</h5>
				  <h5 class="mb-0">Kapasitas Ready : {{ $jumlahKapasitasAbsen }}</h5>
				</div>
			</div>
			<div class="table-responsive">
				<table class="table table-flush" id="datatable-basic">
					<thead class="thead-light">
						<tr>
							<th> No </th>
							<th> Nama Supir </th>
							<th> Nopol Kendaraan </th>
							<th> Jenis Kendaraan </th>
							<th> Nama Ekspedisi </th>
							<th> Jam Masuk Antrian </th>
						</tr>
					</thead>
					<tbody>
						@foreach ($users as $u)
							<tr>
								<td>{{ $loop->iteration }}</td>
								<td>{{ $u->nama }}</td>
								@if (@$u->last_transaksi_data[0])
									<td>
										{{ @$u->last_transaksi_data[0]->armada->nomor_armada}}
									</td>
									<td>{{ @$u->last_transaksi_data[0]->armada->jenis_armada }}</td>
									<td>{{ @$u->last_transaksi_data[0]->armada->perusahaan->nama_perusahaan }}</td>
								@else
									<td colspan="3" class="text-center">
										<i class="text-danger" style="font-size: 13px;">{{ @$u->last_transaksi_data[0]->armada->nomor_armada ?? 'Silahkan Atur Kendaraan di Menu "Penjadwalan"' }}</i>
									</td>
								@endif
								<td>{{ @$u->absen[0]->created_at->format('H:i') }}</td>
							</tr>	
						@endforeach
					</tbody>
				</table>
			</div>
		</div>
	</div>

	<div class="col-xl-12">
		<div class="card">
			<div class="card-header">
				<div class="card-header border-0">
				  <h3 class="mb-2">Kesiapan Kendaraan</h3>
				  <h5 class="mb-0">Kendaraan Ready : {{ $jumlahArmadaReady }}</h5>
				  <h5 class="mb-0">Kapasitas Ready : {{ $jumlahKapasitas }}</h5>
				</div>
			</div>
			<div class="table-responsive">
				<table class="table table-flush datatable" >
					<thead class="thead-light">
						<tr>
							<th> No </th>
							<th> Nopol Kendaraan </th>
							<th> Jenis Kendaraan </th>
							<th> Kapasitas </th>
							<th> Nama Ekspedisi </th>
							<th> status </th>
						</tr>
					</thead>
					<tbody>
						@foreach ($armadas as $armada)
							<tr>
								<td>{{ $loop->iteration }}</td>
								<td>{{ @$armada->nomor_armada }}</td>
								<td>{{ $armada->jenis_armada }}</td>
								<td>{{ $armada->kapasitas }}</td>
								<td>{{ $armada->perusahaan->nama_perusahaan }}</td>
								<td>
									@if ($armada->status == 'Ready')
										<button class="btn btn-success btn-sm"> Ready </button>
									@elseif($armada->status == 'Under Repair')
										<button class="btn btn-danger btn-sm"> Under Repair </button>
									@else
										<button class="btn btn-primary btn-sm"> On A Trip </button>
									@endif
								</td>
							</tr>	
						@endforeach
					</tbody>
				</table>
			</div>
		</div>
	</div>
</div>

@endsection

@push('scripts')
<script>
	$('.datatable').DataTable();
	console.log($('.datatable'));
</script>
@endpush