@extends('layouts.dashboard')

@section('content')
<div class="container-fluid py-4">

    <div class="header-section mb-4 text-center text-lg-start">
        <h3 class="text-primary fw-bold">
            <i class="fas fa-book-reader me-2"></i> Daftar Peminjaman Saya
        </h3>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show shadow-sm" role="alert">
            <i class="fas fa-check-circle me-2"></i> {{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif
    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show shadow-sm" role="alert">
            <i class="fas fa-exclamation-circle me-2"></i> {{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <div class="table-wrapper shadow-sm rounded-4">
        <div class="table-responsive">
            <table class="table table-bordered table-hover align-middle mb-0">
                <thead class="table-header text-center">
                    <tr>
                        <th>No</th>
                        <th>Nama Anggota</th>
                        <th>Judul Buku</th>
                        <th>Tanggal Pinjam</th>
                        <th>Tanggal Kembali</th>
                        <th>Waktu Pengambilan</th>
                        <th>Status</th>
                        <th>Buku Bisa Diambil</th>
                        <th>Surat Pengantar</th>
                        <th>Aksi</th>
                    </tr>
                </thead>
                <tbody>

                    @forelse($peminjaman as $item)
                    @php
                        $today = \Carbon\Carbon::now();
                        $due = $item->tanggal_kembali ? \Carbon\Carbon::parse($item->tanggal_kembali) : null;
                        $isLate = $due && $today->gt($due) && $item->status === 'dipinjam';
                    @endphp

                    <tr>
                        <td class="text-center">{{ $loop->iteration }}</td>
                        <td>{{ $item->anggota->nama ?? '-' }}</td>
                        <td>{{ $item->koleksi->title ?? '-' }}</td>

                        <td class="text-center">
                            {{ $item->tanggal_pinjam ? \Carbon\Carbon::parse($item->tanggal_pinjam)->format('d/m/Y') : '-' }}
                        </td>

                        <td class="text-center">
                            {{ $item->tanggal_kembali ? \Carbon\Carbon::parse($item->tanggal_kembali)->format('d/m/Y') : '-' }}
                        </td>

                        <td class="text-center">
                            @if($item->pickup_date)
                                {{ \Carbon\Carbon::parse($item->pickup_date)->format('d/m/Y') }}
                                {{ $item->pickup_time ? \Carbon\Carbon::parse($item->pickup_time)->format('H:i') : '' }} WIB
                            @else
                                -
                            @endif
                        </td>

                        <td class="text-center">

                            @if($isLate)
                                <span class="badge bg-danger">
                                    <i class="fas fa-clock me-1"></i> Terlambat
                                </span>

                            @else
                                @switch($item->status)

                                    @case('menunggu')
                                        <span class="badge bg-warning text-dark"><i class="fas fa-hourglass-half me-1"></i>Menunggu</span>
                                        @break

                                    @case('disetujui')
                                        <span class="badge bg-info text-dark"><i class="fas fa-calendar-check me-1"></i>Disetujui</span>
                                        @break

                                    @case('dipinjam')
                                        <span class="badge bg-primary"><i class="fas fa-book me-1"></i>Dipinjam</span>
                                        @break

                                    @case('dikembalikan')
                                        <span class="badge bg-success"><i class="fas fa-check-circle me-1"></i>Dikembalikan</span>
                                        @break

                                    @default
                                        <span class="badge bg-secondary">-</span>

                                @endswitch
                            @endif
                        </td>

                        <td class="text-center">
                            @php
                                $pickupDate = $item->pickup_date ? \Carbon\Carbon::parse($item->pickup_date) : null;
                                $now = \Carbon\Carbon::now();
                            @endphp

                            @if($item->status === 'disetujui' && $pickupDate && $pickupDate->lte($now))
                                <span class="badge bg-success"><i class="fas fa-check me-1"></i>Bisa Diambil</span>
                            @else
                                <span class="text-muted">-</span>
                            @endif
                        </td>

                        <td class="text-center">
                            @if($item->surat_pengantar)
                                <a href="{{ route('user.peminjaman.download', $item->id) }}" class="btn btn-sm btn-outline-primary">
                                    <i class="fas fa-file-pdf me-1"></i> Unduh
                                </a>
                            @else
                                <span class="text-muted">Tidak ada</span>
                            @endif
                        </td>

                        <td class="text-center">
                            @if($item->status === 'dipinjam')

                                <form action="{{ route('user.peminjaman.kembalikan', $item->id) }}" method="POST"
                                      onsubmit="return confirm('Yakin ingin mengembalikan buku ini?')" class="d-inline">
                                    @csrf
                                    <button type="submit" class="btn btn-sm btn-danger mb-1">
                                        <i class="fas fa-undo me-1"></i> Kembalikan
                                    </button>
                                </form>

                                @if(($item->perpanjangan_count ?? 0) < 1)
                                    <form action="{{ route('user.peminjaman.perpanjang', $item->id) }}" method="POST"
                                          onsubmit="return confirm('Ajukan perpanjangan peminjaman?')" class="d-inline">
                                        @csrf
                                        <button type="submit" class="btn btn-sm btn-warning mb-1">
                                            <i class="fas fa-clock me-1"></i> Perpanjang
                                        </button>
                                    </form>
                                @else
                                    <span class="badge bg-secondary text-white"><i class="fas fa-ban me-1"></i>Sudah Diperpanjang</span>
                                @endif

                            @elseif($item->status === 'dikembalikan')
                                <a href="{{ route('user.rating.form', $item->id) }}" class="btn btn-sm btn-success">
                                    <i class="fas fa-star me-1"></i> Rating
                                </a>
                            @else
                                <span class="text-muted">-</span>
                            @endif
                        </td>

                    </tr>

                    @empty
                    <tr>
                        <td colspan="10" class="text-center text-muted py-3">
                            <i class="fas fa-info-circle me-2"></i> Belum ada peminjaman.
                        </td>
                    </tr>
                    @endforelse

                </tbody>
            </table>
        </div>
    </div>

</div>
@endsection


@push('styles')
<style>
.table-wrapper {
    background: #ffffff;
    border-radius: 16px;
    padding: 1rem;
    border: 1px solid #f3f4f6;
}

.table {
    background: #fff;
    color: #374151;
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #e5e7eb;
}

.table-header th {
    background: #fff7ed;
    color: #f97316;
    font-weight: 700;
    text-transform: uppercase;
    border-bottom: 2px solid #fde68a;
}

.table th,
.table td {
    padding: 0.85rem 1rem;
    border: 1px solid #e5e7eb;
    white-space: nowrap;
}

.table tbody tr:hover {
    background-color: #fffaf0;
    transition: background 0.25s ease;
}

.badge.bg-success { background-color: #22c55e !important; }
.badge.bg-warning { background-color: #fde68a !important; color: #333 !important; }
.badge.bg-danger  { background-color: #ef4444 !important; }

.btn {
    border-radius: 8px;
    font-weight: 500;
}

@media (min-width: 992px) {
    .container-fluid {
        max-width: 1600px;
        padding: 0 3rem;
        margin: 0 auto;
    }

    .table-responsive {
        overflow-x: hidden !important;
    }

    .header-section h3 {
        font-size: 1.6rem;
        color: #f97316;
        font-weight: 700;
    }
}

@media (max-width: 991.98px) {
    .container-fluid {
        padding: 1rem;
    }

    .header-section h3 {
        font-size: 1.25rem;
        text-align: center;
    }

    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scroll-behavior: smooth;
        border-radius: 12px;
    }

    table.table {
        min-width: 950px;
        font-size: 0.82rem;
    }

    .btn, .badge {
        font-size: 0.78rem !important;
        padding: 5px 8px;
    }

    .alert {
        font-size: 0.85rem;
    }
}
</style>
@endpush