@extends('layouts.app')

@section('judul', 'Disposisi '.$disposisi->nomor_disposisi)
@section('subjudul', $disposisi->suratMasuk->perihal)

@section('aksi-header')
    <a href="{{ route('disposisi.index') }}" class="btn btn-outline-secondary"><i class="fas fa-arrow-left mr-1"></i> Daftar</a>
    <a href="{{ route('surat-masuk.show', $disposisi->suratMasuk) }}" class="btn btn-outline-primary"><i class="far fa-envelope mr-1"></i> Lihat naskah</a>

    @if ($penerimaSaya)
        @can('terima', $penerimaSaya)
            <x-form-aksi :action="route('disposisi.terima', $penerimaSaya)" label="Terima Disposisi" ikon="fa-check" warna="primary"
                         pesan="Dengan menerima, Anda bertanggung jawab menindaklanjuti disposisi ini." tombol-konfirmasi="Ya, terima" />
        @endcan
        @can('tolak', $penerimaSaya)
            <x-form-aksi :action="route('tindak-lanjut.tolak', $penerimaSaya)" label="Tolak" ikon="fa-hand" warna="outline-danger"
                         judul="Tolak disposisi?" pesan="Gunakan bila disposisi salah alamat atau bukan kewenangan Anda. Pemberi disposisi akan diberi tahu."
                         alasan="Alasan penolakan" tombol-konfirmasi="Ya, tolak" />
        @endcan
    @endif

    @can('batalkan', $disposisi)
        <x-form-aksi :action="route('disposisi.batalkan', $disposisi)" label="Batalkan" ikon="fa-ban" warna="outline-danger"
                     judul="Batalkan disposisi?" pesan="Disposisi dan seluruh disposisi lanjutannya dibatalkan. Penerima mendapat notifikasi."
                     alasan="Alasan pembatalan" tombol-konfirmasi="Ya, batalkan" />
    @endcan
@endsection

@section('konten')
    @if ($penerimaSaya?->berstatus('MENUNGGU_DITERIMA'))
        <div class="alert alert-warning d-flex align-items-center">
            <i class="fas fa-bell fa-lg mr-3"></i>
            <div>Disposisi ini ditujukan kepada {{ $penerimaSaya->id_user_penerima ? 'Anda' : 'unit kerja Anda ('.$penerimaSaya->unit->nama_unit.')' }}.
                Tekan <b>Terima Disposisi</b> untuk mulai menindaklanjuti.</div>
        </div>
    @endif

    @php
        $aktif = $disposisi->penerima->reject(fn ($p) => $p->berstatus('DITOLAK', 'DIBATALKAN'));
        $selesai = $aktif->filter(fn ($p) => $p->berstatus('SELESAI'))->count();
        $persen = $aktif->count() ? round($selesai / $aktif->count() * 100) : 0;
    @endphp

    <div class="row">
        <div class="col-lg-7">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="card-title">Instruksi</h3>
                    <x-badge-status :status="$disposisi->status" />
                </div>
                <div class="card-body">
                    <div class="d-flex align-items-center mb-3">
                        <span class="avatar-inisial gold mr-2">{{ mb_substr($disposisi->pemberi->nama, 0, 1) }}</span>
                        <div>
                            <div class="fw-semibold">{{ $disposisi->pemberi->nama }}</div>
                            <div class="small teks-redup">{{ $disposisi->pemberi->jabatan?->nama_jabatan }} · {{ $disposisi->tanggal_disposisi->translatedFormat('l, d M Y H:i') }}</div>
                        </div>
                    </div>

                    @if ($disposisi->penerimaInduk)
                        <div class="small teks-redup mb-2"><i class="fas fa-level-up-alt fa-rotate-90 mr-1"></i>
                            Lanjutan dari disposisi <a href="{{ route('disposisi.show', $disposisi->penerimaInduk->id_disposisi) }}">{{ $disposisi->penerimaInduk->disposisi->nomor_disposisi }}</a>
                            ({{ $disposisi->penerimaInduk->disposisi->pemberi->nama }})</div>
                    @endif

                    @if ($penerimaSaya)
                        {{-- Penerima melihat aksi & instruksi yang berlaku khusus baginya. --}}
                        <div class="p-3 rounded mb-3" style="background:#fff8e1;border:1px solid #f1d27a">
                            <div class="small fw-semibold mb-2" style="color:var(--ss-navy)"><i class="fas fa-user-check mr-1"></i> Untuk {{ $penerimaSaya->id_user_penerima ? 'Anda' : 'unit kerja Anda' }}</div>
                            <div class="mb-2">
                                @foreach ($penerimaSaya->aksi as $aksi)
                                    <span class="badge badge-lembut-primary mb-1">{{ $aksi->nama_aksi }}</span>
                                @endforeach
                            </div>
                            @if ($penerimaSaya->instruksiBerlaku())<div style="white-space:pre-line">{{ $penerimaSaya->instruksiBerlaku() }}</div>@endif
                        </div>
                    @endif

                    @if ($disposisi->instruksi && ! ($penerimaSaya && ! $penerimaSaya->instruksi))
                        <div class="small teks-redup mb-1">Instruksi umum</div>
                        <div class="p-3 rounded mb-3" style="background:#f7f9fc;border:1px solid var(--ss-garis);white-space:pre-line">{{ $disposisi->instruksi }}</div>
                    @endif

                    <div class="row small">
                        <div class="col-6">
                            <div class="teks-redup">Batas waktu</div>
                            <div class="fw-semibold">{{ $disposisi->tanggal_batas?->translatedFormat('d F Y') ?? 'Tidak ditentukan' }}</div>
                        </div>
                        @if ($disposisi->keterangan)
                            <div class="col-6">
                                <div class="teks-redup">Keterangan</div>
                                <div>{{ $disposisi->keterangan }}</div>
                            </div>
                        @endif
                    </div>
                </div>
            </div>

            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="card-title">Penerima & progres</h3>
                    <span class="small teks-redup">{{ $selesai }} dari {{ $aktif->count() }} selesai</span>
                </div>
                <div class="px-3 pt-3">
                    <div class="progress" style="height:6px"><div class="progress-bar bg-success" style="width: {{ $persen }}%"></div></div>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table mb-0">
                            <thead><tr><th>Penerima</th><th>Status</th><th>Diterima</th><th>Batas</th></tr></thead>
                            <tbody>
                            @foreach ($disposisi->penerima as $p)
                                @php
                                    $batas = $disposisi->batasUntuk($p);
                                    $lewat = $batas && $batas->lt(today()) && ! $p->berstatus('SELESAI', 'DITOLAK', 'DIBATALKAN');
                                @endphp
                                <tr class="{{ $penerimaSaya?->is($p) ? 'table-active' : '' }}">
                                    <td>
                                        <div class="fw-semibold">{{ $p->penerima?->nama ?? 'Unit kerja '.$p->unit->nama_unit }}</div>
                                        <div class="small teks-redup">{{ $p->penerima?->jabatan?->nama_jabatan ? $p->penerima->jabatan->nama_jabatan.' · ' : '' }}{{ $p->unit->nama_unit }}</div>
                                        <div class="mt-1">
                                            @foreach ($p->aksi as $aksi)
                                                <span class="badge badge-lembut-primary">{{ $aksi->nama_aksi }}</span>
                                            @endforeach
                                        </div>
                                        @if ($p->instruksi)
                                            <div class="small mt-1" style="white-space:pre-line"><i class="fas fa-quote-left fa-xs teks-redup mr-1"></i>{{ $p->instruksi }}</div>
                                        @endif
                                        @if ($p->keterangan && $p->berstatus('DITOLAK', 'DIBATALKAN'))
                                            <div class="small text-danger mt-1" style="white-space:pre-line"><i class="fas fa-circle-info mr-1"></i>{{ $p->keterangan }}</div>
                                        @endif
                                        @foreach ($p->disposisiLanjutan as $lanjutan)
                                            <div class="small mt-1">
                                                <i class="fas fa-share fa-xs teks-redup"></i>
                                                <a href="{{ route('disposisi.show', $lanjutan) }}">{{ $lanjutan->nomor_disposisi }}</a>
                                                → {{ $lanjutan->penerima->map(fn ($x) => $x->penerima?->nama ?? $x->unit->nama_unit)->implode(', ') }}
                                            </div>
                                        @endforeach
                                    </td>
                                    <td><x-badge-status :status="$p->status" /></td>
                                    <td class="small">
                                        @if ($p->tanggal_diterima)
                                            {{ $p->tanggal_diterima->translatedFormat('d M H:i') }}
                                            @if (! $p->id_user_penerima && $p->diterimaOleh)<div class="teks-redup">oleh {{ $p->diterimaOleh->nama }}</div>@endif
                                        @else
                                            <span class="teks-redup">—</span>
                                        @endif
                                    </td>
                                    <td class="small text-nowrap {{ $lewat ? 'text-danger fw-semibold' : '' }}">
                                        {{ $batas?->translatedFormat('d M Y') ?? '—' }}
                                        @if ($lewat)<i class="fas fa-triangle-exclamation" title="Melewati batas waktu"></i>@endif
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

            {{-- Tindak lanjut: milik penerima yang sedang login lebih dulu, lalu penerima lain yang sudah mencatat. --}}
            @foreach ($disposisi->penerima->sortByDesc(fn ($p) => $penerimaSaya?->is($p)) as $p)
                @if ($penerimaSaya?->is($p) ? ! $p->berstatus('MENUNGGU_DITERIMA', 'DIBATALKAN') : $p->tindakLanjut->isNotEmpty())
                    @include('disposisi._tindak_lanjut')
                @endif
            @endforeach
        </div>

        <div class="col-lg-5">
            <div class="card">
                <div class="card-header d-flex justify-content-between align-items-center">
                    <h3 class="card-title">Naskah</h3>
                    <x-badge-status :status="$disposisi->suratMasuk->status" />
                </div>
                <div class="card-body">
                    <dl class="daftar-info mb-0">
                        <dt>Nomor agenda</dt><dd><span class="nomor-agenda">{{ $disposisi->suratMasuk->nomor_agenda }}</span></dd>
                        <dt>Perihal</dt><dd>{{ $disposisi->suratMasuk->perihal }}</dd>
                        <dt>Pengirim</dt><dd>{{ $disposisi->suratMasuk->pengirim->label }}</dd>
                        <dt>Klasifikasi &amp; derajat</dt><dd class="mb-0"><x-badge-atribut :surat="$disposisi->suratMasuk" /></dd>
                    </dl>
                </div>
            </div>
            <div class="card">
                <div class="card-body">
                    @php($berkas = $disposisi->suratMasuk->fileTerbaru)
                    <x-preview-dokumen :file="$berkas"
                                       :url-lihat="$berkas ? route('dokumen.surat-masuk.lihat', $berkas) : null"
                                       :url-unduh="$berkas && auth()->user()->can('unduh', $disposisi->suratMasuk) ? route('dokumen.surat-masuk.unduh', $berkas) : null" />
                </div>
            </div>
        </div>
    </div>
@endsection

@push('js')
<script>
$(function () {
    // Gulir ke kartu tindak lanjut bila datang dari daftar tugas.
    if (location.hash.startsWith('#tindak-lanjut-')) $(location.hash).addClass('border-primary');
});
</script>
@endpush