feat(memo): Perbaiki tampilan preview memo dengan logo resmi dan format A4
Memperbaiki tampilan preview memo penyelesaian agar sesuai dengan standar dokumen resmi bank. Perubahan yang dilakukan: - Mengganti logo placeholder AGI dengan logo resmi Bank Artha Graha Internasional. - Mengubah layout dari card-based menjadi full-width format A4 untuk preview, print, dan PDF. - Menambahkan header controls dengan class `no-print` agar tersembunyi saat dicetak atau di-generate PDF. - Memperbaiki struktur header bank dengan logo dan nama perusahaan yang proper. - Menyesuaikan judul memo menjadi lebih compact dan professional. - Memperbaiki struktur tabel informasi memo dengan penggunaan inline styling untuk konsistensi PDF. - Menambahkan helper `dateFormat()` untuk penulisan tanggal yang lebih rapi. - Memperbaiki posisi tanda tangan agar lebih proporsional dan sesuai format resmi. - Menambahkan class `page-memo` untuk styling halaman memo secara khusus. - Menyempurnakan responsive design dengan flex layout yang lebih baik. - Menambahkan path logo: `assets/media/images/logo-arthagraha.png` untuk keperluan cetak dan PDF. - Memperbaiki typography dan spacing agar sesuai dengan standar dokumen resmi. - Menambahkan kontrol print-friendly menggunakan class `no-print`. Tujuan perubahan: - Menjamin tampilan memo penyelesaian sesuai standar corporate identity bank. - Memastikan output PDF dan print preview konsisten dengan dokumen resmi. - Meningkatkan profesionalitas tampilan dan mempermudah proses administrasi.
This commit is contained in:
Daeng Deni Mardaeni
@@ -5,215 +5,245 @@
|
||||
@endsection
|
||||
|
||||
@section('content')
|
||||
<div class="grid gap-5 mx-auto w-full lg:gap-7.5">
|
||||
<div class="w-full">
|
||||
<!-- Preview Memo Penyelesaian -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<h3 class="card-title">
|
||||
Preview Memo Penyelesaian
|
||||
</h3>
|
||||
<div class="flex gap-2 items-center">
|
||||
<button onclick="history.back()" class="btn btn-sm btn-light">
|
||||
<i class="ki-filled ki-black-left"></i>
|
||||
Kembali
|
||||
</button>
|
||||
<div class="bg-white">
|
||||
<!-- Header Controls - Hidden saat print -->
|
||||
<div class="p-4 border-b bg-agi-50 no-print">
|
||||
<div class="flex justify-between items-center mx-auto">
|
||||
<h3 class="text-lg font-semibold text-gray-800">
|
||||
Preview Memo Penyelesaian
|
||||
</h3>
|
||||
<div class="flex gap-2">
|
||||
<button onclick="history.back()" class="btn btn-sm btn-light">
|
||||
<i class="ki-filled ki-black-left"></i>
|
||||
Kembali Edit
|
||||
</button>
|
||||
<button type="button" onclick="window.print()" class="btn btn-sm btn-secondary">
|
||||
<i class="ki-filled ki-printer"></i>
|
||||
Print Preview
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card-body">
|
||||
@if (session('error'))
|
||||
<div class="alert alert-danger">
|
||||
{{ session('error') }}
|
||||
@if (session('error'))
|
||||
<div class="m-4 no-print alert alert-danger">
|
||||
{{ session('error') }}
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- Halaman 1: Memo Utama -->
|
||||
<div class="p-5 w-full bg-white page-memo">
|
||||
<!-- Header Bank -->
|
||||
<div class="flex items-center mb-3">
|
||||
<img class="default-logo min-h-[22px] max-w-none" style="height: 53.55px;"
|
||||
src="assets/media/images/logo-arthagraha.png" />
|
||||
</div>
|
||||
|
||||
<!-- Judul Memo -->
|
||||
<div class="mb-8 text-left">
|
||||
<h4 class="text-base font-semibold" style="margin: 0;"><strong>Memo Instruksi Penyelesaian</strong>
|
||||
Rekening Escrow / <strong>KSL Penilai Jaminan</strong></h4>
|
||||
</div>
|
||||
|
||||
<!-- Informasi Memo -->
|
||||
<div class="mb-8">
|
||||
<table style="width: 100%; border-collapse: collapse;">
|
||||
<tr>
|
||||
<td style="width: 80px; padding: 2px 0; vertical-align: top;">Kepada</td>
|
||||
<td style="width: 10px; padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">SUBDIT E-Channel Support & Operation (NOC)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Dari</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">SUBDIT Appraisal</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Nomor</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;"><strong>{{ $memoData['memo_number'] }}</strong>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Tanggal</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">
|
||||
{{ dateFormat($memoData['memo_date']) }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Perihal</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Penyelesaian Rekening Escrow / <strong>KSL
|
||||
Penilai Jaminan (PJ)</strong></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<hr style="border: none; border-top: 1px solid #000; margin: 20px 0;">
|
||||
|
||||
<!-- Isi Memo -->
|
||||
<div class="mb-8">
|
||||
<p style="margin-bottom: 16px; text-align: justify;">Sehubungan dengan telah dilakukannya penilaian
|
||||
jaminan dengan keterangan sbb :</p>
|
||||
|
||||
<table style="width: 100%; border-collapse: collapse; margin-bottom: 16px;">
|
||||
<tr>
|
||||
<td style="width: 120px; padding: 2px 0; vertical-align: top;">Nama Debitur</td>
|
||||
<td style="width: 10px; padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Terlampir ({{ $memoData['debitur_count'] }}
|
||||
Debitur)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Jaminan</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">{{ $memoData['jaminan_info'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Total Biaya PJ</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;"><strong>Rp
|
||||
{{ number_format($memoData['total_biaya_pj'], 0, ',', '.') }},-</strong></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td style="padding: 2px 0; vertical-align: top; font-size: 11pt;">
|
||||
({{ terbilang($memoData['total_biaya_pj']) }} Rupiah)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Pembayaran Tanggal</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">
|
||||
{{ \Carbon\Carbon::parse($memoData['payment_date'])->format('d F Y') }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">LPJ selesai dikirim</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">-</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="padding: 2px 0; vertical-align: top;">Jenis Penilaian</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;">:</td>
|
||||
<td style="padding: 2px 0; vertical-align: top;"><strong>KJPP</strong></td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<p style="margin-bottom: 16px; text-align: justify;">
|
||||
Kami menginstruksikan kepada Sentra Operasi untuk menyelesaikan Rekening Escrow /
|
||||
<strong>KSL Penilai Jaminan</strong> atas nama debitur tersebut diatas ke <strong>KJPP
|
||||
(terlampir)</strong>.
|
||||
</p>
|
||||
|
||||
<p style="margin-bottom: 16px; text-align: justify;">Demikian kami sampaikan, atas perhatian dan
|
||||
kerjasamanya kami ucapkan terima kasih.</p>
|
||||
</div>
|
||||
|
||||
<!-- Tanda Tangan -->
|
||||
<div style="display: flex; justify-content: space-between; margin-top: 60px;">
|
||||
<div style="text-align: center; width: 30%;">
|
||||
<p style="margin-bottom: 80px;">Salam</p>
|
||||
<div style="border-bottom: 1px solid #000; margin: 0 auto 8px; width: 120px;"></div>
|
||||
<p style="font-weight: 500; margin: 0;">Innawati Sulina</p>
|
||||
<p style="font-size: 11pt; margin: 0;">DD Operation 2</p>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!-- Template Memo -->
|
||||
<div class="p-8 mx-auto bg-white" style="max-width: 800px; font-family: 'Times New Roman', serif;">
|
||||
<!-- Header Bank -->
|
||||
<div class="flex items-center mb-6">
|
||||
<div class="mr-4">
|
||||
<div class="flex justify-center items-center w-16 h-16 bg-blue-600 rounded">
|
||||
<span class="text-lg font-bold text-white">AGI</span>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<h2 class="text-lg font-bold text-blue-600">BANK</h2>
|
||||
<h2 class="text-lg font-bold text-blue-600">ARTHA GRAHA</h2>
|
||||
<h2 class="text-lg font-bold text-blue-600">INTERNASIONAL</h2>
|
||||
</div>
|
||||
<div style="text-align: center; width: 30%;">
|
||||
<p style="margin-bottom: 80px;"> </p>
|
||||
<div style="border-bottom: 1px solid #000; margin: 0 auto 8px; width: 120px;"></div>
|
||||
<p style="font-weight: 500; margin: 0;">Wahab N. Wibawa</p>
|
||||
<p style="font-size: 11pt; margin: 0;">Pgs EO Subdit Appraisal</p>
|
||||
</div>
|
||||
|
||||
<!-- Judul Memo -->
|
||||
<div class="mb-6">
|
||||
<h3 class="text-lg font-bold">Memo Instruksi Penyelesaian</h3>
|
||||
<h4 class="text-base font-semibold">Rekening Escrow / KSL Penilai Jaminan</h4>
|
||||
</div>
|
||||
|
||||
<!-- Informasi Memo -->
|
||||
<div class="mb-6 space-y-2">
|
||||
<div class="flex">
|
||||
<span class="w-20 font-medium">Kepada</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>SUBDIT E-Channel Support & Operation (NOC)</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-20 font-medium">Dari</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>SUBDIT Appraisal</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-20 font-medium">Nomor</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>{{ $memoData['memo_number'] }}</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-20 font-medium">Tanggal</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>{{ \Carbon\Carbon::parse($memoData['memo_date'])->format('d F Y') }}</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-20 font-medium">Perihal</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>Penyelesaian Rekening Escrow / <strong>KSL Penilai Jaminan (PJ)</strong></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<hr class="mb-6 border-black">
|
||||
|
||||
<!-- Isi Memo -->
|
||||
<div class="mb-6 space-y-4">
|
||||
<p>Sehubungan dengan telah dilakukannya penilaian jaminan dengan keterangan sbb :</p>
|
||||
|
||||
<div class="space-y-2">
|
||||
<div class="flex">
|
||||
<span class="w-32 font-medium">Nama Debitur</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>Terlampir ({{ $memoData['debitur_count'] }} Debitur)</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-32 font-medium">Jaminan</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>{{ $memoData['jaminan_info'] }}</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-32 font-medium">Total Biaya PJ</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span><strong>Rp
|
||||
{{ number_format($memoData['total_biaya_pj'], 0, ',', '.') }},-</strong></span>
|
||||
</div>
|
||||
<div class="ml-32">
|
||||
<span class="text-sm">({{ terbilang($memoData['total_biaya_pj']) }} Rupiah)</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-32 font-medium">Pembayaran Tanggal</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>{{ \Carbon\Carbon::parse($memoData['payment_date'])->format('d F Y') }}</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-32 font-medium">LPJ selesai dikirim</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span>-</span>
|
||||
</div>
|
||||
<div class="flex">
|
||||
<span class="w-32 font-medium">Jenis Penilaian</span>
|
||||
<span class="mr-2">:</span>
|
||||
<span><strong>KJPP</strong></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="mt-4">
|
||||
Kami menginstruksikan kepada Sentra Operasi untuk menyelesaikan Rekening Escrow /
|
||||
<strong>KSL Penilai Jaminan</strong> atas nama debitur tersebut diatas ke <strong>KJPP
|
||||
(terlampir)</strong>.
|
||||
</p>
|
||||
|
||||
<p>Demikian kami sampaikan, atas perhatian dan kerjasamanya kami ucapkan terima kasih.</p>
|
||||
</div>
|
||||
|
||||
<!-- Tanda Tangan -->
|
||||
<div class="flex justify-between mt-12">
|
||||
<div class="text-center">
|
||||
<p class="mb-16">Salam</p>
|
||||
<div class="mx-auto mb-2 w-32 border-b border-black"></div>
|
||||
<p class="font-medium">Innawati Sulina</p>
|
||||
<p class="text-sm">DD Operation 2</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="mb-16"> </p>
|
||||
<div class="mx-auto mb-2 w-32 border-b border-black"></div>
|
||||
<p class="font-medium">Wahab N. Wibawa</p>
|
||||
<p class="text-sm">Pgs EO Subdit Appraisal</p>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<p class="mb-16"> </p>
|
||||
<div class="mx-auto mb-2 w-32 border-b border-black"></div>
|
||||
<p class="font-medium">Sumurung P. Siahaan</p>
|
||||
<p class="text-sm"> </p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Lampiran -->
|
||||
<div class="mt-8">
|
||||
<p class="mb-2 font-medium">Lampiran :</p>
|
||||
<ul class="space-y-1 text-sm list-disc list-inside">
|
||||
<li>Rekap permohonan penyelesaian biaya KJPP (Eksternal)</li>
|
||||
<li>Asli Invoice & Faktur Pajak KJPP (Eksternal)</li>
|
||||
<li>Copy Tiket Debet (KSL)</li>
|
||||
</ul>
|
||||
<div style="text-align: center; width: 30%;">
|
||||
<p style="margin-bottom: 80px;"> </p>
|
||||
<div style="border-bottom: 1px solid #000; margin: 0 auto 8px; width: 120px;"></div>
|
||||
<p style="font-weight: 500; margin: 0;">Sumurung P. Siahaan</p>
|
||||
<p style="font-size: 11pt; margin: 0;"> </p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Daftar Permohonan -->
|
||||
<div class="mt-8">
|
||||
<h4 class="mb-4 text-lg font-semibold">Daftar Permohonan Terlampir</h4>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="table table-border">
|
||||
<thead>
|
||||
<tr class="bg-gray-50">
|
||||
<th class="text-center">No</th>
|
||||
<th>Nomor Registrasi</th>
|
||||
<th>Debitur</th>
|
||||
<th>Cabang</th>
|
||||
<th>AO</th>
|
||||
<th>Tujuan Penilaian</th>
|
||||
<th class="text-right">Biaya PJ</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach ($permohonanList as $index => $permohonan)
|
||||
<tr>
|
||||
<td class="text-center">{{ $index + 1 }}</td>
|
||||
<td class="font-medium">{{ $permohonan->nomor_registrasi }}</td>
|
||||
<td>{{ $permohonan->debiture->name ?? '-' }}</td>
|
||||
<td>{{ $permohonan->branch->name ?? '-' }}</td>
|
||||
<td>{{ $permohonan->user->name ?? '-' }}</td>
|
||||
<td>
|
||||
@if ($permohonan->tujuanPenilaian)
|
||||
<span class="badge badge-sm badge-primary">
|
||||
{{ $permohonan->tujuanPenilaian->name }}
|
||||
</span>
|
||||
@else
|
||||
-
|
||||
@endif
|
||||
</td>
|
||||
<td class="font-medium text-right">
|
||||
Rp {{ number_format($permohonan->noc->nominal_bayar ?? 0, 0, ',', '.') }}
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr class="font-semibold bg-gray-50">
|
||||
<td colspan="6" class="text-right">Total Biaya PJ:</td>
|
||||
<td class="text-right">Rp {{ number_format($totalBiayaPJ, 0, ',', '.') }}</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
<!-- Lampiran -->
|
||||
<div style="margin-top: 40px;">
|
||||
<p style="font-weight: 500; margin-bottom: 8px;">Lampiran :</p>
|
||||
<ul style="margin: 0; padding-left: 20px; font-size: 11pt;">
|
||||
<li style="margin-bottom: 4px;">Rekap permohonan penyelesaian biaya KJPP (Eksternal)</li>
|
||||
<li style="margin-bottom: 4px;">Asli Invoice & Faktur Pajak KJPP (Eksternal)</li>
|
||||
<li style="margin-bottom: 4px;">Copy Tiket Debet (KSL)</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Halaman 2: Lampiran Daftar Permohonan -->
|
||||
<div class="p-5 w-full bg-white page-lampiran">
|
||||
<div style="text-align: center; margin-bottom: 30px;">
|
||||
<h3 style="font-weight: bold; margin: 0; font-size: 14pt;">LAMPIRAN</h3>
|
||||
<h4 style="font-weight: bold; margin: 8px 0 0 0; font-size: 13pt;">REKAP PERMOHONAN PENYELESAIAN BIAYA
|
||||
KJPP</h4>
|
||||
<p style="margin: 8px 0 0 0; font-size: 11pt;">Memo No: {{ $memoData['memo_number'] }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Form untuk Generate PDF -->
|
||||
<form action="{{ route('memo.generate-pdf') }}" method="POST" id="generate-form">
|
||||
<div style="overflow-x: auto;">
|
||||
<table style="width: 100%; border-collapse: collapse; font-size: 10pt;">
|
||||
<thead>
|
||||
<tr style="background-color: #f8f9fa;">
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: center; font-weight: bold;">No
|
||||
</th>
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: left; font-weight: bold;">Nomor
|
||||
Registrasi</th>
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: left; font-weight: bold;">
|
||||
Debitur</th>
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: left; font-weight: bold;">
|
||||
Cabang</th>
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: left; font-weight: bold;">AO
|
||||
</th>
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: left; font-weight: bold;">
|
||||
Tujuan Penilaian</th>
|
||||
<th style="border: 1px solid #000; padding: 8px; text-align: right; font-weight: bold;">
|
||||
Biaya PJ</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach ($permohonanList as $index => $permohonan)
|
||||
<tr>
|
||||
<td style="border: 1px solid #000; padding: 6px; text-align: center;">
|
||||
{{ $index + 1 }}</td>
|
||||
<td style="border: 1px solid #000; padding: 6px; font-weight: 500;">
|
||||
{{ $permohonan->nomor_registrasi }}</td>
|
||||
<td style="border: 1px solid #000; padding: 6px;">
|
||||
{{ $permohonan->debiture->name ?? '-' }}</td>
|
||||
<td style="border: 1px solid #000; padding: 6px;">
|
||||
{{ $permohonan->branch->name ?? '-' }}</td>
|
||||
<td style="border: 1px solid #000; padding: 6px;">{{ $permohonan->user->name ?? '-' }}
|
||||
</td>
|
||||
<td style="border: 1px solid #000; padding: 6px;">
|
||||
@if ($permohonan->tujuanPenilaian)
|
||||
{{ $permohonan->tujuanPenilaian->name }}
|
||||
@else
|
||||
-
|
||||
@endif
|
||||
</td>
|
||||
<td style="border: 1px solid #000; padding: 6px; text-align: right; font-weight: 500;">
|
||||
Rp {{ number_format($permohonan->noc->nominal_bayar ?? 0, 0, ',', '.') }}
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
<tfoot>
|
||||
<tr style="background-color: #f8f9fa; font-weight: bold;">
|
||||
<td colspan="6"
|
||||
style="border: 1px solid #000; padding: 8px; text-align: right; font-weight: bold;">
|
||||
Total Biaya PJ:</td>
|
||||
<td style="border: 1px solid #000; padding: 8px; text-align: right; font-weight: bold;">Rp
|
||||
{{ number_format($totalBiayaPJ, 0, ',', '.') }}</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Form untuk Generate PDF - Hidden saat print -->
|
||||
<div class="p-4 bg-gray-50 border-t no-print">
|
||||
<form action="{{ route('memo.generate-pdf') }}" method="POST" id="generate-form" class="mx-auto">
|
||||
@csrf
|
||||
@foreach ($permohonanList as $permohonan)
|
||||
<input type="hidden" name="permohonan_ids[]" value="{{ $permohonan->id }}">
|
||||
@@ -222,15 +252,7 @@
|
||||
<input type="hidden" name="memo_date" value="{{ $memoData['memo_date'] }}">
|
||||
<input type="hidden" name="payment_date" value="{{ $memoData['payment_date'] }}">
|
||||
|
||||
<div class="flex gap-2 justify-end mt-8">
|
||||
<button type="button" onclick="history.back()" class="btn btn-light">
|
||||
<i class="ki-filled ki-black-left"></i>
|
||||
Kembali Edit
|
||||
</button>
|
||||
<button type="button" onclick="window.print()" class="btn btn-secondary">
|
||||
<i class="ki-filled ki-printer"></i>
|
||||
Print Preview
|
||||
</button>
|
||||
<div class="flex gap-2 justify-end">
|
||||
<button type="submit" class="btn btn-primary" id="generate-btn">
|
||||
<i class="ki-filled ki-file-down"></i>
|
||||
Generate PDF & Simpan
|
||||
@@ -270,29 +292,69 @@
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Print styles
|
||||
const printStyles = `
|
||||
<style>
|
||||
@media print {
|
||||
body * {
|
||||
visibility: hidden;
|
||||
}
|
||||
.card-body, .card-body * {
|
||||
visibility: visible;
|
||||
}
|
||||
.card-body {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
}
|
||||
.btn, .card-header, .mt-8:last-child {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
`;
|
||||
document.head.insertAdjacentHTML('beforeend', printStyles);
|
||||
</script>
|
||||
@endpush
|
||||
|
||||
@push('styles')
|
||||
<style>
|
||||
/* Print Styles */
|
||||
@media print {
|
||||
* {
|
||||
-webkit-print-color-adjust: exact !important;
|
||||
color-adjust: exact !important;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
background: white !important;
|
||||
}
|
||||
|
||||
.no-print {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.page-memo,
|
||||
.page-lampiran {
|
||||
width: 210mm !important;
|
||||
min-height: 297mm !important;
|
||||
margin: 0 !important;
|
||||
padding: 20mm !important;
|
||||
page-break-after: always;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
.page-lampiran {
|
||||
page-break-before: always !important;
|
||||
}
|
||||
|
||||
/* Ensure table borders print correctly */
|
||||
table,
|
||||
th,
|
||||
td {
|
||||
border-collapse: collapse !important;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
border: 1px solid #000 !important;
|
||||
}
|
||||
|
||||
/* Ensure background colors print */
|
||||
.bg-gray-50,
|
||||
tr[style*="background-color: #f8f9fa"] {
|
||||
background-color: #f8f9fa !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Screen Styles */
|
||||
@media screen {
|
||||
|
||||
.page-memo,
|
||||
.page-lampiran {
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@endpush
|
||||
|
||||
Reference in New Issue
Block a user