@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" 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">
												<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>Petugas</th>
														@if(Auth::user()->akses == "SUPERUSER")
															<th>Flag</th>
														@endif
														<th>Detail</th>
														
													</tr>
												</thead>
												<tbody>
													@foreach($data as $d)
													
													<tr>
														<td>{{ $d->site_id }} {{ $d->sitename }}</td>
														<td>{{ $d->qrcode }}</td>
														<td>{{ date_format(date_create($d->datetimein),'d-M-Y H:i:s') }}</td>
														<td>{{ date_format(date_create($d->datetimeout),'d-M-Y H:i:s') }}</td>
														<td>{{ $d->vehicle }}</td>
														<td>{{ $d->policeno }}</td>
														<td>{{ number_format($d->parking_fee) }}</td>
														<td>{{ $d->userout }}</td>
														@if(Auth::user()->akses == "SUPERUSER")
														<td>{{ $d->flag }}
														@if($d->flag == 0)
															<button type='button' class='btn btn-warning btn-xs' onclick="changeFlag('{{ $d->qrcode }}')">Change Flag</button>
														@else
															<button type='button' class='btn btn-info btn-xs' onclick="undoFlag('out','{{ $d->qrcode }}')">Undo Flag</button>
														@endif
													
													</td>
														@endif
														<td><a data-toggle="modal" data-target=".bd-example-modal-lg" onclick="detail('{{$d->site_id}}','{{$d->qrcode}}')" class="btn btn-primary btn-xs">Detil</a></td>
														
														
													</tr>
													@endforeach
												</tbody>
											</table>
											<h4>Total {{number_format($data->total())}}</h4>
											<div class="pagination">
											<div class="d-flex justify-content-center">
												{!! $data->links('pagination::bootstrap-4') !!}
											</div>
											</div>
	<script>
	function changeFlag(id){
		
		
		swal({
      //title: 'Are you sure?',
      text: "Proses ubah flag transaksi?",
      type: 'question',
      showCancelButton: true,
      confirmButtonColor: '#0CC27E',
      cancelButtonColor: '#FF586B',
      confirmButtonText: 'Yes',
      cancelButtonText: "Cancel"
    }).then(function (isConfirm) {
      if (isConfirm) {
        $.ajaxSetup({
				headers: {
					'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
				}
			});
			$.ajax({
			type : "POST",
			url  : "{{url('setflag')}}",
			data : {id:id},
			beforeSend: function() {
				
			},
			success: function(data){
				window.location.href="";
			}
		});
      }
    }).catch(swal.noop);
	
	
	
	}
	
	function undoFlag(table,id){

		swal({
      //title: 'Are you sure?',
      text: "Proses undo flag transaksi?",
      type: 'question',
      showCancelButton: true,
      confirmButtonColor: '#0CC27E',
      cancelButtonColor: '#FF586B',
      confirmButtonText: 'Yes',
      cancelButtonText: "Cancel"
    }).then(function (isConfirm) {
      if (isConfirm) {
        $.ajaxSetup({
				headers: {
					'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
				}
			});
			$.ajax({
			type : "POST",
			url  : "{{url('undo_flag')}}",
			data : {table:table,id:id},
			beforeSend: function() {
				
			},
			success: function(data){
				window.location.href="";
			}
		});
      }
    }).catch(swal.noop);
	
	
	
	}
	

	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>