{{-- @dd($item->invoiceDetail->id_relasi_produk_supplier) --}}
@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="#">Pembelian</a></li>
    <li class="breadcrumb-item active" aria-current="page">Retur {{ $data->no_faktur }}</li>
  </ol>
</nav>

<div class="card m-b-30">
  <div class="card-body">
    <h5 class="card-title">
      <div class="row">
        <div class="col-12">
          Retur Pembelian
        </div>
      </div>
    </h5>
    <form id="form_retur" onsubmit="formSubmit()">
      <div class="mb-4">
        <div class="">
          <div class="border p-3">
            <div class="form-group">
              <div class="row">
                <div class="col-12 mb-3">
                  <label>Tanggal Pengembalian</label>
                  <input
                    class="form-control resetForm required"
                    type="date"
                    name="tanggal_pengembalian"
                    id="tanggal_pengembalian"
                    placeholder="Tanggal pengembalian"
                    value="{{ $data->returInvoice ? date('Y-m-d', strtotime($data->returInvoice->tanggal)) : date('Y-m-d') }}"
                    required
                  >
                </div>
                <div class="col-12">
                  <label>Keterangan</label>
                  <textarea
                    class="form-control resetForm resetForm"
                    name="keterangan"
                    id="keterangan"
                    placeholder="Keterangan"
                  >{{ $data->returInvoice->keterangan ?? '' }}</textarea>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
      <div class="mb-2">
        <div class="form-group mb-3">
            <div class="row">
                <div class="col-12">
                    <label for="view_nama">View Nama Barang</label>
                    <div class="d-flex">
                        <div class="form-check">
                            <input class="form-check-input" type="radio" name="view_nama" id="view_nama_asli" value="view_nama_asli" checked>
                            <label class="form-check-label" for="view_nama_asli">
                              Asli
                            </label>
                        </div>
                        <div class="form-check ms-2">
                            <input class="form-check-input" type="radio" name="view_nama" id="view_nama_alias" value="view_nama_alias">
                            <label class="form-check-label" for="view_nama_alias">
                              Alias
                            </label>
                        </div>
                        <div class="form-check ms-2">
                            <input class="form-check-input" type="radio" name="view_nama" id="view_nama_asli_alias" value="view_nama_asli_alias">
                            <label class="form-check-label" for="view_nama_asli_alias">
                              Keduanya
                            </label>
                        </div>
                    </div>

                </div>
            </div>
        </div>
      </div>
      <div class="table-responsive" style="overflow-x: auto;">
        <table class="table table-bordered table-hover table-sm">
          <thead>
            <tr>
              <th>Nama Barang</th>
              <th>No Surat Jalan</th>
              <th class="kolomQty text-center">ROL</th>
              <th class="kolomQty text-end">QTY</th>
              <th class="kolomQty text-end">Harga</th>
              <th class="kolomQty text-end">Total</th>
              <th class="text-center">No Urut</th>
              <th class="kolomKeterangan">Keterangan</th>
              <th class="kolomAksi">Aksi</th>
            </tr>
          </thead>
          <tbody class="tampilBarang">
            <tr class="infoKosong" @if ($data->returInvoice) style="display: none" @endif>
              <td colspan="8" class="text-center">Belum Terdapat Data</td>
            </tr>
            @foreach ($data->returInvoice->details ?? [] as $item)
              @php
                $surat_jalan_detail = $item->suratJalanDetail;
                $produk = $surat_jalan_detail->poDetail->produk;
              @endphp
              <tr id="rowBarangDetail{{$item->id_surat_jalan_detail}}" class="rowBarangDetail">
                <td>
                  <input type="hidden" class="form-control idDetail id{{$item->id_surat_jalan_detail}}" value="{{$item->id_surat_jalan_detail}}">
                  <input type="hidden" class="form-control id_invoice_detail id{{$item->id_invoice_detail}}" value="{{$item->id_invoice_detail}}">
                  <div class="view_nama_asli view_nama">
                    {{ $produk->cetakNama($item->invoiceDetail->id_relasi_produk_supplier, 'asli') }}
                  </div>
                  <div class="view_nama_alias view_nama" style="display:none">
                    {{ $produk->cetakNama($item->invoiceDetail->id_relasi_produk_supplier, 'alias') }}
                  </div>
                  <div class="view_nama_asli_alias view_nama" style="display:none">
                    {!! $produk->cetakNama($item->invoiceDetail->id_relasi_produk_supplier, 'asli_alias') !!}
                  </div>
                </td>
                <td>{{ $surat_jalan_detail->suratJalan->nomor_surat_jalan ?? '-' }}</td>
                <td class="text-center">1</td>
                <td class="detail-qty text-end">{{ formatNumber($item->berat) }} {{ $produk->unit_satuan_stock }}</td>
                <td class="text-end">{{ formatNumber($item->harga) }}</td>
                <td class="text-end">{{ formatNumber($item->harga * $item->berat) }}</td>
                <td class="text-center">{{ $surat_jalan_detail->nomor_urut ?? 0 }}</td>
                <td>
                  <textarea class="form-control keterangan" name="keterangan" id="keterangan" placeholder="Keterangan" rows="1">{{ $item->keterangan }}</textarea>
                </td>
                <td>
                  <button type="button" onclick="hapusBarang({{$item->id_surat_jalan_detail}})" class="btn btn-danger btn-custom5 btn-sm">
                    <span class="mdi mdi-delete"></span>
                  </button>
                </td>
              </tr>
            @endforeach
          </tbody>
          <tfoot class="tfoot" style="display: none">
            <tr>
              <th>Total</th>
              <th class="rol">0</th>
              <th class="qty">0</th>
              <th colspan="3"></th>
            </tr>
          </tfoot>
        </table>
      </div>
      <div class="mt-2">
        <div class="form-group mb-3">
            <div class="row">
                <div class="col-12">
                    <label for="view_nama">View Nama Barang</label>
                    <div class="d-flex">
                        <div class="form-check">
                            <input class="form-check-input" type="radio" name="view_nama_second" id="view_nama_asli_second" value="view_nama_asli" checked>
                            <label class="form-check-label" for="view_nama_asli_second">
                              Asli
                            </label>
                        </div>
                        <div class="form-check ms-2">
                            <input class="form-check-input" type="radio" name="view_nama_second" id="view_nama_alias_second" value="view_nama_alias">
                            <label class="form-check-label" for="view_nama_alias_second">
                              Alias
                            </label>
                        </div>
                        <div class="form-check ms-2">
                            <input class="form-check-input" type="radio" name="view_nama_second" id="view_nama_asli_alias_second" value="view_nama_asli_alias">
                            <label class="form-check-label" for="view_nama_asli_alias_second">
                              Keduanya
                            </label>
                        </div>
                    </div>

                </div>
            </div>
        </div>
      </div>
      <div class="row mt-3">
        <div class="col-12 mb-3">
          <button type="button" id="btnTambahBarang" class="btn btn-light" style="width: 100% !important;">Tambah Barang</button>
        </div>
      </div>
      <div class="row mt-3">
        <div class="col-4">
          <button type="submit" id="btnSimpanData" class="btn btn-success btn-custom1" style="width: 100% !important;">Simpan Data Retur</button>
        </div>
        <div class="col-4">
          <button type="button" id="btnHapusData" onclick="hapusData()" class="btn btn-danger btn-custom5" style="width: 100% !important;">Hapus Data Retur</button>
        </div>
        <div class="col-4">
          <a href="{{ route('pembelian.invoice.index') }}" class="btn btn-warning btn-custom8" style="width: 100% !important;">Kembali ke Halaman Sebelumnya</a>
        </div>
      </div>
    </form>
  </div>
</div>

{{-- Modal --}}
<div id="modalBarang" class="modal fade bd-example-modal-xl" data-bs-backdrop="static">
  <div class="modal-dialog modal-xl">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title h4">Data Barang</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="btn-close"></button>
      </div>
      <div class="modal-body">
        <form class="forms-sample">
          <div class="row">
            <div class="col-12">
              <table class="table table-sm" id="tableBarang">
                <thead>
                  <tr>
                    <th class="kolomNomor">No</th>
                    <th>Nama Barang</th>
                    <th>No Surat Jalan</th>
                    <th>Warna</th>
                    <th class="kolomQty text-center">ROL</th>
                    <th class="kolomQty text-end">QTY</th>
                    <th class="kolomQty text-end">Harga</th>
                    <th class="kolomQty text-end">Total</th>
                    <th class="text-center">No Urut</th>
                    <th class="kolomAksi">Aksi</th>
                  </tr>
                </thead>
                <tbody>
                </tbody>
              </table>
            </div>
            <div class="col-12 mt-3" style="text-align: right;">
              <button type="button" id="btnSimpanBarang" class="btn btn-primary btn-custom1">Simpan</button>
              <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Keluar</button>
            </div>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>
{{-- Akhiran Modal --}}
@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>
  $('#btnTambahBarang').on('click', function(e) {
    let data = {
      _token: "{{ csrf_token() }}",
      except: $('.idDetail').map(function() {
        return $(this).val();
      }).get(),
    };

    let url = "{{ route('pembelian.invoice.retur.get-barang', ':id') }}";
    url = url.replace(':id', "{{ $data->id }}");

    sendJson(url, data, rBarang);
  });

  function rBarang(data) {
    swal.close();
    $('#tableBarang').DataTable().clear().destroy();
    $('#modalBarang').modal('show');

    $.each(data, function(i, v) {
      let varian = v.po_detail?.produk;
      let produk = varian?.parent;

      let kode_produk = (produk?.kode ?? '');
      let nama_produk = (kode_produk ? kode_produk + ' | ' : '') + (produk?.nama ?? '');

      let nama_varian = (varian?.nama ?? '');
      if (varian.parent ?? null) {
        nama_produk = nama_produk + ' - ' + nama_varian;
      }
      $('#tableBarang tbody').append(
        '<tr class="rowBarang" id="rowBarang' + v.id + '">' +
        '<td class="text-center">' + (i + 1) + '</td>' +
        '<td>' + nama_produk + '</td>' +
        '<td>' + v.surat_jalan.nomor_surat_jalan + '</td>' +
        '<td>' + varian.kode + '</td>' +
        '<td class="text-center">' + formatNumber(parseFloat(v.jumlah), 0) + '</td>' +
        '<td class="text-end">' + formatNumber(parseFloat(v.berat_bruto ?? 0), 0) + ' ' + varian.unit_satuan_stock + '</td>' +
        '<td class="text-end">' + formatNumber(parseFloat(v.invoice_detail.dpp_harga ?? 0)) + '</td>' +
        '<td class="text-end">' + formatNumber(parseFloat((v.invoice_detail.dpp_harga * v.berat_bruto) ?? 0)) + '</td>' +
        '<td class="text-center">' + v.nomor_urut + '</td>' +
        '<td><input type="checkbox" class="barang" value="' + v.id + '"></td>' +
        '</tr>'
      );
    });
    $('#tableBarang').DataTable().draw();
    $('#tableBarang').DataTable();
  }

  $('#btnSimpanBarang').on('click', function(e){
    let jmlCek = $('.barang:checked').length;
    let IDBarangNew = [];
    if(parseInt(jmlCek) <= 0){
        swal('Perhatian', 'Pastikan Centang Barang Terlebih Dahulu', 'info');
    }else{
      let data = {
        _token: "{{ csrf_token() }}",
        id_detail: $('.barang:checked').map(function() {
          return $(this).val();
        }).get(),
      }

      let url = "{{ route('pembelian.invoice.retur.add-barang', ':id') }}";
      url = url.replace(':id', "{{ $data->id }}");

      sendJson(url, data, rSendsBarang);
    }
  });

  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) {
      $.ajax({
        url: `/master/produk/get-name?id=${v.po_detail.produk.id}&id_supplier=${v.surat_jalan.supplier_id}`,
        type: 'GET',
        dataType: 'json',
        success: function(res) {
          let varian = v.po_detail?.produk;
          let isiHTML = `
          <tr id="rowBarangDetail${v.id}" class="rowBarangDetail">
            <td>
              <input type="hidden" class="form-control idDetail id${v.id}" value="${v.id}">
              <input type="hidden" class="form-control id_invoice_detail id${v.invoice_detail.id}" value="${v.invoice_detail.id}">
              <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.surat_jalan.nomor_surat_jalan}</td>
            <td class="text-center">${formatNumber(parseFloat(v.jumlah ?? 0))}</td>
            <td class="detail-qty text-end">${formatNumber(parseFloat(v.berat_bruto ?? 0), 0)} ${ varian.unit_satuan_stock }</td>
            <td class="text-end">${formatNumber(parseFloat(v.invoice_detail.dpp_harga ?? 0))}</td>
            <td class="text-end">${formatNumber(parseFloat((v.invoice_detail.dpp_harga * v.berat_bruto) ?? 0))}</td>
            <td class="text-center">${v.nomor_urut}</td>
            <td>
              <textarea class="form-control keterangan" name="keterangan" id="keterangan" placeholder="Keterangan" rows="1"></textarea>
            </td>
            <td>
              <button type="button" onclick="hapusBarang(${v.id})" class="btn btn-danger btn-custom5 btn-sm">
                <span class="mdi mdi-delete"></span>
              </button>
            </td>
          </tr>
          `;
          $('.tampilBarang').append(isiHTML);
        },
        error: errorSend
      });
    });

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

  }

  function hapusBarang(id) {
    $('#rowBarangDetail' + id).remove();
    if ($('.rowBarangDetail').length <= 0) {
      $('.infoKosong').show();
    } else {
      $('.infoKosong').hide();
    }
  }

  const formSubmit = () => {
    event.preventDefault();
    let data = {
      _token: "{{ csrf_token() }}",
      tanggal: $('#tanggal_pengembalian').val(),
      keterangan: $('#keterangan').val(),
      details: $('.rowBarangDetail').map(function() {
        return {
          id_invoice_detail: $(this).find('.id_invoice_detail').val(),
          id_surat_jalan_detail: $(this).find('.idDetail').val(),
          keterangan: $(this).find('.keterangan').val(),
        }
      }).get(),
    }
    let url = "{{ route('pembelian.invoice.retur.store', ':id') }}";
    url = url.replace(':id', "{{ $data->id }}");

    sendJson(url, data, callbackAfterSubmit);
  }

  function callbackAfterSubmit(data) {
    let titles = data.type == "success" ? "Sukses" : (data.type == "error" ? "Gagal" : "Info");
    swal({
      title: titles,
      text: data.response,
      type: data.type,
      confirmButtonText: "OK"
    }).then(function() {
      if (data.type == "success") {
        window.location.href = "{{ route('pembelian.invoice.index') }}";
      }
    })
  }

  function hapusData() {
    swal({
      title: "Apakah Anda Yakin?",
      text: "Data Retur Pembelian akan dihapus",
      type: "warning",
      showCancelButton: true,
      confirmButtonText: "Ya, Hapus!",
      cancelButtonText: "Tidak, Batalkan!",
      closeOnConfirm: false,
      closeOnCancel: false
    }).then(function(isConfirm) {
      if (isConfirm) {
        let data = {
          _token: "{{ csrf_token() }}",
        }
        let url = "{{ route('pembelian.invoice.retur.destroy', ':id') }}";
        url = url.replace(':id', "{{ $data->id }}");

        sendJson(url, data, callbackAfterSubmit);
      }
    });
  }
</script>

@endpush