TKK_E32230908/resources/views/user/peminjaman/index.blade.php

277 lines
9.9 KiB
PHP

@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