@extends('layouts.admin.master')

@section('content')
    <div class="container-fluid py-3">
        <div class="d-flex flex-column flex-lg-row justify-content-between align-items-lg-center gap-3 mb-4">
            <div>
                <h3 class="mb-1">{{ $aduan->kode_tiket }}</h3>
                <p class="text-muted mb-0">{{ $aduan->judul }}</p>
            </div>
            <div class="d-flex flex-wrap gap-2">
                <a href="{{ route('admin.smart_city.complaints') }}" class="btn btn-outline-secondary btn-sm">Kembali ke Daftar</a>
                <span class="badge {{ $aduan->status_badge_class }} fs-6 px-3 py-2">{{ $aduan->status_label }}</span>
            </div>
        </div>

        @if (session('success'))
            <div class="alert alert-success">{{ session('success') }}</div>
        @endif
        @if (session('error'))
            <div class="alert alert-danger">{{ session('error') }}</div>
        @endif

        <div class="row g-3 mb-4">
            <div class="col-lg-7">
                <div class="card border-0 shadow-sm h-100">
                    <div class="card-header bg-white border-0 pt-4">
                        <h5 class="mb-1">Detail Aduan</h5>
                    </div>
                    <div class="card-body pt-2">
                        <div class="row g-3">
                            <div class="col-md-6">
                                <div class="small text-muted">Pelapor</div>
                                <div class="fw-semibold">{{ $aduan->nama_pelapor }}</div>
                                <div class="small text-muted">{{ $aduan->no_hp ?: ($aduan->email_pelapor ?: '-') }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Kategori</div>
                                <div class="fw-semibold">{{ $aduan->category?->name ?? 'Tanpa kategori' }}</div>
                                <div class="small text-muted">{{ $aduan->priority_label }} | {{ $aduan->severity_label }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Layanan Terkait</div>
                                <div class="fw-semibold">{{ $aduan->service?->nama ?? '-' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">OPD Tujuan</div>
                                <div class="fw-semibold">{{ $aduan->targetOrganization?->short_name ?: $aduan->targetOrganization?->name ?: 'Belum diarahkan' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Petugas / User</div>
                                <div class="fw-semibold">{{ $aduan->assignedUser?->name ?? 'Belum ditugaskan' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Assignment Lapangan</div>
                                <div class="fw-semibold">{{ $aduan->fieldAssignment?->judul ?? 'Belum dibuat' }}</div>
                                <div class="small text-muted">{{ $aduan->fieldAssignment ? (\App\Models\Kegiatan\Kegiatan::$statuses[$aduan->fieldAssignment->status] ?? ucfirst($aduan->fieldAssignment->status)) : 'Modul kegiatan existing belum dipakai untuk tiket ini' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Waktu Lapor</div>
                                <div class="fw-semibold">{{ optional($aduan->waktu_lapor)->format('d M Y H:i') ?: '-' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Batas Respon</div>
                                <div class="fw-semibold">{{ optional($aduan->batas_respon_at)->format('d M Y H:i') ?: '-' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Batas Selesai</div>
                                <div class="fw-semibold">{{ optional($aduan->batas_selesai_at)->format('d M Y H:i') ?: '-' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Level Eskalasi</div>
                                <div class="fw-semibold">{{ (int) ($aduan->escalation_level ?? 0) }}</div>
                                <div class="small text-muted">Eskalasi terakhir {{ optional($aduan->last_escalated_at)->format('d M Y H:i') ?: 'belum ada' }}</div>
                            </div>
                            <div class="col-md-6">
                                <div class="small text-muted">Assignment Terakhir</div>
                                <div class="fw-semibold">{{ optional($aduan->last_assignment_at)->format('d M Y H:i') ?: 'Belum ada assignment' }}</div>
                            </div>
                            <div class="col-12">
                                <div class="small text-muted">Lokasi</div>
                                <div class="fw-semibold">{{ $aduan->address_text ?: 'Belum ada alamat rinci' }}</div>
                            </div>
                            <div class="col-12">
                                <div class="small text-muted">Uraian</div>
                                <div class="border rounded-4 p-3 bg-light">{{ $aduan->uraian }}</div>
                            </div>
                            @if ($aduan->resolution_summary)
                                <div class="col-12">
                                    <div class="small text-muted">Ringkasan Penyelesaian</div>
                                    <div class="border rounded-4 p-3 bg-success-subtle">{{ $aduan->resolution_summary }}</div>
                                </div>
                            @endif
                            @if ($aduan->closure_note)
                                <div class="col-12">
                                    <div class="small text-muted">Catatan Penutupan</div>
                                    <div class="border rounded-4 p-3 bg-secondary-subtle">{{ $aduan->closure_note }}</div>
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-lg-5">
                <div class="card border-0 shadow-sm mb-3">
                    <div class="card-header bg-white border-0 pt-4">
                        <h5 class="mb-1">Update Status</h5>
                    </div>
                    <div class="card-body pt-2">
                        <form method="POST" action="{{ route('admin.smart_city.complaints.update_status', $aduan) }}" enctype="multipart/form-data">
                            @csrf
                            <div class="mb-3">
                                <label class="form-label">Status Tujuan</label>
                                <select name="status" class="form-select">
                                    @foreach (\App\Models\Pengaduan\Aduan::STATUSES as $key => $label)
                                        <option value="{{ $key }}" @selected($aduan->status === $key)>{{ $label }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Catatan</label>
                                <textarea name="note" rows="3" class="form-control"></textarea>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Ringkasan Penyelesaian</label>
                                <textarea name="resolution_summary" rows="3" class="form-control">{{ old('resolution_summary', $aduan->resolution_summary) }}</textarea>
                                <div class="form-text">Isi saat status bergerak ke <strong>Selesai</strong>. Jika dibiarkan kosong, sistem akan memakai catatan status bila ada.</div>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Catatan Penutupan</label>
                                <textarea name="closure_note" rows="3" class="form-control">{{ old('closure_note', $aduan->closure_note) }}</textarea>
                                <div class="form-text">Isi saat status <strong>Ditolak</strong> atau <strong>Ditutup</strong> agar alasan final tercatat.</div>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Lampiran Update</label>
                                <input type="file" name="attachments[]" multiple class="form-control">
                            </div>
                            <button type="submit" class="btn btn-primary w-100">Simpan Status</button>
                        </form>
                    </div>
                </div>

                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white border-0 pt-4">
                        <h5 class="mb-1">Disposisi Dasar</h5>
                    </div>
                    <div class="card-body pt-2">
                        <form method="POST" action="{{ route('admin.smart_city.complaints.dispose', $aduan) }}">
                            @csrf
                            <div class="mb-3">
                                <label class="form-label">OPD Tujuan</label>
                                <select name="to_opd_id" class="form-select">
                                    @foreach ($organizations as $organization)
                                        <option value="{{ $organization->id }}" @selected($aduan->opd_tujuan_id == $organization->id)>{{ $organization->short_name ?: $organization->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Assign ke User</label>
                                <select name="assigned_to_user_id" class="form-select">
                                    <option value="">Belum ditetapkan</option>
                                    @foreach ($users as $user)
                                        <option value="{{ $user->id }}" @selected($aduan->assigned_to_user_id == $user->id)>{{ $user->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="mb-3">
                                <label class="form-label">Catatan Disposisi</label>
                                <textarea name="note" rows="3" class="form-control"></textarea>
                            </div>
                            <button type="submit" class="btn btn-outline-primary w-100">Simpan Disposisi</button>
                        </form>
                    </div>
                </div>

                <div class="card border-0 shadow-sm mt-3">
                    <div class="card-header bg-white border-0 pt-4">
                        <h5 class="mb-1">Assignment Lapangan</h5>
                        <p class="text-muted mb-0">Reuse modul kegiatan dan petugas yang sudah ada.</p>
                    </div>
                    <div class="card-body pt-2">
                        @if ($petugas->isEmpty() && $penanggungJawabs->isEmpty())
                            <div class="alert alert-warning mb-0">Data petugas dan penanggung jawab belum tersedia. Assignment lapangan bisa diaktifkan setelah master kegiatan diisi.</div>
                        @else
                            <form method="POST" action="{{ route('admin.smart_city.complaints.assignment', $aduan) }}">
                                @csrf
                                <div class="mb-3">
                                    <label class="form-label">Judul Assignment</label>
                                    <input type="text" name="judul" class="form-control" value="{{ old('judul', $aduan->fieldAssignment?->judul ?: 'Tindak lanjut ' . $aduan->kode_tiket) }}">
                                </div>
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        <label class="form-label">Mulai</label>
                                        <input type="datetime-local" name="tanggal_mulai" class="form-control" value="{{ old('tanggal_mulai', optional($aduan->fieldAssignment?->tanggal_mulai ?: now())->format('Y-m-d\\TH:i')) }}">
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">Selesai</label>
                                        <input type="datetime-local" name="tanggal_selesai" class="form-control" value="{{ old('tanggal_selesai', optional($aduan->fieldAssignment?->tanggal_selesai ?: now()->addHours(4))->format('Y-m-d\\TH:i')) }}">
                                    </div>
                                </div>
                                <div class="row g-3 mt-1">
                                    <div class="col-md-6">
                                        <label class="form-label">Status Assignment</label>
                                        <select name="status" class="form-select">
                                            @foreach (\App\Models\Kegiatan\Kegiatan::$statuses as $key => $label)
                                                <option value="{{ $key }}" @selected(old('status', $aduan->fieldAssignment?->status ?: \App\Models\Kegiatan\Kegiatan::STATUS_TERENCANA) === $key)>{{ $label }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label">Penanggung Jawab</label>
                                        <select name="penanggung_jawab_id" class="form-select">
                                            <option value="">Ambil dari petugas utama</option>
                                            @foreach ($penanggungJawabs as $penduduk)
                                                <option value="{{ $penduduk->id }}" @selected((int) old('penanggung_jawab_id', $aduan->fieldAssignment?->penanggung_jawab_id) === $penduduk->id)>{{ $penduduk->nama }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="mb-3 mt-3">
                                    <label class="form-label">Lokasi Assignment</label>
                                    <input type="text" name="lokasi" class="form-control" value="{{ old('lokasi', $aduan->fieldAssignment?->lokasi ?: ($aduan->address_text ?: 'Lokasi mengikuti titik aduan')) }}">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Petugas Lapangan</label>
                                    <select name="petugas_ids[]" class="form-select" multiple size="5">
                                        @php($selectedPetugas = collect(old('petugas_ids', $aduan->fieldAssignment?->petugas?->pluck('id')->all() ?? []))->map(fn($id) => (int) $id)->all())
                                        @foreach ($petugas as $petugasItem)
                                            <option value="{{ $petugasItem->id }}" @selected(in_array($petugasItem->id, $selectedPetugas, true))>
                                                {{ $petugasItem->penduduk?->nama ?: ('Petugas #' . $petugasItem->id) }} - {{ \App\Models\Kegiatan\Petugas::$jabatans[$petugasItem->jabatan] ?? ucfirst($petugasItem->jabatan) }}
                                            </option>
                                        @endforeach
                                    </select>
                                    <div class="form-text">Petugas pertama akan dipakai sebagai petugas utama assignment.</div>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Catatan Lapangan</label>
                                    <textarea name="note" rows="3" class="form-control">{{ old('note', $aduan->fieldAssignment?->catatan_khusus) }}</textarea>
                                </div>
                                <button type="submit" class="btn btn-outline-primary w-100">Simpan Assignment</button>
                            </form>
                        @endif
                    </div>
                </div>
            </div>
        </div>

        <div class="row g-3">
            <div class="col-lg-5">
                <div class="card border-0 shadow-sm mb-3">
                    <div class="card-header bg-white border-0 pt-4"><h5 class="mb-1">Peta Lokasi</h5></div>
                    <div class="card-body"><div id="detail-complaint-map" class="rounded-4 border"></div></div>
                </div>
                <div class="card border-0 shadow-sm mb-3">
                    <div class="card-header bg-white border-0 pt-4"><h5 class="mb-1">Lampiran</h5></div>
                    <div class="card-body pt-2">
                        <div class="list-group list-group-flush">
                            @forelse ($aduan->attachments as $attachment)
                                <a href="{{ $attachment->url }}" target="_blank" class="list-group-item list-group-item-action px-0">
                                    <div class="fw-semibold">{{ $attachment->original_name }}</div>
                                    <div class="small text-muted">{{ strtoupper($attachment->source) }} | {{ number_format($attachment->size / 1024, 1) }} KB</div>
                                </a>
                            @empty
                                <div class="text-muted">Belum ada lampiran.</div>
                            @endforelse
                        </div>
                    </div>
                </div>
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white border-0 pt-4"><h5 class="mb-1">Rating Warga</h5></div>
                    <div class="card-body pt-2">
                        @if ($aduan->rating)
                            <div class="display-6 fw-semibold">{{ $aduan->rating->rating }}/5</div>
                            <div class="fw-semibold">{{ $aduan->rating->rated_by_name ?: 'Warga' }}</div>
                            <p class="text-muted mb-0">{{ $aduan->rating->comment ?: 'Belum ada catatan tambahan.' }}</p>
                        @else
                            <div class="text-muted">Belum ada rating dari warga.</div>
                        @endif
                    </div>
                </div>
                <div class="card border-0 shadow-sm mt-3">
                    <div class="card-header bg-white border-0 pt-4">
                        <h5 class="mb-1">Aset Terkait</h5>
                        <p class="text-muted mb-0">Hubungkan tiket ini ke aset kota agar tindak lanjut maintenance dan command center nyambung.</p>
                    </div>
                    <div class="card-body pt-2">
                        @if ($availableAssets->isNotEmpty())
                            <form method="POST" action="{{ route('admin.smart_city.complaints.assets.link', $aduan) }}" class="row g-3 mb-4">
                                @csrf
                                <div class="col-md-6">
                                    <label class="form-label">Aset</label>
                                    <select name="asset_id" class="form-select" required>
                                        <option value="">Pilih aset</option>
                                        @foreach ($availableAssets as $asset)
                                            <option value="{{ $asset->id }}">
                                                {{ $asset->asset_code }} - {{ $asset->name }}
                                            </option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-md-6">
                                    <label class="form-label">Relasi</label>
                                    <select name="relation_type" class="form-select" required>
                                        @foreach ($assetRelationTypes as $key => $label)
                                            <option value="{{ $key }}">{{ $label }}</option>
                                        @endforeach
                                    </select>
                                </div>
                                <div class="col-12">
                                    <label class="form-label">Catatan</label>
                                    <textarea name="note" rows="2" class="form-control"></textarea>
                                </div>
                                <div class="col-12 d-grid">
                                    <button type="submit" class="btn btn-outline-primary">Tautkan Aset</button>
                                </div>
                            </form>
                        @endif

                        @forelse ($aduan->assetLinks as $link)
                            <div class="border rounded-4 p-3 bg-light mb-3">
                                <div class="d-flex justify-content-between gap-3">
                                    <div>
                                        <div class="fw-semibold">{{ $link->asset?->asset_code ?: 'Aset terhapus' }}</div>
                                        <div>{{ $link->asset?->name ?: '-' }}</div>
                                        <div class="small text-muted">{{ \App\Models\SmartCity\AssetComplaintLink::RELATION_TYPES[$link->relation_type] ?? $link->relation_type }}</div>
                                        <div class="small text-muted">{{ $link->asset?->organization?->short_name ?: $link->asset?->organization?->name ?: 'Belum ada OPD' }}</div>
                                    </div>
                                    <div class="text-end">
                                        @if ($link->asset)
                                            <a href="{{ route('admin.smart_city.assets.show', $link->asset) }}" class="btn btn-outline-primary btn-sm mb-2">Detail Aset</a>
                                        @endif
                                        <form method="POST" action="{{ route('admin.smart_city.complaints.assets.unlink', [$aduan, $link]) }}">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="btn btn-outline-danger btn-sm">Lepas</button>
                                        </form>
                                    </div>
                                </div>
                                @if ($link->note)
                                    <div class="small mt-2">{{ $link->note }}</div>
                                @endif
                            </div>
                        @empty
                            <div class="text-muted">Belum ada aset yang dikaitkan ke pengaduan ini.</div>
                        @endforelse
                    </div>
                </div>
                <div class="card border-0 shadow-sm mt-3">
                    <div class="card-header bg-white border-0 pt-4"><h5 class="mb-1">Log Assignment</h5></div>
                    <div class="card-body pt-2">
                        @forelse ($assignmentLogs as $log)
                            <div class="border rounded-4 p-3 bg-light mb-3">
                                <div class="d-flex justify-content-between gap-3">
                                    <div class="fw-semibold">{{ $log->aksi }}</div>
                                    <div class="small text-muted">{{ optional($log->created_at)->format('d M Y H:i') ?: '-' }}</div>
                                </div>
                                <div class="small text-muted mt-1">{{ $log->user?->name ?: 'Sistem' }}</div>
                            </div>
                        @empty
                            <div class="text-muted">Belum ada log assignment untuk tiket ini.</div>
                        @endforelse
                    </div>
                </div>
            </div>

            <div class="col-lg-7">
                <div class="card border-0 shadow-sm mb-3">
                    <div class="card-header bg-white border-0 pt-4"><h5 class="mb-1">Timeline Status</h5></div>
                    <div class="card-body pt-2">
                        @forelse ($aduan->statusLogs as $log)
                            <div class="timeline-item">
                                <div class="timeline-dot"></div>
                                <div class="border rounded-4 p-3 bg-light">
                                    <div class="d-flex flex-column flex-md-row justify-content-between gap-2">
                                        <div>
                                            <div class="fw-semibold">{{ \App\Models\Pengaduan\Aduan::STATUSES[$log->to_status] ?? $log->to_status }}</div>
                                            <div class="small text-muted">Dari {{ $log->from_status ? (\App\Models\Pengaduan\Aduan::STATUSES[$log->from_status] ?? $log->from_status) : 'awal tiket' }}</div>
                                        </div>
                                        <div class="small text-muted text-md-end">{{ optional($log->changed_at)->format('d M Y H:i') ?: '-' }}<br>{{ $log->actor?->name ?: 'Sistem' }}</div>
                                    </div>
                                    @if ($log->note)
                                        <div class="mt-2">{{ $log->note }}</div>
                                    @endif
                                </div>
                            </div>
                        @empty
                            <div class="text-muted">Belum ada log status.</div>
                        @endforelse
                    </div>
                </div>

                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white border-0 pt-4"><h5 class="mb-1">Riwayat Disposisi</h5></div>
                    <div class="card-body pt-2">
                        @forelse ($aduan->dispositions as $disposition)
                            <div class="border rounded-4 p-3 bg-light mb-3">
                                <div class="d-flex flex-column flex-md-row justify-content-between gap-2">
                                    <div>
                                        <div class="fw-semibold">{{ $disposition->fromOrganization?->short_name ?: $disposition->fromOrganization?->name ?: 'Belum ada' }} <i class="bx bx-right-arrow-alt align-middle"></i> {{ $disposition->toOrganization?->short_name ?: $disposition->toOrganization?->name ?: 'Belum ada' }}</div>
                                        <div class="small text-muted">PIC: {{ $disposition->assignedUser?->name ?: 'Belum dipilih' }}</div>
                                        @if ($disposition->status)
                                            <div class="small text-muted">Status disposisi: {{ \Illuminate\Support\Str::headline($disposition->status) }}</div>
                                        @endif
                                    </div>
                                    <div class="small text-muted text-md-end">{{ optional($disposition->disposed_at)->format('d M Y H:i') ?: '-' }}<br>{{ $disposition->actor?->name ?: 'Sistem' }}</div>
                                </div>
                                @if ($disposition->accepted_at || $disposition->completed_at)
                                    <div class="small text-muted mt-2">
                                        @if ($disposition->accepted_at)
                                            Diterima: {{ optional($disposition->accepted_at)->format('d M Y H:i') }}
                                        @endif
                                        @if ($disposition->accepted_at && $disposition->completed_at)
                                            |
                                        @endif
                                        @if ($disposition->completed_at)
                                            Selesai: {{ optional($disposition->completed_at)->format('d M Y H:i') }}
                                        @endif
                                    </div>
                                @endif
                                @if ($disposition->note)
                                    <div class="mt-2">{{ $disposition->note }}</div>
                                @endif
                            </div>
                        @empty
                            <div class="text-muted">Belum ada riwayat disposisi.</div>
                        @endforelse
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('stylesheet')
    <style>
        #detail-complaint-map { min-height: 320px; }
        .timeline-item { position: relative; padding-left: 28px; margin-bottom: 1rem; }
        .timeline-dot { position: absolute; left: 0; top: 8px; width: 12px; height: 12px; border-radius: 999px; background: #0d6efd; }
    </style>
@endsection

@section('javascript')
    <script>
        document.addEventListener('DOMContentLoaded', function () {
            const mapElement = document.getElementById('detail-complaint-map');
            const latitude = @json($aduan->latitude);
            const longitude = @json($aduan->longitude);
            if (!mapElement || typeof L === 'undefined') { return; }

            const hasPoint = latitude !== null && longitude !== null;
            const map = L.map(mapElement).setView(hasPoint ? [latitude, longitude] : [1.3181, 124.8383], hasPoint ? 15 : 12);
            L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
                maxZoom: 19,
                attribution: '&copy; OpenStreetMap contributors'
            }).addTo(map);

            if (hasPoint) {
                L.marker([latitude, longitude]).addTo(map).bindPopup('<strong>{{ $aduan->kode_tiket }}</strong><br>{{ addslashes($aduan->judul) }}').openPopup();
            }
        });
    </script>
@endsection