NIM_E31222518/resources/views/transaksi/index.blade.php

127 lines
7.0 KiB
PHP

@extends('layouts.dashboard')
@section('content')
<div class="container mx-auto px-4 py-8">
<div class="bg-white rounded-lg shadow-lg p-6">
<div class="flex justify-between items-center mb-6">
<h1 class="text-2xl font-bold text-gray-800">Pembayaran & Transaksi</h1>
</div>
@if(session('success'))
<div class="bg-green-100 border-l-4 border-green-400 text-green-700 px-4 py-3 rounded relative mb-4">
{{ session('success') }}
</div>
@endif
<!-- Menunggu Pembayaran -->
<div class="mb-8">
<h2 class="text-lg font-semibold mb-4">Menunggu Pembayaran</h2>
<div class="bg-white rounded-lg border border-gray-200">
@forelse($transaksiPending as $t)
<div class="p-4 border-b border-gray-200 last:border-b-0">
<div class="flex items-start justify-between">
<div class="flex items-start space-x-4">
<div class="w-20 h-20 rounded-lg overflow-hidden flex-shrink-0">
@if($t->pesanan->barang->gambar)
<img src="{{ Storage::url($t->pesanan->barang->gambar) }}"
alt="{{ $t->pesanan->barang->nama }}"
class="w-full h-full object-cover">
@else
<div class="w-full h-full bg-gray-200 flex items-center justify-center">
<i class="fas fa-box text-gray-400 text-2xl"></i>
</div>
@endif
</div>
<div>
<h3 class="font-medium text-gray-900">{{ $t->pesanan->barang->nama }}</h3>
<p class="text-sm text-gray-600">{{ $t->pesanan->jumlah }} x Rp {{ number_format($t->pesanan->barang->harga, 0, ',', '.') }}</p>
<p class="text-sm font-medium text-gray-900">Total: Rp {{ number_format($t->total_pembayaran, 0, ',', '.') }}</p>
<p class="text-xs text-gray-500 mt-1">Kode: {{ $t->kode_transaksi }}</p>
</div>
</div>
<div class="flex flex-col items-end space-y-2">
<span class="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800">
Menunggu Pembayaran
</span>
<a href="{{ route('transaksi.show', $t) }}"
class="inline-flex items-center px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700">
<i class="fas fa-credit-card mr-2"></i>
Bayar Sekarang
</a>
</div>
</div>
</div>
@empty
<div class="p-4 text-center text-gray-500">
Tidak ada transaksi yang menunggu pembayaran
</div>
@endforelse
</div>
</div>
<!-- Riwayat Transaksi -->
<div>
<h2 class="text-lg font-semibold mb-4">Riwayat Transaksi</h2>
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Kode Transaksi</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Produk</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Total Pembayaran</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Status</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase">Tanggal</th>
<th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase">Aksi</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
@forelse($transaksi as $t)
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-900">{{ $t->kode_transaksi }}</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-900">{{ $t->pesanan->barang->nama }}</div>
<div class="text-sm text-gray-500">{{ $t->pesanan->jumlah }} unit</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-900">Rp {{ number_format($t->total_pembayaran, 0, ',', '.') }}</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full
{{ $t->status === 'menunggu_pembayaran' ? 'bg-yellow-100 text-yellow-800' :
($t->status === 'menunggu_konfirmasi' ? 'bg-blue-100 text-blue-800' :
($t->status === 'dibayar' ? 'bg-green-100 text-green-800' :
'bg-red-100 text-red-800')) }}">
{{ ucwords(str_replace('_', ' ', $t->status)) }}
</span>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-500">{{ $t->created_at->format('d M Y H:i') }}</div>
</td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<a href="{{ route('transaksi.show', $t) }}" class="text-blue-600 hover:text-blue-900">
Detail
</a>
</td>
</tr>
@empty
<tr>
<td colspan="6" class="px-6 py-4 text-center text-gray-500">
Belum ada riwayat transaksi
</td>
</tr>
@endforelse
</tbody>
</table>
@if($transaksi->hasPages())
<div class="px-6 py-4 border-t border-gray-200">
{{ $transaksi->links() }}
</div>
@endif
</div>
</div>
</div>
</div>
@endsection