From 175c9234236349fcbdd35753f69995028e6670ca Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=B3=B4=EA=B3=A4?=
 <lightone2017@codebridge-x.com>
Date: Wed, 4 Feb 2026 10:38:17 +0900
Subject: [PATCH] =?UTF-8?q?feat:=EC=A0=84=EC=9E=90=EC=84=B8=EA=B8=88?=
 =?UTF-8?q?=EA=B3=84=EC=82=B0=EC=84=9C=20=EA=B3=B5=EA=B8=89=EC=9E=90/?=
 =?UTF-8?q?=EA=B3=B5=EA=B8=89=EB=B0=9B=EB=8A=94=EC=9E=90=20=EC=9E=85?=
 =?UTF-8?q?=EB=A0=A5=20=ED=8F=BC=20=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../barobill/tax-invoice/index.blade.php      | 203 +++++++++++++++++-
 1 file changed, 193 insertions(+), 10 deletions(-)

diff --git a/resources/views/barobill/tax-invoice/index.blade.php b/resources/views/barobill/tax-invoice/index.blade.php
index b749f7ba..0c0b21af 100644
--- a/resources/views/barobill/tax-invoice/index.blade.php
+++ b/resources/views/barobill/tax-invoice/index.blade.php
@@ -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