@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" />
<style>
    table#table-kasir> :not(caption)>*>* {
        padding: 0.3rem 0.3rem;
        vertical-align: middle;
    }

    table#kalkulasi> :not(caption)>*>* {
        padding: 0.3rem 0.3rem;
    }

    table#kalkulasi td.amount {
        width: 25%;
    }

    table#kalkulasi td.label-amount {
        vertical-align: middle;
        font-size: large;
        text-align: right;
        font-weight: 400;
    }

    table#kalkulasi td.label-amount-sm {
        vertical-align: middle;
        text-align: right;
    }

    th.nama-barang,
    td.nama-barang {
        max-width: 400px;
        white-space: normal !important;
    }

    td.mn100 {
        min-width: 100px;
    }

    .select2-selection__rendered {
        text-align: left !important;
    }

    .form-control-xl {
        padding: 0.5rem 0.8rem;
        font-size: 1.25rem !important;
        height: calc(2.875rem + 2px);
        border-radius: 0.25rem;
    }

    .fontgede, .fontgede {
        font-size: 1.25rem !important;
    }
</style>
@endpush

@section('content')

@if ($penjualan->is_batal)
  <div class="alert alert-danger alert-dismissible fade show" role="alert">
    {{ $penjualan->keterangan_batal }}
    <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
  </div>
@endif

<nav class="page-breadcrumb">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a href="#">Penjualan</a></li>
        <li class="breadcrumb-item"><a href="/penjualan/kasir">Kasir</a></li>
        <li class="breadcrumb-item active" aria-current="page">Transaksi</li>
    </ol>
</nav>

<div class="row">
    <div class="col-12 grid-margin">
        <div class="card {{ $penjualan->is_batal ? 'bg-card-batal' : '' }}">
            <div class="card-header">
                <h5>Detail Pelanggan</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-12">
                        <input type="hidden" id="id_pelanggan" value="{{ $penjualan->id_pelanggan }}" />
                        <p><b>Kode :</b> {{ $penjualan->pelanggan->kode }}</p>
                        <p><b>Nama :</b> <span id="namaCustomer">{{ $penjualan->pelanggan->nama }}</span></p>
                        <p><b>Detail Kontak :</b></p>
                        <ul>
                            @forelse ($penjualan->pelanggan->detailKontaks as $detail)
                                <li>Telepon: {{ $detail->value }}</li>
                            @empty
                                Belum terdapat data
                            @endforelse
                        </ul>
                        <p>
                            <b>Alamat :</b>
                            <br />
                            {{ $penjualan->pelanggan->alamat }}
                        </p>
                    </div>
                </div>
                <div class="row">
                    <div class="col-12 pt-4">
                        <button class="btn btn-primary btn-custom3 mt-1">Detail Diri</button>
                        <button class="btn btn-primary btn-custom3 mt-1">History Transaksi</button>
                        <button class="btn btn-primary btn-custom3 mt-1">Pembatalan Transaksi</button>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row" id="detail-penjualan">
    <div class="col-12 grid-margin stretch-card">
        <div class="card {{ $penjualan->is_batal ? 'bg-card-batal' : '' }}">
            <div class="card-header">
                <h5>Detail Penjualan</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-12">
                        <div class="table-responsive">
                            <table id="table-kasir" class="table table-bordered table-xs">
                                <thead>
                                    <tr>
                                        <th class="text-center">No.</th>
                                        <th class="text-center nama-barang">Nama Barang</th>
                                        <th class="text-center">Jumlah</th>
                                        <th class="text-center">QTY</th>
                                        <th class="text-center">Harga</th>
                                        <th class="text-center">Add Cost</th>
                                        <th class="text-center">Potongan</th>
                                        <th class="text-center">Total Potongan</th>
                                        <th class="text-center">Total</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @forelse($penjualan->details as $key => $detail)
                                    <tr class="dataBarang">
                                        <td class="text-center">1</td>
                                        <td class="nama-barang">
                                            <span class="dataBarangProduk1">{{ $detail->produk->nama_produk }}</span>
                                            <input type="hidden" id="info{{ $detail->id }}" data-jumlah="{{ $detail->items()->sum('qty_timbang') }}" data-harga="{{ $detail->harga }}" data-biayatambahan="{{ $detail->biaya_tambahan }}">
                                            <a class="text-primary" data-bs-toggle="collapse" href="#detail-info-{{$detail->id}}" role="button" aria-expanded="false" aria-controls="detail-info-{{$detail->id}}">
                                                <span class="mdi mdi-information"></span>
                                            </a>
                                        </td>
                                        <td class="text-end">{{ formatNumber($detail->jumlah) ?? 0 }} {{ $detail->satuan ?? "-" }}</td>
                                        <td class="text-end"><span class="dataBarangJumlah1">{{ formatNumber($detail->items()->sum('qty_timbang')) ?? 0 }} {{ $detail['satuan_stock'] }}</span></td>
                                        <td class="text-end mn100"><span class="dataBarangHarga1">{{ formatNumber($detail->harga) ?? 0 }}</span></td>
                                        <td class="text-end dataBarangBiayaTambahan mn100">{{ formatNumber($detail->biaya_tambahan) ?? 0 }}</td>
                                        <td>
                                            <div class="d-flex align-items-center">
                                                <select
                                                    class="form-control form-control-sm me-2 potonganHarga"
                                                    id="potonganHarga"
                                                    style="max-width: 20%"
                                                    @disabled($penjualan->disabled_form_kasir)
                                                >
                                                    <option value="" data-parameter="{{ $detail->id }}">-</option>
                                                    <option @selected($detail->tipe_diskon == 'persen') value="persen" data-parameter="{{ $detail->id }}">%</option>
                                                    <option @selected($detail->tipe_diskon == 'nominal') value="nominal" data-parameter="{{ $detail->id }}">Rp.</option>
                                                </select>
                                                <input
                                                    type="text"
                                                    class="form-control form-control-sm nominalDiskon text-end removeMinusSign formatInputUang"
                                                    @disabled(!$detail->tipe_diskon)
                                                    @disabled($penjualan->disabled_form_kasir)
                                                    id="nominal_diskon{{ $detail->id }}"
                                                    placeholder="0"
                                                    value="{{ formatNumber($detail->tipe_diskon == 'persen' ? $detail->diskon_persen : $detail->diskon_nominal) }}"
                                                    data-parameter=""
                                                    style="max-width: auto"
                                                >
                                            </div>
                                        </td>
                                        <td class="text-end totalPotonganDetail mn100" id="totalPotonganSatuan{{ $detail->id }}">{{ formatNumberComma( $detail->diskon_nominal ) }}</td>
                                        <td class="mn100 text-end totalHargaDetail dataBarangTotal1" id="totalHarga{{ $detail->id }}" data-dpp_harga="{{ $detail->dpp_harga ?? 0 }}">{{ formatNumberComma($detail->sub_total ?? 0) }}</td>
                                    </tr>
                                    <tr class="collapse" data-bs-parent="#table-kasir" id="detail-info-{{$detail->id}}">
                                        <td colspan="9">
                                            <ul>
                                            @foreach ($detail->items as $item)
                                                @php
                                                    $stokBrang = $item->stokBarang
                                                @endphp
                                                <li>{{ "Nomor Urut: ".$stokBrang['sort']."; Kode Lot: ".$stokBrang['kode_lot']."; QRCode: ".$stokBrang['qrcode']."; QTY: ".formatNumber($item['qty_timbang'])." ".$detail['satuan_stock']; }}</li>
                                            @endforeach
                                            </ul>
                                        </td>
                                    </tr>
                                    @empty
                                    <tr>
                                        <td colspan="9">Belum terdapat data</td>
                                    </tr>
                                    @endforelse
                                </tbody>
                                <tfoot>
                                    <tr>
                                        <td colspan="2" style="font-size: 15px; font-weight: bold; text-align: right; color: red">
                                            TOTAL BERAT TIMBANG BARU
                                        </td>
                                        <td colspan="2">
                                            <input type="text" name="total_timbang_berat_baru" id="total_timbang_berat_baru" class="form-control text-end formatInputUang" value="{{ formatNumber($penjualan->total_timbang_berat_baru ?? 0) }}">
                                        </td>
                                        <td colspan="5"></td>
                                    </tr>
                                </tfoot>
                            </table>
                        </div>
                    </div>
                </div>
                <div class="row" style="margin-top: 25px;">
                    <div class="col-12">
                        <div class="table-responsive">
                            <table id="kalkulasi" class="table table-bordered">
                                <tbody>
                                    <tr>
                                        <td></td>
                                        <td class="label-amount-sm">Potongan</th>
                                        <td class="amount">
                                            <div class="d-flex align-items-center">
                                                <select
                                                    name="potongan"
                                                    id="potongan"
                                                    class="form-control form-control-lg me-2"
                                                    style="width: auto;"
                                                    @disabled($penjualan->disabled_form_kasir)
                                                >
                                                    <option value="">-</option>
                                                    <option @selected($penjualan->tipe_diskon == 'persen') value="persen">%</option>
                                                    <option @selected($penjualan->tipe_diskon == 'nominal') value="nominal">Rp.</option>
                                                </select>

                                                <input
                                                    type="text"
                                                    @disabled(!$penjualan->tipe_diskon)
                                                    @disabled($penjualan->disabled_form_kasir)
                                                    name="input_potongan"
                                                    id="input_potongan"
                                                    class="form-control form-control-lg sanitizeMinusSign text-end formatInputUang"
                                                    placeholder="0"
                                                    value="{{ formatNumber($penjualan->tipe_diskon == 'persen' ? $penjualan->diskon_persen : $penjualan->diskon_nominal) }}"
                                                    onkeyup="dottocomma(this)"
                                                    onchange="formatInputUang(this)"
                                                >
                                            </div>
                                            <div class="form-text text-end" id="nominal-potongan" @if($penjualan->tipe_diskon != 'persen') style="display: none" @endif>({{ formatNumberComma($penjualan->diskon_nominal) }})</div>
                                            <div class="form-text text-end" id="persen-potongan" style="display: none">{{ formatNumberComma($penjualan->diskon_persen) }}</div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td></td>
                                        <td class="label-amount">
                                            <div class="d-flex justify-content-between">
                                                <div>
                                                    <button
                                                        type="button"
                                                        class="btn @if($penjualan->disabled_form_kasir) btn-secondary @else btn-primary btn-custom4 text-white @endif"
                                                        onclick="addPajak()"
                                                        @disabled($penjualan->disabled_form_kasir)
                                                    >Tambah Pajak</button>
                                                    <button
                                                        type="button"
                                                        class="btn @if($penjualan->disabled_form_kasir) btn-secondary @else btn-info btn-custom4 text-white @endif"
                                                        onclick="addBiaya()"
                                                        @disabled($penjualan->disabled_form_kasir)
                                                    >Tambah Biaya lain</button>
                                                </div>
                                                <div>Subtotal</div>
                                            </div>
                                        </th>
                                        <td class="amount">
                                            <input type="text" class="form-control form-control-lg text-end" value="{{ formatNumberComma($sub_total) }}" id="sub-total" readonly>
                                        </td>
                                    </tr>
                                    @foreach ($penjualan->pajakDetails as $key => $pajakDetail)
                                        @php
                                            if(!$pajakDetail->masterPajak->is_include){
                                                $total += $pajakDetail->amount;
                                            }
                                        @endphp
                                        <tr>
                                            <td></td>
                                            <td class="label-amount-sm">
                                                <div class="d-flex justify-content-end">
                                                    <div class="input-group" style="width: 40%;">
                                                        <select class="form-select required pajak" @disabled($penjualan->disabled_form_kasir) onchange="HitungGrandTotalNew()">
                                                            <option value="" data-posisi="{{ $key+1 }}">Pilih Pajak</option>
                                                            @foreach ($listPajak as $pajak)
                                                                <option @selected($pajakDetail->master_pajak_id == $pajak->id) value="{{ $pajak->id }}" data-posisi="{{ $key+1 }}" data-json="{{ json_encode($pajak) }}">{{ $pajak->nama . ' (' . formatNumber(abs($pajak->rate)) . '%)' }}</option>
                                                            @endforeach
                                                        </select>
                                                        <button @disabled($penjualan->disabled_form_kasir) class="btn btn-danger" type="button" onclick="dellPajak(this)">
                                                            <span class="mdi mdi-delete-outline">
                                                        </button>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="amount">
                                                <input type="text" class="form-control form-control-lg text-end amount-pajak" value="{{ formatNumberComma($pajakDetail->amount) }}" id="amount-pajak{{ $key+1 }}" readonly>
                                            </td>
                                        </tr>
                                    @endforeach
                                    <tr class="box-pajak" id="box-pajak"></tr>
                                    @foreach ($penjualan->biayaLain as $biaya)
                                        @php
                                            $total += $biaya->amount;
                                        @endphp
                                        <tr style="background-color: #fbfbfb" class="form-biaya">
                                            <td></td>
                                            <td class="label-amount-sm">
                                                <div class="d-flex justify-content-end">
                                                    <div class="input-group" style="width: 40%;">
                                                        <select @disabled($penjualan->disabled_form_kasir) class="form-select required select2Creatable keterangan-biaya">
                                                            <option selected value="{{ $biaya->keterangan }}">{{ $biaya->keterangan }}</option>
                                                        </select>
                                                        <button @disabled($penjualan->disabled_form_kasir) class="btn btn-danger" type="button" onclick="dellBiaya(this)">
                                                            <span class="mdi mdi-delete-outline">
                                                        </button>
                                                    </div>
                                                </div>
                                            </td>
                                            <td class="amount">
                                            <input
                                                @disabled($penjualan->disabled_form_kasir)
                                                type="text"
                                                value="{{ formatNumberComma($biaya->amount) }}"
                                                class="form-control form-control-lg required amount-biaya removeMinusSign text-end formatInputUang"
                                                onkeyup="HitungGrandTotalNew()"
                                            >
                                            </td>
                                        </tr>
                                    @endforeach
                                    <tr class="box-biaya-lain" id="box-biaya-lain"></tr>
                                    <tr>
                                        <td></td>
                                        <td class="label-amount">Total</th>
                                        <td class="amount">
                                            <input type="text" class="form-control form-control-lg text-end" value="{{ formatNumberComma($total) }}" id="total" readonly>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td></td>
                                        <td class="label-amount-sm">Pembulatan</th>
                                        <td class="amount">
                                            <input type="text" @disabled($penjualan->disabled_form_kasir) class="form-control form-control-lg text-end formatInputUang" value="{{ formatNumberComma($penjualan->pembulatan) }}" id="pembulatan">
                                        </td>
                                    </tr>
                                    <tr>
                                        @php
                                            $grand_total = $total + $penjualan->pembulatan
                                        @endphp
                                        <td></td>
                                        <td class="label-amount" style="font-size: 20px;">Grand Total</th>
                                        <td class="amount">
                                            <input type="text" class="form-control form-control-lg text-end" value="{{ formatNumberComma($grand_total) }}" id="grand-total" readonly>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card-footer d-flex justify-content-end">
                <div>
                    <a class="btn btn-primary btn-custom3" href="#pembayaran">Form Bayar</a>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-12 mb-3">
        <div class="card {{ $penjualan->is_batal ? 'bg-card-batal' : '' }}">
            <div class="card-header bg-white">
                <h5>Riwayat Pembayaran</h5>
            </div>
            <div class="card-body">
                <div class="table-responsive" style="overflow-x: auto;">
                    <table id="datatable-serverside" class="table table-sm" style="width: 100%;">
                        <thead>
                            <tr>
                                <th class="kolomNomor">No.</th>
                                <th>Nomor</th>
                                <th>Metode Bayar</th>
                                <th>Rekening</th>
                                <th>Tanggal</th>
                                <th>No Ref</th>
                                <th>File</th>
                                <th>Nominal</th>
                                <th>Potongan</th>
                                <th>Kembalian</th>
                            </tr>
                        </thead>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

@if (!$penjualan->is_batal)
<div class="row" id="pembayaran">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h5>Form Bayar</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-6 mt-1 mb-3">
                        <label class="form-label fw-bold">Metode Bayar</label>
                        <select name="metode_bayar_id" id="metode_bayar_id" class="form-select form-select-lg">
                            <option value="" data-tunai="0">Silahkan Pilih</option>
                            @foreach ($listMetodeBayar as $metodeBayar)
                            <option value="{{ $metodeBayar->id }}" data-tunai="{{ $metodeBayar->tunai == true ? '1' : '0' }}">
                                {{ $metodeBayar->nama }} @if ($metodeBayar->nama == "DEPOSIT") (Rp. {{ formatNumber($saldo_deposit) }}) @endif
                            </option>
                            @endforeach
                        </select>
                        <input type="hidden" name="total_deposit" id="total_deposit" value="{{ $saldo_deposit }}">
                    </div>
                    <div class="col-6 mt-1 mb-3">
                        <label class="form-label fw-bold">Rekening Tujuan</label>
                        <input type="text" id="rekening_perusahaan" class="form-control form-control-lg" placeholder="Rekening Perusahaan" disabled="disabled">
                    </div>
                    <div class="col-6 mt-1 mb-3">
                        <label class="form-label fw-bold">Tanggal Pembayaran</label>
                        <input type="datetime-local" name="tanggal_transfer_pembayaran" id="tanggal_transfer_pembayaran" class="form-control form-control-lg" placeholder="Tanggal Pembayaran" value="{{ date('Y-m-d\TH:i:s') }}">
                    </div>
                    <div class="col-6 mt-1 mb-3">
                        <label class="form-label fw-bold">Bukti Pembayaran</label>
                        <input type="file" name="file_transfer" id="file_transfer" class="form-control form-control-lg" placeholder="Bukti Pembayaran">
                    </div>
                    <div class="col-12 mt-1 mb-3">
                        <label class="form-label fw-bold">Nomor Referensi</label>
                        <input type="text" name="nomor_transaksi" id="nomor_transaksi" class="form-control form-control-lg" placeholder="Nomor Referensi">
                    </div>
                    <div class="col-12 mt-1 mb-3">
                        <label class="form-label fw-bold">Sudah dibayar</label>
                        <input type="text" id="sudah-dibayar" class="form-control form-control-lg" placeholder="0" readonly="readonly" value="{{ formatNumberComma($sudah_dibayar) ?? 0 }}">
                    </div>
                    <div class="col-12 mt-1 mb-3">
                        <label class="form-label fw-bold">Potongan</label>
                        <input type="text" name="potongan_akhir" id="potongan_akhir" class="formatInputUang form-control form-control-lg sanitizeMinusSign" placeholder="Potongan">
                    </div>
                    <div class="col-12 mt-1 mb-3">
                        <label class="form-label fw-bold">Jumlah Bayar</label>
                        <input type="text" name="uang_dibayarkan" id="uang_dibayarkan" class="formatInputUang form-control-lg form-control removeMinusSign" placeholder="Jumlah Bayar">
                    </div>
                    <input type="hidden" name="dpp" id="dpp" class="form-control form-control-lg" placeholder="DPP" readonly="readonly" value="{{ $penjualan->dpp }}">
                </div>
                <div class="row mt-4">
                    <div class="col-8">
                        <div class="text-center">
                            <label class="form-label fw-bold" id="label-bayar">Kurang Bayar</label>
                            <hr />
                            <h1 id="bayar" data-total_penjualan="0" data-grand_total_penjualan="">Rp. {{ formatNumber($grand_total - $sudah_dibayar) }}</h1>
                        </div>
                    </div>
                    <div class="col-4">
                        <div class="p-1">
                            <button @disabled($penjualan->DisabledButtonBayarFormKasir) class="btn @if($penjualan->DisabledButtonBayarFormKasir) btn-secondary @else btn-primary btn-custom2 @endif w-100 fontgede" onclick="bayar()">Bayar</button>
                        </div>
                        @if (!$penjualan->disabled_form_kasir && $penjualan->status != App\Penjualan::STATUS_PIUTANG)
                            <div class="p-1">
                                <button class="btn btn-primary btn-custom2 w-100 fontgede" onclick="bayar(true)">Piutang</button>
                            </div>
                        @endif
                        <div class="p-1">
                            <a href="#detail-penjualan" class="btn btn-primary btn-custom6 w-100 fontgede">Detail Penjualan</a>
                        </div>
                        <div class="p-1">
                            <a class="btn btn-primary btn-custom6 w-100 fontgede" href="/penjualan/kasir/preview-nota/{{ $penjualan->id }}" target="_blank">Cetak Nota</a>
                        </div>
                        <div class="p-1">
                            <button @disabled($penjualan->disabled_form_kasir)  class="btn @if($penjualan->disabled_form_kasir) btn-danger @else btn-custom5 @endif w-100 fontgede text-white" id="btnBatal">Batal Transaksi</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endif

{{-- Modal --}}
<div id="modalBatal" 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">Batal Transaksi</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" id="form-batal-transaksi">
                    <div class="row">
                        <div class="col-12">
                            <textarea name="keterangan_batal_transaksi" id="keterangan_batal_transaksi" cols="30" rows="10" class="form-control required" placeholder="Keterangan Batal Transaksi"></textarea>
                        </div>
                        <div class="col-12 mt-3" style="text-align: right;">
                            <button type="submit" 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>
@include('pages.penjualan.kasir.input-kasir-js')
{{-- @include('pages.penjualan.kasir.input-kasir-js-old') --}}
@endpush