235 lines
14 KiB
PHP
235 lines
14 KiB
PHP
@extends('guest.layout.main')
|
|
@section('body_main_guests')
|
|
|
|
<section class="section py-5 bg-light">
|
|
|
|
<div class="container">
|
|
<div class="row justify-content-center">
|
|
|
|
<div class="col-lg-8">
|
|
|
|
<div class="card shadow-sm border-0">
|
|
<div class="d-flex justify-content-end align-items-center p-3">
|
|
<a href="/" class="btn btn-outline-success">
|
|
<i class="fa fa-arrow-left me-1"></i> Kembali ke Menu
|
|
</a>
|
|
</div>
|
|
<div class="card-body text-center py-5">
|
|
|
|
<h3 class="mb-4 fw-bold text-success">Cek Status Pesanan Anda</h3>
|
|
<p class="text-muted mb-4">Masukkan <strong>No Order</strong> yang Anda terima setelah pemesanan untuk melihat status.</p>
|
|
|
|
<form action="" class="d-flex justify-content-center" id="form_search_order">
|
|
<div class="input-group w-100 w-md-75">
|
|
<input type="text" name="no_order" class="form-control form-control-lg shadow-sm" placeholder="Contoh: TX/CT/GIZI/2025/07/1/0001" required>
|
|
<button class="btn btn-success btn-lg" type="submit">
|
|
<i class="fa fa-search me-1"></i>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
<div id="result_check_order">
|
|
{{-- Isi javascript --}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<script>
|
|
$(document).ready(function() {
|
|
$("#cartButton").addClass('d-none')
|
|
const container = $("#result_check_order")
|
|
const formSearch = $("#form_search_order")
|
|
|
|
formSearch.on("submit", function(e) {
|
|
e.preventDefault()
|
|
const formData = new FormData(this);
|
|
const noOrder = formData.get("no_order");
|
|
|
|
if (!noOrder) {
|
|
alert("No Order tidak boleh kosong.");
|
|
return;
|
|
}
|
|
|
|
container.html(`<div class="text-center py-3"><div class="spinner-border text-success" role="status"></div><p class="mt-2">Sedang memuat...</p></div>`);
|
|
|
|
fetch(`/check-order/search?no_order=${encodeURIComponent(noOrder)}`)
|
|
.then(res => {
|
|
if (!res.ok) throw new Error("Gagal mengambil data.");
|
|
return res.json();
|
|
})
|
|
.then(order => {
|
|
let html = '';
|
|
let itemHTML ='';
|
|
if(!order.status){
|
|
return container.html(`<h4 class="fw-bold text-black">Pesanan Tidal Ditemukan</h4>`);
|
|
}
|
|
const data = order.data;
|
|
(data.items || []).forEach(item => {
|
|
|
|
const harga = parseInt(item.harga_satuan);
|
|
const jumlah = parseInt(item.jumlah);
|
|
const total = harga * jumlah;
|
|
itemHTML += `
|
|
<div class="card mb-2 shadow-sm">
|
|
<div class="row g-0">
|
|
<div class="${data?.cara_pembayaran === "MCU" ? 'd-none' : 'col-md-4 p-2'}">
|
|
<img src="/gambar/${item.foto || 'default.jpg'}" class="img-fluid rounded-start" alt="${item.nama_item}" style="max-height: 150px; width:100%; object-fit: cover;">
|
|
</div>
|
|
<div class="${data?.cara_pembayaran === "MCU" ? 'col-md-12' : 'col-md-8'}">
|
|
<div class="card-body py-2 px-3 mt-2">
|
|
<h6 class="card-title mb-1">${item.nama_item}</h6>
|
|
<p class="mb-1 small text-muted">Tgl Antar: <strong>${item.tgl_antar}</strong></p>
|
|
${item?.total_kalori ? `
|
|
<p class="mb-1 small text-muted">Total Kalori: <strong>${item?.total_kalori || '-'} kal</strong></p>
|
|
` : ''}
|
|
<p class="mb-1 small">Harga: <strong>${harga.toLocaleString('id-ID')}</strong></p>
|
|
<p class="mb-1 small">Jumlah: <strong>${jumlah}</strong></p>
|
|
<p class="mb-0 small">Total: <strong class="text-success">Rp ${total.toLocaleString('id-ID')}</strong></p>
|
|
<p class="badge text-white
|
|
${item?.status_order === 'Pending'? 'bg-primary'
|
|
: data.status_order === 'Belum Bayar' ? '' : 'bg-success'}">
|
|
${item?.status_order}
|
|
</p>
|
|
${data?.cara_pembayaran === "MCU" ? '' : `
|
|
<p class="mb-1 small">Catatan: <strong>${item?.catatan || '-'}</strong></p>`}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>`;
|
|
});
|
|
|
|
html += `
|
|
<div class="card mt-5 shadow-sm border-0 rounded-4">
|
|
<div class="card-body px-3 py-4">
|
|
<div class="text-center mb-4">
|
|
<h4 class="fw-bold text-success">Pesanan Anda Ditemukan</h4>
|
|
<p class="text-muted small">Berikut adalah detail pesanan dengan No Order: <strong>${data?.no_order}</p>
|
|
</div>
|
|
|
|
<div class="row g-3 mb-3">
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Nama Pemesan</div>
|
|
<div class="text-dark">${data.nama_pemesan}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Tanggal Pesan</div>
|
|
<div class="text-dark">${new Date(data.tgl_pesanan).toLocaleDateString('id-ID')}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Jenis Customer</div>
|
|
<div class="text-dark">${data?.jenis_customer}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Status</div>
|
|
<span class="badge
|
|
${data?.status_order === "Menunggu Konfirmasi Pembayaran"
|
|
? 'bg-primary'
|
|
: data?.status_order === "Belum Bayar"
|
|
? "bg-warning"
|
|
: "bg-success"}">
|
|
${data?.status_order}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
${data?.jenis_customer === "Karyawan RSAB Harapan Kita" ?
|
|
` <div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Bagian /Instalasi</div>
|
|
<div class="text-dark">${data?.bagian_instalasi || '-'}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Ekstensien yang bisa di Hubungi</div>
|
|
<div class="text-dark">${data?.no_ekstensien || '-'}</div>
|
|
</div>
|
|
</div>
|
|
` : data?.jenis_customer === "Keluarga Pasien / Penunggu Pasien" ?
|
|
`
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Nama Pasien</div>
|
|
<div class="text-dark">${data?.nama_pasien || '-'}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Ruang Perawatan</div>
|
|
<div class="text-dark">${data?.ruang_perawatan || '-'}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Nomor Kamar Perawatan</div>
|
|
<div class="text-dark">${data?.no_kamar_perawatan || '-'}</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Kelas Perawatan</div>
|
|
<div class="text-dark">${data?.kelas_perawatan || '-'}</div>
|
|
</div>
|
|
</div>
|
|
` : data?.jenis_customer === "Masyarakat Umum" ? ` <div class="col-md-12">
|
|
<div class="bg-light p-3 rounded shadow-sm small">
|
|
<div class="fw-semibold text-secondary mb-1">Alamat</div>
|
|
<div class="text-dark">${data?.alamat || '-'}</div>
|
|
</div>
|
|
</div>` : ''
|
|
|
|
}
|
|
</div>
|
|
|
|
<div class="bg-white rounded-4 border p-3 shadow-sm mb-4">
|
|
<h6 class="fw-semibold mb-3">Item Pesanan</h6>
|
|
${itemHTML}
|
|
|
|
<div class="text-end mt-3">
|
|
<h6>Total Seluruh Pesanan: <strong class="text-success">Rp ${parseInt(data?.total_harga).toLocaleString('id-ID')}</strong></h6>
|
|
</div>
|
|
</div>
|
|
${data?.status_order === "Belum Bayar"
|
|
? `<div class="text-center mb-4">
|
|
<button class="btn btn-warning fw-bold text-dark">Belum Melakukan Pembayaran</button>
|
|
</div>` :
|
|
data?.bukti_bayar ? `
|
|
<div class="text-center mb-4">
|
|
<h6 class="fw-semibold mb-2">Bukti Pembayaran</h6>
|
|
<img src="/storage/${data?.bukti_bayar}" alt="Bukti Pembayaran" class="img-fluid rounded shadow-sm" style="max-width: 300px;">
|
|
</div>
|
|
` :`
|
|
<div class="text-center mb-4">
|
|
<button class="btn btn-success fw-bold">Pembayaran VIA ${data?.cara_pembayaran === "MCU" ? 'MCU' : 'Billing'}</button>
|
|
</div>
|
|
`}
|
|
<div class="text-center">
|
|
<a href="/" class="btn btn-outline-success btn-sm px-4 rounded-pill">
|
|
<i class="fa fa-arrow-left me-1"></i> Kembali ke Beranda
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
`
|
|
container.html(html);
|
|
})
|
|
.catch(err => {
|
|
console.error(err);
|
|
container.html(`<h4 class="fw-bold text-black mt-3">Pesanan Tidal Ditemukan</h4>`);
|
|
});
|
|
})
|
|
})
|
|
</script>
|
|
|
|
@endsection
|