@extends('layout.master-laporan')

@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">Info Stok Barang Ready</li>
    </ol>
  </nav>

  <div class="row">
    <div class="col-md-12 grid-margin stretch-card">
      <div class="card">
        <div class="card-header bg-white">
          <div class="row">
            <div class="col-12">
              <h6 class="card-title">Info Stok Barang Ready</h6>
            </div>
            <div class="col-12 col-md-4">
              <div class="mb-2">
                <select name="supplier_filter" id="supplier_filter" class="form-control select2Custom">
                  <option value="">Pilih Supplier</option>
                  @foreach ($dataSupplier as $item)
                    <option value="{{ $item->id }}">{{ $item->nama }}</option>
                  @endforeach
                </select>
              </div>
            </div>
            <div class="col-12 col-md-5">
              <div class="mb-2">
                <select name="status_filter" id="status_filter" class="form-control select2Custom">
                  <option value="">Pilih Status Stok</option>
                  <option value="Stok Habis">Stok Habis</option>
                  <option value="Stok Hampir Habis">Stok Hampir Habis</option>
                  <option value="Stok Kurang">Stok Kurang</option>
                  <option value="Stok Aman">Stok Aman</option>
                </select>
              </div>
            </div>
            <div class="col-12 col-md-3">
              <div class="row">
                <div class="col-6 pe-1">
                  <button type="button" id="btnFilter"
                    class="btn btn-primary btn-custom1 btn-custom2 w-100">Filter</button>
                </div>
                <div class="col-6 ps-1">
                  <button type="button" class="btn btn-light btn-custom8 w-100" onclick="filterReset()">Reset</button>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="card-body">
          <div class="table-responsive">
            <table id="datatable-serverside" class="table" style="width: 100%;">
              <thead>
                <tr>
                  <th class="kolomNomor">No.</th>
                  <th>Nama Barang</th>
                  <th>Supplier / Alias</th>
                  <th>Dipesan</th>
                  <th>Diterima</th>
                  <th>Stok</th>
                  <th>AVG Cost (Perpetual)</th>
                  <th>Sisa Stok (Perpetual)</th>
                  <th>AVG Cost (Periodic)</th>
                  <th>Sisa Stok (Periodic)</th>
                  <th>Keterangan</th>
                  <th class="kolomAksi">Aksi</th>
                </tr>
              </thead>
            </table>
          </div>
        </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/info-stok-barang') }}";

    let datatable = $('#datatable-serverside').DataTable({
      lengthMenu: lengthMenuDatatable(),
      processing: true,
      serverSide: true,
      ajax: URLs + '/get-data',
      searching: false,
      columns: [{
          data: 'DT_RowIndex',
          name: 'id'
        },
        {
          data: 'nama_barang',
          name: 'nama_barang'
        },
        {
          data: 'supplier',
          name: 'supplier'
        },
        {
          data: 'dipesan',
          name: 'dipesan'
        },
        {
          data: 'diterima',
          name: 'diterima'
        },
        {
          data: 'stok',
          name: 'stok'
        },
        {
          data: 'hpp_perpetual',
          name: 'hpp_perpetual',
          class: 'text-end',
          searchable: false,
          orderable: false,
          visible: boolPhpToJs("{{ (in_array($GlobalVar->hpp_setting, ['perpetual', 'testing']) && auth()->user()->can('hpp.view')) || ($GlobalVar->hpp_setting == 'testing') }}"),
        },
        {
          data: 'sisa_stok_perpetual',
          name: 'sisa_stok_perpetual',
          class: 'text-end',
          visible: boolPhpToJs("{{ (in_array($GlobalVar->hpp_setting, ['perpetual', 'testing']) && auth()->user()->can('hpp.view')) || ($GlobalVar->hpp_setting == 'testing') }}"),
        },
        {
          data: 'hpp_periodic',
          name: 'hpp_periodic',
          class: 'text-end',
          searchable: false,
          orderable: false,
          visible: boolPhpToJs("{{ (in_array($GlobalVar->hpp_setting, ['periodic', 'testing']) && auth()->user()->can('hpp.view')) || ($GlobalVar->hpp_setting == 'testing') }}"),
        },
        {
          data: 'sisa_stok_periodic',
          name: 'sisa_stok_periodic',
          class: 'text-end',
          visible: boolPhpToJs("{{ (in_array($GlobalVar->hpp_setting, ['periodic', 'testing']) && auth()->user()->can('hpp.view')) || ($GlobalVar->hpp_setting == 'testing') }}"),
        },
        {
          data: 'keterangan',
          name: 'keterangan',
          searchable: false,
          orderable: false,
          class: 'text-center'
        },
        {
          data: 'actions',
          name: 'actions',
          searchable: false,
          orderable: false,
          class: 'text-center'
        },
      ],
    });

    $('#btnFilter').on('click', function(e) {
      var supplier_filter = $('#supplier_filter').val();
      var status_filter = $('#status_filter').val();
      if ((supplier_filter != null && supplier_filter != '') || (status_filter != null && status_filter != '')) {
        var URL_filter = URLs + "/get-data" +
          `?supplier=${$('#supplier_filter').val()}&status=${$('#status_filter').val()}`;
        datatable.ajax.url(URL_filter).load();
      } else {
        swal('Perhatian', 'Pastikan Sudah Memilih Supplier ataupun Status Stok', 'info');
      }
    });

    function filterReset() {
      $('#supplier_filter').val('').trigger('change');
      $('#status_filter').val('').trigger('change');
      datatable.ajax.url(URLs + "/get-data").load();
    }

    @canany(['hpp.create', 'hpp.edit'])
      const recalculateHpp = (id) => {
        swal({
          title: 'Perhatian',
          text: 'Apakah Anda Yakin Ingin Menghitung Ulang HPP?',
          type: "warning",
          showCancelButton: true,
          cancelButtonText: "Batal",
          confirmButtonText: "Lanjutkan"
        }).then(() => {
          sendJson(URLs + '/recalculate-hpp/' + id, {
            _token: '{{ csrf_token() }}'
          });
        }).catch(swal.noop);
      }
    @endcanany
  </script>
@endpush