@extends('layouts.app')
@section('title', 'Daftar Penjualan')

@section('content')
<div class="row g-3 mb-3">
    @foreach([
        ['Transaksi'.($tahun ? ' '.$tahun : ''), $ringkasan['jumlah'].' unit', 'bi-cart-check', 'primary'],
        ['Nilai Penjualan', rupiah($ringkasan['total']), 'bi-graph-up-arrow', 'primary'],
        ['Sudah Dibayar', rupiah($ringkasan['terbayar']), 'bi-wallet2', 'success'],
        ['Sisa Tagihan', rupiah($ringkasan['total'] - $ringkasan['terbayar']), 'bi-receipt', 'danger'],
        ['Pendapatan Denda', rupiah($ringkasan['denda']), 'bi-exclamation-octagon', 'warning'],
        ['Saldo Deposit Titipan', rupiah($ringkasan['deposit']), 'bi-safe', 'info'],
    ] as [$label, $nilai, $icon, $warna])
        <div class="col-6 col-md-4 col-xl-2">
            <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="fw-semibold">{{ $nilai }}</div></div>
            </div></div>
        </div>
    @endforeach
</div>
<p class="small text-muted mt-n2">Nilai penjualan, dibayar & sisa tidak termasuk transaksi batal. Denda & deposit terpisah dari harga rumah.</p>

<div class="card">
    <div class="card-header bg-white d-flex flex-wrap gap-2 justify-content-between align-items-center">
        <form class="d-flex flex-wrap gap-2">
            <select name="tahun" class="form-select" style="width:auto" onchange="this.form.submit()">
                <option value="">Semua Tahun</option>
                @foreach($daftarTahun as $th)
                    <option value="{{ $th }}" @selected($tahun == $th)>Tahun {{ $th }}</option>
                @endforeach
            </select>
            <select name="perumahan_id" class="form-select" style="width:auto">
                <option value="">Semua Perumahan</option>
                @foreach($perumahan as $id => $nama)
                    <option value="{{ $id }}" @selected(request('perumahan_id') == $id)>{{ $nama }}</option>
                @endforeach
            </select>
            <select name="status" class="form-select" style="width:auto">
                <option value="">Semua Status</option>
                @foreach(\App\Models\Penjualan::STATUS as $k => $v)
                    <option value="{{ $k }}" @selected(request('status') == $k)>{{ $v }}</option>
                @endforeach
            </select>
            <select name="metode" class="form-select" style="width:auto">
                <option value="">Semua Metode</option>
                @foreach(\App\Models\Penjualan::METODE as $k => $v)
                    <option value="{{ $k }}" @selected(request('metode') == $k)>{{ $v }}</option>
                @endforeach
            </select>
            <input type="search" name="q" value="{{ request('q') }}" class="form-control" style="width:200px" placeholder="Kode / kode verifikasi / pembeli">
            <button class="btn btn-outline-secondary"><i class="bi bi-funnel"></i> Filter</button>
            @if(request()->hasAny(['tahun', 'perumahan_id', 'status', 'metode', 'q']))
                <a href="{{ route('laporan.penjualan') }}" class="btn btn-link">Reset</a>
            @endif
        </form>
        <div class="d-flex gap-2" title="Export sesuai filter yang aktif">
            <a href="{{ route('laporan.penjualan.export', ['format' => 'excel'] + request()->query()) }}" class="btn btn-success">
                <i class="bi bi-file-earmark-excel"></i> Export Excel
            </a>
            <a href="{{ route('laporan.penjualan.export', ['format' => 'pdf'] + request()->query()) }}" class="btn btn-danger">
                <i class="bi bi-file-earmark-pdf"></i> Export PDF
            </a>
        </div>
    </div>
    <div class="table-responsive">
        <table class="table table-hover mb-0">
            <thead class="table-light"><tr>
                <th>Kode</th><th>Tanggal</th><th>Pembeli</th><th>Unit</th><th>Metode</th>
                <th class="text-end">Total</th><th style="width:160px">Pembayaran</th><th class="text-end">Denda</th><th class="text-end">Deposit</th><th>Status</th>
            </tr></thead>
            <tbody>
            @forelse($penjualan as $p)
                @php $persen = $p->total > 0 ? min(100, round($p->terbayar_sum / $p->total * 100)) : 0; @endphp
                <tr>
                    <td><a href="{{ route('penjualan.show', $p) }}" class="fw-semibold text-decoration-none">{{ $p->kode }}</a></td>
                    <td class="text-nowrap">{{ tgl($p->tanggal) }}</td>
                    <td>{{ $p->pembeli->nama }}</td>
                    <td>{{ $p->unit->perumahan->nama }}<br><small class="text-muted">{{ $p->unit->label }} · {{ $p->unit->tipe }}</small></td>
                    <td>{{ \App\Models\Penjualan::METODE[$p->metode] }}
                        @if($p->isKredit())<br><small class="text-muted">{{ rupiah($p->angsuran_bulanan) }} × {{ $p->tenor_bulan }} bln</small>@endif</td>
                    <td class="text-end text-nowrap">{{ rupiah($p->total) }}</td>
                    <td>
                        <div class="progress" style="height: 8px"><div class="progress-bar bg-success" style="width: {{ $persen }}%"></div></div>
                        <small class="text-muted">{{ $persen }}% · {{ rupiah($p->terbayar_sum) }}</small>
                    </td>
                    <td class="text-end text-nowrap {{ $p->denda_sum > 0 ? 'text-warning-emphasis' : 'text-muted' }}">{{ $p->denda_sum > 0 ? rupiah($p->denda_sum) : '-' }}</td>
                    <td class="text-end text-nowrap {{ $p->deposit_sum > 0 ? 'text-info-emphasis fw-semibold' : 'text-muted' }}">{{ $p->deposit_sum > 0 ? rupiah($p->deposit_sum) : '-' }}</td>
                    <td><span class="badge text-bg-{{ $p->badge }}">{{ \App\Models\Penjualan::STATUS[$p->status] }}</span></td>
                </tr>
            @empty
                <tr><td colspan="10" class="text-center text-muted py-4">Belum ada transaksi.</td></tr>
            @endforelse
            </tbody>
        </table>
    </div>
    <div class="card-footer bg-white">{{ $penjualan->links() }}</div>
</div>
@endsection