SamProject/sam-manage
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat:전자세금계산서 공급자/공급받는자 입력 폼 구현

Browse Source
This commit is contained in:
김보곤
2026-02-04 10:38:17 +09:00
parent 72c18269c9
commit 175c923423
1 changed files with 193 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

203
resources/views/barobill/tax-invoice/index.blade.php
View File

@@ -7,20 +7,203 @@
<div class="flex flex-col sm:flex-row sm:justify-between sm:items-center gap-4 mb-6">
<div>
<h1 class="text-2xl font-bold text-gray-800">전자세금계산서</h1>
<p class="text-sm text-gray-500 mt-1">전자세금계산서 발행 및 조회</p>
<p class="text-sm text-gray-500 mt-1">전자세금계산서 발행</p>
</div>
<div class="flex gap-2">
<button type="button" class="px-4 py-2 bg-gray-500 text-white text-sm font-medium rounded-lg hover:bg-gray-600 transition-colors">
목록
</button>
<button type="submit" form="tax-invoice-form" class="px-4 py-2 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700 transition-colors">
발행
</button>
</div>
</div>
<div class="flex-1 flex items-center justify-center">
<div class="text-center">
<div class="w-24 h-24 bg-purple-100 rounded-full flex items-center justify-center mx-auto mb-4">
<svg class="w-12 h-12 text-purple-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg>
<form id="tax-invoice-form" class="space-y-6">
{{-- 공급자 / 공급받는자 영역 --}}
<div class="bg-white rounded-lg shadow overflow-hidden">
<div class="grid grid-cols-1 lg:grid-cols-2">
{{-- 공급자 (왼쪽 - 분홍색) --}}
<div class="border-r border-gray-200">
<table class="w-full text-sm">
<tbody>
{{-- 등록번호 / 종사업장 --}}
<tr class="border-b border-gray-200">
<td class="w-20 px-3 py-2 bg-red-100 text-red-700 font-medium text-center border-r border-gray-200 align-middle" rowspan="7">
<span class="writing-mode-vertical">공급자</span>
</td>
<td class="w-20 px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">등록번호</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="supplier_business_number" value="664-86-03713" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent" readonly>
</td>
<td class="w-20 px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">종사업장</td>
<td class="px-3 py-2 w-20">
<input type="text" name="supplier_sub_business" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 상호 / 성명 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">상호</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="supplier_company_name" value="(주)코드브릿지엑스" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent" readonly>
</td>
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">성명</td>
<td class="px-3 py-2">
<input type="text" name="supplier_ceo_name" value="이의찬" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent" readonly>
</td>
</tr>
{{-- 사업장주소 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">사업장<br>주소</td>
<td colspan="3" class="px-3 py-2">
<input type="text" name="supplier_address" value="서울 강서구 양천로 583 (염창동, 우림블루나인비즈니스센터)B동 1602호" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent" readonly>
</td>
</tr>
{{-- 업태 / 종목 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">업태</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="supplier_business_type" value="정보통신업" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent" readonly>
</td>
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">종목</td>
<td class="px-3 py-2">
<input type="text" name="supplier_business_item" value="스마트 자동화ERP시스템 개발 및 공급업" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent" readonly>
</td>
</tr>
{{-- 담당자 / 연락처 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">담당자</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="supplier_contact_name" value="전진선" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">연락처</td>
<td class="px-3 py-2">
<input type="text" name="supplier_contact_phone" value="02-6347-0005" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 이메일 --}}
<tr>
<td class="px-3 py-2 bg-red-50 text-red-600 font-medium text-center border-r border-gray-200">이메일</td>
<td colspan="3" class="px-3 py-2">
<input type="email" name="supplier_email" value="admin@codebridge-x.com" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
</tbody>
</table>
</div>
{{-- 공급받는자 (오른쪽 - 파란색) --}}
<div>
<table class="w-full text-sm">
<tbody>
{{-- 등록번호 / 종사업장 --}}
<tr class="border-b border-gray-200">
<td class="w-20 px-3 py-2 bg-blue-100 text-blue-700 font-medium text-center border-r border-gray-200 align-middle" rowspan="7">
<span class="writing-mode-vertical">공급받는자</span>
</td>
<td class="w-20 px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">등록번호</td>
<td class="px-3 py-2 border-r border-gray-200">
<div class="flex gap-1">
<input type="text" name="buyer_business_number" placeholder="000-00-00000" class="flex-1 px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
<button type="button" onclick="searchBuyer()" class="px-3 py-1 bg-blue-500 text-white text-xs font-medium rounded hover:bg-blue-600 transition-colors whitespace-nowrap">
검색
</button>
</div>
</td>
<td class="w-20 px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">종사업장</td>
<td class="px-3 py-2 w-20">
<input type="text" name="buyer_sub_business" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 상호 / 성명 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">상호</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="buyer_company_name" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">성명</td>
<td class="px-3 py-2">
<input type="text" name="buyer_ceo_name" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 사업장주소 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">사업장<br>주소</td>
<td colspan="3" class="px-3 py-2">
<input type="text" name="buyer_address" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 업태 / 종목 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">업태</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="buyer_business_type" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">종목</td>
<td class="px-3 py-2">
<input type="text" name="buyer_business_item" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 담당자 / 연락처 --}}
<tr class="border-b border-gray-200">
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">담당자</td>
<td class="px-3 py-2 border-r border-gray-200">
<input type="text" name="buyer_contact_name" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">연락처</td>
<td class="px-3 py-2">
<input type="text" name="buyer_contact_phone" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
{{-- 이메일 --}}
<tr>
<td class="px-3 py-2 bg-blue-50 text-blue-600 font-medium text-center border-r border-gray-200">
<div class="flex items-center justify-center gap-1">
<svg class="w-4 h-4 text-blue-400" fill="currentColor" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z" clip-rule="evenodd" />
</svg>
이메일
</div>
</td>
<td colspan="3" class="px-3 py-2">
<input type="email" name="buyer_email" placeholder="세금계산서 수신 이메일" class="w-full px-2 py-1 border border-gray-300 rounded text-sm focus:ring-2 focus:ring-blue-500 focus:border-transparent">
</td>
</tr>
</tbody>
</table>
</div>
</div>
<h2 class="text-xl font-semibold text-gray-800 mb-2">준비중입니다</h2>
<p class="text-gray-500">전자세금계산서 기능이 곧 제공됩니다.</p>
</div>
</div>
{{-- 세금계산서 상세 영역 (추후 구현) --}}
<div class="bg-white rounded-lg shadow p-6">
<div class="text-center text-gray-500">
<p>세금계산서 품목 및 금액 입력 영역</p>
<p class="text-sm mt-1">(추후 구현 예정)</p>
</div>
</div>
</form>
</div>
<style>
.writing-mode-vertical {
writing-mode: vertical-rl;
text-orientation: upright;
letter-spacing: 0.1em;
}
</style>
@push('scripts')
<script>
function searchBuyer() {
const businessNumber = document.querySelector('input[name="buyer_business_number"]').value;
if (!businessNumber) {
alert('사업자등록번호를 입력해주세요.');
return;
}
// TODO: 사업자 정보 검색 API 호출
alert('사업자 검색 기능은 추후 구현 예정입니다.');
}
</script>
@endpush
@endsection