fix: fitur print

This commit is contained in:
Yoga Pangestu 2024-12-21 16:57:56 +07:00
parent 48f3a53343
commit 65a02c7c6c
5 changed files with 214 additions and 143 deletions

View File

@ -135,4 +135,11 @@ public function getPrice(string $serviceId): JsonResponse
'data' => formatToRupiah($service->price), 'data' => formatToRupiah($service->price),
], 200); ], 200);
} }
public function print(Transaction $transaction): View
{
return view('pages.admin.manage.transaction.print', [
'transaction' => $transaction->load(['user', 'user.biography', 'customer', 'service', 'barbershop']),
]);
}
} }

View File

@ -74,9 +74,9 @@
<td> <td>
<ul class="action"> <ul class="action">
<li class="show"> <li class="show">
<a href="{{ route('print.page') }}" data-bs-toggle="tooltip" <a href="{{ route('manage.transaction.print', encryptId($transaction->id)) }}"
data-bs-placement="left" data-bs-title="Print" data-bs-toggle="tooltip" data-bs-placement="left"
target="_blank"> data-bs-title="Print" target="_blank">
<i data-feather="printer"></i> <i data-feather="printer"></i>
</a> </a>
</li> </li>

View File

@ -0,0 +1,203 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Invoice</title>
<style>
@page {
size: 58mm auto;
margin: 0;
}
@media print {
* {
print-color-adjust: exact;
-webkit-print-color-adjust: exact;
}
}
body {
margin: 0;
padding: 2mm;
width: 54mm;
font-family: Arial, sans-serif;
font-size: 9px;
line-height: 1.3;
}
.invoice-header {
text-align: left;
margin-bottom: 8px;
}
.invoice-header h1 {
font-size: 12px;
margin: 0;
padding: 3px 0;
font-weight: bold;
}
.invoice-header p {
margin: 1px 0;
}
.invoice-details table {
width: 100%;
border-collapse: collapse;
margin: 8px 0;
}
.invoice-details th,
.invoice-details td {
text-align: left;
padding: 2px 0;
}
.invoice-items {
margin: 8px 0;
}
.invoice-items table {
width: 100%;
border-collapse: collapse;
}
.invoice-items th,
.invoice-items td {
padding: 3px 0;
font-size: 9px;
}
.invoice-items td:first-child {
width: 60%;
word-wrap: break-word;
word-break: break-all;
display: inline-block;
}
.invoice-items td:last-child {
width: 40%;
text-align: left;
vertical-align: top;
}
.total-row {
font-weight: bold;
border-top: 1px dashed #000;
margin-top: 5px;
padding-top: 5px;
}
.divider {
border-top: 1px dashed #000;
margin: 8px 0;
}
.payment-method {
font-weight: bold;
margin: 5px 0;
font-size: 9px;
text-align: left;
}
.thank-you {
margin-top: 8px;
font-style: italic;
font-size: 9px;
text-align: left;
}
.invoice-items table {
width: 100%;
table-layout: fixed;
border-collapse: collapse;
}
.invoice-items th,
.invoice-items td {
padding: 3px 0;
font-size: 9px;
overflow: hidden;
}
.invoice-items th:first-child,
.invoice-items td:first-child {
width: 29mm;
word-wrap: break-word;
word-break: break-all;
}
.invoice-items th:last-child,
.invoice-items td:last-child {
width: 29mm;
text-align: left;
vertical-align: top;
}
.invoice-items .empty-cell {
width: 29mm;
}
</style>
</head>
<body>
<div class="invoice-header">
<h1>Master cut Barbershop</h1>
<p>Jl.pabuaran-sadang</p>
<p>082200000000</p>
</div>
<div class="divider"></div>
<div class="invoice-details">
<table>
<tr>
<th style="width: 30%">Tanggal:</th>
<td>{{ date('Y-m-d H:i') }}</td>
</tr>
<tr>
<th>Invoice:</th>
<td>#INV{{ $transaction->id }}</td>
</tr>
<tr>
<th>Pelanggan:</th>
<td>{{ $transaction->customer->name ?? '-' }}</td>
</tr>
</table>
</div>
<div class="divider"></div>
<div class="invoice-items">
<table>
<tr>
<th style="text-align: left">Layanan</th>
<th style="text-align: left">Harga</th>
</tr>
<tr>
<td>{{ $transaction->service->name }}</td>
<td>{{ formatToRupiah($transaction->price) }}</td>
</tr>
@if ($transaction->discount > 0)
<tr>
<td class="empty-cell"></td>
<td>-{{ formatToRupiah($transaction->discount) }}</td>
</tr>
@endif
<tr class="total-row">
<td class="empty-cell"></td>
<td>{{ formatToRupiah($transaction->total) }}</td>
</tr>
</table>
</div>
<div class="divider"></div>
<div class="invoice-footer">
<p class="payment-method">Metode Pembayaran:
{{ $transaction->payment_method == '1' ? 'Cash' : ($transaction->payment_method == '2' ? 'Qris' : 'Other') }}
</p>
<p class="thank-you">Terima kasih atas kunjungan Anda!</p>
</div>
<script>
window.print();
</script>
</body>
</html>

View File

@ -1,134 +0,0 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Invoice</title>
<style>
@page {
size: 80mm auto;
/* Sesuaikan dengan lebar printer thermal */
margin: 0;
}
body {
margin: 0;
padding: 0;
width: 80mm;
font-family: Arial, sans-serif;
font-size: 12px;
line-height: 1.5;
}
.invoice-header {
text-align: center;
margin-bottom: 10px;
}
.invoice-header h1 {
font-size: 16px;
margin: 0;
}
.invoice-header p {
font-size: 12px;
margin: 0;
}
.invoice-details,
.invoice-footer {
margin: 10px 0;
}
.invoice-details table {
width: 100%;
border-collapse: collapse;
}
.invoice-details th,
.invoice-details td {
text-align: left;
padding: 5px;
}
.invoice-details th {
font-weight: bold;
}
.invoice-footer {
text-align: center;
font-size: 12px;
}
.divider {
border-top: 1px dashed #000;
margin: 10px 0;
}
</style>
</head>
<body>
<div class="invoice-header">
<h1>Barbershop Name</h1>
<p>Alamat Barbershop</p>
<p>Telepon: 123-456-789</p>
</div>
<div class="divider"></div>
<div class="invoice-details">
<table>
<tr>
<th>Tanggal:</th>
<td>{{ date('Y-m-d H:i') }}</td>
</tr>
<tr>
<th>Invoice:</th>
<td>#{{ $transaction->id }}</td>
</tr>
<tr>
<th>Pelanggan:</th>
<td>{{ $transaction->customer->name }}</td>
</tr>
</table>
</div>
<div class="divider"></div>
<div class="invoice-items">
<table>
<tr>
<th>Layanan</th>
<th>Harga</th>
</tr>
<tr>
<td>{{ $transaction->service->name }}</td>
<td>{{ number_format($transaction->price, 2) }}</td>
</tr>
<tr>
<td>Diskon</td>
<td>{{ number_format($transaction->discount, 2) }}</td>
</tr>
<tr>
<td>Total</td>
<td>{{ number_format($transaction->total, 2) }}</td>
</tr>
</table>
</div>
<div class="divider"></div>
<div class="invoice-footer">
<p>Metode Pembayaran:
{{ $transaction->payment_method == '1' ? 'Cash' : ($transaction->payment_method == '2' ? 'Qris' : 'Other') }}
</p>
<p>Terima kasih atas kunjungan Anda!</p>
</div>
<script>
window.print();
</script>
</body>
</html>

View File

@ -146,6 +146,7 @@
Route::get('edit/{transaction}', [TransactionController::class, 'edit'])->name('manage.transaction.edit'); Route::get('edit/{transaction}', [TransactionController::class, 'edit'])->name('manage.transaction.edit');
Route::put('update/{transaction}', [TransactionController::class, 'update'])->name('manage.transaction.update'); Route::put('update/{transaction}', [TransactionController::class, 'update'])->name('manage.transaction.update');
Route::get('get-price/{serviceId}', [TransactionController::class, 'getPrice'])->name('manage.transaction.getPrice'); Route::get('get-price/{serviceId}', [TransactionController::class, 'getPrice'])->name('manage.transaction.getPrice');
Route::get('print/{transaction}', [TransactionController::class, 'print'])->name('manage.transaction.print');
}); });
Route::delete('delete/{transaction}', [TransactionController::class, 'delete'])->name('manage.transaction.delete')->middleware('check_role:1'); Route::delete('delete/{transaction}', [TransactionController::class, 'delete'])->name('manage.transaction.delete')->middleware('check_role:1');
}); });
@ -177,9 +178,3 @@
}); });
Route::get('/', [HomepageController::class, 'index'])->name('homepage'); Route::get('/', [HomepageController::class, 'index'])->name('homepage');
Route::get('/print-page', function () {
return view('print-page', [
'transaction' => Transaction::first(),
]); // Ganti dengan nama view halaman cetak Anda
})->name('print.page');