feat: [approval] 재직증명서 미리보기 및 인쇄 기능 추가

- create/edit: 미리보기 버튼 + 모달 (실제 증명서 양식 레이아웃) - show: 증명서 미리보기 버튼 + 모달 (content 데이터 기반) - 인쇄 버튼으로 새 창에서 바로 인쇄 가능
2026-03-05 19:13:54 +09:00
parent 531e9ec0ca
commit 3f6dfd7251
5 changed files with 382 additions and 9 deletions
--- a/resources/views/approvals/create.blade.php
+++ b/resources/views/approvals/create.blade.php
@@ -901,6 +901,109 @@ function getCertPurpose() {
    return sel.value;
 }

+function openCertPreview() {
+    const name = document.getElementById('cert-name').value || '-';
+    const resident = document.getElementById('cert-resident').value || '-';
+    const address = document.getElementById('cert-address').value || '-';
+    const company = document.getElementById('cert-company').value || '-';
+    const businessNum = document.getElementById('cert-business-num').value || '-';
+    const department = document.getElementById('cert-department').value || '-';
+    const position = document.getElementById('cert-position').value || '-';
+    const hireDate = document.getElementById('cert-hire-date').value || '-';
+    const purpose = getCertPurpose() || '-';
+    const issueDate = document.getElementById('cert-issue-date').value || '-';

+    const issueDateFormatted = issueDate !== '-' ? issueDate.replace(/-/g, function(m, i) { return i === 4 ? '년 ' : '월 '; }) + '일' : '-';
+
+    const el = document.getElementById('cert-preview-content');
+    el.innerHTML = buildCertPreviewHtml({ name, resident, address, company, businessNum, department, position, hireDate, purpose, issueDateFormatted });
+
+    document.getElementById('cert-preview-modal').style.display = '';
+    document.body.style.overflow = 'hidden';
+}
+
+function closeCertPreview() {
+    document.getElementById('cert-preview-modal').style.display = 'none';
+    document.body.style.overflow = '';
+}
+
+function printCertPreview() {
+    const content = document.getElementById('cert-preview-content').innerHTML;
+    const win = window.open('', '_blank', 'width=800,height=1000');
+    win.document.write('<html><head><title>재직증명서</title>');
+    win.document.write('<style>body{font-family:"Pretendard","Malgun Gothic",sans-serif;padding:48px 56px;margin:0;} table{border-collapse:collapse;width:100%;} th,td{border:1px solid #333;padding:10px 14px;font-size:14px;} th{background:#f8f9fa;font-weight:600;text-align:left;white-space:nowrap;width:120px;} @media print{body{padding:40px 48px;}}</style>');
+    win.document.write('</head><body>');
+    win.document.write(content);
+    win.document.write('</body></html>');
+    win.document.close();
+    win.onload = function() { win.print(); };
+}
+
+function buildCertPreviewHtml(d) {
+    const e = (s) => { const div = document.createElement('div'); div.textContent = s; return div.innerHTML; };
+    const thStyle = 'border:1px solid #333; padding:10px 14px; background:#f8f9fa; font-weight:600; text-align:left; white-space:nowrap; width:120px; font-size:14px;';
+    const tdStyle = 'border:1px solid #333; padding:10px 14px; font-size:14px;';
+
+    return `
+        <h1 style="text-align:center; font-size:28px; font-weight:700; letter-spacing:12px; margin-bottom:40px;">재 직 증 명 서</h1>
+
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">1. 인적사항</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:20px;">
+            <tr>
+                <th style="${thStyle}">성 명</th>
+                <td style="${tdStyle}">${e(d.name)}</td>
+                <th style="${thStyle}">주민등록번호</th>
+                <td style="${tdStyle}">${e(d.resident)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">주 소</th>
+                <td style="${tdStyle}" colspan="3">${e(d.address)}</td>
+            </tr>
+        </table>
+
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">2. 재직사항</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:20px;">
+            <tr>
+                <th style="${thStyle}">회 사 명</th>
+                <td style="${tdStyle}" colspan="3">${e(d.company)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">사업자번호</th>
+                <td style="${tdStyle}" colspan="3">${e(d.businessNum)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">근무부서</th>
+                <td style="${tdStyle}">${e(d.department)}</td>
+                <th style="${thStyle}">직 급</th>
+                <td style="${tdStyle}">${e(d.position)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">재직기간</th>
+                <td style="${tdStyle}" colspan="3">${e(d.hireDate)}</td>
+            </tr>
+        </table>
+
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">3. 발급정보</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:32px;">
+            <tr>
+                <th style="${thStyle}">사용용도</th>
+                <td style="${tdStyle}" colspan="3">${e(d.purpose)}</td>
+            </tr>
+        </table>
+
+        <p style="text-align:center; font-size:15px; line-height:2; margin:36px 0;">
+            위 사항을 증명합니다.
+        </p>
+
+        <p style="text-align:center; font-size:15px; font-weight:500; margin-bottom:48px;">
+            ${e(d.issueDateFormatted)}
+        </p>
+
+        <div style="text-align:center; margin-top:32px;">
+            <p style="font-size:16px; font-weight:600; margin-bottom:8px;">${e(d.company)}</p>
+            <p style="font-size:14px; color:#555;">대표이사 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; (인)</p>
+        </div>
+    `;
+}
 </script>
@endpush
--- a/resources/views/approvals/edit.blade.php
+++ b/resources/views/approvals/edit.blade.php
@@ -763,5 +763,110 @@ function getCertPurpose() {
    }
    return sel.value;
 }
+
+function openCertPreview() {
+    const name = document.getElementById('cert-name').value || '-';
+    const resident = document.getElementById('cert-resident').value || '-';
+    const address = document.getElementById('cert-address').value || '-';
+    const company = document.getElementById('cert-company').value || '-';
+    const businessNum = document.getElementById('cert-business-num').value || '-';
+    const department = document.getElementById('cert-department').value || '-';
+    const position = document.getElementById('cert-position').value || '-';
+    const hireDate = document.getElementById('cert-hire-date').value || '-';
+    const purpose = getCertPurpose() || '-';
+    const issueDate = document.getElementById('cert-issue-date').value || '-';
+
+    const issueDateFormatted = issueDate !== '-' ? issueDate.replace(/-/g, function(m, i) { return i === 4 ? '년 ' : '월 '; }) + '일' : '-';
+
+    const el = document.getElementById('cert-preview-content');
+    el.innerHTML = buildCertPreviewHtml({ name, resident, address, company, businessNum, department, position, hireDate, purpose, issueDateFormatted });
+
+    document.getElementById('cert-preview-modal').style.display = '';
+    document.body.style.overflow = 'hidden';
+}
+
+function closeCertPreview() {
+    document.getElementById('cert-preview-modal').style.display = 'none';
+    document.body.style.overflow = '';
+}
+
+function printCertPreview() {
+    const content = document.getElementById('cert-preview-content').innerHTML;
+    const win = window.open('', '_blank', 'width=800,height=1000');
+    win.document.write('<html><head><title>재직증명서</title>');
+    win.document.write('<style>body{font-family:"Pretendard","Malgun Gothic",sans-serif;padding:48px 56px;margin:0;} table{border-collapse:collapse;width:100%;} th,td{border:1px solid #333;padding:10px 14px;font-size:14px;} th{background:#f8f9fa;font-weight:600;text-align:left;white-space:nowrap;width:120px;} @media print{body{padding:40px 48px;}}</style>');
+    win.document.write('</head><body>');
+    win.document.write(content);
+    win.document.write('</body></html>');
+    win.document.close();
+    win.onload = function() { win.print(); };
+}
+
+function buildCertPreviewHtml(d) {
+    const e = (s) => { const div = document.createElement('div'); div.textContent = s; return div.innerHTML; };
+    const thStyle = 'border:1px solid #333; padding:10px 14px; background:#f8f9fa; font-weight:600; text-align:left; white-space:nowrap; width:120px; font-size:14px;';
+    const tdStyle = 'border:1px solid #333; padding:10px 14px; font-size:14px;';
+
+    return `
+        <h1 style="text-align:center; font-size:28px; font-weight:700; letter-spacing:12px; margin-bottom:40px;">재 직 증 명 서</h1>
+
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">1. 인적사항</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:20px;">
+            <tr>
+                <th style="${thStyle}">성 명</th>
+                <td style="${tdStyle}">${e(d.name)}</td>
+                <th style="${thStyle}">주민등록번호</th>
+                <td style="${tdStyle}">${e(d.resident)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">주 소</th>
+                <td style="${tdStyle}" colspan="3">${e(d.address)}</td>
+            </tr>
+        </table>
+
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">2. 재직사항</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:20px;">
+            <tr>
+                <th style="${thStyle}">회 사 명</th>
+                <td style="${tdStyle}" colspan="3">${e(d.company)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">사업자번호</th>
+                <td style="${tdStyle}" colspan="3">${e(d.businessNum)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">근무부서</th>
+                <td style="${tdStyle}">${e(d.department)}</td>
+                <th style="${thStyle}">직 급</th>
+                <td style="${tdStyle}">${e(d.position)}</td>
+            </tr>
+            <tr>
+                <th style="${thStyle}">재직기간</th>
+                <td style="${tdStyle}" colspan="3">${e(d.hireDate)}</td>
+            </tr>
+        </table>
+
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">3. 발급정보</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:32px;">
+            <tr>
+                <th style="${thStyle}">사용용도</th>
+                <td style="${tdStyle}" colspan="3">${e(d.purpose)}</td>
+            </tr>
+        </table>
+
+        <p style="text-align:center; font-size:15px; line-height:2; margin:36px 0;">
+            위 사항을 증명합니다.
+        </p>
+
+        <p style="text-align:center; font-size:15px; font-weight:500; margin-bottom:48px;">
+            ${e(d.issueDateFormatted)}
+        </p>
+
+        <div style="text-align:center; margin-top:32px;">
+            <p style="font-size:16px; font-weight:600; margin-bottom:8px;">${e(d.company)}</p>
+            <p style="font-size:14px; color:#555;">대표이사 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; (인)</p>
+        </div>
+    `;
+}
 </script>
@endpush
--- a/resources/views/approvals/partials/_certificate-form.blade.php
+++ b/resources/views/approvals/partials/_certificate-form.blade.php
@@ -13,15 +13,25 @@
        {{-- 대상 사원 --}}
        <div>
            <label class="block text-sm font-medium text-gray-700 mb-1">대상 사원 <span class="text-red-500">*</span></label>
-            <select id="cert-user-id" onchange="loadCertInfo(this.value)"
-                    class="w-full px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
-                    style="max-width: 300px;">
-                @foreach($employees as $emp)
-                    <option value="{{ $emp->user_id }}" {{ $emp->user_id == $currentUserId ? 'selected' : '' }}>
-                        {{ $emp->display_name }}
-                    </option>
-                @endforeach
-            </select>
+            <div class="flex items-center gap-2">
+                <select id="cert-user-id" onchange="loadCertInfo(this.value)"
+                        class="px-3 py-2 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-blue-500"
+                        style="max-width: 300px;">
+                    @foreach($employees as $emp)
+                        <option value="{{ $emp->user_id }}" {{ $emp->user_id == $currentUserId ? 'selected' : '' }}>
+                            {{ $emp->display_name }}
+                        </option>
+                    @endforeach
+                </select>
+                <button type="button" onclick="openCertPreview()"
+                        class="shrink-0 px-3 py-2 bg-indigo-50 text-indigo-600 hover:bg-indigo-100 border border-indigo-200 rounded-lg text-sm font-medium transition inline-flex items-center gap-1">
+                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/>
+                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/>
+                    </svg>
+                    미리보기
+                </button>
+            </div>
        </div>

        {{-- 인적사항 --}}
@@ -122,3 +132,35 @@ class="w-full px-3 py-2 border border-gray-200 rounded-lg text-sm bg-gray-50 tex
        </div>
    </div>
 </div>
+
+{{-- 재직증명서 미리보기 모달 --}}
+<div id="cert-preview-modal" style="display: none;" class="fixed inset-0 z-50">
+    <div class="absolute inset-0 bg-black/50" onclick="closeCertPreview()"></div>
+    <div class="relative flex items-center justify-center min-h-full p-4">
+        <div class="bg-white rounded-xl shadow-2xl w-full overflow-hidden relative" style="max-width: 700px;">
+            <div class="flex items-center justify-between px-5 py-3 border-b border-gray-200 bg-gray-50">
+                <h3 class="text-base font-semibold text-gray-800">재직증명서 미리보기</h3>
+                <div class="flex items-center gap-2">
+                    <button type="button" onclick="printCertPreview()"
+                            class="px-3 py-1.5 bg-white border border-gray-300 hover:bg-gray-50 rounded-lg text-xs font-medium transition inline-flex items-center gap-1">
+                        <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z"/>
+                        </svg>
+                        인쇄
+                    </button>
+                    <button type="button" onclick="closeCertPreview()"
+                            class="p-1 text-gray-400 hover:text-gray-600 transition">
+                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+                        </svg>
+                    </button>
+                </div>
+            </div>
+            <div class="overflow-y-auto" style="max-height: 80vh;">
+                <div id="cert-preview-content" style="padding: 48px 56px; font-family: 'Pretendard', 'Malgun Gothic', sans-serif;">
+                    {{-- JS에서 동적으로 채움 --}}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
--- a/resources/views/approvals/partials/_certificate-show.blade.php
+++ b/resources/views/approvals/partials/_certificate-show.blade.php
@@ -4,6 +4,18 @@
        $content (array) - approvals.content JSON
 --}}
 <div class="space-y-4">
+    {{-- 미리보기 버튼 --}}
+    <div class="flex justify-end">
+        <button type="button" onclick="openCertShowPreview()"
+                class="px-3 py-1.5 bg-indigo-50 text-indigo-600 hover:bg-indigo-100 border border-indigo-200 rounded-lg text-sm font-medium transition inline-flex items-center gap-1">
+            <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/>
+                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z"/>
+            </svg>
+            증명서 미리보기
+        </button>
+    </div>
+
    {{-- 인적사항 --}}
    <div class="border border-gray-200 rounded-lg overflow-hidden">
        <div class="bg-gray-50 px-4 py-2 border-b border-gray-200">
@@ -99,3 +111,34 @@
        </div>
    @endif
 </div>
+
+{{-- 미리보기 모달 --}}
+<div id="cert-show-preview-modal" style="display: none;" class="fixed inset-0 z-50">
+    <div class="absolute inset-0 bg-black/50" onclick="closeCertShowPreview()"></div>
+    <div class="relative flex items-center justify-center min-h-full p-4">
+        <div class="bg-white rounded-xl shadow-2xl w-full overflow-hidden relative" style="max-width: 700px;">
+            <div class="flex items-center justify-between px-5 py-3 border-b border-gray-200 bg-gray-50">
+                <h3 class="text-base font-semibold text-gray-800">재직증명서 미리보기</h3>
+                <div class="flex items-center gap-2">
+                    <button type="button" onclick="printCertShowPreview()"
+                            class="px-3 py-1.5 bg-white border border-gray-300 hover:bg-gray-50 rounded-lg text-xs font-medium transition inline-flex items-center gap-1">
+                        <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z"/>
+                        </svg>
+                        인쇄
+                    </button>
+                    <button type="button" onclick="closeCertShowPreview()"
+                            class="p-1 text-gray-400 hover:text-gray-600 transition">
+                        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
+                        </svg>
+                    </button>
+                </div>
+            </div>
+            <div class="overflow-y-auto" style="max-height: 80vh;">
+                <div id="cert-show-preview-content" style="padding: 48px 56px; font-family: 'Pretendard', 'Malgun Gothic', sans-serif;">
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
--- a/resources/views/approvals/show.blade.php
+++ b/resources/views/approvals/show.blade.php
@@ -484,5 +484,85 @@ class="bg-red-600 hover:bg-red-700 text-white px-6 py-2 rounded-lg transition te
        showToast('서버 오류가 발생했습니다.', 'error');
    }
 }
+
+// =========================================================================
+// 재직증명서 미리보기 (show 페이지용)
+// =========================================================================
+
+@if(!empty($approval->content) && $approval->form?->code === 'employment_cert')
+const _certContent = @json($approval->content);
+
+function openCertShowPreview() {
+    const c = _certContent;
+    const issueDate = c.issue_date || '';
+    const issueDateFormatted = issueDate ? issueDate.replace(/-/g, function(m, i) { return i === 4 ? '년 ' : '월 '; }) + '일' : '-';
+
+    const el = document.getElementById('cert-show-preview-content');
+    el.innerHTML = _buildCertHtml({
+        name: c.name || '-',
+        resident: c.resident_number || '-',
+        address: c.address || '-',
+        company: c.company_name || '-',
+        businessNum: c.business_num || '-',
+        department: c.department || '-',
+        position: c.position || '-',
+        hireDate: c.hire_date || '-',
+        purpose: c.purpose || '-',
+        issueDateFormatted: issueDateFormatted,
+    });
+
+    document.getElementById('cert-show-preview-modal').style.display = '';
+    document.body.style.overflow = 'hidden';
+}
+
+function closeCertShowPreview() {
+    document.getElementById('cert-show-preview-modal').style.display = 'none';
+    document.body.style.overflow = '';
+}
+
+function printCertShowPreview() {
+    const content = document.getElementById('cert-show-preview-content').innerHTML;
+    const win = window.open('', '_blank', 'width=800,height=1000');
+    win.document.write('<html><head><title>재직증명서</title>');
+    win.document.write('<style>body{font-family:"Pretendard","Malgun Gothic",sans-serif;padding:48px 56px;margin:0;} table{border-collapse:collapse;width:100%;} th,td{border:1px solid #333;padding:10px 14px;font-size:14px;} th{background:#f8f9fa;font-weight:600;text-align:left;white-space:nowrap;width:120px;} @media print{body{padding:40px 48px;}}</style>');
+    win.document.write('</head><body>');
+    win.document.write(content);
+    win.document.write('</body></html>');
+    win.document.close();
+    win.onload = function() { win.print(); };
+}
+
+function _buildCertHtml(d) {
+    const e = (s) => { const div = document.createElement('div'); div.textContent = s; return div.innerHTML; };
+    const thStyle = 'border:1px solid #333; padding:10px 14px; background:#f8f9fa; font-weight:600; text-align:left; white-space:nowrap; width:120px; font-size:14px;';
+    const tdStyle = 'border:1px solid #333; padding:10px 14px; font-size:14px;';
+
+    return `
+        <h1 style="text-align:center; font-size:28px; font-weight:700; letter-spacing:12px; margin-bottom:40px;">재 직 증 명 서</h1>
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">1. 인적사항</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:20px;">
+            <tr><th style="${thStyle}">성 명</th><td style="${tdStyle}">${e(d.name)}</td><th style="${thStyle}">주민등록번호</th><td style="${tdStyle}">${e(d.resident)}</td></tr>
+            <tr><th style="${thStyle}">주 소</th><td style="${tdStyle}" colspan="3">${e(d.address)}</td></tr>
+        </table>
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">2. 재직사항</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:20px;">
+            <tr><th style="${thStyle}">회 사 명</th><td style="${tdStyle}" colspan="3">${e(d.company)}</td></tr>
+            <tr><th style="${thStyle}">사업자번호</th><td style="${tdStyle}" colspan="3">${e(d.businessNum)}</td></tr>
+            <tr><th style="${thStyle}">근무부서</th><td style="${tdStyle}">${e(d.department)}</td><th style="${thStyle}">직 급</th><td style="${tdStyle}">${e(d.position)}</td></tr>
+            <tr><th style="${thStyle}">재직기간</th><td style="${tdStyle}" colspan="3">${e(d.hireDate)}</td></tr>
+        </table>
+        <h3 style="font-size:15px; font-weight:600; margin:24px 0 10px; color:#333;">3. 발급정보</h3>
+        <table style="border-collapse:collapse; width:100%; margin-bottom:32px;">
+            <tr><th style="${thStyle}">사용용도</th><td style="${tdStyle}" colspan="3">${e(d.purpose)}</td></tr>
+        </table>
+        <p style="text-align:center; font-size:15px; line-height:2; margin:36px 0;">위 사항을 증명합니다.</p>
+        <p style="text-align:center; font-size:15px; font-weight:500; margin-bottom:48px;">${e(d.issueDateFormatted)}</p>
+        <div style="text-align:center; margin-top:32px;">
+            <p style="font-size:16px; font-weight:600; margin-bottom:8px;">${e(d.company)}</p>
+            <p style="font-size:14px; color:#555;">대표이사 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; (인)</p>
+        </div>
+    `;
+}
+@endif
 </script>
@endpush