fix: [approvals] 사용인감계 미리보기를 인감비교 형식으로 통일
- edit/show 페이지의 buildSealUsagePreviewHtml을 법인인감|사용인감 비교 레이아웃으로 교체 - 구 테이블 형식(인감종류/비고 필드) 제거 - create 페이지와 동일한 확약문구, 일자 포맷, 회사정보 레이아웃 적용
This commit is contained in:
@@ -755,19 +755,7 @@ function applyBodyTemplate(formId) {
|
||||
document.getElementById('su-usage-date').value = suContent.usage_date || '';
|
||||
document.getElementById('su-purpose').value = suContent.purpose || '';
|
||||
document.getElementById('su-submit-to').value = suContent.submit_to || '';
|
||||
document.getElementById('su-remarks').value = suContent.remarks || '';
|
||||
|
||||
// 인감종류 복원
|
||||
const sealTypeSelect = document.getElementById('su-seal-type');
|
||||
const sealType = suContent.seal_type || '';
|
||||
const predefinedSeals = ['법인인감', '사용인감', '대표이사 인감', '직인'];
|
||||
if (predefinedSeals.includes(sealType)) {
|
||||
sealTypeSelect.value = sealType;
|
||||
} else if (sealType) {
|
||||
sealTypeSelect.value = '__custom__';
|
||||
document.getElementById('su-seal-type-custom-wrap').style.display = '';
|
||||
document.getElementById('su-seal-type-custom').value = sealType;
|
||||
}
|
||||
document.getElementById('su-attachment-desc').value = suContent.attachment_desc || '';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -860,10 +848,9 @@ function applyBodyTemplate(formId) {
|
||||
|
||||
formContent = {
|
||||
usage_date: document.getElementById('su-usage-date').value,
|
||||
seal_type: getSealUsageType(),
|
||||
purpose: suPurpose,
|
||||
submit_to: suSubmitTo,
|
||||
remarks: document.getElementById('su-remarks').value.trim(),
|
||||
attachment_desc: document.getElementById('su-attachment-desc').value.trim(),
|
||||
company_name: document.getElementById('su-company-name').value,
|
||||
business_num: document.getElementById('su-business-num').value,
|
||||
ceo_name: document.getElementById('su-ceo-name').value,
|
||||
@@ -1113,63 +1100,59 @@ function buildCertPreviewHtml(d) {
|
||||
// 사용인감계 관련 함수
|
||||
// =========================================================================
|
||||
|
||||
document.getElementById('su-seal-type')?.addEventListener('change', function() {
|
||||
const customWrap = document.getElementById('su-seal-type-custom-wrap');
|
||||
if (this.value === '__custom__') {
|
||||
customWrap.style.display = '';
|
||||
document.getElementById('su-seal-type-custom').focus();
|
||||
} else {
|
||||
customWrap.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
function getSealUsageType() {
|
||||
const sel = document.getElementById('su-seal-type');
|
||||
if (sel.value === '__custom__') {
|
||||
return document.getElementById('su-seal-type-custom').value.trim() || '기타';
|
||||
}
|
||||
return sel.value;
|
||||
}
|
||||
|
||||
function buildSealUsagePreviewHtml(data) {
|
||||
const e = (s) => s ? String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>') : '-';
|
||||
const dateObj = data.usage_date ? new Date(data.usage_date + 'T00:00:00') : new Date();
|
||||
const y = dateObj.getFullYear();
|
||||
const m = String(dateObj.getMonth() + 1).padStart(2, ' ');
|
||||
const d = String(dateObj.getDate()).padStart(2, ' ');
|
||||
|
||||
return `
|
||||
<div style="text-align:center; margin-bottom:48px;">
|
||||
<h1 style="font-size:28px; font-weight:700; letter-spacing:12px; margin:0;">사 용 인 감 계</h1>
|
||||
<div style="text-align:center; margin-bottom:40px;">
|
||||
<h1 style="font-size:26px; font-weight:700; letter-spacing:14px; margin:0;">사 용 인 감 계</h1>
|
||||
</div>
|
||||
|
||||
<table style="width:100%; border-collapse:collapse; margin-bottom:36px; font-size:14px;">
|
||||
<!-- 인감 비교란 -->
|
||||
<table style="width:360px; margin:0 auto 32px; border-collapse:collapse;">
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; width:120px; text-align:center;">사용일자</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.usage_date)}</td>
|
||||
<td style="border:1px solid #333; padding:8px; text-align:center; font-weight:600; font-size:13px; width:180px; background:#f8f8f8;">법인인감</td>
|
||||
<td style="border:1px solid #333; padding:8px; text-align:center; font-weight:600; font-size:13px; width:180px; background:#f8f8f8;">사용인감</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">인감종류</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.seal_type)}</td>
|
||||
<td style="border:1px solid #333; height:140px; text-align:center; vertical-align:middle;">
|
||||
<span style="color:#bbb; font-size:11px;">(인감 날인)</span>
|
||||
</td>
|
||||
<td style="border:1px solid #333; height:140px; text-align:center; vertical-align:middle;">
|
||||
<span style="color:#bbb; font-size:11px;">(인감 날인)</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">용 도</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.purpose)}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">제출처</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.submit_to)}</td>
|
||||
</tr>
|
||||
${data.remarks ? `<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">비 고</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.remarks)}</td>
|
||||
</tr>` : ''}
|
||||
</table>
|
||||
|
||||
<p style="text-align:center; font-size:13px; color:#666; margin-bottom:36px;">
|
||||
위와 같이 인감 사용을 신청하오니 허가하여 주시기 바랍니다.
|
||||
</p>
|
||||
<!-- 용도 / 제출처 -->
|
||||
<div style="font-size:13px; line-height:2; margin-bottom:8px;">
|
||||
<p style="margin:0;"><span style="font-weight:600;">용도:</span> ${e(data.purpose)}</p>
|
||||
<p style="margin:0;"><span style="font-weight:600;">제출처:</span> ${e(data.submit_to)}</p>
|
||||
</div>
|
||||
|
||||
<div style="margin-top:40px; padding:20px 24px; border:1px solid #ddd; border-radius:6px; background:#fafafa;">
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">상 호</span>: ${e(data.company_name)}</p>
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">사업자등록번호</span>: ${e(data.business_num)}</p>
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">주 소</span>: ${e(data.company_address)}</p>
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">대표이사</span>: ${e(data.ceo_name)}</p>
|
||||
<!-- 확약 문구 -->
|
||||
<div style="margin:28px 0; padding:16px 20px; border:1px solid #ccc; border-radius:4px; background:#fafafa;">
|
||||
<p style="font-size:12px; line-height:1.8; margin:0; color:#333;">
|
||||
위 사용인감은 당사에서 사용하는 인감입니다. 당사는 위 인감사용으로 인한 모든 책임을 질 것을 확약하고 사용인감계를 제출합니다.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- 첨부서류 -->
|
||||
${data.attachment_desc ? `<p style="font-size:12px; margin:0 0 24px; color:#333;"><span style="font-weight:600;">첨부서류:</span> ${e(data.attachment_desc)}</p>` : ''}
|
||||
|
||||
<!-- 일자 -->
|
||||
<p style="text-align:center; font-size:14px; margin:32px 0 28px; letter-spacing:2px;">${y}년 ${m}월 ${d}일</p>
|
||||
|
||||
<!-- 회사 정보 -->
|
||||
<div style="margin-top:20px; font-size:12px; line-height:2;">
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600; letter-spacing:6px;">상 호</span>: ${e(data.company_name)}</p>
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600;">사업자등록번호</span>: ${e(data.business_num)}</p>
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600; letter-spacing:6px;">주 소</span>: ${e(data.company_address)}</p>
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600;">대표이사</span>: ${e(data.ceo_name)}</p>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
@@ -1177,10 +1160,9 @@ function buildSealUsagePreviewHtml(data) {
|
||||
function openSealUsagePreview() {
|
||||
const data = {
|
||||
usage_date: document.getElementById('su-usage-date').value,
|
||||
seal_type: getSealUsageType(),
|
||||
purpose: document.getElementById('su-purpose').value,
|
||||
submit_to: document.getElementById('su-submit-to').value,
|
||||
remarks: document.getElementById('su-remarks').value,
|
||||
attachment_desc: document.getElementById('su-attachment-desc').value,
|
||||
company_name: document.getElementById('su-company-name').value,
|
||||
business_num: document.getElementById('su-business-num').value,
|
||||
ceo_name: document.getElementById('su-ceo-name').value,
|
||||
|
||||
@@ -801,43 +801,57 @@ function _buildCertHtml(d) {
|
||||
|
||||
function buildSealUsageShowPreviewHtml(data) {
|
||||
const e = (s) => s ? String(s).replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>') : '-';
|
||||
const dateObj = data.usage_date ? new Date(data.usage_date + 'T00:00:00') : new Date();
|
||||
const y = dateObj.getFullYear();
|
||||
const m = String(dateObj.getMonth() + 1).padStart(2, ' ');
|
||||
const d = String(dateObj.getDate()).padStart(2, ' ');
|
||||
|
||||
return `
|
||||
<div style="text-align:center; margin-bottom:48px;">
|
||||
<h1 style="font-size:28px; font-weight:700; letter-spacing:12px; margin:0;">사 용 인 감 계</h1>
|
||||
<div style="text-align:center; margin-bottom:40px;">
|
||||
<h1 style="font-size:26px; font-weight:700; letter-spacing:14px; margin:0;">사 용 인 감 계</h1>
|
||||
</div>
|
||||
|
||||
<table style="width:100%; border-collapse:collapse; margin-bottom:36px; font-size:14px;">
|
||||
<!-- 인감 비교란 -->
|
||||
<table style="width:360px; margin:0 auto 32px; border-collapse:collapse;">
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; width:120px; text-align:center;">사용일자</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.usage_date)}</td>
|
||||
<td style="border:1px solid #333; padding:8px; text-align:center; font-weight:600; font-size:13px; width:180px; background:#f8f8f8;">법인인감</td>
|
||||
<td style="border:1px solid #333; padding:8px; text-align:center; font-weight:600; font-size:13px; width:180px; background:#f8f8f8;">사용인감</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">인감종류</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.seal_type)}</td>
|
||||
<td style="border:1px solid #333; height:140px; text-align:center; vertical-align:middle;">
|
||||
<span style="color:#bbb; font-size:11px;">(인감 날인)</span>
|
||||
</td>
|
||||
<td style="border:1px solid #333; height:140px; text-align:center; vertical-align:middle;">
|
||||
<span style="color:#bbb; font-size:11px;">(인감 날인)</span>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">용 도</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.purpose)}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">제출처</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.submit_to)}</td>
|
||||
</tr>
|
||||
${data.remarks ? `<tr>
|
||||
<td style="border:1px solid #333; padding:10px 14px; background:#f8f8f8; font-weight:600; text-align:center;">비 고</td>
|
||||
<td style="border:1px solid #333; padding:10px 14px;">${e(data.remarks)}</td>
|
||||
</tr>` : ''}
|
||||
</table>
|
||||
|
||||
<p style="text-align:center; font-size:13px; color:#666; margin-bottom:36px;">
|
||||
위와 같이 인감 사용을 신청하오니 허가하여 주시기 바랍니다.
|
||||
</p>
|
||||
<!-- 용도 / 제출처 -->
|
||||
<div style="font-size:13px; line-height:2; margin-bottom:8px;">
|
||||
<p style="margin:0;"><span style="font-weight:600;">용도:</span> ${e(data.purpose)}</p>
|
||||
<p style="margin:0;"><span style="font-weight:600;">제출처:</span> ${e(data.submit_to)}</p>
|
||||
</div>
|
||||
|
||||
<div style="margin-top:40px; padding:20px 24px; border:1px solid #ddd; border-radius:6px; background:#fafafa;">
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">상 호</span>: ${e(data.company_name)}</p>
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">사업자등록번호</span>: ${e(data.business_num)}</p>
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">주 소</span>: ${e(data.company_address)}</p>
|
||||
<p style="font-size:13px; margin:4px 0; color:#333;"><span style="display:inline-block; width:110px; font-weight:600;">대표이사</span>: ${e(data.ceo_name)}</p>
|
||||
<!-- 확약 문구 -->
|
||||
<div style="margin:28px 0; padding:16px 20px; border:1px solid #ccc; border-radius:4px; background:#fafafa;">
|
||||
<p style="font-size:12px; line-height:1.8; margin:0; color:#333;">
|
||||
위 사용인감은 당사에서 사용하는 인감입니다. 당사는 위 인감사용으로 인한 모든 책임을 질 것을 확약하고 사용인감계를 제출합니다.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<!-- 첨부서류 -->
|
||||
${data.attachment_desc ? `<p style="font-size:12px; margin:0 0 24px; color:#333;"><span style="font-weight:600;">첨부서류:</span> ${e(data.attachment_desc)}</p>` : ''}
|
||||
|
||||
<!-- 일자 -->
|
||||
<p style="text-align:center; font-size:14px; margin:32px 0 28px; letter-spacing:2px;">${y}년 ${m}월 ${d}일</p>
|
||||
|
||||
<!-- 회사 정보 -->
|
||||
<div style="margin-top:20px; font-size:12px; line-height:2;">
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600; letter-spacing:6px;">상 호</span>: ${e(data.company_name)}</p>
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600;">사업자등록번호</span>: ${e(data.business_num)}</p>
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600; letter-spacing:6px;">주 소</span>: ${e(data.company_address)}</p>
|
||||
<p style="margin:0;"><span style="display:inline-block; width:110px; font-weight:600;">대표이사</span>: ${e(data.ceo_name)}</p>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user