164 lines
8.7 KiB
PHP
164 lines
8.7 KiB
PHP
@extends('layouts.main')
|
|
@section('content')
|
|
<div x-data="{
|
|
showModal: false,
|
|
qrCodeUrl: '',
|
|
venueName: '',
|
|
bookingDate: '',
|
|
bookingTime: ''
|
|
}"
|
|
x-on:keydown.escape.window="showModal = false; document.body.style.overflow = 'auto';"
|
|
class="min-h-screen bg-gray-100">
|
|
|
|
{{-- ======================================================= --}}
|
|
{{-- START: MODAL UNTUK MENAMPILKAN QR CODE --}}
|
|
{{-- ======================================================= --}}
|
|
<div x-show="showModal"
|
|
x-transition:enter="transition ease-out duration-300"
|
|
x-transition:enter-start="opacity-0"
|
|
x-transition:leave="transition ease-in duration-200"
|
|
x-transition:leave-end="opacity-0"
|
|
class="fixed inset-0 z-50 flex items-center justify-center bg-black bg-opacity-75 p-4"
|
|
x-cloak>
|
|
|
|
<div @click.away="showModal = false; document.body.style.overflow = 'auto';" class="bg-white rounded-lg shadow-xl p-6 max-w-sm w-full text-center">
|
|
<h3 class="text-lg font-bold text-gray-800" x-text="venueName"></h3>
|
|
<p class="text-sm text-gray-500 mb-4">
|
|
<span x-text="bookingDate"></span> - <span x-text="bookingTime"></span>
|
|
</p>
|
|
|
|
<div class="p-4 border rounded-lg bg-white">
|
|
<img :src="qrCodeUrl" alt="Booking QR Code" class="w-full h-auto">
|
|
</div>
|
|
|
|
<p class="text-xs text-gray-500 mt-4">Tunjukkan QR Code ini kepada kasir saat Anda tiba di venue.</p>
|
|
|
|
<div class="mt-6 flex space-x-4">
|
|
<button @click="showModal = false; document.body.style.overflow = 'auto';" class="w-full px-4 py-2 bg-gray-200 text-gray-700 rounded-lg hover:bg-gray-300 font-medium">Tutup</button>
|
|
<a :href="qrCodeUrl" download="tiket-carimeja.svg" class="w-full flex items-center justify-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 font-medium">Download</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="min-h-96 mx-4 md:w-3/4 md:mx-auto py-8">
|
|
<h1 class="text-2xl font-bold mb-6">Riwayat Bookingg</h1>
|
|
|
|
@if($bookings->isEmpty())
|
|
<div class="bg-white rounded-lg shadow-md p-6 text-center">
|
|
<p class="text-gray-500">Anda belum memiliki riwayat booking.</p>
|
|
<a href="{{ url('/') }}" class="mt-4 inline-block bg-blue-500 text-white px-4 py-2 rounded-lg">Cari
|
|
Venue</a>
|
|
</div>
|
|
@else
|
|
<div class="space-y-4">
|
|
@foreach($bookings as $booking)
|
|
<div class="bg-white rounded-lg shadow-md overflow-hidden">
|
|
<div class="p-4 border-b {{ $booking->start_time > now() ? 'bg-green-50' : 'bg-gray-50' }}">
|
|
<div class="flex justify-between items-center">
|
|
<h3 class="font-semibold text-lg">{{ $booking->table->venue->name }}</h3>
|
|
<span
|
|
class="px-3 py-1 rounded-full text-sm {{ $booking->start_time > now() ? 'bg-green-100 text-green-800' : 'bg-gray-200 text-gray-800' }}">
|
|
{{ $booking->start_time > now() ? 'Upcoming' : 'Completed' }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<div class="p-4">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div>
|
|
<p class="text-sm text-gray-500">Meja</p>
|
|
<p class="font-medium">{{ $booking->table->name }} ({{ $booking->table->brand }})</p>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm text-gray-500">Tanggal & Waktu</p>
|
|
<p class="font-medium">{{ \Carbon\Carbon::parse($booking->start_time)->format('d M Y') }},
|
|
{{ \Carbon\Carbon::parse($booking->start_time)->format('H:i') }} -
|
|
{{ \Carbon\Carbon::parse($booking->end_time)->format('H:i') }}
|
|
</p>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm text-gray-500">Durasi</p>
|
|
<p class="font-medium">
|
|
{{ \Carbon\Carbon::parse($booking->start_time)->diffInHours($booking->end_time) }} Jam
|
|
</p>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm text-gray-500">Total Bayar</p>
|
|
<p class="font-medium">Rp {{ number_format($booking->total_amount, 0, ',', '.') }}</p>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm text-gray-500">Status Pembayaran</p>
|
|
<p class="font-medium capitalize">{{ $booking->status }}</p>
|
|
</div>
|
|
<div>
|
|
<p class="text-sm text-gray-500">Metode Pembayaran</p>
|
|
<p class="font-medium capitalize">{{ $booking->payment_method ?? '-' }}</p>
|
|
</div>
|
|
@if($booking->has_rescheduled)
|
|
<div class="col-span-2">
|
|
<p class="text-sm text-gray-500">Informasi Reschedule</p>
|
|
<p class="text-sm text-orange-600">
|
|
Booking ini telah di-reschedule dari tanggal
|
|
{{ \Carbon\Carbon::parse($booking->original_start_time)->format('d M Y') }} jam
|
|
{{ \Carbon\Carbon::parse($booking->original_start_time)->format('H:i') }} -
|
|
{{ \Carbon\Carbon::parse($booking->original_end_time)->format('H:i') }}
|
|
</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<div class="border-t mt-4 pt-4 flex justify-end items-center space-x-4">
|
|
<a href="{{ route('venue', $booking->table->venue->name) }}" class="text-sm text-blue-600 hover:underline font-medium">
|
|
Lihat Venue
|
|
</a>
|
|
|
|
{{-- Hanya tampilkan tombol jika status lunas --}}
|
|
@if($booking->status == 'paid')
|
|
|
|
{{-- Opsi untuk booking yang AKAN DATANG --}}
|
|
@if(now()->lt($booking->start_time))
|
|
{{-- Tombol Reschedule, dengan asumsi ada kolom reschedule_count di tabel bookings --}}
|
|
@if(isset($booking->reschedule_count) && $booking->reschedule_count < 1)
|
|
<a href="{{ route('booking.reschedule.form', $booking) }}" class="text-sm text-orange-600 hover:underline font-medium">
|
|
Reschedule
|
|
</a>
|
|
@endif
|
|
@endif
|
|
|
|
{{-- Opsi untuk booking yang SUDAH SELESAI --}}
|
|
@if(now()->gt($booking->end_time))
|
|
@if(!$booking->review)
|
|
<a href="{{ route('reviews.create', $booking) }}" class="text-sm text-green-600 hover:underline font-medium">
|
|
Beri Ulasan
|
|
</a>
|
|
@else
|
|
<span class="text-sm text-gray-500">Ulasan diberikan</span>
|
|
@endif
|
|
@endif
|
|
|
|
{{-- Tombol QR selalu muncul untuk booking lunas yang punya token --}}
|
|
@if($booking->validation_token)
|
|
<button @click="
|
|
showModal = true;
|
|
qrCodeUrl = '{{ route('booking.qrcode', $booking) }}';
|
|
venueName = '{{ addslashes($booking->table->venue->name) }}';
|
|
bookingDate = '{{ $booking->start_time->format("d M Y") }}';
|
|
bookingTime = '{{ $booking->start_time->format("H:i") }} - {{ $booking->end_time->format("H:i") }}';
|
|
document.body.style.overflow = 'hidden';
|
|
"
|
|
class="bg-blue-600 text-white text-sm font-bold px-4 py-2 rounded-lg hover:bg-blue-700 transition-colors">
|
|
Lihat Tiket (QR)
|
|
</button>
|
|
@endif
|
|
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
|
|
<div class="mt-6">
|
|
{{ $bookings->links() }}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
@endsection |