E41220418
/
TIF_NGANJUK_E41220418
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor modal components for order history and payment details 

- Updated modal-foto.blade.php to dynamically include booking ID in modal ID and display booking details using Carbon for date and time formatting.
- Created new modal-riwayat-buket.blade.php and modal-riwayat-foto.blade.php for displaying detailed order history for buket and foto respectively.
- Removed the old modal-riwayat.blade.php file as its functionality has been split into the new modals.
- Updated riwayat.blade.php to integrate new modals and display order history with invoice numbers and customer details.
This commit is contained in:
LailaWulandarii 2025-12-28 19:20:14 +07:00
parent 086356cb17
commit d4b9e5fdf0
11 changed files with 850 additions and 608 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
app/Http/Controllers/admin/HistoriPesananController.php
View File

@ -3,12 +3,25 @@
namespace App\Http\Controllers\Admin;
use App\Http\Controllers\Controller;
use App\Models\BookingFoto;
use App\Models\TransaksiBuket;
use Illuminate\Http\Request;
class HistoriPesananController extends Controller
{
public function index()
{
return view('admin.riwayat-pesanan');
$riwayatBuket = TransaksiBuket::with(['pelanggan', 'buket'])
->where('status_transaksi', '!=', 'menunggu_verifikasi')
->latest()
->get();
// Ambil riwayat foto (selain status menunggu)
$riwayatFoto = BookingFoto::with(['pelanggan', 'paketFoto'])
->where('status_booking', '!=', 'menunggu_verifikasi')
->latest()
->get();
return view('admin.pesanan.riwayat', compact('riwayatBuket', 'riwayatFoto'));
}
}

79
app/Http/Controllers/admin/PesananBuketController.php
View File

@ -3,12 +3,89 @@
namespace App\Http\Controllers\Admin;
use App\Http\Controllers\Controller;
use App\Models\TransaksiBuket;
use Illuminate\Http\Request;
class PesananBuketController extends Controller
{
public function index()
{
return view('admin.pesanan-buket');
$pesanan = TransaksiBuket::with(['pelanggan'])
->where('status_transaksi', 'menunggu_verifikasi')
->latest()
->get();
return view('admin.pesanan.buket', compact('pesanan'));
}
public function updateStatus(Request $request, $id)
{
try {
// 1. Ambil data dengan relasi
$pesanan = \App\Models\TransaksiBuket::with(['pelanggan', 'buket'])->findOrFail($id);
// 2. Tentukan status & session flash sekaligus agar tidak dobel
if ($request->jenis === 'terima') {
$status = 'diterima';
session()->flash('success', "Pesanan #{$pesanan->no_invoice} telah diterima!"); // Alert Hijau
} else {
$status = 'ditolak';
session()->flash('error', "Pesanan #{$pesanan->no_invoice} telah ditolak!"); // Alert Merah
}
// 3. Update database
$pesanan->update(['status_transaksi' => $status]);
// 4. Siapkan Data untuk Pesan WA
$nama = $pesanan->pelanggan->nama; // Pastikan kolomnya 'nama', bukan 'nama_lengkap'
$produk = $pesanan->buket->nama;
$tgl_obj = \Carbon\Carbon::parse($pesanan->tgl_ambil)->locale('id');
$tanggal = $tgl_obj->translatedFormat('l, d F Y');
$waktu = $tgl_obj->format('H:i');
$total = number_format($pesanan->total_bayar, 0, ',', '.');
$req = $pesanan->request ?? '-';
$ucapan = $pesanan->ucapan ?? '-';
$invoice = $pesanan->no_invoice;
// 5. Susun Pesan berdasarkan kondisi
if ($status === 'diterima') {
$msg = "Halo Kak *{$nama}*,\n\n" .
"Pesanan Anda dengan Nomor Invoice: *#{$invoice}* telah kami *TERIMA* dan masuk dalam daftar proses pengerjaan.\n\n" .
"*Rincian Pesanan:*\n" .
"- *Produk:* {$produk}\n" .
"- *Total Bayar:* Rp {$total}\n" .
"- *Request:* {$req}\n" .
"- *Ucapan:* \"{$ucapan}\"\n" .
"- *Waktu Pengambilan:* {$tanggal} pukul {$waktu} WIB\n\n" .
"Mohon simpan rincian ini dan ditunggu info selanjutnya ya Kak. Terima kasih! ✨";
} else {
$msg = "Halo Kak *{$nama}*,\n\n" .
"Mengenai pesanan Anda dengan Nomor Invoice: *#{$invoice}* terpaksa kami *TOLAK* dikarenakan:\n\n" .
"*[TULIS ALASAN DI SINI]*\n\n" .
"*Rincian Pesanan:*\n" .
"- *Produk:* {$produk}\n" .
"- *Total Bayar:* Rp {$total}\n" .
"- *Waktu Pengambilan:* {$tanggal}\n\n" .
"Admin kami akan segera menghubungi Kakak terkait proses pengembalian dana. Mohon maaf atas ketidaknyamanannya.";
}
// 6. Format Nomor WhatsApp
$no_wa = preg_replace('/[^0-9]/', '', $pesanan->pelanggan->no_wa); // Pastikan kolomnya 'no_wa'
if (str_starts_with($no_wa, '0')) {
$no_wa = '62' . substr($no_wa, 1);
} elseif (str_starts_with($no_wa, '8')) {
$no_wa = '62' . $no_wa;
}
// 7. Kembalikan Response JSON
return response()->json([
'success' => true,
'wa_url' => "https://wa.me/{$no_wa}?text=" . urlencode($msg)
]);
} catch (\Exception $e) {
return response()->json(['success' => false, 'message' => $e->getMessage()], 500);
}
}
}

95
app/Http/Controllers/admin/PesananFotoController.php
View File

@ -3,12 +3,105 @@
namespace App\Http\Controllers\Admin;
use App\Http\Controllers\Controller;
use App\Models\BookingFoto;
use Illuminate\Http\Request;
class PesananFotoController extends Controller
{
public function index()
{
return view('admin.pesanan-foto');
$pesanan = BookingFoto::with([
'pelanggan', // Untuk ambil Nama & No HP
'paketFoto', // Untuk ambil Nama Paket (misal: Paket Wisuda)
'detailAdditional.additional' // Lanjut ambil Nama Additional (misal: Background, Orang Tambahan)
])
->where('status_booking', 'menunggu_verifikasi')
->latest()
->get();
return view('admin.pesanan.foto', compact('pesanan'));
}
public function updateStatus(Request $request, $id)
{
try {
// 1. Ambil data dengan relasi lengkap (Eager Loading)
$pesanan = \App\Models\BookingFoto::with(['pelanggan', 'paketFoto', 'detailAdditional.additional'])->findOrFail($id);
// 2. Tentukan status & session flash
if ($request->jenis === 'terima') {
$status = 'diterima';
session()->flash('success', "Booking #{$pesanan->no_invoice} telah diterima!");
} else {
$status = 'ditolak';
session()->flash('error', "Booking #{$pesanan->no_invoice} telah ditolak!");
}
// 3. Update database (Pastikan nama kolom status_booking sesuai migrasimu)
$pesanan->update(['status_booking' => $status]);
// 4. Siapkan Data Dasar
$nama = $pesanan->pelanggan->nama;
$paket = $pesanan->paketFoto->nama;
$tgl_obj = \Carbon\Carbon::parse($pesanan->tgl_booking)->locale('id');
$tanggal = $tgl_obj->translatedFormat('l, d F Y');
// Jam mulai dan selesai
$jam_mulai = \Carbon\Carbon::parse($pesanan->jam_mulai)->format('H:i');
$jam_selesai = \Carbon\Carbon::parse($pesanan->jam_selesai)->format('H:i');
$total = number_format($pesanan->total_bayar, 0, ',', '.');
$invoice = $pesanan->no_invoice;
// 5. Olah Data Additional untuk list di WA
$list_additional = "";
if ($pesanan->detailAdditional->count() > 0) {
foreach ($pesanan->detailAdditional as $item) {
$list_additional .= "- " . $item->additional->nama . " (x" . $item->qty . ")\n";
}
} else {
$list_additional = "- Tidak ada tambahan\n";
}
// 6. Susun Pesan WA
if ($status === 'diterima') {
$msg = "Halo Kak *{$nama}* ,\n\n" .
"Booking foto Anda dengan Invoice: *#{$invoice}* telah kami *TERIMA*. \n\n" .
"*Rincian Booking:*\n" .
"- *Paket:* {$paket}\n" .
"*Tambahan:*\n{$list_additional}" .
"- *Total Bayar:* Rp {$total}\n\n" .
"*Jadwal Sesi Foto:*\n" .
" Tanggal: {$tanggal}\n" .
" Jam: {$jam_mulai} - {$jam_selesai} WIB\n\n" .
"Mohon datang 15 menit sebelum jadwal dimulai ya Kak. Sampai jumpa di studio! ";
} else {
$msg = "Halo Kak *{$nama}*,\n\n" .
"Mohon maaf, booking foto Anda dengan Invoice *#{$invoice}* terpaksa kami *TOLAK* dikarenakan:\n\n" .
"*[TULIS ALASAN DI SINI]*\n\n" .
"*Rincian Booking:*\n" .
"- *Paket:* {$paket}\n" .
"*Tambahan:*\n{$list_additional}" .
"- *Total Bayar:* Rp {$total}\n" .
"- *Jadwal Sesi:* {$tanggal} ({$jam_mulai} - {$jam_selesai} WIB)\n\n" .
"Admin kami akan segera menghubungi Kakak untuk info pengembalian dana atau penjadwalan ulang. Terima kasih. ";
}
// 7. Format Nomor WhatsApp (Sesuaikan kolom: no_hp / no_wa)
$no_wa = preg_replace('/[^0-9]/', '', $pesanan->pelanggan->no_wa);
if (str_starts_with($no_wa, '0')) {
$no_wa = '62' . substr($no_wa, 1);
} elseif (str_starts_with($no_wa, '8')) {
$no_wa = '62' . $no_wa;
}
return response()->json([
'success' => true,
'wa_url' => "https://wa.me/{$no_wa}?text=" . urlencode($msg)
]);
} catch (\Exception $e) {
return response()->json(['success' => false, 'message' => $e->getMessage()], 500);
}
}
}

67
resources/views/admin/pesanan/buket.blade.php
View File

@ -3,43 +3,72 @@
@section('title', 'Pesanan Buket')
@section('content')
{{-- ALERT SUKSES --}}
@if (session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
{{-- ALERT ERROR UMUM (Jika ada error selain validasi modal) --}}
@if (session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
{{ session('error') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
<section class="section">
<div class="card">
<div class="card-body">
<table class="table table-striped" id="table1">
<thead>
<tr>
<th>No.</th>
<th>No. Invoice</th>
<th>Nama Pelanggan</th>
<th>Nama Buket</th>
<th>Tanggal Ambil</th>
<th>Jam Ambil</th>
<th>Total</th>
<th>Status</th>
<th>Aksi</th>
<th class="text-center">Aksi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Graiden</td>
<td>vehicula.aliquet@semconsequat.co.uk</td>
<td>076 4820 8838</td>
<td>Offenburg</td>
<td>Offenburg</td>
<td>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Active</span>
</td>
<td class="col-auto">
<a href="#" class="btn icon btn-primary btn-action" data-bs-toggle="modal"
data-bs-target="#buket">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@forelse ($pesanan as $p)
<tr>
<td>{{ $p->no_invoice }}</td>
<td>{{ $p->pelanggan->nama }}</td>
<td>{{ $p->buket->nama }}</td>
<td>
{{ \Carbon\Carbon::parse($p->tgl_ambil)->locale('id')->translatedFormat('d F Y') }}
</td>
<td>
{{ \Carbon\Carbon::parse($p->tgl_ambil)->format('H:i') }} WIB
</td>
<td>Rp {{ number_format($p->total_bayar, 0, ',', '.') }}</td>
<td>
<span class="badge {{ $p->status_label->class }}">
{{ $p->status_label->text }}
</span>
</td>
<td class="text-center col-auto"><a href="#" class="btn icon btn-primary btn-action"
data-bs-toggle="modal" data-bs-target="#buket{{ $p->id_transaksi }}">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@include('admin.pesanan.partials.modal-buket')
@empty
<tr>
<td colspan="4" class="text-center text-muted">Belum ada data pesanan buket.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</section>
@include('admin.pesanan.partials.modal-buket')
@endsection

72
resources/views/admin/pesanan/foto.blade.php
View File

@ -3,44 +3,74 @@
@section('title', 'Pesanan Foto')
@section('content')
{{-- ALERT SUKSES --}}
@if (session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
{{-- ALERT ERROR UMUM (Jika ada error selain validasi modal) --}}
@if (session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
{{ session('error') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
<section class="section">
<div class="card">
<div class="card-body">
<table class="table table-striped" id="table1">
<thead>
<tr>
<th>No.</th>
<th>No. Invoice</th>
<th>Nama Pelanggan</th>
<th>Nama Paket Foto</th>
<th>Tanggal Booking </th>
<th>Nama Paket</th>
<th>Tanggal Booking</th>
<th>Waktu</th>
<th>Total</th>
<th>Status</th>
<th>Aksi</th>
<th class="text-center">Aksi</th>
</tr>
</thead>
<tbody>
<tr>
<td>Graiden</td>
<td>vehicula.aliquet@semconsequat.co.uk</td>
<td>076 4820 8838</td>
<td>Offenburg</td>
<td>Offenburg</td>
<td>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Selesai</span>
</td>
<td class="col-auto">
<a href="#" class="btn icon btn-primary btn-action" data-bs-toggle="modal"
data-bs-target="#foto">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@forelse ($pesanan as $p)
<tr>
<td>{{ $p->no_invoice }}</td>
<td>{{ $p->pelanggan->nama }}</td>
<td>{{ $p->paketFoto->nama }}</td>
<td>
{{ \Carbon\Carbon::parse($p->tgl_booking)->locale('id')->translatedFormat('d F Y') }}
</td>
<td>
{{ \Carbon\Carbon::parse($p->jam_mulai)->format('H:i') }} -
{{ \Carbon\Carbon::parse($p->jam_selesai)->format('H:i') }}
</td>
<td>Rp {{ number_format($p->total_bayar, 0, ',', '.') }}</td>
<td>
<span class="badge {{ $p->status_label->class }}">
{{ $p->status_label->text }}
</span>
</td>
<td class="text-center col-auto"><a href="#" class="btn icon btn-primary btn-action"
data-bs-toggle="modal" data-bs-target="#foto{{ $p->id_booking }}">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@include('admin.pesanan.partials.modal-foto')
@empty
<tr>
<td colspan="4" class="text-center text-muted">Belum ada data pesanan foto.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</section>
@include('admin.pesanan.partials.modal-foto')
{{-- @include('admin.pesanan.partials.modal-foto') --}}
@endsection

282
resources/views/admin/pesanan/partials/modal-buket.blade.php
View File

@ -1,5 +1,5 @@
<div class="modal fade text-left" id="buket" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"
aria-hidden="true">
<div class="modal fade text-left" id="buket{{ $p->id_transaksi }}" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
@ -17,17 +17,27 @@
<div class="detail-order">
<div class="detail-row">
<span class="detail-label">Nama Buket</span>
<span class="detail-value">Buket Lily Premium</span>
<span class="detail-value">{{ $p->buket->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Request Khusus</span>
<span class="detail-value">Full pink</span>
@if ($p->request && $p->request != '')
<span class="detail-value">{{ $p->request }}</span>
@else
<span class="detail-value">-</span>
@endif
</div>
<div class="detail-row">
<span class="detail-label">Ucapan</span>
<span class="detail-value">Selamat ulang tahun</span>
<div class="detail-value">
@if ($p->ucapan && $p->ucapan != '')
<span class="detail-value">{{ $p->ucapan }}</span>
@else
<span class="detail-value">-</span>
@endif
</div>
</div>
</div>
@ -35,17 +45,25 @@
<div class="detail-customer">
<div class="detail-row">
<span class="detail-label">Nama Lengkap</span>
<span class="detail-value">Budi Susanto</span>
<span class="detail-value">{{ $p->pelanggan->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">WhatsApp</span>
<span class="detail-value">089673665678</span>
<span class="detail-value">{{ $p->pelanggan->no_wa }}</span>
</div>
<div class="detail-row d-flex align-items-start mb-3">
<span class="detail-label" style="min-width: 150px;">Tanggal Pengambilan</span>
<div class="detail-content">
<div class="detail-value">
{{-- Menambahkan 'l' untuk nama hari --}}
{{ \Carbon\Carbon::parse($p->tgl_ambil)->locale('id')->translatedFormat('l, d F Y') }}
</div>
<div class="detail-value">
<div class="detail-row">
<span class="detail-label">Tanggal Pengambilan</span>
<span class="detail-value">10 Nov 2025</span>
{{ \Carbon\Carbon::parse($p->tgl_ambil)->format('H:i') }} WIB
</div>
</div>
</div>
</div>
</div>
@ -55,19 +73,38 @@
<div class="payment-box">
<div class="detail-row align-items-center">
<span class="detail-label">Status</span>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Terbayar</span>
<span class="detail-label">No. Invoice</span>
<span class="badge bg-success-subtle rounded-pill px-3">{{ $p->no_invoice }}</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Status</span><span
class="badge {{ $p->status_label->class }}">
{{ $p->status_label->text }}
</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Total</span>
<span class="detail-value">Rp 150.000</span>
<span class="detail-value">Rp {{ number_format($p->total_bayar, 0, ',', '.') }}</span>
</div>
<div class="detail-row align-items-start">
<span class="detail-label d-block ">Bukti Pembayaran</span>
<div class="proof-img-wrapper" onclick="showImage('{{ asset('img/invoice.jpg') }}')">
<img src="{{ asset('img/invoice.jpg') }}" class="proof-img">
<div class="proof-img-wrapper">
@if ($p->bukti_bayar)
{{-- Klik hanya pada gambar --}}
<img src="{{ asset($p->bukti_bayar) }}" class="proof-img"
style="cursor: pointer;"
onclick="showImage('{{ asset($p->bukti_bayar) }}')">
@else
{{-- Div pengganti kalau tidak ada foto --}}
<div class="custom-img-box d-flex align-items-center justify-content-center text-muted border rounded"
style="height: 100px; background: #f8f9fa;">
<small>Tidak ada bukti pembayaran</small>
</div>
@endif
</div>
</div>
</div>
@ -76,11 +113,15 @@
</div>
<div class="modal-footer border-top-0 pt-2 px-2">
<div class="d-flex w-100 gap-2">
<button type="button" class="btn btn-danger tolak flex-fill" data-bs-toggle="modal"
data-bs-target="#modalTolak">Tolak
Pesanan</button>
<button type="button" class="btn btn-success terima flex-fill ms-2" data-bs-toggle="modal"
data-bs-target="#modalTerima">Terima Pesanan</button>
<button type="button" class="btn btn-danger flex-fill tolak"
onclick="prosesTanpaDialog(this, 'tolak', '{{ $p->id_transaksi }}')">
Tolak Pesanan
</button>
<button type="button" class="btn btn-success flex-fill terima"
onclick="prosesTanpaDialog(this, 'terima', '{{ $p->id_transaksi }}')">
Terima Pesanan
</button>
</div>
</div>
</div>
@ -92,170 +133,73 @@
<div class="modal fade" id="modalImagePreview" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content bg-transparent border-0 shadow-none">
{{-- Tombol close putih agar terlihat di background gelap --}}
<div class="text-end mb-2">
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body p-0 text-center">
<img id="img-preview-target" src="" class="img-fluid rounded shadow-lg"
style="max-height: 85vh;">
style="max-height: 85vh; object-fit: contain;">
</div>
</div>
</div>
</div>
<script>
function showImage(src) {
var modalImg = document.getElementById('img-preview-target');
const modalElement = document.getElementById('modalImagePreview');
const modalImg = document.getElementById('img-preview-target');
// 1. Set sumber gambar
modalImg.src = src;
var myModal = new bootstrap.Modal(document.getElementById('modalImagePreview'));
// 2. Tampilkan modal (Cara Bootstrap 5 yang lebih aman)
const myModal = new bootstrap.Modal(modalElement);
myModal.show();
}
</script>
{{-- MODAL TOLAK --}}
<div class="modal fade" id="modalTolak" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content modal-reject">
<div class="modal-header pb-0">
<h5 class="modal-title">Konfirmasi Penolakan</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body pt-0">
<div class="alert d-flex align-items-center border-0 mb-4 mt-2 p-3 rounded-3"
style="background-color: #f8d7da; color: #842029;" role="alert">
<i class="bi bi-exclamation-circle-fill me-1" style="line-height: 1;"></i>
<div class="lh-sm" style="font-size: 0.75rem;">
Status pesanan akan otomatis berubah menjadi <strong>"Ditolak"</strong>.
</div>
</div>
<label class="form-label fw-bold small text-muted text-uppercase mb-2"> Pesan yang akan dikirim
</label>
<div class="mb-3">
<textarea class="form-control custom-textarea bg-light" id="pesanTolak" rows="5">Halo Kak Budi Susanto,
Mohon maaf, pesanan Foto (Single) Anda pada tanggal 10 Juni 2025 kami *TOLAK* dikarenakan:
[TULIS ALASAN DISINI]
Silakan hubungi admin untuk info pengembalian dana. Terima kasih.</textarea>
<div class="text-start mt-1">
<small class="text-muted" style="font-size: 0.75rem;">
*Pesan dapat diedit sebelum dikirim
</small>
</div>
</div>
</div>
<div class="modal-footer border-top-0 pt-0">
<div class="d-flex w-100 gap-2">
<button type="button" class="btn btn-light batal rounded-pill flex-fill py-2"
data-bs-toggle="modal" data-bs-target="#default">
Batal
</button>
<button type="button" class="btn btn-danger kirim-wa rounded-pill flex-fill py-2"
onclick="kirimWa('tolak')">
<i class="bi bi-whatsapp me-1"></i> Kirim Penolakan
</button>
</div>
</div>
</div>
</div>
</div>
{{-- MODAL TERIMA --}}
<div class="modal fade" id="modalTerima" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content modal-accept">
<div class="modal-header pb-0">
<h5 class="modal-title">Konfirmasi Penerimaan</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body pt-0">
<div class="alert d-flex align-items-center border-0 mb-4 mt-2 p-3 rounded-3"
style="background-color: #d1e7dd; color: #0f5132;" role="alert">
<i class="bi bi-info-circle-fill me-1" style="line-height: 1;"></i>
<div class="lh-sm" style="font-size: 0.75rem;">
Status pesanan akan otomatis berubah menjadi <strong>"Diproses"</strong>.
</div>
</div>
<div class="mb-2">
<label class="form-label fw-bold small text-muted text-uppercase mb-2"> Pesan yang akan dikirim
</label>
<div class="position-relative">
<textarea class="form-control bg-light border-0 shadow-sm p-3 text-secondary" id="pesanTerima" rows="4"
style="resize: none; font-size: 0.85rem; line-height: 1.2; border-radius: 0.5rem;">Halo Kak Budi Susanto,
Selamat! Pesanan Foto (Single) Anda untuk tanggal 10 Juni 2025 telah kami *TERIMA*.
Silakan datang tepat waktu ya. Terima kasih!</textarea>
<div class="position-absolute top-0 start-0 bottom-0 bg-success"
style="width: 4px; border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem;">
</div>
</div>
<div class="text-start mt-1">
<small class="text-muted" style="font-size: 0.75rem;">
*Pesan dapat diedit sebelum dikirim
</small>
</div>
</div>
</div>
<div class="modal-footer border-top-0 pt-0">
<div class="d-flex w-100 gap-2">
<button type="button" class="btn btn-light batal rounded-pill flex-fill py-2"
data-bs-toggle="modal" data-bs-target="#default">
Batal
</button>
<button type="button" class="btn btn-success kirim-wa rounded-pill flex-fill py-2"
onclick="kirimWa('terima')">
<i class="bi bi-whatsapp me-1"></i> Kirim & Terima
</button>
</div>
</div>
</div>
</div>
</div>
<script>
function kirimWa(jenis) {
// 1. Nomor HP Dummy (Nanti diganti variabel database)
var nomorHp = "+6281334394400";
function prosesTanpaDialog(btn, jenis, id) {
// 1. Efek Loading pada tombol yang diklik
const originalText = btn.innerHTML;
btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';
btn.disabled = true;
// 2. Ambil isi pesan dari textarea
var pesan = "";
if (jenis === 'tolak') {
pesan = document.getElementById('pesanTolak').value;
} else {
pesan = document.getElementById('pesanTerima').value;
}
// 3. Encode pesan biar aman di URL (spasi jadi %20, dst)
var url = "https://wa.me/" + nomorHp + "?text=" + encodeURIComponent(pesan);
// 4. Buka WhatsApp di tab baru
window.open(url, '_blank');
// 5. (Opsional) Tutup Modal setelah kirim
// var modalEl = document.getElementById(jenis === 'tolak' ? 'modalTolak' : 'modalTerima');
// var modal = bootstrap.Modal.getInstance(modalEl);
// modal.hide();
// Disini nanti bisa ditambah ajax buat update status di database
alert("Simulasi: Status pesanan berhasil diupdate jadi " + (jenis === 'tolak' ? 'DITOLAK' : 'DITERIMA'));
// 2. Eksekusi Fetch
fetch(`{{ url('/admin/pesanan-buket/update-status') }}/${id}`, {
method: 'PUT',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}',
'Content-Type': 'application/json',
'Accept': 'application/json'
},
body: JSON.stringify({
jenis: jenis
})
})
.then(response => {
if (!response.ok) throw new Error('Gagal menghubungi server');
return response.json();
})
.then(data => {
if (data.success) {
// 3. Langsung buka WhatsApp di tab baru
window.open(data.wa_url, '_blank');
// 4. Reload halaman utama untuk update status di tabel
location.reload();
} else {
alert("Error: " + data.message);
btn.innerHTML = originalText;
btn.disabled = false;
}
})
.catch(error => {
console.error(error);
alert("Terjadi kesalahan sistem. Cek Console.");
btn.innerHTML = originalText;
btn.disabled = false;
});
}
</script>

271
resources/views/admin/pesanan/partials/modal-foto.blade.php
View File

@ -1,4 +1,4 @@
<div class="modal fade text-left" id="foto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"
<div class="modal fade text-left" id="foto{{ $p->id_booking }}" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
@ -17,24 +17,35 @@
<div class="detail-order">
<div class="detail-row">
<span class="detail-label">Tanggal Booking</span>
<span class="detail-value">Kamis 10 Juni 2025</span>
<span class="detail-value">
{{ \Carbon\Carbon::parse($p->tgl_booking)->locale('id')->translatedFormat('d F Y') }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Waktu Booking</span>
<span class="detail-value">10.00</span>
<span class="detail-value"> {{ \Carbon\Carbon::parse($p->jam_mulai)->format('H:i') }} -
{{ \Carbon\Carbon::parse($p->jam_selesai)->format('H:i') }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Paket Foto</span>
<span class="detail-value">Single</span>
<span class="detail-value">{{ $p->paketFoto->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Additional</span>
<div class="detail-value">
<span class="item">Kostum boneka</span><br>
<small class="amount">x1</small>
<div class="detail-items-container d-flex flex-column gap-1">
@forelse($p->detailAdditional as $detail)
<div class="detail-value">
<span class="item" style="color: black;">
{{ $detail->additional->nama }}
</span>
<br>
<small class="amount">x{{ $detail->qty }}</small>
</div>
@empty
<span class="detail-value">-</span>
@endforelse
</div>
</div>
</div>
@ -43,12 +54,12 @@
<div class="detail-customer">
<div class="detail-row">
<span class="detail-label">Nama Lengkap</span>
<span class="detail-value">Budi Susanto</span>
<span class="detail-value">{{ $p->pelanggan->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">WhatsApp</span>
<span class="detail-value">089673665678</span>
<span class="detail-value">{{ $p->pelanggan->no_wa }}</span>
</div>
</div>
</div>
@ -58,19 +69,37 @@
<div class="payment-box">
<div class="detail-row align-items-center">
<span class="detail-label">Status</span>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Terbayar</span>
<span class="detail-label">No. Invoice</span>
<span class="badge bg-success-subtle rounded-pill px-3">{{ $p->no_invoice }}</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Status</span><span
class="badge {{ $p->status_label->class }}">
{{ $p->status_label->text }}
</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Total</span>
<span class="detail-value">Rp 150.000</span>
<span class="detail-value">Rp {{ number_format($p->total_bayar, 0, ',', '.') }}</span>
</div>
<div class="detail-row align-items-start">
<span class="detail-label d-block ">Bukti Pembayaran</span>
<div class="proof-img-wrapper" onclick="showImage('{{ asset('img/invoice.jpg') }}')">
<img src="{{ asset('img/invoice.jpg') }}" class="proof-img">
<div class="proof-img-wrapper">
@if ($p->bukti_bayar)
{{-- Klik hanya pada gambar --}}
<img src="{{ asset($p->bukti_bayar) }}" class="proof-img"
style="cursor: pointer;"
onclick="showImage('{{ asset($p->bukti_bayar) }}')">
@else
{{-- Div pengganti kalau tidak ada foto --}}
<div class="custom-img-box d-flex align-items-center justify-content-center text-muted border rounded"
style="height: 100px; background: #f8f9fa;">
<small>Tidak ada bukti pembayaran</small>
</div>
@endif
</div>
</div>
</div>
@ -79,11 +108,15 @@
</div>
<div class="modal-footer border-top-0 pt-2 px-2">
<div class="d-flex w-100 gap-2">
<button type="button" class="btn btn-danger tolak flex-fill" data-bs-toggle="modal"
data-bs-target="#modalTolak">Tolak
Pesanan</button>
<button type="button" class="btn btn-success terima flex-fill ms-2" data-bs-toggle="modal"
data-bs-target="#modalTerima">Terima Pesanan</button>
<button type="button" class="btn btn-danger flex-fill tolak"
onclick="prosesTanpaDialog(this, 'tolak', '{{ $p->id_booking }}')">
Tolak Pesanan
</button>
<button type="button" class="btn btn-success flex-fill terima"
onclick="prosesTanpaDialog(this, 'terima', '{{ $p->id_booking }}')">
Terima Pesanan
</button>
</div>
</div>
</div>
@ -95,170 +128,74 @@
<div class="modal fade" id="modalImagePreview" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content bg-transparent border-0 shadow-none">
{{-- Tombol close putih agar terlihat di background gelap --}}
<div class="text-end mb-2">
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body p-0 text-center">
<img id="img-preview-target" src="" class="img-fluid rounded shadow-lg"
style="max-height: 85vh;">
style="max-height: 85vh; object-fit: contain;">
</div>
</div>
</div>
</div>
<script>
function showImage(src) {
var modalImg = document.getElementById('img-preview-target');
const modalElement = document.getElementById('modalImagePreview');
const modalImg = document.getElementById('img-preview-target');
// 1. Set sumber gambar
modalImg.src = src;
var myModal = new bootstrap.Modal(document.getElementById('modalImagePreview'));
// 2. Tampilkan modal (Cara Bootstrap 5 yang lebih aman)
const myModal = new bootstrap.Modal(modalElement);
myModal.show();
}
</script>
{{-- MODAL TOLAK --}}
<div class="modal fade" id="modalTolak" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content modal-reject">
<div class="modal-header pb-0">
<h5 class="modal-title">Konfirmasi Penolakan</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body pt-0">
<div class="alert d-flex align-items-center border-0 mb-4 mt-2 p-3 rounded-3"
style="background-color: #f8d7da; color: #842029;" role="alert">
<i class="bi bi-exclamation-circle-fill me-1" style="line-height: 1;"></i>
<div class="lh-sm" style="font-size: 0.75rem;">
Status pesanan akan otomatis berubah menjadi <strong>"Ditolak"</strong>.
</div>
</div>
<label class="form-label fw-bold small text-muted text-uppercase mb-2"> Pesan yang akan dikirim
</label>
<div class="mb-3">
<textarea class="form-control custom-textarea bg-light" id="pesanTolak" rows="5">Halo Kak Budi Susanto,
Mohon maaf, pesanan buket Anda pada tanggal 10 Nov 2025 kami *TOLAK* dikarenakan:
[TULIS ALASAN DISINI]
Silakan hubungi admin untuk info pengembalian dana. Terima kasih.</textarea>
<div class="text-start mt-1">
<small class="text-muted" style="font-size: 0.75rem;">
*Pesan dapat diedit sebelum dikirim
</small>
</div>
</div>
</div>
<div class="modal-footer border-top-0 pt-0">
<div class="d-flex w-100 gap-2">
<button type="button" class="btn btn-light batal rounded-pill flex-fill py-2"
data-bs-toggle="modal" data-bs-target="#default">
Batal
</button>
<button type="button" class="btn btn-danger kirim-wa rounded-pill flex-fill py-2"
onclick="kirimWa('tolak')">
<i class="bi bi-whatsapp me-1"></i> Kirim Penolakan
</button>
</div>
</div>
</div>
</div>
</div>
{{-- MODAL TERIMA --}}
<div class="modal fade" id="modalTerima" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content modal-accept">
<div class="modal-header pb-0">
<h5 class="modal-title">Konfirmasi Penerimaan</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body pt-0">
<div class="alert d-flex align-items-center border-0 mb-4 mt-2 p-3 rounded-3"
style="background-color: #d1e7dd; color: #0f5132;" role="alert">
<i class="bi bi-info-circle-fill me-1" style="line-height: 1;"></i>
<div class="lh-sm" style="font-size: 0.75rem;">
Status pesanan akan otomatis berubah menjadi <strong>"Diproses"</strong>.
</div>
</div>
<div class="mb-2">
<label class="form-label fw-bold small text-muted text-uppercase mb-2"> Pesan yang akan dikirim
</label>
<div class="position-relative">
<textarea class="form-control bg-light border-0 shadow-sm p-3 text-secondary" id="pesanTerima" rows="4"
style="resize: none; font-size: 0.85rem; line-height: 1.2; border-radius: 0.5rem;">Halo Kak Budi Susanto,
Selamat! Pesanan Buket Anda untuk tanggal 10 Nov 2025 telah kami *TERIMA*.
Silakan datang tepat waktu ya. Terima kasih!</textarea>
<div class="position-absolute top-0 start-0 bottom-0 bg-success"
style="width: 4px; border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem;">
</div>
</div>
<div class="text-start mt-1">
<small class="text-muted" style="font-size: 0.75rem;">
*Pesan dapat diedit sebelum dikirim
</small>
</div>
</div>
</div>
<div class="modal-footer border-top-0 pt-0">
<div class="d-flex w-100 gap-2">
<button type="button" class="btn btn-light batal rounded-pill flex-fill py-2"
data-bs-toggle="modal" data-bs-target="#default">
Batal
</button>
<button type="button" class="btn btn-success kirim-wa rounded-pill flex-fill py-2"
onclick="kirimWa('terima')">
<i class="bi bi-whatsapp me-1"></i> Kirim & Terima
</button>
</div>
</div>
</div>
</div>
</div>
<script>
function kirimWa(jenis) {
// 1. Nomor HP Dummy (Nanti diganti variabel database)
var nomorHp = "+6281334394400";
function prosesTanpaDialog(btn, jenis, id) {
// 1. Efek Loading pada tombol yang diklik
const originalText = btn.innerHTML;
btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';
btn.disabled = true;
// 2. Ambil isi pesan dari textarea
var pesan = "";
if (jenis === 'tolak') {
pesan = document.getElementById('pesanTolak').value;
} else {
pesan = document.getElementById('pesanTerima').value;
}
// 3. Encode pesan biar aman di URL (spasi jadi %20, dst)
var url = "https://wa.me/" + nomorHp + "?text=" + encodeURIComponent(pesan);
// 4. Buka WhatsApp di tab baru
window.open(url, '_blank');
// 5. (Opsional) Tutup Modal setelah kirim
// var modalEl = document.getElementById(jenis === 'tolak' ? 'modalTolak' : 'modalTerima');
// var modal = bootstrap.Modal.getInstance(modalEl);
// modal.hide();
// Disini nanti bisa ditambah ajax buat update status di database
alert("Simulasi: Status pesanan berhasil diupdate jadi " + (jenis === 'tolak' ? 'DITOLAK' : 'DITERIMA'));
// 2. Eksekusi Fetch
fetch(`{{ url('/admin/pesanan-foto/update-status') }}/${id}`, {
method: 'PUT',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}',
'Content-Type': 'application/json',
'Accept': 'application/json'
},
body: JSON.stringify({
jenis: jenis
})
})
.then(response => {
if (!response.ok) throw new Error('Gagal menghubungi server');
return response.json();
})
.then(data => {
if (data.success) {
// 3. Langsung buka WhatsApp di tab baru
window.open(data.wa_url, '_blank');
// 4. Reload halaman utama untuk update status di tabel
location.reload();
} else {
alert("Error: " + data.message);
btn.innerHTML = originalText;
btn.disabled = false;
}
})
.catch(error => {
console.error(error);
alert("Terjadi kesalahan sistem. Cek Console.");
btn.innerHTML = originalText;
btn.disabled = false;
});
}
</script>

147
resources/views/admin/pesanan/partials/modal-riwayat-buket.blade.php Normal file
View File

@ -0,0 +1,147 @@
{{-- RIWAYAT BUKET --}}
<div class="modal fade text-left" id="riwayatBuket{{ $rb->id_transaksi }}" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="myModalLabel1">Detail Pesanan Buket</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row gx-3">
<div class="col-12 col-md-6">
<h6 class="modal-section-title">Rincian Pesanan</h6>
<div class="detail-order">
<div class="detail-row">
<span class="detail-label">Nama Buket</span>
<span class="detail-value">{{ $rb->buket->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Request Khusus</span>
@if ($rb->request && $rb->request != '')
<span class="detail-value">{{ $rb->request }}</span>
@else
<span class="detail-value">-</span>
@endif
</div>
<div class="detail-row">
<span class="detail-label">Ucapan</span>
@if ($rb->ucapan && $rb->ucapan != '')
<span class="detail-value">{{ $rb->ucapan }}</span>
@else
<span class="detail-value">-</span>
@endif
</div>
</div>
<h6 class="modal-section-title">Informasi Pemesan</h6>
<div class="detail-customer">
<div class="detail-row">
<span class="detail-label">Nama Lengkap</span>
<span class="detail-value">{{ $rb->pelanggan->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">WhatsApp</span>
<span class="detail-value">{{ $rb->pelanggan->no_wa }}</span>
</div>
<div class="detail-row d-flex align-items-start mb-3">
<span class="detail-label" style="min-width: 150px;">Tanggal Pengambilan</span>
<div class="detail-content">
<div class="detail-value">
{{-- Menambahkan 'l' untuk nama hari --}}
{{ \Carbon\Carbon::parse($rb->tgl_ambil)->locale('id')->translatedFormat('l, d F Y') }}
</div>
<div class="detail-value">
{{ \Carbon\Carbon::parse($rb->tgl_ambil)->format('H:i') }} WIB
</div>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6 mt-4 mt-md-0">
<h6 class="modal-section-title">Pembayaran</h6>
<div class="payment-box">
<div class="detail-row align-items-center">
<span class="detail-label">No. Invoice</span>
<span class="badge bg-success-subtle rounded-pill px-3">{{ $rb->no_invoice }}</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Status</span><span
class="badge {{ $rb->status_label->class }}">
{{ $rb->status_label->text }}
</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Total</span>
<span class="detail-value">Rp {{ number_format($rb->total_bayar, 0, ',', '.') }}</span>
</div>
<div class="detail-row align-items-start">
<span class="detail-label d-block ">Bukti Pembayaran</span>
<div class="proof-img-wrapper">
@if ($rb->bukti_bayar)
{{-- Klik hanya pada gambar --}}
<img src="{{ asset($rb->bukti_bayar) }}" class="proof-img"
style="cursor: pointer;"
onclick="showImage('{{ asset($rb->bukti_bayar) }}')">
@else
{{-- Div pengganti kalau tidak ada foto --}}
<div class="custom-img-box d-flex align-items-center justify-content-center text-muted border rounded"
style="height: 100px; background: #f8f9fa;">
<small>Tidak ada bukti pembayaran</small>
</div>
@endif
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- MODAL GAMBAR --}}
<div class="modal fade" id="modalImagePreview" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content bg-transparent border-0 shadow-none">
{{-- Tombol close putih agar terlihat di background gelap --}}
<div class="text-end mb-2">
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body p-0 text-center">
<img id="img-preview-target" src="" class="img-fluid rounded shadow-lg"
style="max-height: 85vh; object-fit: contain;">
</div>
</div>
</div>
</div>
<script>
function showImage(src) {
const modalElement = document.getElementById('modalImagePreview');
const modalImg = document.getElementById('img-preview-target');
// 1. Set sumber gambar
modalImg.src = src;
// 2. Tampilkan modal (Cara Bootstrap 5 yang lebih aman)
const myModal = new bootstrap.Modal(modalElement);
myModal.show();
}
</script>

146
resources/views/admin/pesanan/partials/modal-riwayat-foto.blade.php Normal file
View File

@ -0,0 +1,146 @@
{{-- RIWAYAT FOTO --}}
<div class="modal fade text-left" id="riwayatFoto{{ $rf->id_booking }}" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="myModalLabel1">Detail Pesanan Foto</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row gx-3">
<div class="col-12 col-md-6">
<h6 class="modal-section-title">Rincian Pesanan</h6>
<div class="detail-order">
<div class="detail-row">
<span class="detail-label">Tanggal Booking</span>
<span class="detail-value">
{{ \Carbon\Carbon::parse($rf->tgl_booking)->locale('id')->translatedFormat('d F Y') }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Waktu Booking</span>
<span class="detail-value"> {{ \Carbon\Carbon::parse($rf->jam_mulai)->format('H:i') }}
-
{{ \Carbon\Carbon::parse($rf->jam_selesai)->format('H:i') }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Paket Foto</span>
<span class="detail-value">{{ $rf->paketFoto->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">Additional</span>
<div class="detail-items-container d-flex flex-column gap-1">
@forelse($rf->detailAdditional as $detail)
<div class="detail-value">
<span class="item" style="color: black;">
{{ $detail->additional->nama }}
</span>
<br>
<small class="amount">x{{ $detail->qty }}</small>
</div>
@empty
<span class="detail-value">-</span>
@endforelse
</div>
</div>
</div>
<h6 class="modal-section-title">Informasi Pemesan</h6>
<div class="detail-customer">
<div class="detail-row">
<span class="detail-label">Nama Lengkap</span>
<span class="detail-value">{{ $rf->pelanggan->nama }}</span>
</div>
<div class="detail-row">
<span class="detail-label">WhatsApp</span>
<span class="detail-value">{{ $rf->pelanggan->no_wa }}</span>
</div>
</div>
</div>
<div class="col-12 col-md-6 mt-4 mt-md-0">
<h6 class="modal-section-title">Pembayaran</h6>
<div class="payment-box">
<div class="detail-row align-items-center">
<span class="detail-label">No. Invoice</span>
<span class="badge bg-success-subtle rounded-pill px-3">{{ $rf->no_invoice }}</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Status</span><span
class="badge {{ $rf->status_label->class }}">
{{ $rf->status_label->text }}
</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Total</span>
<span class="detail-value">Rp
{{ number_format($rf->total_bayar, 0, ',', '.') }}</span>
</div>
<div class="detail-row align-items-start">
<span class="detail-label d-block ">Bukti Pembayaran</span>
<div class="proof-img-wrapper">
@if ($rf->bukti_bayar)
{{-- Klik hanya pada gambar --}}
<img src="{{ asset($rf->bukti_bayar) }}" class="proof-img"
style="cursor: pointer;"
onclick="showImage('{{ asset($rf->bukti_bayar) }}')">
@else
{{-- Div pengganti kalau tidak ada foto --}}
<div class="custom-img-box d-flex align-items-center justify-content-center text-muted border rounded"
style="height: 100px; background: #f8f9fa;">
<small>Tidak ada bukti pembayaran</small>
</div>
@endif
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- MODAL GAMBAR --}}
<div class="modal fade" id="modalImagePreview" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content bg-transparent border-0 shadow-none">
{{-- Tombol close putih agar terlihat di background gelap --}}
<div class="text-end mb-2">
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body p-0 text-center">
<img id="img-preview-target" src="" class="img-fluid rounded shadow-lg"
style="max-height: 85vh; object-fit: contain;">
</div>
</div>
</div>
</div>
<script>
function showImage(src) {
const modalElement = document.getElementById('modalImagePreview');
const modalImg = document.getElementById('img-preview-target');
// 1. Set sumber gambar
modalImg.src = src;
// 2. Tampilkan modal (Cara Bootstrap 5 yang lebih aman)
const myModal = new bootstrap.Modal(modalElement);
myModal.show();
}
</script>

194
resources/views/admin/pesanan/partials/modal-riwayat.blade.php
View File

@ -1,194 +0,0 @@
{{-- RIWAYAT BUKET --}}
<div class="modal fade text-left" id="riwayatBuket" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="myModalLabel1">Detail Riwayat Pesanan Buket</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row gx-3">
<div class="col-12 col-md-6">
<h6 class="modal-section-title">Rincian Pesanan</h6>
<div class="detail-order">
<div class="detail-row">
<span class="detail-label">Nama Buket</span>
<span class="detail-value">Buket Lily Premium</span>
</div>
<div class="detail-row">
<span class="detail-label">Request Khusus</span>
<span class="detail-value">Full pink</span>
</div>
<div class="detail-row">
<span class="detail-label">Ucapan</span>
<span class="detail-value">Selamat ulang tahun</span>
</div>
</div>
<h6 class="modal-section-title">Informasi Pemesan</h6>
<div class="detail-customer">
<div class="detail-row">
<span class="detail-label">Nama Lengkap</span>
<span class="detail-value">Budi Susanto</span>
</div>
<div class="detail-row">
<span class="detail-label">WhatsApp</span>
<span class="detail-value">089673665678</span>
</div>
<div class="detail-row">
<span class="detail-label">Tanggal Pengambilan</span>
<span class="detail-value">10 Nov 2025</span>
</div>
</div>
</div>
<div class="col-12 col-md-6 mt-4 mt-md-0">
<h6 class="modal-section-title">Pembayaran</h6>
<div class="payment-box">
<div class="detail-row align-items-center">
<span class="detail-label">Status</span>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Terbayar</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Total</span>
<span class="detail-value">Rp 150.000</span>
</div>
<div class="detail-row align-items-start">
<span class="detail-label d-block ">Bukti Pembayaran</span>
<div class="proof-img-wrapper" onclick="showImage('{{ asset('img/invoice.jpg') }}')">
<img src="{{ asset('img/invoice.jpg') }}" class="proof-img">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- RIWAYAT FOTO --}}
<div class="modal fade text-left" id="riwayatFoto" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="myModalLabel1">Detail Riwayat Pesanan Foto</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="row gx-3">
<div class="col-12 col-md-6 h-100">
<h6 class="modal-section-title">Rincian Pesanan</h6>
<div class="detail-order ">
<div class="detail-row">
<span class="detail-label">Tanggal Booking</span>
<span class="detail-value">Kamis 10 Juni 2025</span>
</div>
<div class="detail-row">
<span class="detail-label">Waktu Booking</span>
<span class="detail-value">10.00</span>
</div>
<div class="detail-row">
<span class="detail-label">Paket Foto</span>
<span class="detail-value">Single</span>
</div>
<div class="detail-row">
<span class="detail-label">Additional</span>
<div class="detail-value">
<span class="item">Kostum boneka</span><br>
<small class="amount">x1</small>
</div>
</div>
</div>
<h6 class="modal-section-title">Informasi Pemesan</h6>
<div class="detail-customer">
<div class="detail-row">
<span class="detail-label">Nama Lengkap</span>
<span class="detail-value">Budi Susanto</span>
</div>
<div class="detail-row">
<span class="detail-label">WhatsApp</span>
<span class="detail-value">089673665678</span>
</div>
</div>
</div>
<div class="col-12 col-md-6 mt-4 mt-md-0 h-100 d-flex flex-column">
<h6 class="modal-section-title">Pembayaran</h6>
<div class="payment-box flex-grow-1 d-flex flex-column justify-content-between">
<div>
<div class="detail-row align-items-center">
<span class="detail-label">Status</span>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Terbayar</span>
</div>
<div class="detail-row align-items-center">
<span class="detail-label">Total</span>
<span class="detail-value">Rp 150.000</span>
</div>
</div>
<div class="detail-row align-items-start mt-3">
<span class="detail-label d-block">Bukti Pembayaran</span>
<div class="proof-img-wrapper" onclick="showImage('{{ asset('img/invoice.jpg') }}')">
<img src="{{ asset('img/invoice.jpg') }}" class="proof-img">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{{-- MODAL GAMBAR --}}
<div class="modal fade" id="modalImagePreview" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content bg-transparent border-0 shadow-none">
<div class="modal-body p-0 text-center">
<img id="img-preview-target" src="" class="img-fluid rounded shadow-lg"
style="max-height: 85vh;">
</div>
</div>
</div>
</div>
<script>
function showImage(src) {
var modalImg = document.getElementById('img-preview-target');
modalImg.src = src;
var myModal = new bootstrap.Modal(document.getElementById('modalImagePreview'));
myModal.show();
}
</script>

90
resources/views/admin/pesanan/riwayat.blade.php
View File

@ -25,7 +25,7 @@
<table class="table table-striped" id="riwayat-buket">
<thead>
<tr>
<th>No.</th>
<th>No. Invoice</th>
<th>Nama Pelanggan</th>
<th>Nama Buket</th>
<th>Tanggal Ambil</th>
@ -35,22 +35,33 @@
</tr>
</thead>
<tbody>
<tr>
<td>Graiden</td>
<td>vehicula.aliquet@semconsequat.co.uk</td>
<td>076 4820 8838</td>
<td>Offenburg</td>
<td>Offenburg</td>
<td>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Selesai</span>
</td>
<td class="col-auto">
<a href="#" class="btn icon btn-primary btn-action" data-bs-toggle="modal"
data-bs-target="#riwayatBuket">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@forelse ($riwayatBuket as $rb)
<tr>
<td>{{ $rb->no_invoice }}</td>
<td>{{ $rb->pelanggan->nama }}</td>
<td>{{ $rb->buket->nama }}</td>
<td>{{ \Carbon\Carbon::parse($rb->tgl_ambil)->translatedFormat('d M Y') }}</td>
<td>Rp {{ number_format($rb->total_bayar, 0, ',', '.') }}</td>
<td>
<span class="badge {{ $rb->status_label->class }}">
{{ $rb->status_label->text }}
</span>
</td>
<td class="col-auto">
<a href="#" class="btn icon btn-primary btn-action" data-bs-toggle="modal"
data-bs-target="#riwayatBuket{{ $rb->id_transaksi }}">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@include('admin.pesanan.partials.modal-riwayat-buket')
@empty
<tr>
<td colspan="4" class="text-center text-muted">Belum ada data riwayat pesanan
buket.
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
@ -59,7 +70,7 @@
<table class="table table-striped" id="riwayat-foto">
<thead>
<tr>
<th>No.</th>
<th>No. Invoice</th>
<th>Nama Pelanggan</th>
<th>Nama Paket</th>
<th>Tanggal Booking</th>
@ -69,22 +80,32 @@
</tr>
</thead>
<tbody>
<tr>
<td>Graiden</td>
<td>vehicula.aliquet@semconsequat.co.uk</td>
<td>076 4820 8838</td>
<td>Offenburg</td>
<td>Offenburg</td>
<td>
<span class="badge bg-success-subtle rounded-pill px-3 py-2">Selesai</span>
</td>
<td class="col-auto">
<a href="#" class="btn icon btn-primary btn-action" data-bs-toggle="modal"
data-bs-target="#riwayatFoto">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@forelse ($riwayatFoto as $rf)
<tr>
<td>{{ $rf->no_invoice }}</td>
<td>{{ $rf->pelanggan->nama }}</td>
<td>{{ $rf->paketFoto->nama }}</td>
<td>{{ \Carbon\Carbon::parse($rf->tgl_booking)->translatedFormat('d M Y') }}</td>
<td>Rp {{ number_format($rf->total_bayar, 0, ',', '.') }}</td>
<td>
<span class="badge {{ $rf->status_label->class }}">
{{ $rf->status_label->text }}
</span>
</td>
<td class="col-auto">
<a href="#" class="btn icon btn-primary btn-action" data-bs-toggle="modal"
data-bs-target="#riwayatFoto{{ $rf->id_booking }}">
<i class="bi bi-eye"></i>
</a>
</td>
</tr>
@include('admin.pesanan.partials.modal-riwayat-foto')
@empty
<tr>
<td colspan="4" class="text-center text-muted">Belum ada data riwayat pesanan
foto.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
@ -94,6 +115,5 @@
</div>
</section>
@include('admin.pesanan.partials.modal-riwayat')
@endsection