@extends('layouts.master')
@section('title','Komoditi')
@section('content')
        
        
        <!-- Content -->
        <div class="content">
            <div class="animated fadeIn">
                <div class="row">

                    <div class="col-md-12">
                        <div class="card">
                            <div class="card-header">
                                <strong class="card-title">Data Lokasi</strong>
                            </div>
                            <div class="card-body">
                               
                                <a href="{{ route('location.create') }}" class="btn btn-primary mb-3">Tambah</a>
                                <div class="table-responsive">
                                <table id="dataTable" class="table table-striped table-bordered">
                                    <thead>
                                        <tr>
                                            <th>No.</th>
                                            <th>Nama</th>
                                            <th>Deskripsi</th>
                                            
                                            <th>Action</th>
                                        </tr>
                                    </thead>
                                   
                                </table>
                                </div>
                            </div>
                        </div>
                    </div>


                </div>
            </div><!-- .animated -->
        </div><!-- .content -->
        <!-- /.content -->
@section('js')
<script>
  $(document).ready(function() {
    var t = $('#dataTable').DataTable({
        processing: true,
        serverSide: true,
        ajax: "{{ route('location.getData') }}",
        columns: [
            {
                data: null,
                name: 'rownum',
                orderable: false,
                searchable: false,
                render: function(data, type, row, meta) {
                    return meta.row + meta.settings._iDisplayStart + 1;
                }
            },
            { data: 'name', name: 'name' },
            { data: 'description', name: 'description' },
            
            { data: 'action', name: 'action', orderable: false, searchable: false }
        ]
    });
});

</script>
@endsection
@endsection