@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"><a href="/logistik/info-stok-barang">Info Stok Barang</a></li>
      <li class="breadcrumb-item active" aria-current="page">{{ $produk->nama_produk }}</li>
    </ol>
  </nav>

  <div class="row">
    <div class="col-md-12 grid-margin stretch-card">
      <div class="card">
        <div class="card-body">
          <h6 class="card-title">Info Stok Barang ({{ $produk->nama_produk }})</h6>
          <div class="">
            <table id="datatable-serverside" class="table bg-white" style="width: 100%;">
              <thead class="table-primary">
                <tr>
                  <th class="kolomNomor">No.</th>
                  <th>Tanggal</th>
                  <th>Transaksi / No urut</th>
                  {{-- <th>No Urut</th> --}}
                  <th>QTY ({{ $produk->unit_satuan_stock }})</th>
                  <th>Harga</th>
                  <th>Total Harga</th>

                  <th>Cost (Perpetual)</th>
                  <th>Total Cost (Perpetual)</th>
                  <th>Cost (Periodic)</th>
                  <th>Total Cost (Periodic)</th>

                  <th>Sisa QTY</th>
                  <th>Avg Cost (Perpetual)</th>
                  <th>Sisa Stok (Perpetual)</th>
                  <th>Avg Cost (Periodic)</th>
                  <th>Sisa Stok (Periodic)</th>
                </tr>
              </thead>
            </table>

            <table class="table" style="width: 100%;">
              <thead>
                <tr>
                  <th>Cross Check</th>
                  <th class="text-end">Beli</th>
                  <th class="text-end">Keluar</th>
                  <th class="text-end">Sisa</th>
                </tr>
              </thead>
              <tbody>
                @if ($GlobalVar->hpp_setting == 'perpetual' || $GlobalVar->is_testing == 1)
                  <tr>
                    <td>Perpetual</td>
                    <td class="text-end">{{ formatNumberComma($perpetual['beli']) }}</td>
                    <td class="text-end">{{ formatNumberComma($perpetual['jual']) }}</td>
                    <td class="text-end">{{ formatNumberComma($perpetual['beli'] + $perpetual['jual']) }}</td>
                  </tr>
                @endif

                @if ($GlobalVar->hpp_setting == 'periodic' || $GlobalVar->is_testing == 1)
                  <tr>
                    <td>Periodic</td>
                    <td class="text-end">{{ formatNumberComma($periodic['beli']) }}</td>
                    <td class="text-end">{{ formatNumberComma($periodic['jual']) }}</td>
                    <td class="text-end">{{ formatNumberComma($periodic['beli'] + $periodic['jual']) }}</td>
                  </tr>
                @endif
              </tbody>
            </table>
          </div>
        </div>
        <div class="card-footer" style="text-align: right;">
          <a href="/logistik/info-stok-barang" class="btn btn-light btn-custom8">Kembali</a>
        </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>
  <script src="https://unpkg.com/sticky-table-headers"></script>
@endpush

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

  <script>
    let datatable = $('#datatable-serverside').DataTable({
      lengthMenu: lengthMenuDatatable(),
      processing: true,
      serverSide: true,
      ajax: '/logistik/info-stok-barang/{{ $produk->id }}/history-hpp?show_all={{ request('show_all') }}',
      searching: false,
      order: [
        [0, 'asc']
      ],
      columns: [
        {
          data: 'DT_RowIndex',
          name: 'id'
        },
        {
          data: 'tanggal_transaksi',
          name: 'tanggal_transaksi'
        },
        {
          data: 'transaksi',
          name: 'transaksi'
        },
        // {
        //   data: 'stok_barang.sort',
        //   name: 'stok_barang.sort',
        //   class: 'text-center',
        // },
        {
          data: 'qty_satuan',
          name: 'qty_satuan',
          class: 'text-end',
        },
        {
          data: 'harga_transaksi',
          name: 'harga_transaksi',
          class: 'text-end',
        },
        {
          data: 'total_transaksi',
          name: 'total_transaksi',
          class: 'text-end',
        },
        {
          data: 'cost_perpetual',
          name: 'cost_perpetual',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'perpetual' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'total_cost_perpetual',
          name: 'total_cost_perpetual',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'perpetual' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'cost_periodic',
          name: 'cost_periodic',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'periodic' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'total_cost_periodic',
          name: 'total_cost_periodic',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'periodic' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'total_qty',
          name: 'total_qty',
          class: 'text-end',
        },
        {
          data: 'hpp',
          name: 'hpp',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'perpetual' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'nilai_stok',
          name: 'nilai_stok',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'perpetual' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'hpp_periodic',
          name: 'hpp_periodic',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'periodic' || $GlobalVar->is_testing == 1 }}"),
        },
        {
          data: 'nilai_stok_periodic',
          name: 'nilai_stok_periodic',
          class: 'text-end',
          visible: boolPhpToJs("{{ $GlobalVar->hpp_setting == 'periodic' || $GlobalVar->is_testing == 1 }}"),
        }
      ],
      rowCallback: function(row, data, index) {
        if (!data.hitung) {
          $(row).addClass('table-danger');
        }
      }
    });
    $("#datatable-serverside").stickyTableHeaders({fixedOffset: $('.bottom-navbar')});
  </script>
@endpush