@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 active" aria-current="page">Stok Opname (Lokasi)</li>
  </ol>
</nav>

<div class="row">
  <div class="col-md-12 grid-margin stretch-card">
    <div class="card">
      <div class="card-header">
          <h4>Data Stok Opname (Lokasi)</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>Gudang</th>
              <th>Rak</th>
              <th>Tanggal Stok Opname</th>
              <th>Pelaksana</th>
              <th class="kolomAksi">Aksi</th>
            </tr>
          </thead>
        </table>
      </div>
      <div class="card-footer" style="text-align: right;">
        <a class="btn btn-info btn-custom1" href="stok-opname-lokasi/input">Tambah Data</a>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="JurnalModal">
	<div class="modal-dialog modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title h4">Laporan Jurnal</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="btn-close"></button>
      </div>
      <div class="modal-body"></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/stok-opname-lokasi') }}";

    let datatable = $('#datatable-serverside').DataTable({
      processing: true,
      serverSide: true,
      ajax: URLs+'/get-data',
      columns: [
        {data: 'DT_RowIndex', name: 'id'},
        {data: 'nama_gudang', name: 'nama_gudang'},
        {data: 'rak', name: 'rak'},
        {data: 'tanggal_stok_opname', name: 'tanggal_stok_opname'},
        {data: 'pelaksana', name: 'pelaksana'},
        {data: 'aksi', name: 'aksi', searchable: false, orderable: false, class: 'text-center'},
      ],
    });

    function hapusData(id) {
        swal({
            title: "Konfirmasi",
            text: "Apakah anda ingin menghapus data ?",
            type: "warning",
            showCancelButton: true,
            cancelButtonText: "Batal",
            confirmButtonText: "Lanjutkan"
        }).then(function() {
            var data = {
                id: id,
                _token: '{{ csrf_token() }}'
            };
            sendJson(URLs + "/delete", data, rSends);
        })
    }

    function lihatJurnal(id) {
      $('#JurnalModal').modal('show');
      let modal = $('#JurnalModal');
      modal.find('.modal-body').html('<div class="text-center"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div></div>');

      $.ajax({
        method: "GET",
        url: "{{ url('jurnal/stok-opname-lokasi') }}",
        data: {
          stok_opname_lokasi_id: id,
        },
        success: function(result) {
          if(result.type == 'error'){
            modal.find('.modal-body').html(result.response);
          }else{
            modal.find('.modal-body').html(result)
          }
        },
        error: function(xhr, status, error) {
          console.log(xhr);
          modal.find('.modal-body').html(xhr.responseText);
        }
      })
    }
  </script>
@endpush