Files
sam-manage/resources/views/rd/ai-quotation/document-templates/dark.blade.php
김보곤 420b80e45a feat: [ai-quotation] 견적서 5종 템플릿 선택 시스템 추가
- classic(클래식), modern(모던), blue(블루), dark(다크), colorful(컬러풀) 5종
- 문서 상단 미리보기 카드 클릭으로 즉시 디자인 전환
- URL 쿼리 파라미터 ?template=xxx 방식, 기본값 classic
- 인쇄/PDF 시 선택 UI 자동 숨김 (no-print)
- 기존 디자인은 classic 템플릿으로 100% 보존
2026-03-02 19:28:01 +09:00

148 lines
8.6 KiB
PHP

{{-- 프리미엄 다크 견적서 템플릿 --}}
<style>
.dark-tpl { font-family: 'Pretendard', sans-serif; color: #e5e7eb; background: #111827 !important; }
.dark-tpl .doc-table { width: 100%; border-collapse: collapse; }
.dark-tpl .doc-table th, .dark-tpl .doc-table td { padding: 7px 10px; font-size: 13px; border: 1px solid #374151; }
.dark-tpl .doc-table thead th { background: #1f2937; color: #fbbf24; font-weight: 600; border-color: #374151; }
.dark-tpl .doc-table tbody tr:nth-child(even) { background-color: #1a2332; }
.dark-tpl .doc-table tbody td { color: #d1d5db; }
.dark-tpl .doc-table tbody th { color: #9ca3af; background: #1f2937; }
.dark-tpl .seal-box { display: inline-block; width: 60px; height: 60px; border: 2px solid #fbbf24; border-radius: 50%; text-align: center; line-height: 56px; color: #fbbf24; font-weight: 700; font-size: 16px; }
@media print {
.dark-tpl { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.dark-tpl .doc-table thead th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.dark-tpl .doc-table tbody tr:nth-child(even) { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
</style>
<div class="dark-tpl document-page max-w-[210mm] mx-auto my-8 shadow-lg" style="padding: 18mm 22mm; background: #111827;">
{{-- 골드 라인 + 제목 --}}
<div style="border-top: 3px solid #fbbf24; padding-top: 20px; margin-bottom: 32px;">
<div style="display: flex; justify-content: space-between; align-items: flex-end;">
<div>
<h1 style="font-size: 30px; font-weight: 300; letter-spacing: 0.6em; color: #fbbf24; margin: 0;"> </h1>
<p style="font-size: 11px; color: #6b7280; margin-top: 4px; letter-spacing: 0.2em;">PREMIUM QUOTATION</p>
</div>
<div style="text-align: right; font-size: 12px; color: #6b7280;">
<p>No. {{ $quotationNo }}</p>
<p>{{ $quotation->created_at->format('Y. m. d') }}</p>
<p style="margin-top: 2px;">유효기간: 견적일로부터 30</p>
</div>
</div>
</div>
{{-- 수신 / 공급자 --}}
<table class="doc-table mb-6">
<colgroup>
<col style="width: 8%;"><col style="width: 42%;"><col style="width: 8%;"><col style="width: 42%;">
</colgroup>
<thead>
<tr>
<th colspan="2" class="text-center"> </th>
<th colspan="2" class="text-center"> </th>
</tr>
</thead>
<tbody>
<tr>
<th>귀사명</th><td style="color: #f9fafb; font-weight: 500;">{{ $quotation->title }}</td>
<th> </th><td style="color: #f9fafb; font-weight: 500;">()코드브릿지엑스</td>
</tr>
<tr>
<th> </th><td>{{ $company['industry'] ?? '-' }}</td>
<th> </th><td>이의찬</td>
</tr>
<tr>
<th> </th><td>{{ $company['scale'] ?? '-' }}</td>
<th> </th><td>인천 남동구 남동대로 215번길 30</td>
</tr>
<tr>
<th>현재시스템</th><td>{{ !empty($company['current_systems']) ? implode(', ', $company['current_systems']) : '-' }}</td>
<th>연락처</th><td>032-123-4567</td>
</tr>
</tbody>
</table>
{{-- 합계 --}}
<div style="margin-bottom: 24px; padding: 18px 20px; border: 1px solid #fbbf24; text-align: center; background: linear-gradient(135deg, #1f2937, #111827);">
<p style="font-size: 12px; color: #6b7280; margin-bottom: 8px;">아래와 같이 견적합니다.</p>
<p style="font-size: 22px; font-weight: 300; color: #fbbf24;">
합계금액: <strong>{{ $devTotalKorean }}</strong>원정
<span style="font-size: 14px; color: #9ca3af;">(&#8361;{{ number_format($devSubtotal) }})</span>
</p>
<p style="font-size: 11px; color: #6b7280; margin-top: 6px;"> 부가가치세 별도 / 구독료 {{ number_format($monthlySubtotal) }} 별도</p>
</div>
{{-- 품목 --}}
<table class="doc-table" style="margin-bottom: 24px;">
<colgroup>
<col style="width: 5%;"><col style="width: 7%;"><col style="width: 20%;"><col style="width: 33%;"><col style="width: 17.5%;"><col style="width: 17.5%;">
</colgroup>
<thead>
<tr>
<th class="text-center">No</th><th class="text-center">구분</th><th class="text-center"> </th>
<th class="text-center"> </th><th class="text-center">개발비 ()</th><th class="text-center"> 구독료 ()</th>
</tr>
</thead>
<tbody>
@foreach($sortedItems as $index => $item)
<tr>
<td class="text-center" style="color: #6b7280;">{{ $index + 1 }}</td>
<td class="text-center">
<span style="font-size: 11px; padding: 1px 6px; border-radius: 3px; {{ $item->is_required ? 'background:#422006;color:#fbbf24;' : 'background:#1f2937;color:#6b7280;' }}">
{{ $item->is_required ? '필수' : '선택' }}
</span>
</td>
<td style="font-weight: 500; color: #f3f4f6;">{{ $item->module_name }}</td>
<td style="font-size: 12px; color: #9ca3af;">{{ Str::limit($item->reason, 80) }}</td>
<td class="text-right" style="color: #d1d5db;">{{ number_format((int) $item->dev_cost) }}</td>
<td class="text-right" style="color: #d1d5db;">{{ number_format((int) $item->monthly_fee) }}</td>
</tr>
@endforeach
</tbody>
<tfoot>
<tr>
<th colspan="4" class="text-right" style="color: #9ca3af;"> </th>
<td class="text-right" style="font-weight: 700; color: #e5e7eb;">{{ number_format($devSubtotal) }}</td>
<td class="text-right" style="font-weight: 700; color: #e5e7eb;">{{ number_format($monthlySubtotal) }}</td>
</tr>
<tr>
<th colspan="4" class="text-right" style="color: #6b7280;">부가세 (10%)</th>
<td class="text-right" style="color: #6b7280;">{{ number_format($devVat) }}</td>
<td class="text-right" style="color: #6b7280;">{{ number_format($monthlyVat) }}</td>
</tr>
<tr style="background: #1f2937; -webkit-print-color-adjust: exact; print-color-adjust: exact;">
<th colspan="4" class="text-right" style="font-size: 15px; color: #fbbf24; border-color: #374151;"> </th>
<td class="text-right" style="font-size: 15px; font-weight: 700; color: #fbbf24; border-color: #374151;">{{ number_format($devTotal) }}</td>
<td class="text-right" style="font-size: 15px; font-weight: 700; color: #fbbf24; border-color: #374151;">{{ number_format($monthlyTotal) }}</td>
</tr>
</tfoot>
</table>
{{-- 비고 --}}
<div style="margin-bottom: 28px; padding: 16px 20px; border: 1px solid #374151; background: #1f2937; -webkit-print-color-adjust: exact; print-color-adjust: exact;">
<p style="font-size: 11px; color: #fbbf24; font-weight: 600; margin-bottom: 8px; letter-spacing: 0.15em;"> </p>
<ol style="list-style: decimal; padding-left: 18px; font-size: 12px; color: #9ca3af; line-height: 1.8;">
<li>상기 금액은 부가가치세 별도입니다.</li>
<li>개발비 납부 조건: 계약 50%, 완료 50% 분할 납부</li>
<li> 구독료: 서비스 오픈일부터 과금 ( {{ number_format($monthlyTotal) }}, VAT 포함)</li>
@if($estimatedMonths)
<li>예상 구축 기간: {{ $estimatedMonths }}개월</li>
@endif
<li> 견적서의 유효기간은 견적일로부터 30일입니다.</li>
<li>세부 사항은 별도 협의를 통해 조정될 있습니다.</li>
</ol>
</div>
{{-- 서명 --}}
<div style="display: flex; justify-content: flex-end; align-items: center; gap: 24px; margin-top: 48px; padding-top: 20px; border-top: 1px solid #374151;">
<div style="text-align: right;">
<p style="font-size: 16px; font-weight: 600; color: #f9fafb;">()코드브릿지엑스</p>
<p style="font-size: 12px; color: #6b7280; margin-top: 4px;">대표이사 </p>
</div>
<div class="seal-box">()</div>
</div>
</div>