@extends('layouts.petugas')
@section('title','Data Perumahan')
@section('page-title','Data Perumahan')

@section('content')
<div class="page-header">
    <div class="page-header-left">
        <div class="breadcrumb"><a href="{{ route('petugas.dashboard') }}">Dashboard</a><span class="breadcrumb-sep">›</span><span>Data Perumahan</span></div>
        <h1 class="page-header-title">Data Perumahan</h1>
        <p class="page-header-sub">Wilayah tanggung jawab Anda — Tahun {{ $tahunAktif?->tahun ?? '-' }}</p>
    </div>
    <div class="page-header-actions">
        <a href="{{ route('petugas.data-perumahans.create') }}" class="btn btn-primary">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" width="16" height="16"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15" /></svg>
            Tambah Data
        </a>
    </div>
</div>

<form method="GET">
<div class="filter-bar">
    <div class="filter-group" style="flex:1;">
        <label class="filter-label">Cari Desa</label>
        <input type="text" name="search" class="filter-control" placeholder="Nama desa..." value="{{ request('search') }}">
    </div>
    <div class="filter-group">
        <label class="filter-label">Kecamatan</label>
        <select name="kecamatan" class="filter-control">
            <option value="">Semua</option>
            @foreach($kecamatans as $kec)
            <option value="{{ $kec->id }}" {{ request('kecamatan')==$kec->id ? 'selected' : '' }}>{{ $kec->nama }}</option>
            @endforeach
        </select>
    </div>
    <div class="filter-group">
        <label class="filter-label">Status</label>
        <select name="status" class="filter-control">
            <option value="">Semua</option>
            <option value="draft"         {{ request('status')==='draft'         ? 'selected' : '' }}>Draft</option>
            <option value="diajukan"      {{ request('status')==='diajukan'      ? 'selected' : '' }}>Diajukan</option>
            <option value="revisi"        {{ request('status')==='revisi'        ? 'selected' : '' }}>Revisi</option>
            <option value="terverifikasi" {{ request('status')==='terverifikasi' ? 'selected' : '' }}>Terverifikasi</option>
        </select>
    </div>
    <div class="filter-actions">
        <button type="submit" class="btn btn-primary btn-sm">Filter</button>
        <a href="{{ route('petugas.data-perumahans.index') }}" class="btn btn-outline btn-sm">Reset</a>
    </div>
</div>
</form>

<div class="card">
    <div class="table-wrapper" style="border:none;">
        <table>
            <thead>
                <tr>
                    <th>#</th>
                    <th>Desa / Kelurahan</th>
                    <th>Kecamatan</th>
                    <th class="text-right">KK</th>
                    <th class="text-right">Rumah</th>
                    <th class="text-right">RTLH</th>
                    <th class="text-right">Backlog</th>
                    <th>Status</th>
                    <th>Aksi</th>
                </tr>
            </thead>
            <tbody>
                @forelse($data as $item)
                <tr>
                    <td class="text-muted">{{ $data->firstItem() + $loop->index }}</td>
                    <td class="fw-bold">{{ $item->desa?->nama }}</td>
                    <td class="text-muted">{{ $item->desa?->kecamatan?->nama }}</td>
                    <td class="text-right num">{{ number_format($item->jumlah_kk) }}</td>
                    <td class="text-right num">{{ number_format($item->jumlah_rumah) }}</td>
                    <td class="text-right num" style="color:var(--danger);">{{ number_format($item->rtlh) }}</td>
                    <td class="text-right num" style="color:#b45309;">{{ number_format($item->backlog) }}</td>
                    <td><span class="badge badge-{{ $item->status }}">{{ ucfirst($item->status) }}</span></td>
                    <td>
                        <div class="td-actions">
                            <a href="{{ route('petugas.data-perumahans.show', $item) }}" class="btn btn-outline btn-sm">Detail</a>
                            @if(in_array($item->status, ['draft','revisi']))
                            <a href="{{ route('petugas.data-perumahans.edit', $item) }}" class="btn btn-primary btn-sm">Edit</a>
                            @endif
                        </div>
                    </td>
                </tr>
                @empty
                <tr><td colspan="9">
                    <div class="empty-state"><div class="empty-state-icon">🏠</div><div class="empty-state-title">Tidak ada data perumahan</div></div>
                </td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($data->hasPages())
    <div class="pagination-wrapper">
        <span class="pagination-info">{{ $data->firstItem() }}–{{ $data->lastItem() }} dari {{ $data->total() }}</span>
        {{ $data->links('components.pagination') }}
    </div>
    @endif
</div>
@endsection