@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>
									  </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>
									  </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('kartu/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>