# [IMPL-2025-12-18] 거래처원장 (Vendor Ledger) 구현

## 개요
- **화면명**: 거래처원장
- **경로**: 회계관리 > 거래처원장
- **구성**: 리스트 페이지 + 상세 페이지

---

## Phase 1: 리스트 페이지 (VendorLedger/index.tsx)

### 1.1 헤더 영역
- [ ] 제목: "거래처원장"
- [ ] 설명: "거래처별 기간 내역을 조회합니다."
- [ ] 기간 선택기: 2025-09-01 ~ 2025-09-03 형식
- [ ] 기간 버튼: 당해년도, 전년월, 전월, 당월, 어제, 오늘
- [ ] 엑셀 다운로드 버튼

### 1.2 요약 카드 (4개)
- [ ] 전기 이월: 3,123,000원
- [ ] 매출: 3,123,000원
- [ ] 수금: 3,123,000원
- [ ] 잔액: 3,123,000원

### 1.3 테이블 영역
- [ ] 검색 필드
- [ ] 총 N건 표시
- [ ] 테이블 컬럼:
  - No.
  - 거래처명
  - 이월잔액
  - 매출
  - 수금
  - 잔액
  - 결제일
- [ ] 합계 행 (테이블 하단)
- [ ] 행 클릭 시 상세 페이지 이동

---

## Phase 2: 상세 페이지 (VendorLedger/VendorLedgerDetail.tsx)

### 2.1 헤더 영역
- [ ] 제목: "거래처원장 상세 (거래명세서별)"
- [ ] 설명: "거래처 상세 내역을 조회합니다."
- [ ] 기간 선택기: 2025-09-01 ~ 2025-09-03
- [ ] 기간 버튼: 당해년도, 전년월, 전월, 당월, 어제, 오늘
- [ ] PDF 다운로드 버튼

### 2.2 거래처 정보 섹션 (2열 레이아웃)
- [ ] 좌측 열:
  - 회사명: [값]
  - 사업자등록번호: 123-12-12345
  - 전화번호: 02-1234-1234
  - 팩스: 02-1234-1236
  - 주소: 주소영
- [ ] 우측 열:
  - 기간: 2025-01-01 ~ 2025-12-31
  - 대표자: 홍길동
  - 모바일: 02-1234-1235
  - 이메일: abc@email.com

### 2.3 판매/수금 내역 테이블
- [ ] 컬럼: 일자, 적요, 판매, 수금, 잔액, 작업
- [ ] 이월잔액 행 (첫 행, 적요에 "이월잔액")
- [ ] 거래 행 (◆ 아이콘 + 날짜)
  - 클릭 시 어음 상세 화면 이동
- [ ] 거래명세서 행 (클릭 시 문서 상세 팝업)
- [ ] 품목명 행 (세금계산서 미발행 시 노란색 하이라이트)
- [ ] 누계 행 (※ 123건 누계 (VAT 포함) 형식)
- [ ] 월별 계 행 (회색 배경, 예: "2025/01 계", "2025/09 계")
- [ ] 작업 컬럼: 수정 아이콘 (✏️)

---

## Phase 3: 타입 및 라우트

### 3.1 types.ts
- [ ] VendorLedgerItem 인터페이스
- [ ] VendorLedgerDetail 인터페이스
- [ ] TransactionEntry 인터페이스

### 3.2 라우트 설정
- [ ] `/ko/accounting/vendor-ledger` - 리스트 페이지
- [ ] `/ko/accounting/vendor-ledger/[id]` - 상세 페이지

---

## 스크린샷 상세 분석

### 리스트 페이지 테이블 데이터 예시
| No. | 거래처명 | 이월잔액 | 매출 | 수금 | 잔액 | 결제일 |
|-----|---------|---------|------|------|------|--------|
| 7 | 회사명 | -100,000 | | | | |
| 6 | 회사명 | 10,000,000 | 10,000,000 | 10,000,000 | | |
| 5 | 회사명 | 10,000,000 | | | | |
| ... | | | | | | |
| **합계** | | 10,000,000 | 10,000,000 | 10,000,000 | 10,000,000 | |

### 상세 페이지 판매/수금 내역 예시
| 일자 | 적요 | 판매 | 수금 | 잔액 | 작업 |
|------|------|------|------|------|------|
| | 이월잔액 | 10,000,000 | | | |
| ◆ 2025-01-01 | 수취 어음 (만기 1/5) | | 3,000,000 | 10,000,000 | ✏️ |
| ◆ 2025-01-05 | 어음 회수 | | 3,000,000 | | |
| **2025/01 계** | | | | | |
| ◆ 2025-09-25 | 매출 입력 | 1,000,000 | | | |
| | 품목명 | **🟡 500,000** | | | |
| | ※ 123건 누계 (VAT 포함) | 1,000,000 | | 1,000,000 | |
| **2025/09 계** | | 1,000,000 | 8,000,000 | | |

---

## 작업 진행 상황
- [x] Phase 1: 리스트 페이지 구현
- [x] Phase 2: 상세 페이지 구현
- [x] Phase 3: 타입 및 라우트 설정
- [x] Phase 4: 테스트 및 검증

## 생성된 파일
1. `src/components/accounting/VendorLedger/types.ts` - 타입 정의
2. `src/components/accounting/VendorLedger/index.tsx` - 리스트 페이지
3. `src/components/accounting/VendorLedger/VendorLedgerDetail.tsx` - 상세 페이지
4. `src/app/[locale]/(protected)/accounting/vendor-ledger/page.tsx` - 리스트 라우트
5. `src/app/[locale]/(protected)/accounting/vendor-ledger/[id]/page.tsx` - 상세 라우트

## 접속 URL
- 리스트: `/ko/accounting/vendor-ledger`
- 상세: `/ko/accounting/vendor-ledger/[id]`