@extends('layouts.app')

@section('title', 'Paket Distribusi Perwakilan - Sistem Distribusi Qurban')

@section('header_title', 'Paket Distribusi Perwakilan')
@section('header_subtitle', 'Daftar penanggung jawab pengambilan paket titipan beserta rincian jatahnya')

@section('content')
<div class="panel">
    <div class="panel-header">
        <h2 class="panel-title"><span>📦</span> Rekapitulasi Paket Distribusi & Titipan</h2>
    </div>

    <!-- Filters -->
    <form action="{{ route('distribution.paket') }}" method="GET" class="filter-bar">
        <input type="text" name="search" class="form-control" placeholder="Cari Nama Perwakilan atau Nomor Kupon..." value="{{ request('search') }}">

        <select name="status" class="form-control" onchange="this.form.submit()">
            <option value="">-- Semua Status Pengambilan --</option>
            <option value="belum" {{ $status === 'belum' ? 'selected' : '' }}>Belum Diambil</option>
            <option value="sudah" {{ $status === 'sudah' ? 'selected' : '' }}>Sudah Diambil (Selesai)</option>
        </select>

        <div style="display: flex; align-items: center; gap: 0.5rem; margin-right: 0.5rem;">
            <label style="font-size: 0.85rem; font-weight: 600; color: var(--text-muted); cursor: pointer; display: flex; align-items: center; gap: 0.25rem;">
                <input type="checkbox" name="only_representatives" value="1" {{ $onlyRepresentatives ? 'checked' : '' }} onchange="this.form.submit()" style="accent-color: var(--primary);"> 
                Hanya Tampilkan Perwakilan (Memiliki Titipan)
            </label>
        </div>

        <button type="submit" class="btn btn-primary btn-sm">Filter</button>
        @if(request()->anyFilled(['search', 'only_representatives', 'status']))
            <a href="{{ route('distribution.paket') }}" class="btn btn-secondary btn-sm">Reset</a>
        @endif
    </form>

    <!-- Table of representatives -->
    @if ($participants->isEmpty())
        <div style="text-align: center; padding: 3rem 0; color: var(--text-muted);">
            <span style="font-size: 3rem; display: block; margin-bottom: 1rem;">👥</span>
            Tidak ditemukan data perwakilan paket qurban.
        </div>
    @else
        <div class="table-wrapper">
            <table class="table-custom">
                <thead>
                    <tr>
                        <th style="width: 20%;">Nama Perwakilan</th>
                        <th style="width: 10%;">Tipe</th>
                        <th style="width: 15%;">Status</th>
                        <th style="width: 22%;">List Titipan (Pemilik & Tipe)</th>
                        <th style="width: 18%;">Total Paket</th>
                        <th style="width: 15%; text-align: center;">Aksi Serah Terima</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($participants as $p)
                        @php
                            $alloc = $p->getAllocation();
                            $ownStatus = $p->distribution ? $p->distribution->status : 'Belum';
                            $pendingTitips = $p->entrustedToMe->where('status', '!=', 'Selesai');
                            $hasPendingItems = ($ownStatus !== 'Sudah') || ($pendingTitips->count() > 0);
                        @endphp
                        <tr>
                            <!-- Representative Name -->
                            <td>
                                <strong style="color: var(--primary-dark); font-size: 1.05rem; display: block;">{{ $p->nama }}</strong>
                                <div style="display: flex; gap: 0.5rem; align-items: center; margin-top: 0.15rem;">
                                    <span style="font-size: 0.75rem; color: var(--accent); font-weight: 700;">Kupon: {{ $p->no_kupon }}</span>
                                    <span style="font-size: 0.75rem; color: var(--text-muted);">Regu {{ $p->regu ?? '-' }}</span>
                                </div>
                            </td>

                            <!-- Tipe -->
                            <td>
                                <span style="font-weight: 700; color: var(--text-main); font-size: 0.85rem; background: var(--primary-light); padding: 0.2rem 0.5rem; border-radius: 4px;">
                                    {{ $p->jenis }}
                                </span>
                            </td>

                            <!-- Own Allocation Details -->
                            <td>
                                <div style="font-size: 0.8rem; line-height: 1.35; background: #fafafa; padding: 0.5rem; border-radius: 6px; border: 1px solid #f0f0f0;">
                                    @if($ownStatus === 'Titip')
                                        <div style="margin-bottom: 0.25rem; font-weight: 600; color: var(--text-muted);">
                                            Paket dititipkan ke:<br>
                                            <strong style="color: var(--primary-dark);">{{ $p->distribution->entrustee->nama ?? '-' }}</strong>
                                        </div>
                                        <span class="badge badge-info" style="font-size: 0.65rem; padding: 0.1rem 0.35rem;">Dititip</span>
                                    @else
                                        @if($alloc->daging_sapi > 0) 🐮 Sapi: {{ $alloc->daging_sapi }} Porsi<br> @endif
                                        @if($alloc->daging_kambing > 0) 🐐 Kambing: {{ $alloc->daging_kambing }} Porsi<br> @endif
                                        @if($alloc->hak_2kg > 0) ⭐ Hak 2Kg: {{ $alloc->hak_2kg }}<br> @endif
                                        @if($alloc->hak_paha > 0) 🍗 Paha: {{ $alloc->hak_paha }} @endif
                                        <div style="margin-top: 0.25rem;">
                                            @if($ownStatus === 'Sudah')
                                                <span class="badge badge-success" style="font-size: 0.65rem; padding: 0.1rem 0.35rem;">Diambil</span>
                                            @else
                                                <span class="badge badge-danger" style="font-size: 0.65rem; padding: 0.1rem 0.35rem;">Belum</span>
                                            @endif
                                        </div>
                                    @endif
                                </div>
                            </td>

                            <!-- Entrusted List -->
                            <td>
                                @if($p->entrustedToMe->isEmpty())
                                    <span style="font-size: 0.8rem; color: var(--text-muted); font-style: italic;">Tidak ada titipan paket</span>
                                @else
                                    <ul style="list-style-type: none; font-size: 0.8rem; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 0.35rem;">
                                        @foreach($p->entrustedToMe as $t)
                                            @php
                                                $tAlloc = $t->participant->getAllocation();
                                            @endphp
                                            <li style="border-left: 2px solid var(--primary); padding-left: 0.5rem; line-height: 1.35;">
                                                <strong style="color: var(--text-main);">{{ $t->participant->nama }}</strong>
                                                <span style="font-size: 0.7rem; color: var(--accent); font-weight: 700; margin-left: 0.25rem;">({{ $t->participant->no_kupon }})</span>
                                                <span style="font-size: 0.7rem; font-family: monospace; font-weight: 600; background: #e2e8f0; padding: 0.1rem 0.25rem; border-radius: 3px; margin-left: 0.25rem;">
                                                    {{ $t->participant->jenis }}
                                                </span>
                                                <div style="font-size: 0.75rem; color: var(--text-muted);">
                                                    Jatah:
                                                    @if($tAlloc->daging_sapi > 0) 🐮S:{{ $tAlloc->daging_sapi }} @endif
                                                    @if($tAlloc->daging_kambing > 0) 🐐K:{{ $tAlloc->daging_kambing }} @endif
                                                    @if($tAlloc->hak_2kg > 0) ⭐2K:{{ $tAlloc->hak_2kg }} @endif
                                                </div>
                                                <div style="margin-top: 0.15rem;">
                                                    @if($t->status === 'Pending')
                                                        <span class="badge badge-warning" style="font-size: 0.6rem; padding: 0 0.3rem;">Pending</span>
                                                    @elseif($t->status === 'Diproses')
                                                        <span class="badge badge-info" style="font-size: 0.6rem; padding: 0 0.3rem;">Diproses</span>
                                                    @else
                                                        <span class="badge badge-success" style="font-size: 0.6rem; padding: 0 0.3rem;">Selesai</span>
                                                    @endif
                                                </div>
                                            </li>
                                        @endforeach
                                    </ul>
                                @endif
                            </td>

                            <!-- Total Paket -->
                            <td style="vertical-align: middle;">
                                @php
                                    $tally = [];
                                    if ($ownStatus !== 'Titip') {
                                        $tally[$p->jenis] = ($tally[$p->jenis] ?? 0) + 1;
                                    }
                                    foreach ($p->entrustedToMe as $t) {
                                        $tally[$t->participant->jenis] = ($tally[$t->participant->jenis] ?? 0) + 1;
                                    }
                                @endphp
                                @if (empty($tally))
                                    <span style="font-size: 0.8rem; color: var(--text-muted); font-style: italic;">0 Paket</span>
                                @else
                                    <div style="display: flex; flex-direction: column; gap: 0.3rem;">
                                        @foreach ($tally as $type => $count)
                                            <span style="font-size: 0.8rem; font-weight: 700; color: var(--primary-dark); display: inline-flex; align-items: center; gap: 0.25rem;">
                                                <span style="background: #e2e8f0; color: #334155; font-size: 0.7rem; font-weight: 800; padding: 0.1rem 0.35rem; border-radius: 4px; line-height: 1;">
                                                    {{ $count }}x
                                                </span>
                                                {{ $type }}
                                            </span>
                                        @endforeach
                                    </div>
                                @endif
                            </td>

                            <!-- Bulk release button -->
                            <td style="text-align: center; vertical-align: middle;">
                                @if($ownStatus === 'Titip')
                                    <span class="badge badge-info" style="font-size: 0.75rem; padding: 0.35rem 0.6rem; display: inline-flex; width: 100%; justify-content: center;">
                                        Dititipkan
                                    </span>
                                @elseif($hasPendingItems)
                                    <form action="{{ route('distribution.distribute-all', $p->id) }}" method="POST">
                                        @csrf
                                        <button type="submit" class="btn btn-primary btn-sm" style="width: 100%; justify-content: center; font-size: 0.75rem; padding: 0.5rem;">
                                            🎁 Serahkan Semua
                                        </button>
                                    </form>
                                    @if($p->entrustedToMe->count() > 0)
                                        <div style="font-size: 0.7rem; color: var(--text-muted); font-weight: 500; margin-top: 0.35rem;">
                                            Total: <strong>{{ 1 + $p->entrustedToMe->count() }} Paket</strong>
                                        </div>
                                    @endif
                                @else
                                    <span class="badge badge-success" style="font-size: 0.75rem; padding: 0.35rem 0.6rem; display: inline-flex; width: 100%; justify-content: center;">
                                        ✅ Semua Selesai
                                    </span>
                                @endif
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        <div class="pagination-wrapper">
            <div style="font-size: 0.85rem; color: var(--text-muted);">
                Menampilkan {{ $participants->firstItem() }} - {{ $participants->lastItem() }} dari {{ $participants->total() }} Data
            </div>
            <div>
                {{ $participants->links() }}
            </div>
        </div>
    @endif
</div>
@endsection