<?php $__env->startSection('title', 'Tagihan Siswa - ' . $siswa->nis); ?>

<?php $__env->startPush('styles'); ?>
<style>
    /* ── Info bar siswa ── */
    .siswa-bar {
        background: #fff;
        border: 1px solid #dee2e6;
        border-radius: 6px;
        padding: 9px 16px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 6px 16px;
        margin-bottom: 12px;
        font-size: 0.9rem;
    }
    .siswa-bar .siswa-name {
        font-weight: 700;
        font-size: 1rem;
        color: #212529;
    }
    .siswa-bar .divider {
        color: #ced4da;
    }

    /* ── Summary cards ── */
    .summary-cards {
        display: flex;
        gap: 8px;
        margin-bottom: 12px;
        flex-wrap: wrap;
    }
    .summary-card {
        flex: 1 1 0;
        min-width: 140px;
        border-radius: 6px;
        padding: 10px 14px;
        color: #fff;
        display: flex;
        align-items: center;
        gap: 12px;
    }
    .summary-card .sc-icon { font-size: 1.6rem; opacity: .7; }
    .summary-card .sc-body { line-height: 1.3; }
    .summary-card .sc-label { font-size: 0.78rem; opacity: .9; text-transform: uppercase; letter-spacing: .04em; }
    .summary-card .sc-value { font-size: 1.05rem; font-weight: 700; }
    .summary-card.bg-info    { background: linear-gradient(135deg,#17a2b8,#138496); }
    .summary-card.bg-success { background: linear-gradient(135deg,#28a745,#1e7e34); }
    .summary-card.bg-danger  { background: linear-gradient(135deg,#dc3545,#b21f2d); }
    .summary-card.bg-secondary{ background: linear-gradient(135deg,#6c757d,#545b62); }

    /* ── Filter bar ── */
    .filter-bar {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 12px;
        flex-wrap: wrap;
    }
    .filter-bar label { margin-bottom: 0; font-size: 0.9rem; white-space: nowrap; }

    /* ── Action bar ── */
    .action-bar {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 12px;
        flex-wrap: wrap;
    }

    /* ── Tables ── */
    .card-title-sm { font-size: 0.95rem; font-weight: 600; }
    .table-compact th, .table-compact td { padding: 6px 10px !important; font-size: 0.875rem; vertical-align: middle !important; }
    .table-compact thead th { background: #f8f9fa; font-weight: 600; }
</style>
<?php $__env->stopPush(); ?>

<?php $__env->startSection('content'); ?>

<?php
    $selectedTA = $tahunAjarans->firstWhere('id', $selectedTahunAjaranId);

    // Warna card sisa
    $totalSemuaTagihan = $tagihanSPP->count() + $tagihanDPP->count();
    if ($totalSemuaTagihan === 0) {
        $sisaColor = 'secondary'; $sisaIcon = 'minus-circle';
    } elseif ($totalSisa > 0) {
        $sisaColor = 'danger'; $sisaIcon = 'exclamation-triangle';
    } else {
        $sisaColor = 'success'; $sisaIcon = 'check-double';
    }

    $adaTagihanBelumLunas = $tagihanSPP->whereIn('status', ['belum_bayar','kurang'])->count()
        + $tagihanDPP->whereIn('status', ['belum_bayar','kurang'])->count();
?>


<div class="siswa-bar" style="align-items:flex-start; gap: 4px 20px;">

    
    <span class="siswa-name align-self-center">
        <i class="fas fa-user-graduate mr-1 text-primary"></i><?php echo e($siswa->nama_lengkap); ?>

    </span>

    <span class="divider align-self-center">|</span>

    
    <span style="line-height:1.6">
        <span class="text-muted">NIS:</span> <strong><?php echo e($siswa->nis); ?></strong><br>
        <span class="text-muted">Kelas:</span>
        <?php if($siswa->kelas): ?>
            <span class="badge badge-info"><?php echo e($siswa->kelas->nama_kelas); ?></span>
        <?php else: ?>
            <span class="text-muted">-</span>
        <?php endif; ?>
    </span>

    <span class="divider align-self-center">|</span>

    
    <span style="line-height:1.6">
        <span class="text-muted">TA:</span>
        <?php if($selectedTA): ?>
            <span class="badge badge-secondary"><?php echo e($selectedTA->tahun); ?></span>
        <?php else: ?>
            <span class="text-muted">-</span>
        <?php endif; ?>
        <br>
        <span class="text-muted">Kategori:</span>
        <span class="badge badge-light border"><?php echo e(ucfirst($siswa->kategori)); ?></span>
    </span>

    <span class="divider align-self-center">|</span>

    
    <span class="align-self-center">
        <?php if($siswa->status == 'aktif'): ?>
            <span class="badge badge-success"><i class="fas fa-circle" style="font-size:.6rem"></i> Aktif</span>
        <?php else: ?>
            <span class="badge badge-danger"><?php echo e(ucfirst(str_replace('_', ' ', $siswa->status))); ?></span>
        <?php endif; ?>
    </span>

    
    <?php if($totalTunggakanSisa > 0): ?>
        <span class="divider align-self-center">|</span>
        <span class="d-flex align-items-center" style="gap:8px">
            <span class="badge badge-danger" style="font-size:.85rem; padding:.35em .6em">
                <i class="fas fa-exclamation-circle"></i> Tunggak Rp <?php echo e(number_format($totalTunggakanSisa, 0, ',', '.')); ?>

            </span>
            <?php if(!empty($waPesan) && $siswa->no_wa): ?>
                <button type="button" id="btnKirimWaTunggakan"
                    class="btn btn-success btn-sm"
                    data-nis="<?php echo e($siswa->nis); ?>"
                    data-pesan="<?php echo e(addslashes($waPesan)); ?>"
                    data-nama="<?php echo e($siswa->nama_lengkap); ?>">
                    <i class="fab fa-whatsapp"></i> Kirim WA Tunggakan
                </button>
            <?php endif; ?>
        </span>
    <?php endif; ?>

</div>


<div class="row no-gutters" style="gap:0; margin-bottom:10px;">
    <div class="col-12">
        <div class="d-flex align-items-start flex-wrap" style="gap:8px">

            
            <form action="<?php echo e(route('tagihan.cari')); ?>" method="GET" class="d-flex align-items-center" id="form-filter-tahun" style="gap:6px">
                <input type="hidden" name="nis" value="<?php echo e($siswa->nis); ?>">
                <label class="mb-0 text-muted" style="white-space:nowrap">
                    <i class="fas fa-filter"></i> Tahun Ajaran:
                </label>
                <select name="tahun_ajaran_id" class="form-control form-control-sm" style="width:auto"
                    onchange="document.getElementById('form-filter-tahun').submit();">
                    <?php if($tahunAjarans->isEmpty()): ?>
                        <option value="">-- Belum Ada --</option>
                    <?php else: ?>
                        <?php $__currentLoopData = $tahunAjarans; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $ta): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <option value="<?php echo e($ta->id); ?>" <?php echo e($selectedTahunAjaranId == $ta->id ? 'selected' : ''); ?>>
                                <?php echo e($ta->tahun); ?>

                            </option>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    <?php endif; ?>
                </select>
            </form>

            
            <div class="summary-cards" style="flex:1; margin:0">
                <?php if($tagihanSPP->isNotEmpty()): ?>
                <div class="summary-card bg-info">
                    <i class="fas fa-file-invoice-dollar sc-icon"></i>
                    <div class="sc-body">
                        <div class="sc-label">Total Tagihan</div>
                        <div class="sc-value">Rp <?php echo e(number_format($totalTagihan, 0, ',', '.')); ?></div>
                    </div>
                </div>
                <?php endif; ?>
                <div class="summary-card bg-success">
                    <i class="fas fa-check-circle sc-icon"></i>
                    <div class="sc-body">
                        <div class="sc-label">Terbayar</div>
                        <div class="sc-value">Rp <?php echo e(number_format($totalTerbayar, 0, ',', '.')); ?></div>
                    </div>
                </div>
                <div class="summary-card bg-<?php echo e($sisaColor); ?>">
                    <i class="fas fa-<?php echo e($sisaIcon); ?> sc-icon"></i>
                    <div class="sc-body">
                        <div class="sc-label">Sisa Tagihan</div>
                        <div class="sc-value">Rp <?php echo e(number_format($totalSisa, 0, ',', '.')); ?></div>
                    </div>
                </div>
            </div>

            
            <?php if($tarifTidakTersedia || $tagihans->isEmpty()): ?>
                <div class="alert alert-warning mb-0 py-1 px-2">
                    <i class="fas fa-exclamation-triangle"></i> Tarif belum tersedia.
                </div>
            <?php elseif($adaTagihanBelumLunas > 0): ?>
                <a href="<?php echo e(route('transaksi.create', ['nis' => $siswa->nis])); ?>"
                   class="btn btn-success btn-sm d-flex align-items-center" style="white-space:nowrap">
                    <i class="fas fa-cash-register mr-1"></i> Bayar Sekarang
                    <span class="badge badge-light ml-1"><?php echo e($adaTagihanBelumLunas); ?></span>
                </a>
            <?php else: ?>
                <div class="alert alert-success mb-0 py-1 px-2">
                    <i class="fas fa-check-circle"></i> Semua <strong>lunas</strong>
                </div>
            <?php endif; ?>

        </div>
    </div>
</div>


<div class="card card-outline card-info mb-2">
    <div class="card-header py-1 px-3 d-flex justify-content-between align-items-center">
        <h3 class="card-title card-title-sm mb-0"><i class="fas fa-calendar-alt mr-1"></i> Tagihan SPP (Bulanan)</h3>
        <?php if(auth()->user()->hasRole('admin') || auth()->user()->hasRole('bendahara')): ?>
            <button type="button" class="btn btn-xs btn-info" data-toggle="modal" data-target="#modalPotonganSPP" style="padding:2px 8px; font-size:0.75rem;">
                <i class="fas fa-percent"></i> Set Potongan SPP
            </button>
        <?php endif; ?>
    </div>
    <div class="card-body p-0">
        <table class="table table-hover table-sm table-compact mb-0">
            <thead>
                <tr>
                    <th style="width:36px">No</th>
                    <th>Bulan</th>
                    <th>Nominal</th>
                    <th>Terbayar</th>
                    <th>Sisa</th>
                    <th>Status</th>
                </tr>
            </thead>
            <tbody>
                <?php
                    $sortedTagihanSPP = $tagihanSPP->sortBy(function($t) {
                        return $t->tahun . str_pad($t->bulan, 2, '0', STR_PAD_LEFT);
                    })->values();
                ?>
                <?php $__empty_1 = true; $__currentLoopData = $sortedTagihanSPP; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $tagihan): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                    <tr>
                        <td class="text-center text-muted"><?php echo e($index + 1); ?></td>
                        <td><?php echo e($tagihan->nama_bulan); ?> <?php echo e($tagihan->tahun ?? ''); ?></td>
                        <td>Rp <?php echo e(number_format($tagihan->jumlah_tagihan, 0, ',', '.')); ?></td>
                        <td>Rp <?php echo e(number_format($tagihan->jumlah_terbayar, 0, ',', '.')); ?></td>
                        <td>
                            <?php if($tagihan->sisa_tagihan > 0): ?>
                                <strong class="text-danger">Rp <?php echo e(number_format($tagihan->sisa_tagihan, 0, ',', '.')); ?></strong>
                            <?php else: ?>
                                <span class="text-success">Rp 0</span>
                            <?php endif; ?>
                        </td>
                        <td>
                            <?php if($tagihan->status == 'lunas'): ?>
                                <span class="badge badge-success">Lunas</span>
                            <?php elseif($tagihan->status == 'kurang'): ?>
                                <span class="badge badge-warning">Kurang</span>
                            <?php elseif($tagihan->is_tunggakan): ?>
                                <span class="badge badge-danger">Tunggakan</span>
                            <?php else: ?>
                                <span class="badge badge-secondary">Belum Bayar</span>
                            <?php endif; ?>
                        </td>
                    </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                    <tr><td colspan="6" class="text-center text-muted py-2">Belum ada tagihan SPP.</td></tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
</div>


<div class="card card-outline card-warning mb-2">
    <div class="card-header py-1 px-3">
        <h3 class="card-title card-title-sm"><i class="fas fa-money-check-alt mr-1"></i> Tagihan DPP (Sekali Bayar / Cicilan)</h3>
    </div>
    <div class="card-body p-0">
        <table class="table table-hover table-sm table-compact mb-0">
            <thead>
                <tr>
                    <th style="width:36px">No</th>
                    <th>Nominal</th>
                    <th>Terbayar</th>
                    <th>Sisa</th>
                    <th>Status</th>
                    <th style="width:50px">Aksi</th>
                </tr>
            </thead>
            <tbody>
                <?php $__empty_1 = true; $__currentLoopData = $tagihanDPP; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $tagihan): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                    <tr>
                        <td class="text-center text-muted"><?php echo e($index + 1); ?></td>
                        <td>
                            <?php if($tagihan->tarif_lama > 0): ?>
                                
                                <span class="text-dark font-weight-bold">Rp <?php echo e(number_format($tagihan->tarif_lama, 0, ',', '.')); ?></span>
                                <br><small class="text-muted" title="Tarif DPP asal">
                                    <s>Rp <?php echo e(number_format($tagihan->jumlah_tagihan, 0, ',', '.')); ?></s>
                                </small>
                            <?php else: ?>
                                Rp <?php echo e(number_format($tagihan->jumlah_tagihan, 0, ',', '.')); ?>

                            <?php endif; ?>
                        </td>
                        <td>Rp <?php echo e(number_format($tagihan->jumlah_terbayar, 0, ',', '.')); ?></td>
                        <td>
                            <?php if($tagihan->sisa_tagihan > 0): ?>
                                <strong class="text-danger">Rp <?php echo e(number_format($tagihan->sisa_tagihan, 0, ',', '.')); ?></strong>
                            <?php else: ?>
                                <span class="text-success">Rp 0</span>
                            <?php endif; ?>
                        </td>
                        <td>
                            <?php if($tagihan->status == 'lunas'): ?>
                                <span class="badge badge-success">Lunas</span>
                            <?php elseif($tagihan->status == 'kurang'): ?>
                                <span class="badge badge-warning">Kurang</span>
                            <?php elseif($tagihan->is_tunggakan): ?>
                                <span class="badge badge-danger">Tunggakan</span>
                            <?php else: ?>
                                <span class="badge badge-secondary">Belum Bayar</span>
                            <?php endif; ?>
                        </td>
                        <td class="text-center">
                            <?php if(auth()->user()->hasRole('admin') || auth()->user()->hasRole('bendahara')): ?>
                                <button type="button" class="btn btn-xs btn-info btn-set-tarif-lama"
                                    data-id="<?php echo e($tagihan->id); ?>"
                                    data-tarif="<?php echo e((int) $tagihan->tarif_lama); ?>"
                                    data-tarif-awal="<?php echo e((int) $tagihan->jumlah_tagihan); ?>"
                                    data-toggle="modal" data-target="#modalTarifLama"
                                    title="Set Tarif Lama / Potongan" style="padding:2px 6px">
                                    <i class="fas fa-edit" style="font-size:.7rem"></i>
                                </button>
                            <?php else: ?>
                                -
                            <?php endif; ?>
                        </td>
                    </tr>
                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                    <tr><td colspan="6" class="text-center text-muted py-2">Belum ada tagihan DPP.</td></tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
</div>


<div class="modal fade" id="modalTarifLama" tabindex="-1">
    <div class="modal-dialog modal-sm">
        <form action="" method="POST" id="formTarifLama">
            <?php echo csrf_field(); ?>
            <?php echo method_field('PATCH'); ?>
            <div class="modal-content">
                <div class="modal-header py-2">
                    <h5 class="modal-title" style="font-size:.9rem">Set Tarif / Potongan DPP</h5>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body py-2">
                    <div class="form-group mb-1">
                        <label style="font-size:.82rem">Tarif DPP Awal (Rp)</label>
                        <input type="number" id="inputTarifAwal" class="form-control form-control-sm" readonly>
                    </div>
                    <div class="form-group mb-1">
                        <label style="font-size:.82rem">Potongan DPP (%)</label>
                        <input type="number" name="potongan_dpp" id="inputPotonganDpp" class="form-control form-control-sm" min="0" max="100" placeholder="0">
                    </div>
                    <div class="form-group mb-1">
                        <label style="font-size:.82rem">Nominal DPP Akhir (Rp)</label>
                        <input type="number" name="tarif_lama" id="inputTarifLama" class="form-control form-control-sm" required min="0">
                        <small class="text-muted">Nominal setelah potongan.</small>
                    </div>
                </div>
                <div class="modal-footer py-2">
                    <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-sm btn-primary">Simpan</button>
                </div>
            </div>
        </form>
    </div>
</div>

<div class="modal fade" id="modalPotonganSPP" tabindex="-1">
    <div class="modal-dialog modal-sm">
        <form action="<?php echo e(route('tagihan.update-potongan-spp-bulk')); ?>" method="POST" id="formPotonganSPP">
            <?php echo csrf_field(); ?>
            <input type="hidden" name="siswa_id" value="<?php echo e($siswa->id); ?>">
            <input type="hidden" name="tahun_ajaran_id" value="<?php echo e($selectedTahunAjaranId); ?>">
            
            <div class="modal-content">
                <div class="modal-header py-2">
                    <h5 class="modal-title" style="font-size:.9rem">Set Potongan SPP (%)</h5>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body py-2">
                    <div class="form-group mb-1">
                        <label style="font-size:.82rem">Potongan SPP (%)</label>
                        <input type="number" name="potongan_spp" id="inputPotonganSppBulk" class="form-control form-control-sm" required min="0" max="100" placeholder="Contoh: 10">
                        <small class="text-muted">Potongan akan diterapkan ke semua tagihan SPP yang belum lunas pada Tahun Ajaran ini.</small>
                    </div>
                </div>
                <div class="modal-footer py-2">
                    <button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-sm btn-primary" onclick="return confirm('Apakah Anda yakin ingin menerapkan potongan SPP ke semua tagihan bulan yang belum dibayar?');">Terapkan</button>
                </div>
            </div>
        </form>
    </div>
</div>

<?php $__env->stopSection(); ?>

<?php $__env->startPush('scripts'); ?>

<style>
#waToast {
    position: fixed; top: 20px; right: 20px; z-index: 9999;
    min-width: 280px; max-width: 380px;
    border-radius: 8px; padding: 12px 16px;
    display: none; box-shadow: 0 4px 16px rgba(0,0,0,.18);
    font-size: .88rem; align-items: flex-start; gap: 10px;
}
#waToast.toast-success { background: #d4edda; border-left: 4px solid #28a745; color: #155724; }
#waToast.toast-error   { background: #f8d7da; border-left: 4px solid #dc3545; color: #721c24; }
#waToast .toast-icon   { font-size: 1.2rem; margin-top: 1px; flex-shrink: 0; }
#waToast .toast-close  { margin-left: auto; cursor: pointer; opacity: .6; flex-shrink: 0; font-size: 1rem; }
</style>
<div id="waToast">
    <i class="toast-icon fas"></i>
    <div id="waToastMsg" style="flex:1"></div>
    <span class="toast-close" onclick="$(this).closest('#waToast').fadeOut()">&#x2715;</span>
</div>

<script>
    function showWaToast(type, msg) {
        var $t = $('#waToast');
        $t.removeClass('toast-success toast-error d-flex').addClass('toast-' + type);
        $t.find('.toast-icon').removeClass('fa-check-circle fa-times-circle')
            .addClass(type === 'success' ? 'fa-check-circle' : 'fa-times-circle');
        $('#waToastMsg').html(msg);
        $t.css('display', 'flex').hide().fadeIn(300);
        if (type === 'success') setTimeout(function(){ $t.fadeOut(400); }, 5000);
    }

    $(document).ready(function() {
        // ── Tarif lama modal ──
        $('.btn-set-tarif-lama').click(function() {
            let id    = $(this).data('id');
            let tarif = $(this).data('tarif');
            let tarifAwal = $(this).data('tarif-awal');
            
            $('#inputTarifAwal').val(tarifAwal);
            $('#inputTarifLama').val(tarif > 0 ? tarif : tarifAwal);
            $('#inputPotonganDpp').val('');
            
            $('#formTarifLama').attr('action', "<?php echo e(url('/tagihan')); ?>/" + id + "/tarif-lama");
        });

        // ── Hitung Otomatis Potongan DPP ──
        $('#inputPotonganDpp').on('input', function() {
            let tarifAwal = parseFloat($('#inputTarifAwal').val()) || 0;
            let diskon = parseFloat($(this).val()) || 0;
            if (diskon > 100) diskon = 100;
            if (diskon < 0) diskon = 0;
            
            let nominalAkhir = tarifAwal - (tarifAwal * diskon / 100);
            $('#inputTarifLama').val(Math.round(nominalAkhir));
        });
        
        $('#inputTarifLama').on('input', function() {
            $('#inputPotonganDpp').val('');
        });

        // ── Kirim WA Tunggakan per-siswa via Fonnte ──
        $('#btnKirimWaTunggakan').on('click', function() {
            var $btn  = $(this);
            var nis   = $btn.data('nis');
            var pesan = $btn.data('pesan');
            var nama  = $btn.data('nama');

            $btn.prop('disabled', true).html('<i class="fas fa-spinner fa-spin"></i> Mengirim...');

            $.ajax({
                url: '<?php echo e(route("ajax.tagihan.kirim-wa")); ?>',
                method: 'POST',
                data: {
                    _token : '<?php echo e(csrf_token()); ?>',
                    nis    : nis,
                    pesan  : pesan,
                },
                success: function(res) {
                    $btn.prop('disabled', false).html('<i class="fab fa-whatsapp"></i> Kirim WA Tunggakan');
                    if (res.success) {
                        showWaToast('success', '<strong>Berhasil!</strong> Notifikasi WA telah dikirim ke <em>' + nama + '</em>.');
                    } else {
                        showWaToast('error', '<strong>Gagal!</strong> ' + (res.message || 'Terjadi kesalahan.'));
                    }
                },
                error: function(xhr) {
                    $btn.prop('disabled', false).html('<i class="fab fa-whatsapp"></i> Kirim WA Tunggakan');
                    var msg = xhr.responseJSON && xhr.responseJSON.message ? xhr.responseJSON.message : 'Terjadi kesalahan server.';
                    showWaToast('error', '<strong>Gagal!</strong> ' + msg);
                }
            });
        });
    });
</script>
<?php $__env->stopPush(); ?>

<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH C:\Herd\spp_app\resources\views/tagihan/hasil.blade.php ENDPATH**/ ?>