@extends('layouts.app')

@section('content')
 <div class="row">
        
	<div class="col-md-8">	  
		  <div class="card">
		  <div class="card-header">
		  PerTenant
		  </div>
		  <div class="card-body">
				<table class="table table-hover table-sm" id="tbldata">
				  <thead>
				  <tr>
				  <th>No</th>
				  <th>Nama Tenant</th>
				  <th>Jumlah Data</th>
				  </thead>
				  <tbody>
					<?php
					$a=array("warning","success","danger","primary","secondary");
					$random_keys=array_rand($a,5);
					$i = 0;
					$no = 0;
					
					 foreach($data as $r)
					 {
						 $no++;
						$i++; 
						if($i == 5){
							$i = 0;
						}
						?>
						
						<tr>
						<td><?php echo$no;?></td>
						<td><?php echo  $r->company_name;?></td>
						<td><span onclick="view({{$r->company_id}},'tenant')" class="badge bg-<?php echo $a[$random_keys[$i]];?> mr-2"><?php echo number_format($r->qty);?></td> 
						</tr>
					 <?php
					 }
					 
					 ?>
				  </tbody>
				  </table>
				  
				  </div>
		  </div>
		</div>
		  <div class="col-sm-4">
		   <div class="card">
			  <div class="card-header">
			  PerProduk
			  </div>
			  <div class="card-body">
					<table class="table table-hover table-sm table-responsive" id="tblproduk">
				  <thead>
				  <tr>
				  <th>No</th>
				  <th>Nama Produk</th>
				  <th>Jumlah Data</th>
				  </thead>
				  <tbody>
					<?php
					$no  = 0;
					$a=array("warning","success","danger","primary","secondary");
					$random_keys=array_rand($a,5);
					$i = 0;
					
					 foreach($produk as $r)
					 {
						$i++; 
						if($i == 5){
							$i = 0;
						}
						$no++;
						?>
						<tr>
						<td><?php echo$no;?></td>
						<td><?php echo  $r->productname;?></td>
						<td><span  onclick="view('{{$r->productcode}}','produk')" class="badge bg-<?php echo $a[$random_keys[$i]];?> mr-2 float-right"><?php echo number_format($r->qty);?></span> </td>
						</tr>
						
					 <?php
					 }
					 
					 ?>
				  </tbody>
				  </table>
				  </div>
			</div>
			
	
	</div>
		
</div>
	

@endsection
@section('custom-script')
<script>
$(function () {
	$('#tbldata').DataTable({
      "paging": false,
      "lengthChange": false,
      "searching": true,
      "ordering": false,
      "info": false,
      "autoWidth": false,
      "responsive": true,
    });
	$('#tblproduk').DataTable({
      "paging": false,
      "lengthChange": false,
      "searching": false,
      "ordering": false,
      "info": false,
      "autoWidth": false,
      "responsive": true,
    });
});
function view(id,type){
	 $("#myModal").modal('show');
		$.ajaxSetup({
			headers: {
				'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
			}
		});
		$.ajax({
			type : "POST",
			url  : "{{url('nopol/detail')}}",
			data : {id:id,type:type},
			beforeSend: function() {
					$("#divrs").html("<p>Please wait..</p>");
			},
			success: function(data){
				$("#divrs").html(data);
				$('#tbldetail').DataTable({
				  "paging": false,
				  "lengthChange": false,
				  "searching": true,
				  "ordering": false,
				  "info": false,
				  "autoWidth": false,
				  "responsive": true,
				});
			}
		});
}

</script>
@endsection

<div class="modal fade" id="myModal" style="z-index:99999">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <!-- Modal Header -->
            <div class="modal-header">
                <h4 class="modal-title">Detil Langganan</h4>
                <button type="button" class="close" data-dismiss="modal">&times;</button>
            </div>
            
            <!-- Modal Body -->
            <div class="modal-body">
                <div id="divrs"></div>
            </div>
            
            <!-- Modal Footer -->
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>