@extends('layouts.app')
@section('title', 'Kas Masuk / Keluar')

@section('content')
<div class="row g-3 mb-3">
    @foreach([
        ['Saldo Kas Saat Ini', $ringkasan['saldo'], 'bi-wallet2', 'primary', 'semua sumber'],
        ['Masuk Hari Ini', $ringkasan['masuk_hari'], 'bi-box-arrow-in-down', 'success', 'Bulan ini '.rupiah($ringkasan['masuk_bulan'])],
        ['Keluar Hari Ini', $ringkasan['keluar_hari'], 'bi-box-arrow-up', 'danger', 'Bulan ini '.rupiah($ringkasan['keluar_bulan'])],
    ] as [$label, $nilai, $icon, $warna, $catatan])
        <div class="col-md-4">
            <div class="card h-100"><div class="card-body d-flex align-items-center py-2">
                <div class="stat-icon bg-{{ $warna }}-subtle text-{{ $warna }} me-3"><i class="bi {{ $icon }}"></i></div>
                <div><div class="text-muted small">{{ $label }}</div><div class="fs-5 fw-semibold">{{ rupiah($nilai) }}</div><div class="small text-muted">{{ $catatan }}</div></div>
            </div></div>
        </div>
    @endforeach
</div>

<div class="row g-3">
    <div class="col-xl-5">
        @php $j = old('jenis', $jenis); @endphp
        <div class="card border-{{ $j === 'masuk' ? 'success' : 'danger' }}" id="kartuKas">
            <div class="card-header bg-white fw-semibold d-flex justify-content-between align-items-center">
                <span><i class="bi bi-pencil-square"></i> Catat Transaksi Kas</span>
                @if(auth()->user()->role === 'admin')
                    <a href="{{ route('pos-kas.index') }}" class="small fw-normal"><i class="bi bi-tags"></i> Atur pos</a>
                @endif
            </div>
            <div class="card-body">
                <form method="POST" action="{{ route('kas.store') }}" id="formKas">
                    @csrf
                    <div class="btn-group w-100 mb-3" role="group">
                        <input type="radio" class="btn-check" name="jenis" id="jenis_masuk" value="masuk" @checked($j === 'masuk')>
                        <label class="btn btn-outline-success" for="jenis_masuk"><i class="bi bi-box-arrow-in-down"></i> Kas Masuk</label>
                        <input type="radio" class="btn-check" name="jenis" id="jenis_keluar" value="keluar" @checked($j === 'keluar')>
                        <label class="btn btn-outline-danger" for="jenis_keluar"><i class="bi bi-box-arrow-up"></i> Kas Keluar</label>
                    </div>

                    <div class="mb-2">
                        <label class="form-label small">Pos Transaksi</label>
                        <select name="pos_kas_id" id="pos_kas_id" class="form-select @error('pos_kas_id') is-invalid @enderror" required>
                            <option value="">— Pilih pos —</option>
                            @foreach($pos as $p)
                                <option value="{{ $p->id }}" data-jenis="{{ $p->jenis }}" @selected(old('pos_kas_id') == $p->id)>{{ $p->nama }}</option>
                            @endforeach
                        </select>
                        @error('pos_kas_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <small class="text-muted">Pembayaran rumah, DP, angsuran &amp; denda otomatis masuk pos <strong>Pendapatan Usaha</strong> — tidak perlu dicatat di sini.</small>
                    </div>
                    <div class="row g-2">
                        <div class="col-md-7">
                            <label class="form-label small">Jumlah (Rp)</label>
                            <input type="text" inputmode="numeric" data-uang name="jumlah" value="{{ old('jumlah') }}" class="form-control form-control-lg @error('jumlah') is-invalid @enderror" required>
                            @error('jumlah')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                        <div class="col-md-5">
                            <label class="form-label small">Tanggal</label>
                            <input type="date" name="tanggal" value="{{ old('tanggal', now()->toDateString()) }}" max="{{ now()->toDateString() }}" class="form-control form-control-lg @error('tanggal') is-invalid @enderror" required>
                            @error('tanggal')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        </div>
                        <div class="col-md-7">
                            <label class="form-label small" id="labelPihak">{{ $j === 'masuk' ? 'Diterima dari' : 'Dibayarkan kepada' }}</label>
                            <input name="pihak" value="{{ old('pihak') }}" maxlength="150" class="form-control @error('pihak') is-invalid @enderror" placeholder="nama orang / toko / instansi">
                        </div>
                        <div class="col-md-5">
                            <label class="form-label small">Cara</label>
                            <select name="cara_bayar" class="form-select">
                                <option value="tunai" @selected(old('cara_bayar') === 'tunai')>Tunai</option>
                                <option value="transfer" @selected(old('cara_bayar') === 'transfer')>Transfer</option>
                            </select>
                        </div>
                        <div class="col-12">
                            <label class="form-label small">Keterangan</label>
                            <input name="keterangan" value="{{ old('keterangan') }}" maxlength="255" class="form-control" placeholder="mis. pembelian semen 50 sak untuk Blok C">
                        </div>
                    </div>
                    <button class="btn btn-lg w-100 mt-3 {{ $j === 'masuk' ? 'btn-success' : 'btn-danger' }}" id="btnKas"><i class="bi bi-printer"></i> Simpan &amp; Cetak Bukti</button>
                </form>
            </div>
        </div>
    </div>

    <div class="col-xl-7">
        <div class="card">
            <div class="card-header bg-white d-flex justify-content-between align-items-center">
                <span class="fw-semibold">Transaksi Kas Lain Terakhir</span>
                <div class="d-flex gap-2 align-items-center">
                    <form class="d-flex gap-1">
                        <input type="hidden" name="jenis" value="{{ $jenis }}">
                        <select name="filter_jenis" class="form-select form-select-sm" onchange="this.form.submit()">
                            <option value="">Semua</option>
                            @foreach(\App\Models\PosKas::JENIS as $k => $v)
                                <option value="{{ $k }}" @selected(request('filter_jenis') === $k)>{{ $v }}</option>
                            @endforeach
                        </select>
                    </form>
                    <a href="{{ route('laporan.kas') }}" class="small text-nowrap">Buku Kas →</a>
                </div>
            </div>
            <div class="table-responsive">
                <table class="table table-sm table-hover mb-0 align-middle small">
                    <thead class="table-light"><tr><th class="ps-3">Tanggal</th><th>No. Bukti</th><th>Pos</th><th>Keterangan</th><th class="text-end">Jumlah</th><th></th></tr></thead>
                    <tbody>
                    @forelse($terbaru as $k)
                        <tr>
                            <td class="ps-3 text-nowrap">{{ tgl($k->tanggal) }}</td>
                            <td class="text-nowrap">{{ $k->nomor }}<br><span class="font-monospace text-muted">{{ $k->kode_verifikasi_format }}</span></td>
                            <td>{{ $k->isBiayaUnit() ? $k->uraian_biaya : $k->pos->nama }}</td>
                            <td>@if($k->penjualan)<a href="{{ route('penjualan.show', $k->penjualan) }}" class="text-decoration-none"><i class="bi bi-house-door"></i> {{ $k->penjualan->unit->perumahan->nama }} {{ $k->penjualan->unit->label }}</a><br>@endif{{ $k->keterangan }}@if($k->pihak)<br><span class="text-muted">{{ $k->jenis === 'masuk' ? 'dari' : 'kepada' }} {{ $k->pihak }}</span>@endif
                                <br><span class="text-muted">{{ ucfirst($k->cara_bayar) }} · {{ $k->petugas->name ?? '-' }}</span></td>
                            <td class="text-end text-nowrap fw-semibold {{ $k->jenis === 'masuk' ? 'text-success' : 'text-danger' }}">{{ $k->jenis === 'masuk' ? '+' : '−' }}{{ rupiah($k->jumlah) }}</td>
                            <td class="text-end text-nowrap pe-2">
                                <a href="{{ route('kas.bukti', $k) }}" target="_blank" class="btn btn-sm btn-outline-secondary py-0" title="Cetak ulang bukti"><i class="bi bi-file-earmark-pdf"></i></a>
                                @if(auth()->user()->role === 'admin')
                                    <a href="{{ route('hapus-transaksi.konfirmasi', ['kas', $k->id]) }}" class="btn btn-sm btn-outline-danger py-0" title="Hapus transaksi salah input"><i class="bi bi-trash"></i></a>
                                @endif
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="6" class="text-center text-muted py-4">Belum ada transaksi kas lain.</td></tr>
                    @endforelse
                    </tbody>
                </table>
            </div>
            @if($terbaru->hasPages())<div class="card-footer bg-white">{{ $terbaru->links() }}</div>@endif
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
(() => {
    const pos = document.getElementById('pos_kas_id');
    const kartu = document.getElementById('kartuKas');
    const btn = document.getElementById('btnKas');
    const label = document.getElementById('labelPihak');
    const ubah = () => {
        const jenis = document.querySelector('#formKas input[name=jenis]:checked').value;
        pos.querySelectorAll('option[data-jenis]').forEach(o => { o.hidden = o.disabled = o.dataset.jenis !== jenis; });
        if (pos.selectedOptions[0]?.disabled) pos.value = '';
        const masuk = jenis === 'masuk';
        kartu.className = 'card border-' + (masuk ? 'success' : 'danger');
        btn.className = 'btn btn-lg w-100 mt-3 ' + (masuk ? 'btn-success' : 'btn-danger');
        label.textContent = masuk ? 'Diterima dari' : 'Dibayarkan kepada';
    };
    document.querySelectorAll('#formKas input[name=jenis]').forEach(r => r.addEventListener('change', ubah));
    ubah();
})();
</script>
@endpush