@extends('layouts.app')

@section('content')

										<div class="row">
											<div class="col-sm-6">
													
											</div>
											<div class="col-sm-6 text-right">
											<form action="" >
														 <div class="input-group">
														<input type="text" name="q" id="q" placeholder="Pencarian.." class="form-control" value="" /> 
														<div class="input-group-append">
                      <input type="submit" class="btn btn-danger" value="Search"/> 
                    </div></div>
														
														
													</form>
													
											</div>
											</div>
											<table class="table" id="tbldata">
												<thead>
													<tr>
														<th>Lokasi</th>
														<th>No Tiket</th>
														<th>Waktu Masuk</th>
														<th>Waktu Keluar</th>
														<th>Paket</th>
														<th>No Polisi</th>
														<th>Biaya</th>
														<th>Detail</th>
														
													</tr>
												</thead>
												<tbody>
												</tbody>
											</table>
											</div>
	<script>
	$(document).ready(function (){
		 load();
		setInterval(load, 10000);
	});
   
   function load(){
	   var s = $("#q").val();
	   
		$.ajaxSetup({
			headers: {
				'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
			}
		});
		$.ajax({
			type : "POST",
			url  : "{{url('transaksi/vehicle_outm')}}",
			data : {q:s},
			beforeSend: function() {
				//NProgress.start(); 	
			},
			success: function(data){
				$("#tbldata tbody").empty();
				$("#tbldata tbody").append(data);
			}
		});
	}
	

	function detail(kdsite,id){
		$.ajaxSetup({
			headers: {
				'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
			}
		});
		$.ajax({
			type : "POST",
			url  : "{{url('transaksi/vehicle_out/detail')}}",
			data : {kdsite:kdsite,id:id},
			beforeSend: function() {
					//NProgress.start(); 	
			},
			success: function(data){
				//NProgress.done(); 
				var obj = jQuery.parseJSON( data );
				$("#no_tiket").html(obj.qrcode);
				$("#no_polisi").html(obj.policeno);
				$("#waktu_masuk").html(obj.datetimein);
				$("#waktu_keluar").html(obj.datetimeout);
				$("#nama_paket").html(obj.vehicle);
				$("#lobby").html(obj.lobby_name);
				
				var img_list = "<a href='https://app.vrtech.my.id/uploads/"+obj.img_in+"' target='new'><img src='https://app.vrtech.my.id/uploads/"+obj.img_in+"' height=100></a><br><br>";
				$("#foto").html(img_list);
			}
		});
	}
	</script>
@endsection	


<div class="modal fade fade-in bd-example-modal-lg" style="z-index:9999" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
								<div class="modal-dialog modal-lg">
									<div class="modal-content">
										<div class="modal-header">
											<h5 class="modal-title" id="exampleModalLongTitle">Detail Kendaraan</h5>
											<button type="button" class="close" data-dismiss="modal" aria-label="Close">
												<span aria-hidden="true">&times;</span>
											</button>
										</div>
										<div class="modal-body">
											<table class="table table-striped">
												<tr><td width=150>No Tiket</td><td><span id="no_tiket"></span></td></tr>
												<tr><td>No Polisi</td><td><span id="no_polisi"></span></td></tr>
												<tr><td>Waktu Masuk</td><td><span id="waktu_masuk"></span></td></tr>
												<tr><td>Waktu Keluar</td><td><span id="waktu_keluar"></span></td></tr>
												<tr><td>Paket</td><td><span id="nama_paket"></span></td></tr>
												<tr><td>Lobby</td><td><span id="lobby"></span></td></tr>
												<tr><td>Foto Kendaraan</td><td><div id="foto"></div></td></tr>
													
											</table>
										</div>
										<div class="modal-footer">
											<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
										</div>
									</div>
								</div>
							</div>