@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])

@section('content')
@include('layouts.navbars.auth.topnav', ['title' => ''])

<div class="container-fluid">
    <div class="row">
        <div class="col-md-12">
            <div class="row mx-1">
                <div class="card">
                    <div class="card-header">
                        <h5 class="mb-0">Tambah Mutasi Bank</h5>
                    </div>

                    <hr class="horizontal dark mt-0">

                    <div class="card-body">
                        <form id="formAddTrsmts" method="POST">
                            @csrf

                            <div class="row">
                                <div class="col-md-12">
                                    <h6 class="text-uppercase text-sm text-muted mb-3">Informasi Umum</h6>
                                </div>
                            </div>

                            {{-- Row 1: Rekening Bank, Tanggal --}}
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="rekening_display" class="form-label">
                                        Rekening Bank (Sumber) <span class="text-danger">*</span>
                                    </label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" id="rekening_display"
                                            name="rekening_display" placeholder="-- Pilih Rekening --" readonly required>
                                        <input type="hidden" id="rekening_id" name="rekening_id">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openSelectRekeningModal()">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-rekening_id"></div>
                                </div>
                                <div class="col-md-6 mb-3">
                                    <label for="date" class="form-label">Tanggal <span class="text-danger">*</span></label>
                                    <input type="date" class="form-control" id="date" name="date" required>
                                    <div class="invalid-feedback" id="error-date"></div>
                                </div>
                            </div>

                            {{-- Row 2: Kode Mutasi, Nomor Bukti --}}
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="kode_mutasi_display" class="form-label">
                                        Kode Mutasi <span class="text-danger">*</span>
                                    </label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" id="kode_mutasi_display"
                                            name="kode_mutasi_display" placeholder="-- Pilih Kode Mutasi --" readonly required>
                                        <input type="hidden" id="kode_mutasi_id" name="kode_mutasi_id">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openSelectKodeMutasiModal()">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-kode_mutasi_id"></div>
                                </div>

                                <div class="col-md-6 mb-3">
                                    <label for="nomor_bukti" class="form-label">Nomor Bukti <span class="text-danger">*</span></label>
                                    <input type="text" class="form-control" id="nomor_bukti" name="nomor_bukti"
                                        maxlength="100" placeholder="Nomor bukti akan auto generate setelah memilih tanggal" required>
                                    <div class="invalid-feedback" id="error-nomor_bukti"></div>
                                </div>
                            </div>

                            {{-- Row 3: Rek Asal/Tujuan, Is Project, Project --}}
                            <div class="row">
                                <div class="col-md-6 mb-3">
                                    <label for="rekening_tujuan_dari_display" class="form-label">
                                        Rekening Asal/Tujuan <span class="text-danger">*</span>
                                    </label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" id="rekening_tujuan_dari_display"
                                            name="rekening_tujuan_dari_display"
                                            placeholder="-- Pilih Rekening Asal/Tujuan --" readonly required>
                                        <input type="hidden" id="rekening_tujuan_dari" name="rekening_tujuan_dari">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openSupplierBankModal()">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-rekening_tujuan_dari"></div>
                                </div>
                                <div class="col-md-2 mb-3">
                                    <label class="form-label d-block">Project Terkait</label>
                                    <div class="form-check form-switch mt-2">
                                        <input class="form-check-input" type="checkbox" id="is_project" name="is_project"
                                            value="1" role="switch" disabled>
                                        <label class="form-check-label" for="is_project">Terakit Project</label>
                                    </div>
                                    <small class="text-muted">Aktifkan apabila transaksi dibebankan ke project</small>
                                </div>
                                <div class="col-md-4 mb-3" id="projectFieldRow" style="display:none;">
                                    <label for="project_display" class="form-label">
                                        Project <span class="text-danger">*</span>
                                    </label>
                                    <div class="input-group">
                                        <input type="text" class="form-control" id="project_display"
                                            name="project_display" placeholder="-- Pilih Project --" readonly>
                                        <input type="hidden" id="project_id" name="project_id">
                                        <span class="input-group-text bg-primary text-light" id="btnSearchProject" style="cursor:pointer"
                                            onclick="openSelectProjectModal()">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-project_id"></div>
                                </div>
                            </div>

                            <div class="row">
                                <div class="col-md-6 mb-3" style="display: none;">
                                    <div class="form-check form-switch">
                                        <input class="form-check-input" type="checkbox" id="is_credit" name="is_credit"
                                            value="1" disabled>
                                        <label class="form-check-label" for="is_credit">
                                            Credit (Keluar)
                                        </label>
                                    </div>
                                    <small class="text-muted">Otomatis terisi berdasarkan Kode Mutasi</small>
                                </div>
                            </div>

                            <hr class="horizontal dark">

                            <!-- Section: PO Assign (Multi) -->
                            <div id="poAssignSection">
                                <div class="row">
                                    <div class="col-md-12 d-flex justify-content-between align-items-center mb-3">
                                        <h6 class="text-uppercase text-sm text-muted mb-0">PO Assign</h6>
                                        <button type="button" class="btn btn-primary btn-sm"
                                            onclick="openSelectPOAssignModal()">
                                            <i class="fas fa-plus me-1"></i> Tambah PO
                                        </button>
                                    </div>
                                </div>
                                <div class="invalid-feedback d-block mb-2" id="error-po_items"></div>
                                <div id="poItemsContainer">
                                    <div id="poItemsEmpty" class="text-center text-muted py-3 border rounded mb-3">
                                        <i class="fas fa-inbox me-1"></i> Belum ada PO dipilih
                                    </div>
                                </div>
                                <hr class="horizontal dark">
                            </div>

                            <!-- Section: Pengeluaran Selain PO -->
                            <div id="nonPOSection">
                                <div class="row">
                                    <div class="col-md-12 d-flex justify-content-between align-items-center mb-3">
                                        <h6 class="text-uppercase text-sm text-muted mb-0">Pengeluaran / Pemasukan Selain PO</h6>
                                        <button type="button" class="btn btn-primary btn-sm"
                                            onclick="addNonPOItemRow()">
                                            <i class="fas fa-plus me-1"></i> Tambah Detail
                                        </button>
                                    </div>
                                </div>
                                <div class="table-responsive mb-3">
                                    <table class="table table-sm table-bordered" id="nonPOTable">
                                        <thead style="background-color:#e9ecef;">
                                            <tr>
                                                <th width="3%" class="text-center">Aksi</th>
                                                <th width="3%" class="text-center">No</th>
                                                <th width="35%">Keterangan</th>
                                                <th width="15%" class="text-end">Qty (Unit)</th>
                                                <th width="20%" class="text-end">Amount Rupiah/Unit</th>
                                                <th width="20%" class="text-end">Amount (Rp)</th>
                                            </tr>
                                        </thead>
                                        <tbody id="nonPOTableBody">
                                            <tr id="nonPOEmptyRow">
                                                <td colspan="6" class="text-center text-muted fst-italic py-3">
                                                    <i class="fas fa-inbox me-1"></i> Belum ada pengeluaran / pemasukan selain PO ditambahkan
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                            <hr class="horizontal dark">

                            <!-- Section: DP / Termin -->
                            <div class="row">
                                <div class="col-md-12">
                                    <h6 class="text-uppercase text-sm text-muted mb-3">DP / Termin</h6>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-md-4 mb-3">
                                    <label class="form-label">Tipe Pembayaran</label>
                                    <div class="form-check form-switch mt-2">
                                        <input class="form-check-input" type="checkbox" id="is_dp" name="is_dp"
                                            value="1" role="switch">
                                        <label class="form-check-label" for="is_dp">DP / Termin</label>
                                    </div>
                                    <small class="text-muted">Aktifkan jika transaksi ini adalah DP atau Termin</small>
                                </div>
                                <div class="col-md-4 mb-3" id="dpPercentageDiv" style="display:none;">
                                    <label for="dp_percentage" class="form-label">Persentase DP / Termin (%)</label>
                                    <input type="number" class="form-control" id="dp_percentage" name="dp_percentage"
                                        step="0.01" min="0" max="100" placeholder="0.00">
                                    <small class="text-muted">Nilai antara 0 - 100</small>
                                </div>
                                <div class="col-md-4 mb-3" id="dpSeqDiv" style="display:none;">
                                    <label for="dp_seq" class="form-label">Urutan DP / Termin</label>
                                    <input type="number" class="form-control" id="dp_seq" name="dp_seq" min="1" step="1"
                                        placeholder="1">
                                    <small class="text-muted">Urutan ke berapa (misal: DP ke-1, ke-2, dst.)</small>
                                </div>
                            </div>
                            <div id="dpSummarySection" class="row" style="display:none;">
                                <div class="col-md-12">
                                    <div id="dpSummaryContainer"></div>
                                </div>
                            </div>

                            <hr class="horizontal dark">

                            <div class="row">
                                <div class="col-md-12">
                                    <h6 class="text-uppercase text-sm text-muted mb-3">Informasi Keuangan</h6>
                                </div>
                            </div>

                            <div class="row">
                                <!-- Gross Amount (readonly) -->
                                <div class="col-md-4 mb-3">
                                    <label for="gross_amount" class="form-label">Gross Amount (Rp)</label>
                                    <input type="text" class="form-control amount-input" id="gross_amount"
                                        name="gross_amount" placeholder="0,00" readonly>
                                    <div class="invalid-feedback" id="error-gross_amount"></div>
                                    <small class="text-muted">Total nominal sebelum potongan bon & diskon (PO + Non-PO)</small>
                                </div>

                                <!-- Potongan Bon -->
                                <div class="col-md-4 mb-3">
                                    <label for="potongan_bon" class="form-label">Potongan Bon (Rp)</label>
                                    <input type="text" class="form-control amount-input" id="potongan_bon"
                                        name="potongan_bon" placeholder="0,00" onkeyup="formatInputRupiah(this);calculateFinalAmount();"
                                        onblur="formatInputRupiahOnBlur(this);calculateFinalAmount();">
                                    <div class="invalid-feedback" id="error-potongan_bon"></div>
                                    <small class="text-muted">Potongan bon (opsional) — akan mengurangi net amount</small>
                                </div>

                                <!-- Diskon Nominal + Persen Button -->
                                <div class="col-md-4 mb-3">
                                    <label for="diskon" class="form-label">Diskon <span id="diskonLabel"></span></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control amount-input" id="diskon"
                                            name="diskon" placeholder="0,00" onkeyup="formatInputRupiah(this);calculateFinalAmount();"
                                            onblur="formatInputRupiahOnBlur(this);calculateFinalAmount();">
                                        <input type="hidden" id="diskon_persen" name="diskon_persen" value="">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openDiskonPersenModal()" title="Input Diskon dalam Persen">
                                            <i class="fas fa-percent"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-diskon"></div>
                                    <small class="text-muted">Nominal diskon (opsional) — akan mengurangi net amount</small>
                                </div>
                            </div>
                            <div class="row">
                                <!-- Net Amount (DPP sebelum pajak) -->
                                <div class="col-md-4 mb-3">
                                    <label for="amount" class="form-label">Net Amount (Rp)</label>
                                    <input type="text" class="form-control amount-input" id="amount" name="amount"
                                        placeholder="0,00" required readonly onkeyup="formatInputRupiah(this)"
                                        onblur="formatInputRupiahOnBlur(this)">
                                    <div class="invalid-feedback" id="error-amount"></div>
                                    <small class="text-muted">Net Amount = Gross Amount - Potongan Bon - Diskon</small>
                                </div>
                                <!-- PPh Amount (dari master) -->
                                <div class="col-md-4 mb-3">
                                    <label for="pph_amount" class="form-label">PPh <span id="pphRateLabel" class="text-primary"></span></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control amount-input" id="pph_amount"
                                            name="pph_amount" placeholder="0,00" readonly>
                                        <input type="hidden" id="pph_id" name="pph_id">
                                        <input type="hidden" id="pph_rate" name="pph_rate" value="0">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openSelectPPhModal()" title="Pilih Tarif PPh dari Master">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-pph_amount"></div>
                                    <small class="text-muted">Pajak Penghasilan (opsional) — dihitung dari Net Amount</small>
                                </div>
                            </div>
                            <div class="row">

                                <!-- DPP Amount (dari master) -->
                                <div class="col-md-4 mb-3">
                                    <label for="dpp_amount" class="form-label">DPP Amount <span id="dppNameLabel" class="text-primary"></span></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control amount-input" id="dpp_amount" name="dpp_amount"
                                            placeholder="0,00" readonly>
                                        <input type="hidden" id="dpp_id" name="dpp_id">
                                        <input type="hidden" id="dpp_numerator" name="dpp_numerator" value="1">
                                        <input type="hidden" id="dpp_denominator" name="dpp_denominator" value="1">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openSelectDPPModal()" title="Pilih DPP dari Master">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-dpp_amount"></div>
                                    <small class="text-muted">DPP (Dasar Pengenaan Pajak) = Net Amount * (Numerator / Denominator)</small>
                                </div>

                                

                                <!-- PPN Amount (dari master) -->
                                <div class="col-md-4 mb-3">
                                    <label for="ppn_amount" class="form-label">PPN <span id="ppnRateLabel" class="text-primary"></span></label>
                                    <div class="input-group">
                                        <input type="text" class="form-control amount-input" id="ppn_amount"
                                            name="ppn_amount" placeholder="0,00" readonly>
                                        <input type="hidden" id="ppn_id" name="ppn_id">
                                        <input type="hidden" id="ppn_rate" name="ppn_rate" value="0">
                                        <span class="input-group-text bg-primary text-light" style="cursor:pointer"
                                            onclick="openSelectPPNModal()" title="Pilih Tarif PPN dari Master">
                                            <i class="fas fa-search"></i>
                                        </span>
                                    </div>
                                    <div class="invalid-feedback" id="error-ppn_amount"></div>
                                    <small class="text-muted">Pajak Pertambahan Nilai (opsional) — dihitung dari DPP</small>
                                </div>

                                <!-- Description -->
                                <div class="col-md-12 mb-3">
                                    <label for="description" class="form-label">Description</label>
                                    <textarea class="form-control" id="description" name="description" rows="3" placeholder="Masukkan deskripsi transaksi"></textarea>
                                    <div class="invalid-feedback" id="error-description"></div>
                                    <small class="text-muted">Deskripsi detail transaksi (opsional)</small>
                                </div>
                            </div>

                    <hr class="horizontal dark">

                    <div class="row">
                        <div class="col-md-12">
                            <button type="submit" class="btn btn-primary" id="btnSubmit">
                                <i class="fas fa-save me-1"></i> Simpan
                            </button>
                            <button type="button" class="btn btn-secondary"
                                onclick="window.location='{{ url('/trsmts') }}'">
                                <i class="fas fa-arrow-left me-1"></i> Kembali
                            </button>
                        </div>
                    </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>

{{-- Include Modals --}}
@include('transc.trsmts.modals')

@endsection

@push('js')
<script>
    // ============================================
    // AMOUNT FORMAT FUNCTIONS (Indonesian)
    // ============================================
    
    function formatRupiah(value) {
        if (value === null || value === undefined || value === '') return '';
        let number = parseFloat(String(value).replace(/,/g, ''));
        if (isNaN(number)) return '';
        let integerPart = Math.floor(number);
        let decimalPart = Math.round((number - integerPart) * 100);
        let formatted = integerPart.toString().replace(/\B(?=(\d{3})+(?!\d))/g, '.');
        formatted += ',' + decimalPart.toString().padStart(2, '0');
        return formatted;
    }

    function parseRupiah(value) {
        if (!value) return '';
        let parsed = String(value).replace(/\./g, '').replace(',', '.');
        let number = parseFloat(parsed);
        return isNaN(number) ? '' : number.toFixed(2);
    }

    function formatInputRupiah(input) {
        let value = input.value;
        value = value.replace(/[^0-9,]/g, '');
        if (value.includes(',')) {
            let parts = value.split(',');
            let integer = parts[0].replace(/\D/g, '');
            let decimal = parts[1].replace(/\D/g, '').substring(0, 2);
            value = integer + ',' + decimal;
        } else {
            value = value.replace(/\D/g, '');
        }
        input.value = value;
    }

    function formatInputRupiahOnBlur(input) {
        let value = input.value;
        if (!value) return;
        let parsed = parseRupiah(value);
        if (parsed) {
            input.value = formatRupiah(parsed);
        }
    }

    function parseAmount(val) {
        if (!val) return 0;
        let parsed = String(val).replace(/\./g, '').replace(',', '.');
        return parseFloat(parsed) || 0;
    }

    function formatAmount(val) {
        const num = parseFloat(String(val).replace(/,/g, ''));
        if (isNaN(num)) return '';
        return formatRupiah(num);
    }

    function formatAmountInput(el) {
        let value = el.value;
        if (!value) return;
        let parsed = parseRupiah(value);
        if (parsed) {
            el.value = formatRupiah(parsed);
        }
    }

    let poAssignData = [];
    let rekeningData = [];
    let kodeMutasiData = [];
    let supplierBankData = [];
    let isLoadingPOAssign = false;
    let poAssignCurrentPage = 1;
    let poAssignLastPage = 1;
    let poAssignTotal = 0;
    let poAssignPerPage = 10;
    let poAssignCurrentSearch = '';
    let poAssignSearchTimer = null;
    let isLoadingRekening = false;
    let isLoadingKodeMutasi = false;
    let isLoadingSupplierBank = false;
    let projectsData = [];
    let isLoadingProjects = false;
    let selectedPOItems = [];
    let selectedNonPOItems = [];
    let currentSaldoAwal = 0;
    let currentIsIn = null;
    let currentAmount = 0;
    let lockedMonths = [];

    // Global function untuk update is_project switch state
    // Switch hanya bisa diaktifkan bila Rekening + Kode Mutasi + Tanggal sudah terisi
    // DAN belum ada PO yang diinput. Jika sudah ada PO, switch Project Terkait di-disable.
    function updateIsProjectSwitchState() {
        const rekeningId   = $('#rekening_id').val();
        const kodeMutasiId = $('#kode_mutasi_id').val();
        const tanggal      = $('#date').val();
        const allFilled    = rekeningId && kodeMutasiId && tanggal;
        const poExists     = selectedPOItems && selectedPOItems.length > 0;
        $('#is_project').prop('disabled', !allFilled || poExists);
        // Disable juga tombol search project ketika sudah ada PO
        $('#btnSearchProject').prop('disabled', poExists).css('cursor', poExists ? 'not-allowed' : 'pointer');
    }

    $(document).ready(function() {
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        // Load locked months for date validation
        $.ajax({
            url: '{{ url("/trsmts/api/locked-months") }}',
            type: 'GET',
            success: function(response) {
                if (response.success) {
                    lockedMonths = response.data || [];
                }
            },
            error: function() {
                console.warn('Gagal memuat data bulan terkunci');
            }
        });

        loadRekening();
        loadKodeMutasi();
        loadPOAssign();
        loadSupplierBankData();
        loadProjects();

        // AUTO-GENERATE NOMOR BUKTI (hanya setelah user pilih tanggal)
        function generateNomorBukti(dateVal) {
            if (!dateVal) return;
            $.get('{{ url("/trsmts/api/nomor-bukti") }}/' + dateVal, function(res) {
                if (res.success && res.data.nomor_bukti) {
                    $('#nomor_bukti').val(res.data.nomor_bukti);
                }
            }).fail(function() {
                console.warn('Gagal auto-generate nomor bukti');
            });
        }

        // Generate nomor bukti hanya saat user mengganti tanggal (jika tanggal tidak terkunci)
        $('#date').on('change', function() {
            const selectedDate = $(this).val();
            if (validateLockedDate(selectedDate)) {
                generateNomorBukti(selectedDate);
            } else {
                $('#nomor_bukti').val('');
            }
        });

        // Prevent form submit if date is locked
        $('#formAddTrsmts').on('submit', function(e) {
            const selectedDate = $('#date').val();
            if (!validateLockedDate(selectedDate, true)) {
                e.preventDefault();
                return false;
            }
        });

        updateIsProjectSwitchState();

                $('#is_project').on('change', function() {
            if ($(this).is(':checked')) {
                const poHasProject = selectedPOItems.some(function(po) { return po.project_id; });
                if (poHasProject) {
                    $(this).prop('checked', false);
                    Swal.fire({
                        title: 'Perhatian!',
                        text: 'Project Terkait hanya berlaku untuk transaksi Non-PO. Jika transaksi menggunakan PO atau PO + Non-PO, Project Terkait tidak dapat dipilih secara manual karena akan mengikuti project pada PO yang dipilih.',
                        icon: 'warning',
                        confirmButtonColor: '#028284'
                    });
                    return;
                }
                $('#projectFieldRow').slideDown(300);
            } else {
                $('#projectFieldRow').slideUp(300);
                $('#project_id').val('');
                $('#project_display').val('');
                // Reload PO Assign tanpa filter project
                loadPOAssign(1);
            }
        });

        $('#is_dp').on('change', function() {
            if ($(this).is(':checked')) {
                $('#dpPercentageDiv, #dpSeqDiv').slideDown(300);
                checkAndSetDPAuto(function(hasDp, nextSeq) {
                    if (!hasDp) {
                        $('#dp_seq').val(1);
                        renderDPSummaryTable();
                        $('#dpSummarySection').slideDown(300);
                    }
                });
            } else {
                $('#dpPercentageDiv, #dpSeqDiv').slideUp(300);
                $('#dp_percentage, #dp_seq').val('');
                $('#dpSummarySection').hide();
            }
        });

        $('#dp_seq').on('change', function() {
            const seq = parseInt($(this).val()) || 1;
            renderDPSummaryTable();
            $('#dpSummarySection').slideDown(300);
        });

        $('#formAddTrsmts').on('submit', function(e) {
            e.preventDefault();
            $('.form-control, .form-select').removeClass('is-invalid');
            $('.invalid-feedback').text('');

            let valid = true;
            let errorMsg = '';

            selectedPOItems.forEach(function(po, poIdx) {
                po.selected_details.forEach(function(d, dIdx) {
                    const amtUnit = parseFloat(d.amount_unit) || 0;
                    const amtRupUnit = parseFloat(d.amount_rupiah_unit) || 0;
                    const amtRup = parseFloat(d.amount_rupiah) || 0;
                    if (amtUnit <= 0 || amtRupUnit <= 0 || amtRup <= 0) {
                        valid = false;
                        errorMsg = 'PO ' + po.po_number + ' - baris ' + (dIdx + 1) + ': Qty (Unit), Amount Rupiah/Unit, dan Amount (Rp) harus diisi dan tidak boleh 0';
                    }
                });
            });

            if (valid) {
                selectedNonPOItems.forEach(function(item, idx) {
                    const amtUnit = parseFloat(item.amount_unit) || 0;
                    const amtRupUnit = parseFloat(item.amount_rupiah_unit) || 0;
                    const amtRup = parseFloat(item.amount_rupiah) || 0;
                    const ket = item.keterangan || '';
                    if (amtUnit <= 0 || amtRupUnit <= 0 || amtRup <= 0) {
                        valid = false;
                        errorMsg = 'Pengeluaran Selain PO - baris ' + (idx + 1) + ' (' + (ket || '(tanpa keterangan)') + '): Qty (Unit), Amount Rupiah/Unit, dan Amount (Rp) harus diisi dan tidak boleh 0';
                    }
                });
            }

            if (!valid) {
                Swal.fire({ title: 'Validasi Gagal!', text: errorMsg, icon: 'warning', confirmButtonColor: '#028284' });
                $('#btnSubmit').prop('disabled', false).html('<i class="fas fa-save me-1"></i> Simpan');
                return;
            }

            // Validasi Rekening Asal/Tujuan
            if (!$('#rekening_tujuan_dari').val()) {
                $('#rekening_tujuan_dari_display').addClass('is-invalid');
                $('#error-rekening_tujuan_dari').text('Rekening Asal/Tujuan harus diisi');
                Swal.fire({ title: 'Validasi Gagal!', text: 'Rekening Asal/Tujuan harus diisi', icon: 'warning', confirmButtonColor: '#028284' });
                $('#btnSubmit').prop('disabled', false).html('<i class="fas fa-save me-1"></i> Simpan');
                return;
            }

            $('#btnSubmit').prop('disabled', true).html('<i class="fas fa-spinner fa-spin me-1"></i> Menyimpan...');

            const poItems = selectedPOItems.map(function(po, idx) {
            let dpTotalInput = $(`input.po-dp-total[data-po-idx="${idx}"]`).val();
                let dpTotal = dpTotalInput ? parseFloat(parseRupiah(dpTotalInput)) : 0;
                return {
                    po_assign_id: po.po_assign_id,
                    dp_total: dpTotal,
                    details: po.selected_details.map(function(d) {
                        return { detail_kategori_id: d.detail_kategori_id, detail_kategori_unit_id: d.detail_kategori_unit_id, spesifikasi_id: d.spesifikasi_id || null, amount_unit: d.amount_unit || 0, amount_rupiah: d.amount_rupiah || 0, amount_rupiah_unit: d.amount_rupiah_unit || 0 };
                    })
                };
            });

            const nonPOItems = selectedNonPOItems.map(function(item) {
                return { keterangan: item.keterangan || null, amount_unit: item.amount_unit || 0, amount_rupiah: item.amount_rupiah || 0, amount_rupiah_unit: item.amount_rupiah_unit || 0 };
            });

            const formData = {
                rekening_id: $('#rekening_id').val(),
                date: $('#date').val(),
                kode_mutasi_id: $('#kode_mutasi_id').val(),
                nomor_bukti: $('#nomor_bukti').val(),
                is_credit: $('#is_credit').is(':checked') ? 1 : 0,
                is_project: $('#is_project').is(':checked') ? 1 : 0,
                project_id: $('#project_id').val() || null,
                is_dp: $('#is_dp').is(':checked') ? 1 : 0,
                dp_percentage: $('#dp_percentage').val() || null,
                dp_seq: $('#dp_seq').val() || null,
                potongan_bon: parseRupiah($('#potongan_bon').val()) || 0,
                diskon: parseRupiah($('#diskon').val()) || 0,
                amount: parseRupiah($('#amount').val()) || 0,
                dpp_id: $('#dpp_id').val() || null,
                pph_id: $('#pph_id').val() || null,
                ppn_id: $('#ppn_id').val() || null,
                dpp_amount: parseRupiah($('#dpp_amount').val()) || 0,
                pph_amount: parseRupiah($('#pph_amount').val()) || 0,
                ppn_amount: parseRupiah($('#ppn_amount').val()) || 0,
                rekening_tujuan_dari: $('#rekening_tujuan_dari').val() || null,
                description: $('#description').val() || null,
                po_items: poItems,
                non_po_items: nonPOItems
            };

            $.ajax({
                url: '{{ url("/trsmts") }}',
                type: 'POST',
                data: JSON.stringify(formData),
                contentType: 'application/json',
                dataType: 'json',
                success: function(response) {
                    if (response.success) {
                        Swal.fire({ title: 'Berhasil!', text: response.message, icon: 'success', confirmButtonColor: '#028284' }).then(() => {
                            window.location.href = '{{ url("/trsmts") }}';
                        });
                    } else {
                        Swal.fire({ title: 'Gagal!', text: response.message, icon: 'error', confirmButtonColor: '#028284' });
                        $('#btnSubmit').prop('disabled', false).html('<i class="fas fa-save me-1"></i> Simpan');
                    }
                },
                error: function(xhr) {
                    if (xhr.status === 422) {
                        const errors = xhr.responseJSON.data.errors;
                        $.each(errors, function(field, messages) {
                        $(`#${field}`).addClass('is-invalid');
                        $(`#error-${field}`).text(messages[0]);
                        });
                        Swal.fire({ title: 'Validasi Gagal!', text: 'Silakan periksa kembali input Anda', icon: 'warning', confirmButtonColor: '#028284' });
                    } else {
                        Swal.fire({ title: 'Error!', text: xhr.responseJSON?.message || 'Terjadi kesalahan', icon: 'error', confirmButtonColor: '#028284' });
                    }
                    $('#btnSubmit').prop('disabled', false).html('<i class="fas fa-save me-1"></i> Simpan');
                }
            });
        });

        $('#rekening_id, #kode_mutasi_id, #date, #nomor_bukti').on('change keyup', function() {
            updateIsProjectSwitchState();
        });

        $('.form-control, .form-select').on('change keyup', function() {
            $(this).removeClass('is-invalid');
            $(`#error-${$(this).attr('name')}`).text('');
        });

        // Clear error when rekening_tujuan_dari is selected
        $('#rekening_tujuan_dari').on('change', function() {
            $('#rekening_tujuan_dari_display').removeClass('is-invalid');
            $('#error-rekening_tujuan_dari').text('');
        });

        let isCalculatingFinalAmount = false;

        window.openDiskonPersenModal = function() {
            Swal.fire({
                title: 'Input Persentase Diskon (%)',
            html: `<div class="input-group"><input id="swal-diskon-persen" type="number" class="form-control" min="0" max="100" step="0.01" value="${$('#diskon_persen').val() || ''}"><span class="input-group-text">%</span></div>`,
                showCancelButton: true,
                confirmButtonText: 'Hitung',
                cancelButtonText: 'Batal',
                confirmButtonColor: '#028284',
                focusConfirm: false,
                preConfirm: function() {
                    const value = $('#swal-diskon-persen').val();
                    if (value === '' || value === null) return '';
                    const val = parseFloat(value);
                    if (isNaN(val) || val < 0 || val > 100) {
                        Swal.showValidationMessage('Nilai harus antara 0 - 100');
                        return false;
                    }
                    return val;
                }
            }).then(function(result) {
                if (result.isConfirmed) {
                    const rawValue = result.value;
                    if (rawValue === '') {
                        $('#diskon_persen').val('');
                        $('#diskon').val('');
                        calculateFinalAmount();
                    } else {
                        $('#diskon_persen').val(rawValue);
                        let baseAmount = getBaseAmount();
                        if (baseAmount <= 0) {
                            Swal.fire({ title: 'Perhatian!', text: 'Belum ada item', icon: 'warning', confirmButtonColor: '#028284' });
                            return;
                        }
                        const diskonPersen = Math.max(0, Math.min(100, rawValue));
                        if (diskonPersen > 0) {
                            let diskonNominal = baseAmount * (diskonPersen / 100);
                            $('#diskon').val(formatRupiah(diskonNominal.toFixed(2)));
                        }
                        calculateFinalAmount();
                    }
                }
            });
        };

        window.updateDiskonLabel = function() {
            const diskonPersen = parseFloat($('#diskon_persen').val());
            const baseAmount = getBaseAmount();
            let displayPersen = diskonPersen;
            if (!diskonPersen && baseAmount > 0) {
                const diskonNominal = parseAmount($('#diskon').val());
                if (diskonNominal > 0) {
                    displayPersen = Math.round((diskonNominal / baseAmount) * 100 * 100) / 100;
                    $('#diskon_persen').val(displayPersen);
                }
            }
            if (displayPersen && baseAmount > 0) {
            $('#diskonLabel').html(`<span class="text-primary">(${displayPersen}%)</span>`);
            } else {
                $('#diskonLabel').html('');
            }
        };

        window.getBaseAmount = function() {
            let baseAmount = 0;
            selectedPOItems.forEach(function(po) {
                po.selected_details.forEach(function(d) { baseAmount += parseFloat(d.gross_amount_rupiah || d.amount_rupiah) || 0; });
            });
            selectedNonPOItems.forEach(function(item) {
                baseAmount += parseFloat(item.gross_amount_rupiah || item.amount_rupiah) || 0;
            });
            return baseAmount;
        };

        window.recalculateDiskonPersen = function() {
            const baseAmount = getBaseAmount();
            const diskonNominal = parseAmount($('#diskon').val());
            if (baseAmount > 0 && diskonNominal > 0) {
                let diskonPersen = (diskonNominal / baseAmount) * 100;
                diskonPersen = Math.round(diskonPersen * 100) / 100;
                $('#diskon_persen').val(diskonPersen);
            } else if (diskonNominal <= 0) {
                $('#diskon_persen').val('');
            }
            updateDiskonLabel();
        };

        window.calculateFinalAmount = function() {
            recalculateDiskonPersen();

            let grossAmount = getBaseAmount();
            let potonganBon = parseAmount($('#potongan_bon').val()) || 0;
            let diskon = parseAmount($('#diskon').val()) || 0;

            potonganBon = Math.max(0, potonganBon);
            diskon = Math.max(0, diskon);

        // Update Gross Amount field
            if (grossAmount > 0) {
                $('#gross_amount').val(formatRupiah(grossAmount.toFixed(2)));
            } else {
                $('#gross_amount').val('');
            }

            let totalPotongan = potonganBon + diskon;
            if (totalPotongan > grossAmount && grossAmount > 0) {
                Swal.fire({
                    title: 'Validasi Gagal!',
                    text: 'Total Potongan Bon + Diskon tidak boleh melebihi Gross Amount (Rp ' + formatRupiah(grossAmount.toFixed(2)) + ')',
                    icon: 'warning',
                    confirmButtonColor: '#028284'
                });
                if (potonganBon > grossAmount) {
                    potonganBon = 0;
                    $('#potongan_bon').val(formatRupiah(potonganBon));
                }
                if (diskon > grossAmount) {
                    diskon = 0;
                    $('#diskon').val(formatRupiah(Math.max(0, diskon)));
                }
                totalPotongan = potonganBon + diskon;
            }

        // DPP = Gross - Potongan - Diskon
            let dpp = grossAmount - totalPotongan;
            dpp = Math.max(0, dpp);

            $('#amount').val(formatRupiah(dpp.toFixed(2)));
            currentAmount = dpp;

        // Recalculate PPh and PPN from new DPP if percentages are set
            const pphPersen = parseFloat($('#pph_persen').val()) || 0;
            const ppnPersen = parseFloat($('#ppn_persen').val()) || 0;
            if (pphPersen > 0 && dpp > 0) {
                const pphNominal = dpp * (pphPersen / 100);
                $('#pph_amount').val(formatRupiah(pphNominal.toFixed(2)));
            }
            if (ppnPersen > 0 && dpp > 0) {
                const ppnNominal = dpp * (ppnPersen / 100);
                $('#ppn_amount').val(formatRupiah(ppnNominal.toFixed(2)));
            }

            updateDiskonLabel();
    
    // Recalculate DPP/PPh/PPN from stored master values
            recalculateFromMaster();

            setTimeout(function() {
                isCalculatingFinalAmount = false;
            }, 10);
        };

    // ============================================
    // PPh PERCENTAGE FUNCTIONS (from DPP)
    // ============================================
        window.getDPPAmount = function() {
            return parseAmount($('#amount').val()) || 0;
        };

       

        
        $(document).on('keyup change blur', '#pph_amount, #ppn_amount', function() {
            const id = $(this).attr('id');
            if (id === 'pph_amount') updatePPHLabel();
            if (id === 'ppn_amount') updatePPNLabel();
        });

        $('#diskon').on('keyup change blur', function() {
            if (!isCalculatingFinalAmount) {
                recalculateDiskonPersen();
            }
        });

    $('#searchSupplierBank').on('keyup', function () {
            const keyword = $(this).val().toLowerCase();
            const filtered = supplierBankData.filter(item => {
                return (
                    (item.supplier_name || '').toLowerCase().includes(keyword) ||
                    (item.nama_bank || '').toLowerCase().includes(keyword) ||
                    (item.nomor_akun || '').toLowerCase().includes(keyword) ||
                    (item.nama_akun || '').toLowerCase().includes(keyword)
                );
            });
            renderSupplierBankTable(filtered);
        });
        $('#searchPOAssign').on('keyup', function() {
            clearTimeout(poAssignSearchTimer);
            poAssignCurrentSearch = $(this).val().trim();
            poAssignSearchTimer = setTimeout(function() { loadPOAssign(1); }, 400);
        });

        $('#searchRekening').on('keyup', function() {
            const search = $(this).val().toLowerCase();
            renderRekeningTable(rekeningData.filter(r =>
                r.nama_bank.toLowerCase().includes(search) ||
                r.nomor_akun.toLowerCase().includes(search) ||
                r.nama_akun.toLowerCase().includes(search)
            ));
        });

        $('#searchKodeMutasi').on('keyup', function() {
            const search = $(this).val().toLowerCase();
            renderKodeMutasiTable(kodeMutasiData.filter(k => {
                const jenisMutasi = k.is_in == 1 ? 'mutasi masuk' : 'mutasi keluar';
                return k.kode_mutasi.toLowerCase().includes(search) ||
                    jenisMutasi.includes(search);
            }));
        });

        $('#searchProject').on('keyup', function() {
            const search = $(this).val().toLowerCase();
            renderProjectTable(projectsData.filter(p =>
                (p.proyek || '').toLowerCase().includes(search) ||
                (p.lokasi || '').toLowerCase().includes(search) ||
                (p.pekerjaan || '').toLowerCase().includes(search) ||
                (p.pemilik || '').toLowerCase().includes(search) ||
                (p.no_spk || '').toLowerCase().includes(search) ||
                (p.sales || '').toLowerCase().includes(search)
            ));
        });

        $('#formAddRekening').on('submit', function(e) {
            e.preventDefault();
            saveRekening();
        });

        $('#formAddKodeMutasi').on('submit', function(e) {
            e.preventDefault();
            saveKodeMutasi();
        });

        $('#formAddSupplier').on('submit', function(e) {
            e.preventDefault();
            saveSupplier();
        });

        $('#formAddSuppliersBank').on('submit', function(e) {
            e.preventDefault();
            saveSuppliersBank();
        });
    });

    // ============================================
    // LOCKED DATE VALIDATION
    // ============================================
    function validateLockedDate(dateStr, isSubmit = false) {
        if (!dateStr) return true;
        
        const selectedDate = new Date(dateStr);
        const selectedMonth = selectedDate.getMonth() + 1; // 1-12
        const selectedYear = selectedDate.getFullYear();
        
        const lockedEntry = lockedMonths.find(function(lock) {
            return parseInt(lock.bulan) === selectedMonth && parseInt(lock.tahun) === selectedYear;
        });
        
        if (lockedEntry) {
            const monthNames = ['Januari', 'Februari', 'Maret', 'April', 'Mei', 'Juni', 'Juli', 'Agustus', 'September', 'Oktober', 'November', 'Desember'];
            const monthName = monthNames[selectedMonth - 1] || selectedMonth;
            
            Swal.fire({
                title: 'Tanggal Terkunci!',
                html: `Transaksi untuk bulan <strong>${monthName} ${selectedYear}</strong> sudah dikunci.<br>Silakan pilih tanggal bulan lain yang belum dikunci atau hubungi super admin untuk membuka kunci.`,
                icon: 'error',
                confirmButtonColor: '#d33',
                confirmButtonText: 'Mengerti'
            });
            
            // Clear the date field
            $('#date').val('');
            $('#nomor_bukti').val('');
            
            // Focus back to date input
            $('#date').focus();
            
            return false;
        }
        
        return true;
    }

    // ============================================
    // DP FUNCTIONS
// ============================================
    function checkAndSetDPAuto(callback) {
        if (selectedPOItems.length === 0) { if (callback) callback(false, 1); return; }
        const poId = selectedPOItems[0].po_assign_id;
        $.get('{{ url("/trsmts/api/dp-check") }}/' + poId, function(res) {
            if (res.success && res.data.has_dp) {
                $('#dp_seq').val(res.data.next_urutan);
                renderDPSummaryTable();
                $('#dpSummarySection').slideDown(300);
                if (callback) callback(true, res.data.next_urutan);
            } else {
                if (callback) callback(false, 1);
            }
        }).fail(function() {
            if (callback) callback(false, 1);
        });
    }

    function renderDPSummaryTable() {
        const container = $('#dpSummaryContainer');
        container.empty();
        if (selectedPOItems.length === 0) {
            container.html('<div class="text-muted py-2"><i class="fas fa-info-circle me-1"></i>Tidak ada PO</div>');
            return;
        }
        const isSeq1 = (parseInt($('#dp_seq').val()) || 0) === 1;
        const titleText = isSeq1 ? 'Total Harga Awal (Harga Keseluruhan PO)' : 'Riwayat DP / Termin';
        let html = '<div class="mb-1">' +
            '<label class="form-label">' + titleText + '</label>' +
            (isSeq1 ? '<small class="text-muted d-block">Total harga awal kontrak dan setelah dikurangi diskon dan potongan (Net Amount)</small>' : '') +
            '</div>';
        html += '<div class="table-responsive"><table class="table table-sm table-bordered">';
        html += '<thead style="background-color:#e9ecef;"><tr>';
        html += '<th style="width:30px" class="text-center"></th>';
        html += '<th style="width:40%"  class="text-center">PO Number</th>';
        if (isSeq1) {
            html += '<th  class="text-center" style="width:55%">Total Harga Awal (Rp)</th>';
        } else {
            html += '<th class="text-center" style="width:20%">Harga Awal</th>';
            html += '<th class="text-center" style="width:20%">Dibayar</th>';
            html += '<th class="text-center" style="width:20%">Kurang Bayar</th>';
        }
        html += '</tr></thead><tbody>';
        selectedPOItems.forEach(function(po, i) {
            let totalAwal = 0;
            po.selected_details.forEach(function(d) { totalAwal += parseFloat(d.amount_rupiah) || 0; });
            const displayTotal = isSeq1 ? 0 : totalAwal;
            const formatted = formatRupiah(displayTotal.toFixed(2));
            html += '<tr data-po-idx="' + i + '" data-po-id="' + po.po_assign_id + '" >';
            html += '<td class="text-center"><i class="fas fa-chevron-down text-muted" style="cursor:pointer;font-size:0.6rem;" onclick="toggleDPDetail(this)"></i></td>';
            html += '<td class="fw-semibold" style="word-break:break-all;">' + po.po_number + '</td>';
            if (isSeq1) {
            html += '<td class="text-end"><input type="text" class="form-control form-control-sm text-end po-dp-total" data-po-idx="' + i + '" value="' + formatted + '" onkeyup="formatInputRupiah(this);syncDPTotal(this)" onblur="formatInputRupiahOnBlur(this);syncDPTotal(this)" style="max-width:300px;margin-left:auto;font-size:0.8rem;padding:1px 4px;"></td>';
        } else {
            html += '<td class="text-end">' +
            '<span class="dp-total-awal fw-semibold">' + formatted + '</span> ' +
            '<i class="fas fa-edit text-primary ms-1" ' +
                'style="font-size:0.9em; cursor:pointer; vertical-align:middle;" ' +
                'onclick="editDPTotal(' + i + ')" ' +
                'title="Edit Harga Awal"></i>' +
            '</td>';
            html += '<td class="text-end dp-total-dibayar text-success fw-semibold">Rp 0,00</td>';
            html += '<td class="text-end dp-kurang-bayar text-danger fw-semibold">Rp 0,00</td>';
        }
            html += '</tr>';
            html += '<tr class="dp-detail-row" style="display:none"><td colspan="5" class="p-0"><div class="dp-detail-content px-2 py-1 bg-light border-top" style="font-size:0.7rem;"></div></td></tr>';
        });
        html += '</tbody></table></div>';
        container.append(html);
        if (!isSeq1) {
            selectedPOItems.forEach(function(po, i) {
                loadDPSummaryForPO(po, i);
            });
        }
    }

    function toggleDPDetail(el) {
        const row = $(el).closest('tr');
        const detailRow = row.next('.dp-detail-row');
        detailRow.toggle();
        $(el).toggleClass('fa-chevron-down fa-chevron-up');
        if (detailRow.is(':visible') && !detailRow.data('loaded')) {
            const poId = row.data('po-id');
            const content = detailRow.find('.dp-detail-content');
            content.html('<div class="text-center text-muted py-2"><i class="fas fa-spinner fa-spin me-1"></i>Memuat...</div>');
            $.get('{{ url("/trsmts/api/dp-history") }}/' + poId, function(res) {
                content.empty();
                if (res.success && res.data.length > 0) {
                    let h = '<table class="table table-sm table-bordered mb-0" style="font-size:0.8rem;"><thead style="background-color:#e9ecef;"><tr><th style="width:30px"  class="text-center">DP Ke-</th><th class="text-center">Tanggal</th><th class="text-center">No. Bukti</th><th class="text-center">Persentase DP (%)</th><th  class="text-center" style="width:160px">Total Dibayar</th></tr></thead><tbody>';
                    res.data.forEach(function(d, idx) {
                        h += '<tr><td class="text-center" style="border:1px solid #dee2e6;">' + (idx + 1) + '</td><td style="border:1px solid #dee2e6;">' + (formatDate(d.date) || '-') + '</td><td style="border:1px solid #dee2e6;">' + (d.nomor_bukti || '-') + '</td><td style="border:1px solid #dee2e6;">' + (d.dp_percentage || '-') + '</td><td class="text-end fw-semibold" style="border:1px solid #dee2e6;">Rp ' + formatRupiah(d.amount_paid) + '</td></tr>';
                    });
                    h += '</tbody></table>';
                    content.html(h);
                } else {
                    content.html('<div class="text-muted text-center py-1"><i class="fas fa-inbox me-1"></i>Belum ada transaksi DP sebelumnya</div>');
                }
                detailRow.data('loaded', true);
            });
        }
    }

    function formatDate(dateString) {
        if (!dateString) return '-';
        const date = new Date(dateString);
        const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
        let hour = date.getHours();
        const minute = String(date.getMinutes()).padStart(2, '0');
        const ampm = hour >= 12 ? 'PM' : 'AM';
        hour = hour % 12;
        hour = hour ? hour : 12;
        hour = String(hour).padStart(2, '0');
    return `${date.getDate()}-${months[date.getMonth()]}-${date.getFullYear()} ${hour}:${minute} ${ampm}`;
    }

    function loadDPSummaryForPO(po, idx) {
        $.get('{{ url("/trsmts/api/dp-summary") }}/' + po.po_assign_id, function(res) {
            if (res.success) {
                const row = $('tr[data-po-idx="' + idx + '"]');
                const totalAwalFormatted = formatRupiah(res.data.total_amount_awal.toFixed(2));
                const dibayarFormatted = formatRupiah(res.data.total_dibayar.toFixed(2));
                const kurangFormatted = formatRupiah(res.data.kurang_bayar.toFixed(2));
                row.find('.dp-total-awal').html(totalAwalFormatted);
                row.find('.dp-total-dibayar').html('Rp ' + dibayarFormatted);
                row.find('.dp-kurang-bayar').html('Rp ' + kurangFormatted);
            }
        });
    }

    function syncDPTotal(input) { }

    function editDPTotal(poIdx) {
        const row = $('tr[data-po-idx="' + poIdx + '"]');
        const totalAwalSpan = row.find('.dp-total-awal');
        const currentAmountText = totalAwalSpan.text().trim();
        const poId = row.data('po-id');

        Swal.fire({
            title: 'Edit Harga Awal',
            html: `
                <div class="mb-2 text-start">
                    <label class="form-label small">Total Harga Awal (Rp)</label>
                    <small class="text-muted d-block mb-2 ms-0" style="font-size:0.8rem ; padding-left:4px">  Harga awal kontrak setelah dikurangi diskon dan potongan (Net Amount)</small>
                    <input id="swal-dp-amount" type="text" class="form-control" value="${currentAmountText}" onkeyup="formatInputRupiah(this)" onblur="formatInputRupiahOnBlur(this)">
                </div>
            `,
            showCancelButton: true,
            confirmButtonText: 'Simpan',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#028284',
            focusConfirm: false,
            preConfirm: function() {
                const val = $('#swal-dp-amount').val();
                if (!val || val.trim() === '') {
                    Swal.showValidationMessage('Nilai tidak boleh kosong');
                    return false;
                }
                const parsed = parseRupiah(val);
                const amount = parsed ? parseFloat(parsed) : 0;
                if (amount <= 0) {
                    Swal.showValidationMessage('Nilai harus lebih dari 0');
                    return false;
                }
                return amount;
            }
        }).then(function(result) {
            if (result.isConfirmed) {
                const totalAmount = result.value;
                totalAwalSpan.html(formatRupiah(totalAmount.toFixed(2)));

                const payload = {
                    po_assign_id: poId,
                    total_amount: totalAmount
                };

                $.ajax({
                    url: '{{ url("/trsmts/api/dp-total") }}',
                    type: 'POST',
                    data: JSON.stringify(payload),
                    contentType: 'application/json',
                    dataType: 'json',
                    headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
                    success: function(res) {
                        if (res.success) {
                            Swal.fire({
                                title: 'Berhasil!',
                                text: res.message || 'Total harga awal berhasil disimpan',
                                icon: 'success',
                                confirmButtonColor: '#028284',
                                timer: 1500,
                                showConfirmButton: false
                            });
                        } else {
                            Swal.fire({ title: 'Gagal!', text: res.message || 'Gagal menyimpan total harga awal', icon: 'error', confirmButtonColor: '#028284' });
                        }
                    },
                    error: function(xhr) {
                        const msg = xhr.responseJSON?.message || 'Terjadi kesalahan';
                        Swal.fire({ title: 'Error!', text: msg, icon: 'error', confirmButtonColor: '#028284' });
                    }
                });
            }
        });
    }

    // GLOBAL FUNCTIONS
    function loadSupplierBank() {
        isLoadingSupplierBank = true;
        renderSupplierBankTable(supplierBankData);
        $.ajax({
            url: '{{ url("/trsmts/api/supplier-bank") }}',
            type: 'GET',
            success: function(response) { if (response.success) supplierBankData = response.data; },
            error: function(xhr) { console.error('Gagal load supplier bank', xhr); },
            complete: function() { isLoadingSupplierBank = false; renderSupplierBankTable(supplierBankData); }
        });
    }

    function loadRekening() {
        isLoadingRekening = true;
        renderRekeningTable(rekeningData);
        $.ajax({
            url: '{{ url("/trsmts/api/rekening") }}',
            type: 'GET',
            success: function(response) { if (response.success) rekeningData = response.data; },
            complete: function() { isLoadingRekening = false; renderRekeningTable(rekeningData); }
        });
    }

    function loadKodeMutasi() {
        isLoadingKodeMutasi = true;
        renderKodeMutasiTable(kodeMutasiData);
        $.ajax({
            url: '{{ url("/trsmts/api/kode-mutasi") }}',
            type: 'GET',
            success: function(response) { if (response.success) kodeMutasiData = response.data; },
            complete: function() { isLoadingKodeMutasi = false; renderKodeMutasiTable(kodeMutasiData); }
        });
    }

    function loadProjects() {
        isLoadingProjects = true;
        renderProjectTable(projectsData);
        $.ajax({
            url: '{{ url("/trsmts/api/projects/active") }}',
            type: 'GET',
            success: function(response) { if (response.success) projectsData = response.data; },
            complete: function() { isLoadingProjects = false; renderProjectTable(projectsData); }
        });
    }

    // Project filter untuk PO Assign hanya dari #project_id (Project Terkait)
    function getPOAssignProjectFilter() {
        return $('#project_id').val() || '';
    }

    function loadPOAssign(page = 1) {
        isLoadingPOAssign = true;
        poAssignCurrentPage = page;
        renderPOAssignTable([]);
        $.ajax({
            url: '{{ url("/trsmts/api/po-assign") }}',
            type: 'GET',
            data: { search: poAssignCurrentSearch, page: page, per_page: poAssignPerPage, project_id: getPOAssignProjectFilter() },
            success: function(response) {
                if (response.success) {
                    poAssignData = response.data;
                    poAssignCurrentPage = response.pagination.current_page;
                    poAssignLastPage = response.pagination.last_page;
                    poAssignTotal = response.pagination.total;
                }
            },
            complete: function() { isLoadingPOAssign = false; renderPOAssignTable(poAssignData); renderPOAssignPagination(); }
        });
    }

// Render functions
    function renderSupplierBankTable(data) {
        const tbody = $('#supplierBankTableBody');
        tbody.empty();
        if (isLoadingSupplierBank) {
            tbody.html('<tr><td colspan="7" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="7" class="text-center">Tidak ada data</td></tr>');
            return;
        }
        data.forEach((item, index) => {
        const displayText = `${item.supplier_name} - ${item.nama_bank} (${item.nomor_akun})`;
        tbody.append(`<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectSupplierBank(${item.id}, '${displayText.replace(/'/g, "\\'")}')">Pilih</button></td><td class="text-center">${index + 1}</td><td>${item.supplier_name ?? ''}</td><td>${item.keterangan ?? ''}</td><td class="${(item.nama_bank || '-') === '-' ? 'text-center' : 'text-start'}">${item.nama_bank ?? ''}</td><td>${item.nomor_akun ?? ''}</td><td>${item.nama_akun ?? ''}</td></tr>`);
        });
    }

    function renderRekeningTable(data) {
        const tbody = $('#rekeningTableBody');
        tbody.empty();
        if (isLoadingRekening) {
            tbody.html('<tr><td colspan="7" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="7" class="text-center">Tidak ada data</td></tr>');
            return;
        }
        data.forEach((item, index) => {
            const saldoAwal = parseFloat(item.saldo_awal || 0).toLocaleString('id-ID', {minimumFractionDigits: 2, maximumFractionDigits: 2});
            const saldoAkhir = parseFloat(item.saldo_akhir || 0).toLocaleString('id-ID', {minimumFractionDigits: 2, maximumFractionDigits: 2});
        tbody.append(`<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectRekening(${item.id}, '${item.nama_bank} - ${item.nomor_akun}')">Pilih</button></td><td class="text-center">${index + 1}</td><td class="${item.nama_bank ? 'text-start' : 'text-center'}">${item.nama_bank}</td><td class="${item.nomor_akun ? 'text-start' : 'text-center'}">${item.nomor_akun}</td><td class="${item.nama_akun ? 'text-start' : 'text-center'}">${item.nama_akun}</td><td class="text-end">${saldoAwal}</td><td class="text-end">${saldoAkhir}</td></tr>`);
        });
    }

    function renderKodeMutasiTable(data) {
        const tbody = $('#kodeMutasiTableBody');
        tbody.empty();
        if (isLoadingKodeMutasi) {
            tbody.html('<tr><td colspan="4" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="4" class="text-center">Tidak ada data</td></tr>');
            return;
        }
        data.forEach((item, index) => {
            const jenisMutasi = item.is_in == 1 ? 'Mutasi Masuk' : 'Mutasi Keluar';
        const displayText = `${item.kode_mutasi} - ${jenisMutasi}`;
        tbody.append(`<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectKodeMutasi(${item.id}, '${displayText}')">Pilih</button></td><td class="text-center">${index + 1}</td><td class="${item.kode_mutasi ? 'text-start' : 'text-center'}">${item.kode_mutasi}</td><td class="${jenisMutasi ? 'text-start' : 'text-center'}">${jenisMutasi}</td></tr>`);
        });
    }

    function renderPOAssignTable(data) {
        const tbody = $('#poAssignTableBody');
        tbody.empty();
        if (isLoadingPOAssign) {
            tbody.html('<tr><td colspan="8" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="8" class="text-center">Tidak ada data</td></tr>');
            return;
        }
        data.forEach((item, index) => {
            const projectDisplay = item.proyek || '-';
            const supplierDisplay = item.supplier_name || '-';
            const isProjectBadge = item.is_project ? '<span class="badge bg-success"><i class="fas fa-check"></i> Ya</span>' : '<span class="badge bg-secondary"><i class="fas fa-times"></i> Tidak</span>';
            const isSupplierBadge = item.supplier_id ? '<span class="badge bg-success"><i class="fas fa-check"></i> Ya</span>' : '<span class="badge bg-secondary"><i class="fas fa-times"></i> Tidak</span>';
        tbody.append(`<tr><td><div class="btn-group btn-group-sm" role="group"><button type="button" class="btn btn-primary" onclick='selectPOAssign(${JSON.stringify(item)})'><i class="fas fa-check me-1"></i>Pilih</button><button type="button" class="btn btn-outline-secondary btn-toggle-detail" id="btnDetail_${item.id}" onclick="togglePODetail(${item.id})" title="Lihat Detail Items"><i class="fas fa-chevron-down"></i></button></div></td><td class="text-center">${(poAssignCurrentPage - 1) * poAssignPerPage + index + 1}</td><td class="${item.po_number ? 'text-start' : 'text-center'}"><span class="fw-semibold text-primary">${item.po_number}</span></td><td class="text-muted small ${item.description ? 'text-start' : 'text-center'}">${item.description || '<em>-</em>'}</td><td class="text-center">${isProjectBadge}</td><td class="small">${projectDisplay}</td><td class="text-center">${isSupplierBadge}</td><td class="small">${supplierDisplay}</td></tr><tr id="poDetail_${item.id}" class="po-detail-row"><td colspan="8" class="p-0"><div class="po-detail-content"><div class="d-flex align-items-center gap-1 mb-2"><i class="fas fa-list-ul text-muted"></i><small class="text-muted fw-semibold">Detail Items &mdash; ${item.po_number}</small></div><table class="table table-sm table-bordered" style="font-size:0.8rem"><thead style="background-color:#e9ecef;"><tr><th class="text-center" style="width:36px">#</th><th class="text-center">Kategori</th><th class="text-center">Detail Kategori</th><th class="text-center" style="width:150px">Quantity (Unit)</th><th class="text-center" style="width:70px">Unit</th></tr></thead><tbody></tbody></table></div></td></tr>`);
        });
    }

    function togglePODetail(poId) {
    const detailRow = $(`#poDetail_${poId}`);
    const btn = $(`#btnDetail_${poId}`);
        if (detailRow.hasClass('show')) { detailRow.removeClass('show'); btn.removeClass('expanded'); return; }
        detailRow.addClass('show');
        btn.addClass('expanded');
        if (detailRow.data('loaded')) return;
        const tbody = detailRow.find('tbody');
    tbody.html(`<tr><td colspan="5" class="text-center py-2 text-muted"><i class="fas fa-spinner fa-spin me-1"></i> Memuat detail...</td></tr>`);
        $.ajax({
        url: `{{ url("/trsmts/api/po-assign-detail") }}/${poId}`,
            type: 'GET',
            success: function(response) {
                tbody.empty();
                if (!response.success || response.data.length === 0) {
                tbody.html(`<tr><td colspan="5" class="text-center py-2 text-muted fst-italic"><i class="fas fa-inbox me-1"></i> tidak ada data</td></tr>`);
                    return;
                }
                response.data.forEach(function(d, i) {
                    const amount = parseFloat(d.amount_unit || 0).toLocaleString('en-US', {minimumFractionDigits: 2, maximumFractionDigits: 2});
                tbody.append(`<tr><td>${i + 1}</td><td>${d.kategori || '-'}</td><td>${d.detail_kategori || '-'}</td><td class="text-end">${amount}</td><td>${d.unit || '-'}</td></tr>`);
                });
                detailRow.data('loaded', true);
            },
        error: function() { tbody.html(`<tr><td colspan="5" class="text-center py-2 text-danger"><i class="fas fa-exclamation-triangle me-1"></i> Gagal memuat detail</td></tr>`); }
        });
    }

    function renderPOAssignPagination() {
        const info = $('#poAssignInfo');
        const paginationEl = $('#poAssignPagination');
        const from = poAssignTotal === 0 ? 0 : (poAssignCurrentPage - 1) * poAssignPerPage + 1;
        const to = Math.min(poAssignCurrentPage * poAssignPerPage, poAssignTotal);
    if (poAssignTotal === 0) { info.html('<span class="text-muted fst-italic">Tidak ada data ditemukan</span>'); } else { info.html(`Menampilkan <strong>${from}&ndash;${to}</strong> dari <strong>${poAssignTotal}</strong> data`); }
        paginationEl.empty();
        if (poAssignLastPage <= 1) return;
        const ul = $('<ul class="pagination pagination-sm mb-0"></ul>');
    ul.append(`<li class="page-item ${poAssignCurrentPage === 1 ? 'disabled' : ''}"><a class="page-link" href="#" data-page="${poAssignCurrentPage - 1}" aria-label="Prev"><i class="fas fa-chevron-left"></i></a></li>`);
        let startPage = Math.max(1, poAssignCurrentPage - 2);
        let endPage = Math.min(poAssignLastPage, startPage + 4);
        if (endPage - startPage < 4) startPage = Math.max(1, endPage - 4);
    if (startPage > 1) { ul.append(`<li class="page-item"><a class="page-link" href="#" data-page="1">1</a></li>`); if (startPage > 2) ul.append('<li class="page-item disabled"><a class="page-link">&hellip;</a></li>'); }
    for (let p = startPage; p <= endPage; p++) { ul.append(`<li class="page-item ${p === poAssignCurrentPage ? 'active' : ''}"><a class="page-link" href="#" data-page="${p}">${p}</a></li>`); }
    if (endPage < poAssignLastPage) { if (endPage < poAssignLastPage - 1) ul.append('<li class="page-item disabled"><a class="page-link">&hellip;</a></li>'); ul.append(`<li class="page-item"><a class="page-link" href="#" data-page="${poAssignLastPage}">${poAssignLastPage}</a></li>`); }
    ul.append(`<li class="page-item ${poAssignCurrentPage === poAssignLastPage ? 'disabled' : ''}"><a class="page-link" href="#" data-page="${poAssignCurrentPage + 1}" aria-label="Next"><i class="fas fa-chevron-right"></i></a></li>`);
        ul.on('click', 'a.page-link[data-page]', function(e) { e.preventDefault(); if ($(this).closest('li').hasClass('disabled') || $(this).closest('li').hasClass('active')) return; const pg = parseInt($(this).data('page')); if (!isNaN(pg) && pg >= 1 && pg <= poAssignLastPage) loadPOAssign(pg); });
        paginationEl.append(ul);
    }

    function renderProjectTable(data) {
        const tbody = $('#projectTableBody');
        tbody.empty();
        if (isLoadingProjects) { tbody.html('<tr><td colspan="11" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>'); return; }
        if (data.length === 0) { tbody.html('<tr><td colspan="11" class="text-center">Tidak ada data</td></tr>'); return; }
        data.forEach((item, index) => {
        tbody.append(`<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectProject(${item.id}, '${item.proyek}', '${item.no_spk || ''}')"><i class="fas fa-check"></i> Pilih</button></td><td class="text-center">${index + 1}</td><td  class="${item.proyek ? 'text-start' : 'text-center'}">${item.proyek}</td><td class="${item.lokasi ? 'text-start' : 'text-center'}">${item.lokasi || '-'}</td><td class="${item.pekerjaan ? 'text-start' : 'text-center'}">${item.pekerjaan || '-'}</td><td class="${item.pemilik ? 'text-start' : 'text-center'}">${item.pemilik || '-'}</td><td class="${item.no_spk ? 'text-start' : 'text-center'}">${item.no_spk || '-'}</td><td class="${item.sales ? 'text-start' : 'text-center'}">${item.sales || '-'}</td><td class="${item.pv_capacity ? 'text-end' : 'text-center'}">${item.pv_capacity ? parseFloat(item.pv_capacity).toFixed(2) : '-'}</td><td class="${item.inverter_capacity ? 'text-end' : 'text-center'}">${item.inverter_capacity ? parseFloat(item.inverter_capacity).toFixed(2) : '-'}</td><td class="${item.forex ? 'text-end' : 'text-center'}">${item.forex || '-'}</td></tr>`);
        });
    }

    function loadSupplierBankData() {
        isLoadingSupplierBank = true;
        renderSupplierBankTable(supplierBankData);
        $.ajax({
        url: '{{ url("/trsmts/api/supplier-bank") }}', type: 'GET',
            success: function(response) { if (response.success) supplierBankData = response.data; },
            error: function(xhr) { console.error('Gagal load supplier bank', xhr); },
            complete: function() { isLoadingSupplierBank = false; renderSupplierBankTable(supplierBankData); }
        });
    }

// Open modal functions
    function openSupplierBankModal() {
        $('.modal').modal('hide');
        setTimeout(function() {
            $('#modalSelectSupplierBank').modal('show');
            $('#searchSupplierBank').val('').focus();
            renderSupplierBankTable(supplierBankData);
        }, 300);
    }

    function openSelectRekeningModal() {
        $('.modal').modal('hide');
        setTimeout(function() {
            $('#modalSelectRekening').modal('show');
            $('#searchRekening').val('').focus();
            renderRekeningTable(rekeningData);
        }, 300);
    }

    function openSelectKodeMutasiModal() {
        $('.modal').modal('hide');
        setTimeout(function() {
            $('#modalSelectKodeMutasi').modal('show');
            $('#searchKodeMutasi').val('').focus();
            renderKodeMutasiTable(kodeMutasiData);
        }, 300);
    }

    function openSelectProjectModal() {
        // Guard: jangan buka modal jika sudah ada PO (tombol search project di-disable)
        if (selectedPOItems && selectedPOItems.length > 0) return;
        $('.modal').modal('hide');
        setTimeout(function() {
            $('#modalSelectProject').modal('show');
            $('#searchProject').val('').focus();
            renderProjectTable(projectsData);
        }, 300);
    }

    function openSelectKategoriModal() { $('.modal').modal('hide'); setTimeout(function() { $('#modalSelectKategori').modal('show'); $('#searchKategori').val('').focus(); renderKategoriTable(kategoriData); }, 300); }
    function openSelectSupplierModal() { $('.modal').modal('hide'); setTimeout(function() { $('#modalSelectSupplier').modal('show'); $('#searchSupplier').val('').focus(); renderSupplierTable(supplierData); }, 300); }
    function openSelectKategoriIndukModal() { $('.modal').modal('hide'); setTimeout(function() { $('#modalSelectKategoriInduk').modal('show'); $('#searchKategoriInduk').val(''); loadKategoriInduk(); }, 300); }
    function openSelectSupplierForKategoriModal() { $('.modal').modal('hide'); setTimeout(function() { $('#modalSelectSupplierForKategori').modal('show'); $('#searchSupplierForKategori').val(''); loadSupplierForKategori(); }, 300); }
    function openSelectBrandModal() { $('.modal').modal('hide'); setTimeout(function() { $('#modalSelectBrand').modal('show'); $('#searchBrand').val(''); loadBrand(); }, 300); }
    function openSelectSpesifikasiModal() { $('.modal').modal('hide'); setTimeout(function() { $('#modalSelectSpesifikasi').modal('show'); $('#searchSpesifikasi').val(''); loadSpesifikasi(); }, 300); }

// Select functions
    function selectSupplierBank(id, text) {
        $('#rekening_tujuan_dari').val(id);
        $('#rekening_tujuan_dari_display').val(text);
        $('#modalSelectSupplierBank').modal('hide');
    }

    function selectRekening(id, name) {
        $('#rekening_id').val(id);
        $('#rekening_display').val(name);
        $('#modalSelectRekening').modal('hide');
        $.ajax({
        url: `{{ url("/trsmts/api/saldo-awal") }}/${id}`, type: 'GET',
            success: function(response) { if (response.success) currentSaldoAwal = parseFloat(response.data.saldo_awal) || 0; },
            error: function(xhr) { console.error('Error fetching saldo awal:', xhr); currentSaldoAwal = 0; }
        });
    }

    function selectKodeMutasi(id, name) {
        $('#kode_mutasi_id').val(id);
        $('#kode_mutasi_display').val(name);
        $('#modalSelectKodeMutasi').modal('hide');
        $.ajax({
        url: `{{ url("/trsmts/api/kode-mutasi-info") }}/${id}`, type: 'GET',
            success: function(response) { if (response.success) { currentIsIn = response.data.is_in; $('#is_credit').prop('checked', !currentIsIn); updateMutasiCounterpartyFields(); } },
            error: function(xhr) { console.error('Error fetching kode mutasi info:', xhr); currentIsIn = null; updateMutasiCounterpartyFields(); }
        });
    }

    function updateMutasiCounterpartyFields() {
        $('#receiveFromField, #payToField').hide();
        if (currentIsIn === 1 || currentIsIn === true) { $('#receiveFromField').show(); $('#payToField').hide().find('input').val(''); }
        else if (currentIsIn === 0 || currentIsIn === false) { $('#payToField').show(); $('#receiveFromField').hide().find('input').val(''); }
    }

    function selectPOAssign(item) {
        if (selectedPOItems.find(function(p) { return p.po_assign_id === item.id; })) {
            Swal.fire({ title: 'Perhatian!', text: 'PO ' + item.po_number + ' sudah dipilih', icon: 'warning', confirmButtonColor: '#028284' });
            return;
        }
        $('#modalSelectPOAssign').modal('hide');
        const label = item.po_number + (item.description ? ' - ' + item.description : '') + ' - ' + (item.is_project ? (item.proyek || '') : (item.supplier_name || ''));
                        const newPO = { po_assign_id: item.id, po_number: item.po_number, po_label: label, is_project: item.is_project, project_id: item.project_id || null, available_details: [], selected_details: [] };
        selectedPOItems.push(newPO);

        // Jika PO memiliki project
        if (item.project_id) {
            // Cek apakah user sudah memilih project yang berbeda
            const currentProjectId = $('#project_id').val();
            if (currentProjectId && currentProjectId != item.project_id) {
                Swal.fire({
                    title: 'Perhatian!',
                    text: 'PO ini memiliki project yang berbeda dengan project yang sudah dipilih. Hapus project terlebih dahulu atau pilih PO yang sesuai dengan project yang dipilih.',
                    icon: 'warning',
                    confirmButtonColor: '#028284'
                });
                // Remove PO yang baru ditambahkan
                selectedPOItems.pop();
                return;
            }
            $('#is_project').prop('checked', true);
            $('#project_id').val(item.project_id);
            $('#project_display').val(item.proyek || '');
            $('#projectFieldRow').show();
            $('#is_project').prop('disabled', true);
            $('#btnSearchProject').prop('disabled', true).css('cursor', 'not-allowed');
        } else {
            // Jika PO tidak punya project, nonaktifkan dan disable switch Project Terkait
            // serta bersihkan field project yang mungkin sudah dipilih sebelumnya
            $('#is_project').prop('checked', false);
            $('#project_id').val('');
            $('#project_display').val('');
            $('#projectFieldRow').slideUp(300);
            $('#is_project').prop('disabled', true);
            $('#btnSearchProject').prop('disabled', true).css('cursor', 'not-allowed');
        }

        renderSelectedPOItems();
        const poIndex = selectedPOItems.length - 1;
        $.ajax({
        url: '{{ url("/trsmts/api/po-assign-detail") }}/' + item.id, type: 'GET',
            success: function(response) {
                selectedPOItems[poIndex].available_details = response.data || [];
                if (response.data && response.data.length > 0) {
                    selectedPOItems[poIndex].selected_details = (response.data || []).map(function(d) {
                        const amountUnit = d.amount_unit || 0;
                        const amountRupiahUnit = d.amount_rupiah_unit || 0;
                        const amountRupiah = amountUnit * amountRupiahUnit;
                        return { detail_kategori_id: d.detail_kategori_id, detail_kategori_unit_id: d.detail_kategori_unit_id, spesifikasi_id: d.spesifikasi_id || null, spesifikasi_name: d.spesifikasi_name || null, supplier_name: d.supplier_name || null, brand_name: d.brand_name || null, kategori: d.kategori || '-', detail_kategori: d.detail_kategori || '-', amount_unit: amountUnit, unit: d.unit || '-', amount_rupiah: amountRupiah, amount_rupiah_unit: amountRupiahUnit };
                    });
                } else {
                    selectedPOItems[poIndex].selected_details = [];
                    selectedPOItems[poIndex].manual_amount = 0;
                }
                renderSelectedPOItems();

                // Auto-check DP if PO already has DP history
                $.get('{{ url("/trsmts/api/dp-check") }}/' + item.id, function(dpRes) {
                    if (dpRes.success && dpRes.data.has_dp) {
                        $('#is_dp').prop('checked', true);
                        $('#dp_percentage').val(dpRes.data.dp_percentage || '');
                        $('#dp_seq').val(dpRes.data.next_urutan);
                        $('#dpPercentageDiv, #dpSeqDiv').slideDown(300);
                        renderDPSummaryTable();
                        $('#dpSummarySection').slideDown(300);
                    }
                });
            },
            error: function() { Swal.fire({ title: 'Error!', text: 'Gagal memuat detail PO', icon: 'error', confirmButtonColor: '#028284' }); }
        });
    }

    function renderSelectedPOItems() {
        const $container = $('#poItemsContainer');
        const $empty = $('#poItemsEmpty');
        $container.find('.po-item-card').remove();
        if (selectedPOItems.length === 0) { $empty.show(); calculateAllPOTotal(); return; }
        $empty.hide();
        selectedPOItems.forEach(function(po, poIdx) {
            let rows = '';
            if (po.selected_details.length === 0) {
                rows = '<tr><td colspan="11" class="text-center text-muted fst-italic py-2">tidak ada detail PO</td></tr>';
            } else {
                po.selected_details.forEach(function(d, dIdx) {
                    const supplierName = d.supplier_name || po.supplier_name || '-';
                    const brandName = d.brand_name || '-';
                    const spesifikasiStr = d.spesifikasi_name || '-';
                    const amtUnit = formatRupiah(d.amount_unit || 0);
                    const amtRupUnit = d.amount_rupiah_unit > 0 ? formatRupiah(d.amount_rupiah_unit) : '';
                    const amtRup = d.amount_rupiah > 0 ? formatRupiah(d.amount_rupiah) : '';
                    rows += '<tr><td class="text-center"><button type="button" class="btn btn-danger btn-sm" onclick="removeDetailFromPoItem(' + poIdx + ',' + dIdx + ')"><i class="fas fa-trash"></i></button></td><td class="text-center">' + (dIdx + 1) + '</td><td>' + d.kategori + '</td><td>' + d.detail_kategori + '</td><td>' + supplierName + '</td><td>' + brandName + '</td><td>' + spesifikasiStr + '</td><td class="text-end"><input type="text" class="form-control form-control-sm text-end po-detail-qty" data-po-idx="' + poIdx + '" data-d-idx="' + dIdx + '" value="' + amtUnit + '" placeholder="0,00" maxlength="19" onkeyup="formatInputRupiah(this);syncQty(this)" onblur="formatInputRupiahOnBlur(this);syncQty(this)"></td><td class="text-end"><input type="text" class="form-control form-control-sm text-end po-detail-amount-unit" data-po-idx="' + poIdx + '" data-d-idx="' + dIdx + '" value="' + amtRupUnit + '" placeholder="0,00" maxlength="19" onkeyup="formatInputRupiah(this);syncDetailAmountUnit(this)" onblur="formatInputRupiahOnBlur(this);syncDetailAmountUnit(this)"></td><td class="text-end"><input type="text" class="form-control form-control-sm text-end po-detail-amount" data-po-idx="' + poIdx + '" data-d-idx="' + dIdx + '" value="' + amtRup + '" placeholder="0,00" maxlength="19" onkeyup="formatInputRupiah(this);syncDetailAmount(this)" onblur="formatInputRupiahOnBlur(this);syncDetailAmount(this)" readonly></td><td>' + d.unit + '</td></tr>';
                });
            }
            const selectedIds = po.selected_details.map(function(d) { return d.detail_kategori_id; });
            const hasMore = po.available_details.some(function(d) { return !selectedIds.includes(d.detail_kategori_id); });
            const addBtn = hasMore ? '<button type="button" class="btn btn-outline-primary btn-sm me-1" onclick="openAddDetailToPoModal(' + poIdx + ')"><i class="fas fa-plus me-1"></i>Tambah Item</button>' : '';
            const card = '<div class="card mb-3 po-item-card"><div class="card-header py-2 d-flex justify-content-between align-items-center bg-light"><h6 class="mb-0 text-sm"><i class="fas fa-file-contract me-1 text-primary"></i>' + po.po_label + '</h6><div>' + addBtn + '<button type="button" class="btn btn-danger btn-sm" onclick="removePOItem(' + poIdx + ')"><i class="fas fa-times me-1"></i>Hapus PO</button></div></div><div class="card-body p-0"><div class="table-responsive"><table class="table table-sm table-bordered mb-0"><thead style="background-color:#e9ecef;"><tr><th width="5%" class="text-center">Aksi</th><th width="5%" class="text-center">No</th><th width="15%">Kategori</th><th width="15%">Detail Kategori</th><th width="12%">Supplier</th><th width="10%">Brand</th><th width="12%">Spesifikasi</th><th width="10%" class="text-end">Qty (Unit)</th><th width="13%" class="text-end">Amount Rupiah/Unit</th><th width="13%" class="text-end">Amount (Rp)</th><th width="10%">Unit</th></tr></thead><tbody>' + rows + '</tbody></table></div></div></div>';
            $container.append(card);
        });
        calculateAllPOTotal();
        updateAmountFieldReadonlyState();
    }

    function syncDetailAmount(input) {
        const poIdx = parseInt($(input).data('po-idx'));
        const dIdx = parseInt($(input).data('d-idx'));
        const val = parseFloat(parseRupiah(input.value)) || 0;
        if (selectedPOItems[poIdx] && selectedPOItems[poIdx].selected_details[dIdx] !== undefined) { selectedPOItems[poIdx].selected_details[dIdx].amount_rupiah = val; }
        calculateAllPOTotal();
    }

    function syncDetailAmountUnit(input) {
        const poIdx = parseInt($(input).data('po-idx'));
        const dIdx = parseInt($(input).data('d-idx'));
        const val = parseFloat(parseRupiah(input.value)) || 0;
        if (selectedPOItems[poIdx] && selectedPOItems[poIdx].selected_details[dIdx] !== undefined) {
            selectedPOItems[poIdx].selected_details[dIdx].amount_rupiah_unit = val;
            const qty = selectedPOItems[poIdx].selected_details[dIdx].amount_unit || 0;
            const calculatedAmount = qty * val;
            selectedPOItems[poIdx].selected_details[dIdx].amount_rupiah = calculatedAmount;
        const amountInput = $(`input.po-detail-amount[data-po-idx="${poIdx}"][data-d-idx="${dIdx}"]`);
            amountInput.val(formatRupiah(calculatedAmount));
        }
        calculateAllPOTotal();
    }

    function syncQty(input) {
        const poIdx = parseInt($(input).data('po-idx'));
        const dIdx = parseInt($(input).data('d-idx'));
        const val = parseFloat(parseRupiah(input.value)) || 0;
        if (selectedPOItems[poIdx] && selectedPOItems[poIdx].selected_details[dIdx] !== undefined) {
            selectedPOItems[poIdx].selected_details[dIdx].amount_unit = val;
            const amtUnit = selectedPOItems[poIdx].selected_details[dIdx].amount_rupiah_unit || 0;
            const calculatedAmount = val * amtUnit;
            selectedPOItems[poIdx].selected_details[dIdx].amount_rupiah = calculatedAmount;
        const amountInput = $(`input.po-detail-amount[data-po-idx="${poIdx}"][data-d-idx="${dIdx}"]`);
            amountInput.val(formatRupiah(calculatedAmount));
        }
        calculateAllPOTotal();
    }

    function updateAmountFieldReadonlyState() {
        // Gross amount is always readonly - shows total from PO + non-PO
        // DPP (amount) is also readonly - calculated automatically
    }

    function calculateAllPOTotal() {
        let totalGross = 0;
        selectedPOItems.forEach(function(po) {
            po.selected_details.forEach(function(d) { totalGross += parseFloat(d.gross_amount_rupiah || d.amount_rupiah) || 0; });
        });
        selectedNonPOItems.forEach(function(item) {
            totalGross += parseFloat(item.gross_amount_rupiah || item.amount_rupiah) || 0;
        });

        const grossFormatted = totalGross > 0 ? formatRupiah(totalGross.toFixed(2)) : '';
        $('#gross_amount').val(grossFormatted);

        const diskonPersen = parseFloat($('#diskon_persen').val()) || 0;
        const previousGross = parseAmount($('#gross_amount').data('previous-gross')) || totalGross;
        let diskonNominal = 0;
        if (diskonPersen > 0 && totalGross > 0) {
            diskonNominal = totalGross * (diskonPersen / 100);
        } else {
            diskonNominal = parseAmount($('#diskon').val()) || 0;
        }
        diskonNominal = Math.max(0, diskonNominal);
        $('#diskon').val(formatRupiah(diskonNominal.toFixed(2)));

    // Potongan bon tetap seperti nilai yang diinput, tidak perlu recalculate
        const potonganBonNominal = parseAmount($('#potongan_bon').val()) || 0;

        const dpp = Math.max(0, totalGross - potonganBonNominal - diskonNominal);
        $('#amount').val(formatRupiah(dpp.toFixed(2)));
        currentAmount = totalGross;

        if (totalGross > 0) {
            $('#gross_amount').data('previous-gross', totalGross);
        }

        const pphPersen = parseFloat($('#pph_persen').val()) || 0;
        const ppnPersen = parseFloat($('#ppn_persen').val()) || 0;
        if (pphPersen > 0 && dpp > 0) {
            const pphNominal = dpp * (pphPersen / 100);
            $('#pph_amount').val(formatRupiah(pphNominal.toFixed(2)));
        }
        if (ppnPersen > 0 && dpp > 0) {
            const ppnNominal = dpp * (ppnPersen / 100);
            $('#ppn_amount').val(formatRupiah(ppnNominal.toFixed(2)));
        }

    // Auto-calc PPh from Net Amount using master rate (tanpa perlu pilih DPP dahulu)
        const pphRate = parseFloat($('#pph_rate').val()) || 0;
        if (pphRate > 0 && dpp > 0) {
            const pphNominal = dpp * (pphRate / 100);
            $('#pph_amount').val(formatRupiah(pphNominal.toFixed(2)));
        }

    // Recalculate DPP/PPh/PPN from stored master values when details change
        recalculateFromMaster();
    }

    function removePOItem(poIdx) {
        selectedPOItems.splice(poIdx, 1);
        renderSelectedPOItems();
        recheckDPAfterRemove();

        // Jika semua PO dihapus, reset is_project switch ke aturan form
        if (selectedPOItems.length === 0) {
            // Cek apakah project masih terisi, jika ya maka switch tetap checked
            if (!$('#project_id').val()) {
                $('#is_project').prop('checked', false);
            }
            updateIsProjectSwitchState();
        }
    }

    function recheckDPAfterRemove() {
        if (selectedPOItems.length === 0) {
            $('#is_dp').prop('checked', false);
            $('#dp_percentage, #dp_seq').val('');
            $('#dpPercentageDiv, #dpSeqDiv').slideUp(300);
            $('#dpSummarySection').hide();
            return;
        }
        // Check if any remaining PO has DP history
        const poId = selectedPOItems[0].po_assign_id;
        $.get('{{ url("/trsmts/api/dp-check") }}/' + poId, function(dpRes) {
            if (!dpRes.success || !dpRes.data.has_dp) {
                $('#is_dp').prop('checked', false);
                $('#dp_percentage, #dp_seq').val('');
                $('#dpPercentageDiv, #dpSeqDiv').slideUp(300);
                $('#dpSummarySection').hide();
            }
        });
    }

// Non-PO functions
    function addNonPOItemRow() {
        selectedNonPOItems.push({ keterangan: '', amount_unit: 0, amount_rupiah_unit: 0, amount_rupiah: 0 });
        renderNonPOTable();
        updateAmountFieldReadonlyState();
    }

    function renderNonPOTable() {
        const $tbody = $('#nonPOTableBody');
        const $empty = $('#nonPOEmptyRow');
        $tbody.find('tr.nonpo-row').remove();
        if (selectedNonPOItems.length === 0) { $empty.show(); calculateAllPOTotal(); return; }
        $empty.hide();
        selectedNonPOItems.forEach(function(item, idx) {
            const keterangan = item.keterangan || '';
            const amtUnit = formatRupiah(item.amount_unit || 0);
            const amtRupUnit = item.amount_rupiah_unit > 0 ? formatRupiah(item.amount_rupiah_unit) : '';
            const gross = parseFloat(item.amount_rupiah) || 0;
            const row = '<tr class="nonpo-row"><td class="text-center"><button type="button" class="btn btn-danger btn-sm" onclick="removeNonPOItem(' + idx + ')"><i class="fas fa-trash"></i></button></td><td class="text-center">' + (idx + 1) + '</td><td><input type="text" class="form-control form-control-sm nonpo-keterangan" data-idx="' + idx + '" value="' + keterangan.replace(/"/g, '"') + '" placeholder="Masukkan keterangan" maxlength="100" onkeyup="syncNonPOKeterangan(this)" onchange="syncNonPOKeterangan(this)"></td><td class="text-end"><input type="text" class="form-control form-control-sm text-end nonpo-amount-unit" data-idx="' + idx + '" value="' + amtUnit + '" placeholder="0,00" maxlength="19" onkeyup="formatInputRupiah(this);syncNonPOAmountUnit(this)" onblur="formatInputRupiahOnBlur(this);syncNonPOAmountUnit(this)"></td><td class="text-end"><input type="text" class="form-control form-control-sm text-end nonpo-amount-rupiah-unit" data-idx="' + idx + '" value="' + amtRupUnit + '" placeholder="0,00" maxlength="19" onkeyup="formatInputRupiah(this);syncNonPORupiahUnit(this)" onblur="formatInputRupiahOnBlur(this);syncNonPORupiahUnit(this)"></td><td class="text-end"><input type="text" class="form-control form-control-sm text-end nonpo-amount-rupiah" data-idx="' + idx + '" value="' + formatRupiah(gross) + '" placeholder="0,00" readonly maxlength="19"></td></tr>';
            $tbody.append(row);
        });
        calculateAllPOTotal();
    }

    function syncNonPOKeterangan(input) {
        const idx = parseInt($(input).data('idx'));
        if (selectedNonPOItems[idx] !== undefined) selectedNonPOItems[idx].keterangan = input.value;
    }

    function syncNonPOAmountUnit(input) {
        const idx = parseInt($(input).data('idx'));
        const val = parseFloat(parseRupiah(input.value)) || 0;
        if (selectedNonPOItems[idx] !== undefined) {
            selectedNonPOItems[idx].amount_unit = val;
            const rupiahUnit = selectedNonPOItems[idx].amount_rupiah_unit || 0;
            const calculated = val * rupiahUnit;
            selectedNonPOItems[idx].amount_rupiah = calculated;
        $(`input.nonpo-amount-rupiah[data-idx="${idx}"]`).val(formatRupiah(calculated));
        }
        calculateAllPOTotal();
    }

    function syncNonPORupiahUnit(input) {
        const idx = parseInt($(input).data('idx'));
        const val = parseFloat(parseRupiah(input.value)) || 0;
        if (selectedNonPOItems[idx] !== undefined) {
            selectedNonPOItems[idx].amount_rupiah_unit = val;
            const qty = selectedNonPOItems[idx].amount_unit || 0;
            const calculated = qty * val;
            selectedNonPOItems[idx].amount_rupiah = calculated;
        $(`input.nonpo-amount-rupiah[data-idx="${idx}"]`).val(formatRupiah(calculated));
        }
        calculateAllPOTotal();
    }

    function removeNonPOItem(idx) {
        Swal.fire({
            title: 'Apakah anda yakin?',
            text: 'Detail ini akan dihapus secara permanen!',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Ya, Hapus!',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6'
        }).then((result) => {
            if (result.isConfirmed) {
                selectedNonPOItems.splice(idx, 1);
                renderNonPOTable();
                updateAmountFieldReadonlyState();
            Swal.fire({
                title: 'Terhapus!',
                text: 'Detail berhasil dihapus.',
                icon: 'success',
                timer: 1500,
                showConfirmButton: false
            });
            }
        });
    }

    function removeDetailFromPoItem(poIdx, dIdx) {
        const po = selectedPOItems[poIdx];
        if (!po) return;
        if (po.selected_details.length <= 1) {
            Swal.fire({ title: 'Tidak Dapat Dihapus!', text: 'Minimal harus ada satu item detail', icon: 'warning', confirmButtonColor: '#028284' });
            return;
        }
        Swal.fire({
            title: 'Apakah anda yakin?',
            text: 'Item detail ini akan dihapus secara permanen!',
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Ya, Hapus!',
            cancelButtonText: 'Batal',
            confirmButtonColor: '#d33',
            cancelButtonColor: '#3085d6'
        }).then((result) => {
            if (result.isConfirmed) {
                po.selected_details.splice(dIdx, 1);
                renderSelectedPOItems();
            Swal.fire({
                title: 'Terhapus!',
                text: 'Item detail berhasil dihapus.',
                icon: 'success',
                timer: 1500,
                showConfirmButton: false
            });
            }
        });
    }

    function openAddDetailToPoModal(poIdx) {
        const po = selectedPOItems[poIdx];
        if (!po) return;
        const selectedIds = po.selected_details.map(function(d) { return d.detail_kategori_id; });
        const availableItems = po.available_details.filter(function(d) { return !selectedIds.includes(d.detail_kategori_id); });
        if (availableItems.length === 0) { Swal.fire({ title: 'Tidak Ada Opsi!', text: 'Semua item sudah ditambahkan', icon: 'info', confirmButtonColor: '#028284' }); return; }
        let optionsHtml = '<option value="">-- Pilih Item --</option>';
        availableItems.forEach(function(item) {
            optionsHtml += '<option value="' + item.detail_kategori_id + '" data-kategori="' + (item.kategori || '') + '" data-detail-kategori="' + (item.detail_kategori || '') + '" data-amount-unit="' + (item.amount_unit || 0) + '" data-unit="' + (item.unit || '-') + '" data-default-amount-rupiah-unit="' + (item.amount_rupiah_unit || 0) + '">' + (item.kategori || '-') + ' - ' + (item.detail_kategori || '-') + '</option>';
        });
        Swal.fire({
            title: 'Tambah Item Detail PO',
            html: '<select id="swalPODetailSelect" class="form-select">' + optionsHtml + '</select>',
            showCancelButton: true, confirmButtonText: 'Tambah', cancelButtonText: 'Batal', confirmButtonColor: '#028284',
            preConfirm: function() {
                const select = document.getElementById('swalPODetailSelect');
                const opt = select.options[select.selectedIndex];
                if (!opt.value) { Swal.showValidationMessage('Silakan pilih item terlebih dahulu'); return false; }
                const amountUnit = parseFloat(opt.dataset.amountUnit) || 0;
                const defaultAmountRupiahUnit = parseFloat(opt.dataset.defaultAmountRupiahUnit) || 0;
                const amountRupiah = amountUnit * defaultAmountRupiahUnit;
                return { detail_kategori_id: parseInt(opt.value), kategori: opt.dataset.kategori, detail_kategori: opt.dataset.detailKategori, amount_unit: amountUnit, unit: opt.dataset.unit, amount_rupiah: amountRupiah, amount_rupiah_unit: defaultAmountRupiahUnit };
            }
        }).then(function(result) { if (result.isConfirmed && result.value) { selectedPOItems[poIdx].selected_details.push(result.value); renderSelectedPOItems(); } });
    }

    function openSelectPOAssignModal() {
        $('.modal').modal('hide');
        setTimeout(function() {
            poAssignCurrentSearch = '';
            $('#searchPOAssign').val('');
            $('#modalSelectPOAssign').modal('show');
            loadPOAssign(1);
            setTimeout(function() { $('#searchPOAssign').focus(); }, 150);
        }, 300);
    }

        function selectProject(id, proyek, no_spk) {
        $('#project_id').val(id);
        $('#project_display').val(proyek);
        $('#modalSelectProject').modal('hide');

        // Jika sudah ada PO yang dipilih, cek apakah PO tersebut punya project
        if (selectedPOItems.length > 0) {
            const poHasProject = selectedPOItems.some(function(po) { return po.project_id; });
            if (poHasProject) {
                Swal.fire({
                    title: 'Perhatian!',
                    text: 'Tidak bisa memilih Project karena sudah ada PO yang memiliki project. Hapus PO tersebut terlebih dahulu untuk mengganti project.',
                    icon: 'warning',
                    confirmButtonColor: '#028284'
                });
                // Reset project selection
                $('#project_id').val('');
                $('#project_display').val('');
                return;
            }
        }

        // Auto-check is_project (switch tetap enabled, akan disable setelah PO dipilih)
        $('#is_project').prop('checked', true);
        $('#projectFieldRow').show();
        // Reload PO Assign dengan filter project terbaru
        loadPOAssign(1);
    }

    function selectKategori(id, code, detail_kategori) {
        $('#detail_kategori_id').val(id);
        $('#kategori_display').val(code + ' - ' + detail_kategori);
        $('#modalSelectKategori').modal('hide');
    }

    function selectSupplier(id, name) {
        $('#supplier_id').val(id);
        $('#supplier_display').val(name);
        clearSuppliersBank();
        $('#supplierBankHint').text('Klik tombol search untuk memilih rekening supplier');
        $('#modalSelectSupplier').modal('hide');
    }

// ============================================
// MASTER DATA FOR TAX CALCULATION (DPP, PPh, PPN)
// ============================================
    let dppData = [];
    let pphData = [];
    let ppnData = [];
    let isLoadingDPP = false;
    let isLoadingPPh = false;
    let isLoadingPPN = false;

    function loadDPPData() {
        isLoadingDPP = true;
        renderDPPTable([]);
        $.ajax({
            url: '{{ url("/trsmts/api/dpp-data") }}',
            type: 'GET',
        success: function(response) {
            if (response.success) dppData = response.data;
        },
        complete: function() {
            isLoadingDPP = false;
            renderDPPTable(dppData);
        }
        });
    }

    function loadPPhData() {
        isLoadingPPh = true;
        renderPPhTable([]);
        $.ajax({
            url: '{{ url("/trsmts/api/pph-data") }}',
            type: 'GET',
        success: function(response) {
            if (response.success) pphData = response.data;
        },
        complete: function() {
            isLoadingPPh = false;
            renderPPhTable(pphData);
        }
        });
    }

    function loadPPNData() {
        isLoadingPPN = true;
        renderPPNTable([]);
        $.ajax({
            url: '{{ url("/trsmts/api/ppn-data") }}',
            type: 'GET',
        success: function(response) {
            if (response.success) ppnData = response.data;
        },
        complete: function() {
            isLoadingPPN = false;
            renderPPNTable(ppnData);
        }
        });
    }

// Render DPP Table
    function renderDPPTable(data) {
        const tbody = $('#dppTableBody');
        tbody.empty();
        if (isLoadingDPP) {
            tbody.html('<tr><td colspan="5" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="5" class="text-center">Tidak ada data DPP</td></tr>');
            return;
        }
        data.forEach(function(item, index) {
            tbody.append('<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectDPP(' + item.id + ', \'' + item.name.replace(/'/g, "\\'") + '\', ' + item.dpp_numerator + ', ' + item.dpp_denominator + ')">Pilih</button></td><td class="text-center">' + (index + 1) + '</td><td>' + item.name + '</td><td class="text-center">' + item.dpp_numerator + '</td><td class="text-center">' + item.dpp_denominator + '</td></tr>');
        });
    }

// Render PPh Table
    function renderPPhTable(data) {
        const tbody = $('#pphTableBody');
        tbody.empty();
        if (isLoadingPPh) {
            tbody.html('<tr><td colspan="4" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="4" class="text-center">Tidak ada data PPh</td></tr>');
            return;
        }
        data.forEach(function(item, index) {
            tbody.append('<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectPPh(' + item.id + ', \'' + item.name.replace(/'/g, "\\'") + '\', ' + item.rate + ')">Pilih</button></td><td class="text-center">' + (index + 1) + '</td><td>' + item.name + '</td><td class="text-center">' + item.rate + '%</td></tr>');
        });
    }

// Render PPN Table
    function renderPPNTable(data) {
        const tbody = $('#ppnTableBody');
        tbody.empty();
        if (isLoadingPPN) {
            tbody.html('<tr><td colspan="4" class="text-center"><i class="fas fa-spinner fa-spin"></i> Loading...</td></tr>');
            return;
        }
        if (data.length === 0) {
            tbody.html('<tr><td colspan="4" class="text-center">Tidak ada data PPN</td></tr>');
            return;
        }
        data.forEach(function(item, index) {
            tbody.append('<tr><td><button type="button" class="btn btn-sm btn-primary" onclick="selectPPN(' + item.id + ', \'' + item.name.replace(/'/g, "\\'") + '\', ' + item.rate + ')">Pilih</button></td><td class="text-center">' + (index + 1) + '</td><td>' + item.name + '</td><td class="text-center">' + item.rate + '%</td></tr>');
        });
    }

// Open Modal Functions
    function openSelectDPPModal() {
        $('.modal').modal('hide');
        setTimeout(function() {
            loadDPPData();
            $('#modalSelectDPP').modal('show');
            $('#searchDPP').val('').focus();
        }, 300);
    }

    function openSelectPPhModal() {
        
        $('.modal').modal('hide');
    setTimeout(function() {
        loadPPhData();
        $('#modalSelectPPh').modal('show');
        $('#searchPPh').val('').focus();
    }, 300);
    }

    function openSelectPPNModal() {
        const dppId = $('#dpp_id').val();
        const dpp = parseAmount($('#amount').val());
        if (!dppId || isNaN(dpp) || dpp <= 0) {
            Swal.fire({ title: 'Perhatian!', text: 'Pilih DPP terlebih dahulu sebelum memilih PPN.', icon: 'warning', confirmButtonColor: '#028284' });
            return;
        }
        $('.modal').modal('hide');
        setTimeout(function() {
            loadPPNData();
            $('#modalSelectPPN').modal('show');
            $('#searchPPN').val('').focus();
        }, 300);
    }

// Select Functions
    function selectDPP(id, name, numerator, denominator) {
        $('#dpp_id').val(id);
        $('#dpp_numerator').val(numerator);
        $('#dpp_denominator').val(denominator);
        $('#dppNameLabel').html('<span class="text-primary fw-semibold">(' + name + ')</span>');
        const netAmount = parseAmount($('#amount').val()) || 0;
        if (numerator > 0 && denominator > 0 && netAmount > 0) {
            const dppAmount = netAmount * (numerator / denominator);
            $('#dpp_amount').val(formatRupiah(dppAmount.toFixed(2)));
        } else {
            $('#dpp_amount').val('');
        }
        $('#modalSelectDPP').modal('hide');
        recalculateTaxFromDPP();
    }

    function selectPPh(id, name, rate) {
        $('#pph_id').val(id);
        $('#pph_rate').val(rate);
        $('#pphRateLabel').html('<span class="text-primary fw-semibold">(' + rate + '%)</span>');
        const netAmount = parseAmount($('#amount').val()) || 0;
        if (rate > 0 && netAmount > 0) {
            const pphAmount = netAmount * (rate / 100);
            $('#pph_amount').val(formatRupiah(pphAmount.toFixed(2)));
        } else {
            $('#pph_amount').val('');
        }
        $('#modalSelectPPh').modal('hide');
    }

    function selectPPN(id, name, rate) {
        $('#ppn_id').val(id);
        $('#ppn_rate').val(rate);
        $('#ppnRateLabel').html('<span class="text-primary fw-semibold">(' + rate + '%)</span>');
        const dppAmount = parseAmount($('#dpp_amount').val()) || 0;
        if (rate > 0 && dppAmount > 0) {
            const ppnAmount = dppAmount * (rate / 100);
            $('#ppn_amount').val(formatRupiah(ppnAmount.toFixed(2)));
        } else {
            $('#ppn_amount').val('');
        }
        $('#modalSelectPPN').modal('hide');
    }

// Recalculate DPP from stored master values (called after net amount changes)
    function recalculateFromMaster() {
        const dppId = $('#dpp_id').val();
        if (dppId) {
            const numerator = parseInt($('#dpp_numerator').val()) || 1;
            const denominator = parseInt($('#dpp_denominator').val()) || 1;
            const netAmount = parseAmount($('#amount').val()) || 0;
            if (numerator > 0 && denominator > 0 && netAmount > 0) {
                const dppAmount = netAmount * (numerator / denominator);
                $('#dpp_amount').val(formatRupiah(dppAmount.toFixed(2)));
                recalculateTaxFromDPP();
            }
        }
    }

// Recalculate Tax: PPh from Net Amount, PPN from DPP (stored hidden values)
    function recalculateTaxFromDPP() {
        const netAmount = parseAmount($('#amount').val()) || 0;
        const dppAmount = parseAmount($('#dpp_amount').val()) || 0;

    // Recalculate PPh from Net Amount (stored rate)
        const pphRate = parseFloat($('#pph_rate').val()) || 0;
        if (pphRate > 0 && netAmount > 0) {
            const pphAmount = netAmount * (pphRate / 100);
            $('#pph_amount').val(formatRupiah(pphAmount.toFixed(2)));
        }

    // Recalculate PPN from DPP (stored rate)
        const ppnRate = parseFloat($('#ppn_rate').val()) || 0;
        if (ppnRate > 0 && dppAmount > 0) {
            const ppnAmount = dppAmount * (ppnRate / 100);
            $('#ppn_amount').val(formatRupiah(ppnAmount.toFixed(2)));
        }
    }

// Override calculateFinalAmount to recalculate DPP/PPh/PPN from stored values
    const originalCalculateFinalAmount = window.calculateFinalAmount;
    window.calculateFinalAmount = function() {
        if (typeof originalCalculateFinalAmount === 'function') {
            originalCalculateFinalAmount();
        }
    // Recalculate DPP from stored numerator/denominator
        const dppId = $('#dpp_id').val();
        if (dppId) {
            const numerator = parseInt($('#dpp_numerator').val()) || 1;
            const denominator = parseInt($('#dpp_denominator').val()) || 1;
            const netAmount = parseAmount($('#amount').val()) || 0;
            if (numerator > 0 && denominator > 0 && netAmount > 0) {
                const dppAmount = netAmount * (numerator / denominator);
                $('#dpp_amount').val(formatRupiah(dppAmount.toFixed(2)));
            }
        }
    // Auto-calc PPh dari Net Amount (tanpa perlu pilih ulang), PPN dari DPP
        recalculateTaxFromDPP();
    };

// Search handlers for DPP, PPh, PPN
    $(document).on('keyup', '#searchDPP', function() {
        const search = $(this).val().toLowerCase();
        const filtered = dppData.filter(function(item) {
            return item.name.toLowerCase().includes(search);
        });
        renderDPPTable(filtered);
    });

    $(document).on('keyup', '#searchPPh', function() {
        const search = $(this).val().toLowerCase();
        const filtered = pphData.filter(function(item) {
            return item.name.toLowerCase().includes(search);
        });
        renderPPhTable(filtered);
    });

    $(document).on('keyup', '#searchPPN', function() {
        const search = $(this).val().toLowerCase();
        const filtered = ppnData.filter(function(item) {
            return item.name.toLowerCase().includes(search);
        });
        renderPPNTable(filtered);
    });

    $(function(){
        try {
            $('#amount').prop('readonly', true);
            $('#gross_amount').prop('readonly', true);
            $('#dpp_amount').prop('readonly', true);
            $('#pph_amount').prop('readonly', true);
            $('#ppn_amount').prop('readonly', true);
        } catch (e) { }
    });
</script>
@endpush