@extends('layouts.app')

@section('title', 'Daftar Titipan - Sistem Distribusi Qurban')

@section('header_title', 'Daftar Titipan')
@section('header_subtitle', 'Kelola paket qurban yang dititipkan pengambilannya ke orang lain')

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

    <!-- Filters -->
    <form action="{{ route('titip.index') }}" method="GET" class="filter-bar">
        <input type="text" name="search" class="form-control" placeholder="Cari Pemilik atau Penerima Titipan..." value="{{ request('search') }}">

        <select name="status" class="form-control">
            <option value="">-- Semua Status --</option>
            <option value="Pending" {{ request('status') == 'Pending' ? 'selected' : '' }}>Pending (Baru)</option>
            <option value="Diproses" {{ request('status') == 'Diproses' ? 'selected' : '' }}>Sedang Diproses</option>
            <option value="Selesai" {{ request('status') == 'Selesai' ? 'selected' : '' }}>Sudah Selesai</option>
        </select>

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

    <!-- Table of entrusted packages -->
    @if ($titips->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 titipan paket saat ini.
        </div>
    @else
        <div class="table-wrapper">
            <table class="table-custom">
                <thead>
                    <tr>
                        <th>Pemilik Asli (Kupon)</th>
                        <th>Dititipkan Ke (Kupon)</th>
                        <th>Jatah Daging Pemilik</th>
                        <th>Status Titipan</th>
                        <th>Tanggal Pengajuan</th>
                        <th>Waktu Diambil</th>
                        <th style="text-align: center;">Tindakan</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($titips as $t)
                        @php
                            $alloc = $t->participant->getAllocation();
                        @endphp
                        <tr>
                            <td>
                                <strong style="color: var(--primary-dark); font-size: 0.95rem;">{{ $t->participant->nama }}</strong>
                                <div style="font-size: 0.75rem; color: var(--accent); font-weight: 700;">Kupon: {{ $t->participant->no_kupon }}</div>
                            </td>
                            <td>
                                <strong style="font-size: 0.95rem;">{{ $t->entrustee->nama }}</strong>
                                <div style="font-size: 0.75rem; color: var(--text-muted); font-weight: 600;">Kupon: {{ $t->entrustee->no_kupon }}</div>
                            </td>
                            <td>
                                <div style="font-size: 0.8rem; line-height: 1.3;">
                                    @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>
                            </td>
                            <td>
                                @if ($t->status === 'Pending')
                                    <span class="badge badge-warning">Pending (Baru)</span>
                                @elseif ($t->status === 'Diproses')
                                    <span class="badge badge-info">Diproses</span>
                                @else
                                    <span class="badge badge-success">Selesai</span>
                                @endif
                            </td>
                            <td style="font-size: 0.8rem; color: var(--text-muted);">
                                {{ $t->created_at->format('d M Y, H:i') }}
                            </td>
                            <td style="font-size: 0.8rem; color: var(--text-muted); font-weight: 600;">
                                {{ $t->taken_at ? $t->taken_at->format('d M Y, H:i') : '-' }}
                            </td>
                            <td style="text-align: center;">
                                <div style="display: flex; gap: 0.35rem; justify-content: center;">
                                    @if ($t->status === 'Pending')
                                        <form action="{{ route('titip.update-status', $t->id) }}" method="POST" style="display: inline;">
                                            @csrf
                                            <input type="hidden" name="status" value="Diproses">
                                            <button type="submit" class="btn btn-secondary btn-sm" style="padding: 0.3rem 0.5rem; font-size: 0.7rem;">
                                                ⚙️ Proses
                                            </button>
                                        </form>
                                        
                                        <form action="{{ route('titip.update-status', $t->id) }}" method="POST" style="display: inline;">
                                            @csrf
                                            <input type="hidden" name="status" value="Selesai">
                                            <button type="submit" class="btn btn-primary btn-sm" style="padding: 0.3rem 0.5rem; font-size: 0.7rem;">
                                                ✔ Serahkan
                                            </button>
                                        </form>
                                    @elseif ($t->status === 'Diproses')
                                        <form action="{{ route('titip.update-status', $t->id) }}" method="POST" style="display: inline;">
                                            @csrf
                                            <input type="hidden" name="status" value="Selesai">
                                            <button type="submit" class="btn btn-primary btn-sm" style="padding: 0.3rem 0.5rem; font-size: 0.7rem; background-color: var(--success); border-color: var(--success);">
                                                ✔ Serahkan
                                            </button>
                                        </form>
                                    @else
                                        <button class="btn btn-secondary btn-sm" style="padding: 0.3rem 0.5rem; font-size: 0.7rem;" disabled>
                                            ✅ Selesai
                                        </button>
                                    @endif
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

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