106 lines
4.7 KiB
PHP
106 lines
4.7 KiB
PHP
@extends('layouts.dashboard')
|
|
|
|
@section('content')
|
|
<div class="container mx-auto px-4 py-6">
|
|
<div class="max-w-2xl mx-auto">
|
|
<div class="bg-white rounded-xl shadow-sm p-6">
|
|
<div class="text-center mb-6">
|
|
<div class="w-20 h-20 mx-auto mb-4 text-red-500">
|
|
<i class="fas fa-exclamation-circle text-6xl"></i>
|
|
</div>
|
|
<h2 class="text-2xl font-bold text-gray-800 mb-2">Pembayaran Gagal</h2>
|
|
<p class="text-gray-600">{{ $message ?? 'Terjadi kesalahan saat memproses pembayaran Anda.' }}</p>
|
|
</div>
|
|
|
|
<div class="border-t border-gray-100 pt-6">
|
|
<div class="space-y-4">
|
|
<div class="flex justify-between">
|
|
<span class="text-gray-600">Kode Transaksi:</span>
|
|
<span class="font-semibold">{{ $transaksi->kode_transaksi ?? '-' }}</span>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-gray-600">Total Pembayaran:</span>
|
|
<span class="font-semibold text-[#2C7A7B]">Rp {{ number_format($transaksi->total_pembayaran ?? 0, 0, ',', '.') }}</span>
|
|
</div>
|
|
<div class="flex justify-between">
|
|
<span class="text-gray-600">Status:</span>
|
|
<span class="px-3 py-1 text-sm rounded-full bg-red-100 text-red-800">
|
|
{{ ucfirst($transaction_status ?? 'error') }}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mt-8 space-y-4">
|
|
<a href="{{ route('pesanan.index') }}" class="block w-full text-center px-4 py-2 bg-[#2C7A7B] text-white rounded-lg hover:bg-[#1C6B6B] transition-colors duration-200">
|
|
Kembali ke Daftar Pesanan
|
|
</a>
|
|
@if(isset($transaksi) && $transaksi->status === 'menunggu_pembayaran')
|
|
<button onclick="payWithSnap({{ $transaksi->pesanan_id }})" class="block w-full text-center px-4 py-2 bg-green-500 text-white rounded-lg hover:bg-green-600 transition-colors duration-200">
|
|
Coba Bayar Lagi
|
|
</button>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@push('scripts')
|
|
<script type="text/javascript" src="https://app.midtrans.com/snap/snap.js" data-client-key="{{ config('midtrans.client_key') }}"></script>
|
|
<script>
|
|
function payWithSnap(pesananId) {
|
|
// Tampilkan loading state
|
|
const button = event.target;
|
|
const originalText = button.innerHTML;
|
|
button.innerHTML = '<i class="fas fa-spinner fa-spin mr-1"></i> Memproses...';
|
|
button.disabled = true;
|
|
|
|
// Panggil endpoint untuk mendapatkan snap token
|
|
fetch(`/transaksi/create/${pesananId}`, {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
|
|
}
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
return response.json().then(err => {
|
|
throw new Error(err.error || 'Terjadi kesalahan saat memproses pembayaran');
|
|
});
|
|
}
|
|
return response.json();
|
|
})
|
|
.then(data => {
|
|
if (data.snap_token) {
|
|
window.snap.pay(data.snap_token, {
|
|
onSuccess: function(result) {
|
|
window.location.href = '{{ route("transaksi.finish") }}?order_id=' + result.order_id;
|
|
},
|
|
onPending: function(result) {
|
|
window.location.href = '{{ route("transaksi.unfinish") }}?order_id=' + result.order_id;
|
|
},
|
|
onError: function(result) {
|
|
window.location.href = '{{ route("transaksi.error") }}?order_id=' + result.order_id;
|
|
},
|
|
onClose: function() {
|
|
button.innerHTML = originalText;
|
|
button.disabled = false;
|
|
}
|
|
});
|
|
} else {
|
|
alert('Terjadi kesalahan saat memproses pembayaran');
|
|
button.innerHTML = originalText;
|
|
button.disabled = false;
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error:', error);
|
|
alert(error.message || 'Terjadi kesalahan saat memproses pembayaran');
|
|
button.innerHTML = originalText;
|
|
button.disabled = false;
|
|
});
|
|
}
|
|
</script>
|
|
@endpush
|
|
@endsection
|