@extends('layouts.app')

@section('title', 'Administrasi Kegiatan')

@section('content')
<div class="pkbm-master-page mx-auto max-w-7xl space-y-5">
    <header class="pkbm-dashboard__heading">
        <div class="min-w-0">
            <p class="pkbm-dashboard__breadcrumb"><span>Standar Pengelolaan</span><i class="bi bi-chevron-right" aria-hidden="true"></i>Manajemen Kegiatan<i class="bi bi-chevron-right" aria-hidden="true"></i>Administrasi Kegiatan</p>
            <h1 class="pkbm-dashboard__title">Administrasi Kegiatan</h1>
            <p class="pkbm-dashboard__subtitle">Susun proposal, atur anggaran, catat realisasi, dan siapkan dokumen kegiatan dalam satu alur.</p>
        </div>
        <a href="{{ route('pkbm.kegiatan.history') }}" class="sp-btn-secondary shrink-0"><i class="bi bi-arrow-left" aria-hidden="true"></i>Riwayat & Risalah</a>
    </header>

    @if (session('status'))
        <div role="status" class="settings-notice settings-notice--success"><i class="bi bi-check-circle-fill" aria-hidden="true"></i><span>{{ session('status') }}</span></div>
    @endif

    <section class="grid grid-cols-3 gap-2 sm:gap-3">
        <article class="sp-card flex min-w-0 items-center gap-2 p-3 sm:gap-4 sm:p-5">
            <span class="grid size-9 shrink-0 place-items-center rounded-xl bg-blue-50 text-lg text-blue-700 sm:size-12 sm:rounded-2xl sm:text-xl"><i class="bi bi-journal-richtext" aria-hidden="true"></i></span>
            <div class="min-w-0"><p class="truncate text-[10px] font-semibold uppercase tracking-wide text-slate-500 sm:text-xs">Alur administrasi</p><p class="mt-1 text-xs font-bold leading-4 text-slate-900 sm:text-sm">Proposal → Anggaran → Cetak</p></div>
        </article>
        <article class="sp-card flex min-w-0 items-center gap-2 p-3 sm:gap-4 sm:p-5">
            <span class="grid size-9 shrink-0 place-items-center rounded-xl bg-emerald-50 text-lg text-emerald-700 sm:size-12 sm:rounded-2xl sm:text-xl"><i class="bi bi-folder-check" aria-hidden="true"></i></span>
            <div class="min-w-0"><p class="truncate text-[10px] font-semibold uppercase tracking-wide text-slate-500 sm:text-xs">Kegiatan terdaftar</p><p class="mt-1 text-xl font-bold leading-5 text-slate-900 sm:text-2xl">{{ number_format($activities->total(), 0, ',', '.') }}</p></div>
        </article>
        <article class="sp-card flex min-w-0 items-center gap-2 p-3 sm:gap-4 sm:p-5">
            <span class="grid size-9 shrink-0 place-items-center rounded-xl bg-violet-50 text-lg text-violet-700 sm:size-12 sm:rounded-2xl sm:text-xl"><i class="bi bi-printer" aria-hidden="true"></i></span>
            <div class="min-w-0"><p class="truncate text-[10px] font-semibold uppercase tracking-wide text-slate-500 sm:text-xs">Dokumen siap</p><p class="mt-1 text-xs font-bold leading-4 text-slate-900 sm:text-sm">Proposal & RAB</p></div>
        </article>
    </section>

    <section class="sp-card overflow-hidden">
        <div class="sp-card-header flex flex-wrap items-center justify-between gap-3">
            <div>
                <h2 class="sp-section-title">Pilih kegiatan</h2>
                <p class="mt-1 text-xs text-slate-500">Lanjutkan administrasi dari kegiatan yang sudah dibuat.</p>
            </div>
            <form method="GET" action="{{ route('pkbm.kegiatan.administration') }}" class="flex w-full gap-2 sm:w-auto">
                <label for="administration-search" class="sr-only">Cari kegiatan</label>
                <input id="administration-search" type="search" name="q" value="{{ $filters['q'] ?? '' }}" placeholder="Cari nama kegiatan..." class="sp-form-control min-w-0 flex-1 px-3 py-2 text-sm sm:w-64">
                <button type="submit" class="sp-btn-secondary" aria-label="Cari kegiatan"><i class="bi bi-search" aria-hidden="true"></i><span class="sr-only sm:not-sr-only">Cari</span></button>
                @if (($filters['q'] ?? '') !== '')
                    <a href="{{ route('pkbm.kegiatan.administration') }}" class="sp-btn-secondary">Reset</a>
                @endif
            </form>
        </div>

        <div class="divide-y divide-slate-100">
            @forelse ($activities as $activity)
                @php
                    $proposalFields = [$activity->latar_belakang, $activity->tujuan_kegiatan, $activity->panitia_kegiatan, $activity->jadwal_kegiatan];
                    $proposalProgress = collect($proposalFields)->filter(fn ($field) => trim(strip_tags((string) $field)) !== '')->count();
                    $budgetCount = (float) $activity->total_anggaran > 0;
                    $startDate = $activity->tanggal_kegiatan && $activity->tanggal_kegiatan !== '0000-00-00'
                        ? \Carbon\CarbonImmutable::parse($activity->tanggal_kegiatan)->locale('id')->translatedFormat('d F Y')
                        : 'Tanggal belum diatur';
                @endphp
                <article class="grid gap-5 p-5 lg:grid-cols-[minmax(0,1fr)_auto] lg:items-center">
                    <div class="min-w-0">
                        <div class="flex flex-wrap items-center gap-x-2 gap-y-1">
                            <p class="activity-administration__name">{{ $activity->judul_kegiatan ?: 'Kegiatan tanpa judul' }}</p>
                            <span class="rounded-full bg-blue-50 px-2 py-0.5 text-[11px] font-semibold leading-4 text-blue-700">{{ $activity->nama_kategori ?: 'Tanpa kategori' }}</span>
                        </div>
                        <p class="mt-0.5 truncate text-xs leading-5 text-slate-500"><i class="bi bi-calendar-event mr-1" aria-hidden="true"></i>{{ $startDate }} <span class="mx-1">·</span><i class="bi bi-geo-alt mr-1" aria-hidden="true"></i>{{ $activity->tempat_kegiatan ?: 'Tempat belum diisi' }}</p>
                        <div class="mt-2 flex flex-wrap gap-1.5 text-[11px]">
                            <span @class(['rounded-full px-2.5 py-1 font-semibold', 'bg-emerald-50 text-emerald-700' => $proposalProgress === 4, 'bg-amber-50 text-amber-800' => $proposalProgress > 0 && $proposalProgress < 4, 'bg-slate-100 text-slate-600' => $proposalProgress === 0])>
                                <i class="bi bi-file-earmark-text mr-1" aria-hidden="true"></i>Proposal {{ $proposalProgress }}/4 bagian
                            </span>
                            <span @class(['rounded-full px-2.5 py-1 font-semibold', 'bg-emerald-50 text-emerald-700' => $budgetCount, 'bg-slate-100 text-slate-600' => ! $budgetCount])>
                                <i class="bi bi-cash-stack mr-1" aria-hidden="true"></i>{{ $budgetCount ? 'RAB Rp '.number_format((float) $activity->total_anggaran, 0, ',', '.') : 'RAB belum diisi' }}
                            </span>
                            @if ($budgetCount)
                                <span class="rounded-full bg-violet-50 px-2.5 py-1 font-semibold text-violet-700"><i class="bi bi-arrow-repeat mr-1" aria-hidden="true"></i>Realisasi Rp {{ number_format((float) $activity->total_realisasi, 0, ',', '.') }}</span>
                            @endif
                        </div>
                    </div>
                    <div class="flex flex-wrap gap-2 lg:justify-end">
                        @if ($canManage)
                            <a href="{{ route('pkbm.kegiatan.proposal', $activity->id) }}" class="sp-btn-primary"><i class="bi bi-pencil-square" aria-hidden="true"></i>{{ $proposalProgress ? 'Lanjutkan proposal' : 'Susun proposal' }}</a>
                            <a href="{{ route('pkbm.kegiatan.budget', $activity->id) }}" class="sp-btn-secondary"><i class="bi bi-wallet2" aria-hidden="true"></i>Kelola RAB</a>
                        @else
                            <a href="{{ route('pkbm.kegiatan.proposal', $activity->id) }}" class="sp-btn-secondary"><i class="bi bi-eye" aria-hidden="true"></i>Lihat proposal</a>
                            <a href="{{ route('pkbm.kegiatan.budget', $activity->id) }}" class="sp-btn-secondary"><i class="bi bi-eye" aria-hidden="true"></i>Lihat RAB</a>
                        @endif
                        <a href="{{ route('pkbm.kegiatan.administration.print-proposal', $activity->id) }}" target="_blank" rel="noopener" class="sp-btn-secondary" aria-label="Cetak proposal {{ $activity->judul_kegiatan }}" title="Cetak proposal"><i class="bi bi-printer" aria-hidden="true"></i></a>
                    </div>
                </article>
            @empty
                <div class="px-5 py-12 text-center">
                    <span class="mx-auto grid size-12 place-items-center rounded-2xl bg-blue-50 text-xl text-blue-700"><i class="bi bi-folder2-open" aria-hidden="true"></i></span>
                    <p class="mt-3 font-semibold text-slate-800">Belum ada kegiatan untuk dikelola</p>
                    <p class="mt-1 text-sm text-slate-500">{{ ($filters['q'] ?? '') !== '' ? 'Coba kata pencarian lain.' : 'Buat kegiatan terlebih dahulu melalui menu Input Kegiatan Baru.' }}</p>
                </div>
            @endforelse
        </div>
        @if ($activities->hasPages())
            <div class="border-t border-slate-100 px-4 py-3">{{ $activities->links() }}</div>
        @endif
    </section>
</div>
@endsection