@include('pages.pembelian.invoice.function')
<script defer>
  function hitungGrandTotal() {
    let dpp = 0;
    $.each($('.totalDetail'), function(i, v) {
      dpp += parseFloat($(this).data('value'));
    });
    let grandTotal = dpp;
    $.each($('.pajak'), function(i, v) {
      let data = $(this).find(':selected').data('json');
      let pajak = hitungPajak((data?.rate ?? 0), dpp, data?.is_include);
      if (!data?.is_include) {
        grandTotal += pajak;
      } else {
        dpp -= pajak;
      }
      $(this).closest('.form-group').find('.amount-pajak').html('Rp ' + formatNumber(Math.abs(pajak), 0, 2));
    });
    $.each($('.amount-biaya'), function(i, v) {
      if ($(this).val() != '') {
        grandTotal += parseFloat($(this).val().replace(/\./g, '').replace(/\,/g, '.'));
      }
    });

    let po_header_id = [];
    let total_uang_muka = 0;
    $.each($(`.rowBarangDetail`), function(i, v){
      if(!po_header_id.includes($(this).data('po_header_id'))){
        po_header_id.push($(this).data('po_header_id'));
        if($(this).data('uang_muka') > 0){
          total_uang_muka += parseFloat($(this).data('uang_muka'));
        }
      }
    })
    if(total_uang_muka){
      let sisa_hutang = grandTotal - total_uang_muka;
      $('.uang-muka').html(`
        <div class="row">
          <div class="col-6 mb-3">
            <h5>Uang Muka</h5>
          </div>
          <div class="col-6 mb-3 text-end">
            <h5 id="uang-muka" data-amount="${total_uang_muka}">Rp ${formatNumber(total_uang_muka, 0, 2)}</h5>
          </div>
        </div>
      `);
      $('.sisa-hutang').html(`
        <div class="row">
          <div class="col-6 mb-3">
            <h5>Sisa Hutang</h5>
          </div>
          <div class="col-6 mb-3 text-end">
            <h5 id="sisa-hutang" data-amount="${sisa_hutang}">Rp ${formatNumber(sisa_hutang, 0, 2)}</h5>
          </div>
        </div>
      `);
      $('#sisa-hutang').data('amount', sisa_hutang);
    }else{
      $('.uang-muka').html('');
      $('.sisa-hutang').html('');
    }

    $('#dpp').html('Rp ' + formatNumber(dpp, 0, 2));
    $('#dpp').data('amount', dpp);
    $('#grand-total').html('Rp ' + formatNumber(grandTotal, 0, 2));
    $('#grand-total').data('amount', grandTotal);
  }

  function rSendsBarang(data) {
    swal.close();
    $('#modalBarang').modal('hide');
    $('#tableBarang tbody').html('');
    let checked_view_nama = $('input[name="view_nama"]:checked').val();

    $.each(data, function(i, v) {

      let uang_muka = 0;
      $.each((v.po_detail?.po?.uang_muka_verified ?? []), function(index, item){
        uang_muka += parseFloat(item.total_bayar ?? 0);
      });

      $.ajax({
        url: `/master/produk/get-name?id=${v.po_detail?.produk?.id}&id_supplier=${v.id_relasi_produk_supplier}`,
        type: 'GET',
        dataType: 'json',
        success: function(res) {
          var detailBerat = [];
          $.each(v.detail_berat_bruto.split('; '), function(id, vd){
            detailBerat.push(formatNumber(parseFloat(vd ?? 0)));
          });

          let isiHTML = `
            <tr id="rowBarangDetail${v.po_detail_id}" data-uang_muka="${uang_muka}" data-po_header_id="${v.po_detail.po_header_id}" class="rowBarangDetail po_header_id-${v.po_detail.po_header_id}">
              <td>
                <input type="hidden" class="form-control idDetail id${v.po_detail_id}" value="${v.po_detail_id}">
                ${formatNumber(parseFloat(v.po_detail?.jumlah ?? 0))}
              </td>
              <td>
                <div class="view_nama_asli view_nama" ${checked_view_nama != 'view_nama_asli' ? 'style="display:none"' : ''}>
                  ${res.asli}
                </div>
                <div class="view_nama_alias view_nama" ${checked_view_nama != 'view_nama_alias' ? 'style="display:none"' : ''}>
                  ${res.alias}
                </div>
                <div class="view_nama_asli_alias view_nama" ${checked_view_nama != 'view_nama_asli_alias' ? 'style="display:none"' : ''}>
                  ${res.asli_alias}
                </div>
              </td>
              <td>${(v.po_detail?.produk?.kode ?? '-')}</td>
              <td>PO : ${(v.po_detail?.po?.nomor_po ?? '-')}</td>
              <td>
                <div class="d-flex">
                  <input type="text" class="form-control qty removeMinusSign text-end" onkeyup="dottocomma(this);hitungTotalDetail(this);hitungGrandTotal()" onchange="formatInputUang(this)" value="${formatNumber(parseFloat(v.total_berat_bruto),0)}">
                  <a class="text-primary" data-bs-toggle="collapse" href="#detail-qty-${v.po_detail_id}" role="button" aria-expanded="false" aria-controls="detail-qty-${v.po_detail_id}">
                    <span class="mdi mdi-information"></span>
                  </a>
                </div>
              </td>
              <td>
                <input type="text" class="form-control harga text-end removeMinusSign" onkeyup="hitungTotalDetail(this);hitungGrandTotal()" onchange="formatInputUang(this)" value="${formatNumber(parseFloat(v.po_detail?.harga))}">
              </td>
              <td class="totalDetail text-end" data-value="${(v.po_detail?.harga ?? 0) * (v.total_berat_bruto)}">
                ${formatNumber(parseFloat((v.po_detail?.harga ?? 0) * (v.total_berat_bruto)), 0, 2)}
              </td>
              <td>
                <button type="button" onclick="hapusBarang(${v.po_detail_id})" class="btn btn-danger btn-custom5 btn-sm">
                  <span class="mdi mdi-delete"></span>
                </button>
              </td>
            </tr>
            <tr class="collapse" data-bs-parent="#table-detail" id="detail-qty-${v.po_detail_id}">
              <td colspan="3"></td>
              <td colspan="2">
                ${detailBerat.join('; ')}
              </td>
              <td colspan="3"></td>
            </tr>
          `;
          $('.tampilBarang').append(isiHTML);
          hitungGrandTotal();
        },
        error: errorSend
      });
    });

    if (data.length > 0) {
      $('.infoKosong').hide();
    } else {
      $('.infoKosong').show();
    }
  }

  $('#btnSimpanBarang').on('click', function(e) {
    let jmlCek = $('.barangSupplier:checked').length;
    let IDBarangNew = [];
    if (parseFloat(jmlCek) <= 0) {
      swal('Perhatian', 'Pastikan Centang Barang Terlebih Dahulu', 'info');
    } else {
      $($('.barangSupplier:checked')).each(function(i, v) {
        IDBarangNew.push(parseFloat($(this).val()));
      });
      let arrBarangID = IDBarangNew.join("|");
      let data = {
        arr_barang_id: arrBarangID,
        _token: "{{ csrf_token() }}"
      }
      sendJson("{{ route('pembelian.invoice.add-barang-supplier') }}", data, rSendsBarang);
    }
  });

  function rBarang(data) {
    swal.close();
    $('#tableBarang').DataTable().clear().destroy();
    $('#modalBarang').modal('show');
    $.each(data, function(i, v) {
      let kode_produk_parent = (v.po_detail?.produk?.parent?.kode ?? '');
      let nama_produk_parent = (kode_produk_parent ? kode_produk_parent + ' | ' : '') + (v.po_detail?.produk?.parent
        ?.nama ?? '');
      // let kode_produk = (v.po_detail?.produk?.kode ?? '');
      let nama_produk = (v.po_detail?.produk?.nama ?? '');
      if (v.po_detail.produk.parent ?? null) {
        nama_produk = nama_produk_parent + ' - ' + nama_produk;
      }
      $('#tableBarang tbody').append(
        '<tr class="rowBarang" id="rowBarang' + v.po_detail_id + '">' +
        '<td>' + (i + 1) + '</td>' +
        '<td class="text-center">' + formatNumber(parseFloat(v.po_detail?.jumlah ?? 0), 0) + '</td>' +
        '<td>' + nama_produk + '</td>' +
        '<td>' + (v.po_detail?.produk?.kode ?? '-') + '</td>' +
        '<td>PO : ' + (v.po_detail?.po?.nomor_po ?? '-') + '</td>' +
        '<td class="text-end">' + formatNumber(parseFloat(v.total_berat_bruto), 0) + '</td>' +
        '<td class="text-end">' + formatNumber(parseFloat(v.po_detail?.harga), 0, 0) + '</td>' +
        '<td class="text-end">' + formatNumber(parseFloat((v.po_detail?.harga ?? 0) * (v.total_berat_bruto)), 0, 2) + '</td>' +
        '<td><input type="checkbox" class="barangSupplier" value="' + v.po_detail_id + '"></td>' +
        '</tr>'
      );
    });
    $('#tableBarang').DataTable().draw();
    $('#tableBarang').DataTable();
  }

  $('#btnTambahBarang').on('click', function(e) {
    let supplier = $('#supplier_id').val();
    if (supplier == null || supplier == '') {
      swal('Perhatian', 'Tentukan Supplier Terlebih Dahulu', 'info');
    } else {
      let data = {
        _token: "{{ csrf_token() }}",
        supplier_id: supplier,
        except: $('.idDetail').map(function() {
          return $(this).val();
        }).get(),
        invoice_id: "{{ $data->id ?? 0 }}"
      };
      sendJson("{{ route('pembelian.invoice.barang-supplier') }}", data, rBarang);
    }
  });

  $('#supplier_id').select2({
    ajax: {
      url: '{{ route("kontak.supplier") }}',
      dataType: 'json',
      delay: 250,
      data: function (params) {
        return {
          search: params.term
        };
      },
      processResults: function (data) {
        return {
          results: $.map(data, function (item) {
            return {
              text: item.nama,
              id: item.id,
              tempo: item.tempo
            }
          })
        };
      },
      cache: true
    },
    minimumInputLength: 3,
  });
</script>