@extends('layouts.anggota')

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

    <h3 class="mb-3 text-primary">Daftar Transaksi Peminjaman</h3>

    <div class="card shadow-lg border-0 mb-4">
        <div class="card-body p-4">
            @if(session('success'))
                <div class="alert alert-success">{{ session('success') }}</div>
            @endif
            @if(session('error'))
                <div class="alert alert-danger">{{ session('error') }}</div>
            @endif

            <div class="table-responsive">
                <table class="table table-striped table-bordered align-middle mb-0">
                    <thead class="table-light text-center align-middle">
                        <tr>
                            <th>No</th>
                            <th>Nama Anggota</th>
                            <th>NIP/NIM</th> 
                            <th>No. HP</th>
                            <th>Judul Buku</th>
                            <th>Tanggal Pinjam</th>
                            <th>Tanggal & Waktu Ambil</th>
                            <th>Tanggal Kembali</th>
                            <th>Buku Bisa Diambil</th>
                            <th>Surat Pengantar</th>
                            <th>Status</th>
                            <th>Aksi</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($transactions as $t)
                        <tr>
                            <td>{{ $loop->iteration }}</td>
                            <td>{{ $t->anggota->nama ?? '-' }}</td>
                            <td>{{ $t->anggota->nip_nim ?? '-' }}</td> 
                            <td>{{ $t->anggota->no_hp ?? '-' }}</td>
                            <td>{{ $t->koleksi->title ?? '-' }}</td>

                            <td>
                                {{ $t->tanggal_pinjam 
                                    ? \Carbon\Carbon::parse($t->tanggal_pinjam)
                                        ->setTimezone('Asia/Jakarta')
                                        ->format('d/m/Y') 
                                    : '-' 
                                }}
                            </td>

                            <td>
                                @if($t->pickup_date)
                                    @php
                                        $pickupDate = \Carbon\Carbon::parse($t->pickup_date)
                                            ->setTimezone('Asia/Jakarta')
                                            ->format('d/m/Y');
                                        $pickupTime = $t->pickup_time
                                            ? \Carbon\Carbon::parse($t->pickup_time)
                                                ->setTimezone('Asia/Jakarta')
                                                ->format('H:i')
                                            : '00:00';
                                    @endphp
                                    {{ $pickupDate }} {{ $pickupTime }} WIB
                                @else
                                    -
                                @endif
                            </td>

                            <td>
                                {{ $t->tanggal_kembali 
                                    ? \Carbon\Carbon::parse($t->tanggal_kembali)
                                        ->setTimezone('Asia/Jakarta')
                                        ->format('d/m/Y')
                                    : '-' 
                                }}
                            </td>

                            <td class="text-center">
                                @php
                                    $pickupDateCheck = $t->pickup_date ? \Carbon\Carbon::parse($t->pickup_date) : null;
                                    $now = \Carbon\Carbon::now('Asia/Jakarta');
                                @endphp
                                @if($t->status == 'disetujui' && $pickupDateCheck && $pickupDateCheck->lte($now))
                                    <span class="badge bg-success text-white">
                                        <i class="bi bi-check-circle me-1"></i> Bisa Diambil
                                    </span>
                                @else
                                    <span class="text-muted">-</span>
                                @endif
                            </td>

                            <td>
                                @if($t->surat_pengantar)
                                    <a href="{{ route('admin.peminjaman.download', $t->id) }}" 
                                       class="btn btn-outline-success btn-sm">
                                        Download
                                    </a>
                                @else
                                    -
                                @endif
                            </td>

                            <td>
                                @switch($t->status)
                                    @case('menunggu')
                                        <span class="badge bg-warning text-dark">Menunggu</span>
                                        @break
                                    @case('disetujui')
                                        <span class="badge bg-info text-white">Disetujui</span>
                                        @break
                                    @case('dipinjam')
                                        <span class="badge bg-primary text-white">Dipinjam</span>
                                        @break
                                    @case('perpanjangan_menunggu')
                                        <span class="badge bg-purple text-white" style="background-color:#6f42c1">
                                            Menunggu Persetujuan Perpanjangan
                                        </span>
                                        @break
                                    @case('pengembalian_menunggu')
                                        <span class="badge bg-secondary text-white">Menunggu Konfirmasi Pengembalian</span>
                                        @break
                                    @case('dikembalikan')
                                        <span class="badge bg-success text-white">Dikembalikan</span>
                                        @break
                                    @case('ditolak')
                                        <span class="badge bg-danger text-white">Ditolak</span>
                                        @break
                                    @default
                                        <span class="badge bg-secondary">-</span>
                                @endswitch
                            </td>

                            <td>
                                @if($t->status == 'menunggu')
                                    <button class="btn btn-primary btn-sm" 
                                            data-bs-toggle="modal" 
                                            data-bs-target="#approveModal" 
                                            data-id="{{ $t->id }}"
                                            data-pickup="{{ date('Y-m-d') }}"
                                            data-pickuptime="{{ date('H:i') }}"
                                            data-return="{{ \Carbon\Carbon::now()->addDays(7)->format('Y-m-d') }}">
                                        Approve
                                    </button>

                                    <form action="{{ route('admin.peminjaman.tolak', $t->id) }}" method="POST" class="d-inline">
                                        @csrf
                                        <button type="submit" class="btn btn-danger btn-sm">Reject</button>
                                    </form>

                                @elseif($t->status == 'disetujui')
                                    <form action="{{ route('admin.peminjaman.ambil', $t->id) }}" method="POST" class="d-inline">
                                        @csrf
                                        <button type="submit" class="btn btn-primary btn-sm">Ambil Buku</button>
                                    </form>

                                @elseif($t->status == 'dipinjam')
                                    <span class="badge bg-warning text-dark">Menunggu Pengembalian</span>

                                @elseif($t->status == 'perpanjangan_menunggu')
                                    <form action="{{ route('admin.peminjaman.setujuiPerpanjangan', $t->id) }}" 
                                          method="POST" class="d-inline"
                                          onsubmit="return confirm('Setujui perpanjangan dan tambah 7 hari dari tanggal kembali?')">
                                        @csrf
                                        <button type="submit" class="btn btn-success btn-sm">
                                            <i class="bi bi-check-lg me-1"></i> Setujui Perpanjangan
                                        </button>
                                    </form>

                                    <form action="{{ route('admin.peminjaman.tolakPerpanjangan', $t->id) }}" 
                                          method="POST" class="d-inline"
                                          onsubmit="return confirm('Tolak permintaan perpanjangan ini?')">
                                        @csrf
                                        <button type="submit" class="btn btn-danger btn-sm">
                                            <i class="bi bi-x-lg me-1"></i> Tolak Perpanjangan
                                        </button>
                                    </form>

                                @elseif($t->status == 'pengembalian_menunggu')
                                    <form action="{{ route('admin.peminjaman.kembalikan', $t->id) }}" method="POST" class="d-inline">
                                        @csrf
                                        @method('PUT')
                                        <button type="submit" class="btn btn-success btn-sm">Konfirmasi Pengembalian</button>
                                    </form>

                                @else
                                    <span class="text-success fw-bold">Selesai</span>
                                @endif
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="12" class="text-center">Belum ada transaksi peminjaman.</td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="approveModal" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog">
    <form id="approveForm" method="POST">
        @csrf
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title">Setujui Peminjaman</h5>
            <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
          </div>
          <div class="modal-body">
              <div class="mb-3">
                  <label for="pickup_date" class="form-label">Tanggal Ambil Buku</label>
                  <input type="date" class="form-control" name="pickup_date" id="pickup_date" required>
              </div>
              <div class="mb-3">
                  <label for="pickup_time" class="form-label">Waktu Ambil Buku</label>
                  <input type="time" class="form-control" name="pickup_time" id="pickup_time" required>
              </div>
              <div class="mb-3">
                  <label for="tanggal_kembali" class="form-label">Tanggal Pengembalian</label>
                  <input type="date" class="form-control" name="tanggal_kembali" id="tanggal_kembali" required>
                  <small class="text-muted">Tanggal ini digunakan sebagai batas akhir pengembalian buku.</small>
              </div>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
            <button type="submit" class="btn btn-primary">Setujui</button>
          </div>
        </div>
    </form>
  </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function () {
    var approveModal = document.getElementById('approveModal');
    approveModal.addEventListener('show.bs.modal', function (event) {
        var button = event.relatedTarget;
        var transactionId = button.getAttribute('data-id');
        var pickupDate = button.getAttribute('data-pickup');
        var pickupTime = button.getAttribute('data-pickuptime');
        var returnDate = button.getAttribute('data-return');

        var form = document.getElementById('approveForm');
        form.action = '/admin/peminjaman/' + transactionId + '/setujui';

        form.querySelector('#pickup_date').value = pickupDate;
        form.querySelector('#pickup_time').value = pickupTime;
        form.querySelector('#tanggal_kembali').value = returnDate;
    });
});
</script>

<style>
.table-bordered > :not(caption) > * > * {
    border-color: #dee2e6 !important;
    border-width: 1px !important;
}
.table th, .table td {
    vertical-align: middle !important;
    text-align: center;
    border: 1px solid #dee2e6 !important;
}
.table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
}
</style>
@endsection