@extends('layouts.app')

@section('title', 'Penerbitan PBG')

@section('content')
<div class="container-fluid">
    <!-- Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="page-header">
                <h2>📄 Penerbitan Persetujuan Bangunan Gedung</h2>
                <p>Cetak dan terbitkan PBG untuk pengajuan yang sudah diverifikasi</p>
            </div>
        </div>
    </div>

    <!-- ========================================== -->
    <!-- FORM INPUT TANDA TANGAN (TAMBAHKAN INI) -->
    <!-- ========================================== -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="content-card">
                <div class="card-header">
                    <span><i class="bi bi-pencil-square me-2"></i> Data Tanda Tangan Pejabat</span>
                </div>
                <div class="card-body">
                    <form action="{{ route('admin.penerbitan.update_ttd') }}" method="POST" class="row g-3">
                        @csrf
                        <div class="col-md-3">
                            <label class="form-label">Nama Pejabat</label>
                            <input type="text" name="ttd_nama" class="form-control" value="{{ $ttd_nama ?? 'MUSLIM, ST, M.Si' }}" required>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">NIP</label>
                            <input type="text" name="ttd_nip" class="form-control" value="{{ $ttd_nip ?? '197504022000031005' }}" required>
                        </div>
                        <div class="col-md-3">
                            <label class="form-label">Jabatan</label>
                            <input type="text" name="ttd_jabatan" class="form-control" value="{{ $ttd_jabatan ?? 'KEPALA DINAS PENANAMAN MODAL DAN PELAYANAN TERPADU SATU PINTU' }}" required>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">Kota</label>
                            <input type="text" name="ttd_kota" class="form-control" value="{{ $ttd_kota ?? 'KOTA PAYAKUMBUH' }}" required>
                        </div>
                        <div class="col-md-2">
                            <label class="form-label">&nbsp;</label>
                            <button type="submit" class="btn btn-primary d-block w-100">
                                <i class="bi bi-save"></i> Simpan
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Statistik -->
    <div class="row mb-4">
        <div class="col-md-4 mb-3">
            <div class="stat-card">
                <div class="d-flex justify-content-between align-items-start">
                    <div>
                        <div class="stat-value">{{ $total_diverifikasi }}</div>
                        <div class="stat-label">Menunggu Penerbitan</div>
                        <small class="text-muted">Status: Diverifikasi</small>
                    </div>
                    <div class="stat-icon" style="background: #d1fae5; color: #065f46;">
                        <i class="bi bi-clock-history"></i>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4 mb-3">
            <div class="stat-card">
                <div class="d-flex justify-content-between align-items-start">
                    <div>
                        <div class="stat-value">{{ $total_disetujui }}</div>
                        <div class="stat-label">Sudah Diterbitkan</div>
                        <small class="text-muted">Status: Disetujui</small>
                    </div>
                    <div class="stat-icon" style="background: #c6f6d5; color: #22543d;">
                        <i class="bi bi-file-check-fill"></i>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-4 mb-3">
            <div class="stat-card">
                <div class="d-flex justify-content-between align-items-start">
                    <div>
                        <div class="stat-value">{{ $pengajuan->total() }}</div>
                        <div class="stat-label">Total Data</div>
                        <small class="text-muted">Diverifikasi + Disetujui</small>
                    </div>
                    <div class="stat-icon" style="background: #e0e7ff; color: #3730a3;">
                        <i class="bi bi-database"></i>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Tabel Data (LANJUTAN KODE ANDA YANG SUDAH ADA) -->
    <div class="content-card">
        <div class="card-header">
            <div class="d-flex justify-content-between align-items-center">
                <span><i class="bi bi-table me-2"></i> Daftar Pengajuan</span>
                <div class="d-flex gap-2">
                    <select id="filterStatus" class="form-select form-select-sm" style="width: 150px;">
                        <option value="all">Semua Status</option>
                        <option value="diverifikasi">Menunggu Terbit</option>
                        <option value="disetujui">Sudah Terbit</option>
                    </select>
                    <input type="text" id="searchInput" class="form-control form-control-sm" placeholder="Cari nomor pengajuan..." style="width: 250px;">
                </div>
            </div>
        </div>
        <div class="card-body">
            @if(session('success'))
                <div class="alert alert-success alert-dismissible fade show" role="alert">
                    <i class="bi bi-check-circle-fill me-2"></i> {{ session('success') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
            @endif

            @if(session('error'))
                <div class="alert alert-danger alert-dismissible fade show" role="alert">
                    <i class="bi bi-exclamation-triangle-fill me-2"></i> {{ session('error') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
            @endif

            <div class="table-responsive">
                <table class="table table-modern" id="pengajuanTable">
                    <thead>
                        <tr>
                            <th>No</th>
                            <th>Nomor Pengajuan</th>
                            <th>Nama Pemohon</th>
                            <th>Nama Bangunan</th>
                            <th>Lokasi</th>
                            <th>Luas (m²)</th>
                            <th>Status</th>
                            <th>Nomor PBG</th>
                            <th>Tgl Terbit</th>
                            <th>Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($pengajuan as $key => $item)
                        <tr>
                            <td>{{ $key + $pengajuan->firstItem() }}</td>
                            <td>
                                <strong>{{ $item->nomor_pengajuan }}</strong>
                            </td>
                            <td>{{ $item->nama_lengkap ?? $item->pemohon->name ?? '-' }}</td>
                            <td>{{ $item->nama_bangunan }}</td>
                            <td>{{ $item->kecamatan }}, {{ $item->kelurahan ?? '-' }}</td>
                            <td>{{ number_format($item->luas_bangunan ?? 0, 2) }}</td>
                            <td>
                                @if($item->status == 'diverifikasi')
                                    <span class="badge-status diverifikasi">
                                        <i class="bi bi-hourglass-split"></i> Menunggu Terbit
                                    </span>
                                @elseif($item->status == 'disetujui')
                                    <span class="badge-status disetujui">
                                        <i class="bi bi-check-circle"></i> Sudah Terbit
                                    </span>
                                @else
                                    <span class="badge-status {{ $item->status }}">{{ $item->status }}</span>
                                @endif
                             </td>
                            <td>
                                @if($item->nomor_pbg)
                                    <small><code>{{ $item->nomor_pbg }}</code></small>
                                @else
                                    <span class="text-muted">-</span>
                                @endif
                             </td>
                            <td>
                                @if($item->tanggal_disetujui)
                                    {{ \Carbon\Carbon::parse($item->tanggal_disetujui)->format('d/m/Y') }}
                                @else
                                    <span class="text-muted">-</span>
                                @endif
                             </td>
                            <td>
                                @if($item->status == 'diverifikasi')
                                    <a href="{{ route('admin.penerbitan.cetak', $item->id) }}" 
                                       class="btn btn-primary btn-sm" 
                                       target="_blank">
                                        <i class="bi bi-printer"></i> Cetak & Terbitkan
                                    </a>
                                @elseif($item->status == 'disetujui')
                                    <a href="{{ route('admin.penerbitan.cetak', $item->id) }}" 
                                       class="btn btn-secondary btn-sm" 
                                       target="_blank">
                                        <i class="bi bi-printer"></i> Cetak Ulang
                                    </a>
                                @endif
                              </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="10" class="text-center text-muted py-5">
                                <i class="bi bi-inbox fs-1 d-block mb-3"></i>
                                Belum ada data pengajuan.<br>
                                Status <strong class="text-success">"diverifikasi"</strong> atau <strong class="text-info">"disetujui"</strong> akan muncul di sini.
                              </span
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>

            <div class="mt-3">
                {{ $pengajuan->links() }}
            </div>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
    // Filter by status
    document.getElementById('filterStatus').addEventListener('change', function() {
        let filterValue = this.value;
        let rows = document.querySelectorAll('#pengajuanTable tbody tr');
        
        rows.forEach(function(row) {
            if (filterValue === 'all') {
                row.style.display = '';
            } else {
                let statusCell = row.cells[6]?.innerText.toLowerCase() || '';
                if (filterValue === 'diverifikasi' && statusCell.includes('menunggu')) {
                    row.style.display = '';
                } else if (filterValue === 'disetujui' && statusCell.includes('sudah terbit')) {
                    row.style.display = '';
                } else {
                    row.style.display = 'none';
                }
            }
        });
    });
    
    // Search functionality
    document.getElementById('searchInput').addEventListener('keyup', function() {
        let value = this.value.toLowerCase();
        let rows = document.querySelectorAll('#pengajuanTable tbody tr');
        
        rows.forEach(function(row) {
            let text = row.cells[1]?.innerText.toLowerCase() || '';
            if (text.includes(value)) {
                row.style.display = '';
            } else {
                row.style.display = 'none';
            }
        });
    });
</script>
@endsection