@extends('dashboard.utama')
@section('content')
<div class="card shadow">
    <div class="card-body">
      <div class="toolbar row mb-3">
        <div class="col">
          <form class="form-inline">
            <div class="form-row">
            </div>
          </form>
        </div>
        <div class="col ml-auto">
        </div>
      </div>
      <!-- table -->
      <table class="table datatables" id="dataTable-1">
        <thead>
         
          <tr role="row">
            <th style="width: 20px;" >#</th>
            <th style="width: 70px;">No Bon</th>
            <th style="width: 50px;">No pel</th>
            <th style="width: 70px;">Tgl Terima</th>
            <th style="width: 140px;" >Nama</th>
            <th style="width: 150px;">Alamat</th>
            <th style="width: 100px;">Merk</th>                      
            <th style="width: 30px;">UK</th>
            <th style="width: 40px;">No.Seri</th>
            <th style="width: 40px;" >Stand</th>
            <th  style="width: 50px;">Hasil Tera</th>
            <th style="width: 70px;">Tgl Sls</th>                      
            <th style="width: 170px;">Catatan</th>
          </tr>
        </thead>
        <tbody>
            @foreach ($data as $laporan)

                          
            <tr>
                <td style="width: 20px;">{{$nomor++}}</td>
                <td style="width: 70px;">{{$laporan->nobonp}}</td>
                <td style="width: 50px;">{{$laporan->nopel}}</td>
                <td style="width: 70px;">{{$tgltrm}}</td>
                <td style="width: 150px;">{{$laporan->namapel}}</td>
                <td style="width: 150px;">{{$laporan->alamatpel}}</td>
                <td style="width: 100px;">{{$laporan->namamerek}}</td>                  
                <td style="width: 30px;">{{$laporan->kodeukuran}}</td>
                <td style="width: 40px;">{{$laporan->nometer}}</td>
                <td style="width: 50px;">{{$laporan->stand}}</td>
                <td style="width: 100px;">{{$laporan->hasiltera}}</td>                  
                <td style="width: 70px;">{{$tglsls}}</td>                                                        
                <td style="width: 170px;">{{$laporan->keterangan}}</td>
            </tr>

        @endforeach          
        </tbody>
      </table>
    </div>
  </div>
</div> <!-- simple table -->
</div> <!-- end section -->
@endsection
@section('page_javascripts')   
<script>
$(document).ready(function() {
  // $('#dataTable-1').DataTable(
  // {
  //   autoWidth: true,
  //   "lengthMenu": [
  //     [16, 32, 64, -1],
  //     [16, 32, 64, "All"]
  //   ]
  // });
    document.getElementById("navbar").classList.add("collapsed");
    var table = $('#dataTable-1').DataTable( {
        dom: 'Bfrtip',
        buttons: [
            {
                 extend: 'pdfHtml5',
                orientation: 'landscape',
                pageSize: 'LEGAL',
               
                messageTop: 'TREKAP HASIL TERA/PERIKSA'
            },
            'colvis'
        ]
    } );
} );    
</script>


@endsection