@extends('layout.master')

@push('plugin-styles')
  <link href="{{ asset('assets/plugins/datatables-net-bs5/dataTables.bootstrap5.css') }}" rel="stylesheet" />
  <link href="{{ asset('assets/plugins/@mdi/css/materialdesignicons.min.css') }}" rel="stylesheet" />
@endpush

@section('content')
<nav class="page-breadcrumb">
  <ol class="breadcrumb">
    <li class="breadcrumb-item"><a href="#">Logistik</a></li>
    <li class="breadcrumb-item"><a href="#">Storing ({{ $dataGudang->nama }})</a></li>
    <li class="breadcrumb-item active" aria-current="page">Rak</li>
  </ol>
</nav>

<div class="row">
  <div class="col-md-12 grid-margin stretch-card">
    <div class="card">
      <div class="card-header">
          <h4>Data Storing</h4>
        </div>
      <div class="card-body">
        <table id="datatable-serverside" class="table table-sm" style="width: 100%;">
          <thead>
            <tr>
              <th class="kolomNomor">No.</th>
              <th>Rak</th>
              <th>Deskripsi</th>
              <th class="kolomAksi">Aksi</th>
            </tr>
          </thead>
        </table>
      </div>
    </div>
  </div>
</div>
@endsection

@push('plugin-scripts')
  <script src="{{ asset('assets/plugins/datatables-net/jquery.dataTables.js') }}"></script>
  <script src="{{ asset('assets/plugins/datatables-net-bs5/dataTables.bootstrap5.js') }}"></script>
@endpush

@push('custom-scripts')
  <script src="{{ asset('assets/js/data-table.js') }}"></script>
  <script src="{{ asset('assets/js/sweet-alert.js') }}"></script>

  <script>
    var URLs = "{{ url('logistik/storing') }}";

    let datatable = $('#datatable-serverside').DataTable({
      lengthMenu: lengthMenuDatatable(),
      processing: true,
      serverSide: true,
      ajax: URLs+'/get-data-rak/{{ $dataGudang->id }}',
      columns: [
        {data: 'DT_RowIndex', name: 'id'},
        {data: 'rak', name: 'rak'},
        {data: 'deskripsi', name: 'deskripsi'},
        {data: 'aksi', name: 'aksi', searchable: false, orderable: false, class: 'text-center'},
      ],
    });
  </script>
@endpush