# [IMPL-2025-12-18] 매입관리 페이지 구현

## 개요
회계관리 > 매입관리 페이지 구현 (리스트 + 상세)

## 참고자료
- 기안함 리스트 페이지: `src/components/approval/DraftBox/index.tsx`
- 공통 템플릿: `IntegratedListTemplateV2`
- 공통 컴포넌트: `DateRangeSelector`, `ListMobileCard`

---

## Phase 1: 리스트 페이지

### 1.1 페이지 구조
- [ ] 라우트 생성: `/accounting/purchase`
- [ ] 컴포넌트 생성: `src/components/accounting/PurchaseManagement/index.tsx`
- [ ] 타입 정의: `src/components/accounting/PurchaseManagement/types.ts`

### 1.2 상단 영역
- [ ] 날짜 범위 선택 (DateRangeSelector)
- [ ] 탭 버튼: 담대조건, 진행중, 당일, 이달, 이번, 미결

### 1.3 통계 카드 (4개)
- [ ] 매입금액 합계 (원)
- [ ] 출금액 합계 (원)
- [ ] 매입 건수
- [ ] 미결 건수

### 1.4 필터 셀렉트 박스
- [ ] 부가세여부 필터 (다중 선택): 부가세여부, 상품매입, 오주경비, 소모품비, 수선비, 원재료비, 사무용품비 등
- [ ] 거래처 필터 (검색 + 다중 선택)
- [ ] 증빙 필터 (다중 선택): 증빙유형 목록

### 1.5 테이블 컬럼
| 컬럼 | 설명 |
|------|------|
| No | 순번 |
| 매입일자 | 매입 등록일 |
| 매입금액 | 금액 |
| 거래처 | 거래처명 |
| 출금액 | 실제 출금액 |
| 부가세 | 부가세 금액 |
| 매입유형 | 유형 분류 |
| 증빙유형 | 세금계산서 등 |

### 1.6 기능
- [ ] 매입 자동 등록: 지출예상내역서 승인 완료 시 자동 등록
- [ ] 매입/매출등록 Alert 표시 (API 연동 예정)
- [ ] 일람표/거래처원장 연계 출력

---

## Phase 2: 상세 페이지 (모달)

### 2.1 기본 정보 섹션
- [ ] 근거 문서명: 품의서 또는 지출결의서 표시
- [ ] 결재 버튼: 클릭 시 매입 문서 상세 팝업
- [ ] 예상 비용 표시: 품의서/지출결의서 예상/총 비용

### 2.2 매입 정보 섹션
- [ ] 매입일자: 문서번호 + 상세조회 아이콘
- [ ] 출금계좌 셀렉트 박스: 등록된 계좌 목록 (계좌번호 마지막 4자리 + 별명)
- [ ] 거래처 셀렉트 박스: 검색 기능
- [ ] 매입 유형 셀렉트 박스: 부자재매입, 상품매입, 오주경비, 소모품비, 수선비, 원재료비, 사무용품비, 임차료, 수도광열비, 통신비, 차량유지비, 잡비, 보험료, 기타경비, 미상담

### 2.3 품목 정보 섹션
- [ ] 테이블: 품목명, 수량, 단가, 공급가액, 부가세, 적요
- [ ] 행 추가/삭제 기능
- [ ] 합계 표시

### 2.4 세금계산서 섹션
- [ ] 세금계산서 수취 토글 버튼
- [ ] 토글 시 미수취/수취완료 상태 변경
- [ ] 수취 완료 후 완료 상태로 변경

---

## Phase 3: 연동 및 마무리
- [ ] 전자결재 시스템 연동 (지출예상내역서 승인 → 매입 자동 등록)
- [ ] API 연동 준비 (비포템 API 자동 등록 예정)
- [ ] 일람표/거래처원장 출력 기능

---

## 파일 구조
```
src/
├── app/[locale]/(protected)/accounting/
│   └── purchase/
│       └── page.tsx
├── components/accounting/
│   └── PurchaseManagement/
│       ├── index.tsx          # 리스트 페이지
│       ├── types.ts           # 타입 정의
│       └── PurchaseDetailModal.tsx  # 상세 모달
```

---

## 진행 상태
- [x] 요구사항 분석 완료
- [x] 계획서 작성 완료
- [x] Phase 1 완료 (리스트 페이지)
- [x] Phase 2 완료 (상세 모달)
- [ ] Phase 3 대기 (API 연동)

## 테스트 URL
```
http://localhost:3000/ko/accounting/purchase
```