83 lines
5.4 KiB
PHP
83 lines
5.4 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', 'Keranjang')
|
|
<!-- Halaman Keranjang User -->
|
|
@section('content')
|
|
@if($items->isEmpty())
|
|
<x-card class="max-w-lg mx-auto text-center py-16">
|
|
<div class="inline-flex h-16 w-16 items-center justify-center rounded-2xl bg-gray-100 text-gray-400 mb-4">
|
|
<i class="fa-solid fa-cart-shopping text-3xl"></i>
|
|
</div>
|
|
<h2 class="text-xl font-semibold text-gray-900">Keranjang kosong</h2>
|
|
<p class="mt-1 text-gray-500">Tambahkan mainan dari halaman belanja.</p>
|
|
<x-button href="{{ route('shop.index') }}" variant="primary" size="lg" class="mt-6">Belanja Sekarang</x-button>
|
|
</x-card>
|
|
@else
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
|
<div class="lg:col-span-2">
|
|
<x-card>
|
|
<div class="overflow-x-auto">
|
|
<table class="w-full text-sm">
|
|
<thead>
|
|
<tr class="border-b border-gray-100">
|
|
<th class="text-left py-4 font-semibold text-gray-700">Produk</th>
|
|
<th class="text-left py-4 font-semibold text-gray-700">Harga</th>
|
|
<th class="text-left py-4 font-semibold text-gray-700">Jumlah</th>
|
|
<th class="text-right py-4 font-semibold text-gray-700">Subtotal</th>
|
|
<th class="w-10"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-gray-50">
|
|
@foreach($items as $item)
|
|
<tr class="hover:bg-gray-50/50 transition">
|
|
<td class="py-4">
|
|
<div class="flex items-center gap-4">
|
|
<div class="h-16 w-16 rounded-xl bg-gray-100 overflow-hidden shrink-0">
|
|
@if($item->product->image_type)
|
|
<img src="data:image/{{ $item->product->image_type }};base64,{{ base64_encode($item->product->image) }}" alt="" class="h-full w-full object-cover">
|
|
@else
|
|
<div class="h-full w-full flex items-center justify-center text-2xl">🧸</div>
|
|
@endif
|
|
</div>
|
|
<span class="font-medium text-gray-900">{{ $item->product->name }}</span>
|
|
</div>
|
|
</td>
|
|
<td class="py-4 text-gray-600">Rp {{ number_format($item->product->price, 0, ',', '.') }}</td>
|
|
<td class="py-4">
|
|
<form action="{{ route('cart.update', $item) }}" method="POST" class="inline-flex items-center gap-2">
|
|
@csrf
|
|
@method('PUT')
|
|
<input type="number" name="quantity" value="{{ $item->quantity }}" min="1" max="{{ $item->product->stock }}" class="w-16 rounded-lg border border-gray-200 px-2 py-2 text-center text-sm focus:border-primary-500 focus:ring-2 focus:ring-primary-500/20">
|
|
<button type="submit" class="text-sm font-medium text-primary-600 hover:text-primary-700">Update</button>
|
|
</form>
|
|
</td>
|
|
<td class="py-4 text-right font-semibold text-gray-900">Rp {{ number_format($item->quantity * $item->product->price, 0, ',', '.') }}</td>
|
|
<td class="py-4">
|
|
<form action="{{ route('cart.destroy', $item) }}" method="POST" data-confirm="Hapus dari keranjang?">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit" class="p-2 rounded-lg text-gray-400 hover:text-red-600 hover:bg-red-50 transition" aria-label="Hapus"><i class="fa-solid fa-trash"></i></button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
@endforeach
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</x-card>
|
|
</div>
|
|
<div class="lg:col-span-1">
|
|
<div class="lg:sticky lg:top-24">
|
|
<x-card>
|
|
<h3 class="font-semibold text-gray-900 mb-4">Ringkasan</h3>
|
|
<div class="flex justify-between text-gray-600 mb-2"><span>Subtotal ({{ $items->count() }} item)</span><span>Rp {{ number_format($total, 0, ',', '.') }}</span></div>
|
|
<hr class="border-gray-100 my-4">
|
|
<div class="flex justify-between font-bold text-gray-900 text-lg mb-6"><span>Total</span><span>Rp {{ number_format($total, 0, ',', '.') }}</span></div>
|
|
<x-button href="{{ route('checkout.show') }}" variant="primary" size="lg" class="w-full">Checkout</x-button>
|
|
</x-card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
@endsection
|