docs: 전수 조사 결과 섹션 통합 (12-24 → 12-26)

- 1.4 섹션 (2025-12-24 전수 조사 결과 요약) 삭제 - 1.6 섹션 (2025-12-26 전수 조사 결과)을 1.4로 이동 - 중복 내용 제거 및 최신 상태만 유지 - 섹션 번호 재조정 (1.7 → 1.6, 1.8 → 1.7) - mockData.ts 삭제 대상에 H-1~H-3 연동 완료 표시 추가 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2025-12-26 17:28:29 +09:00
parent 66eac6b39f
commit 5b8eceef36
1 changed files with 226 additions and 21 deletions
--- a/plans/react-mock-to-api-migration-plan.md
+++ b/plans/react-mock-to-api-migration-plan.md
@@ -23,36 +23,139 @@
 └─────────────────────────────────────────────────────────────────┘
 ```

-### 1.4 2025-12-24 전수 조사 결과 요약
+### 1.4 전수 조사 결과 (2025-12-26 최신)

-> MCP Serena를 활용한 Mock 데이터 사용 현황 전수 조사 결과
+> MCP Serena를 활용한 React 전체 Mock 데이터 사용 현황 전수 조사 결과

-**🔍 발견된 주요 패턴:**
-1. **리스트 API 연동 완료, 상세/CRUD Mock**: 리스트는 API 호출하지만 상세 조회, 등록, 수정, 삭제는 Mock
-2. **actions.ts 존재하지만 미연동**: Server Actions 파일은 있으나 UI에서 호출하지 않음 (console.log 사용)
-3. **MOCK_XXX 패턴**: 상수 배열로 Mock 데이터 정의 (예: `MOCK_POPUPS`, `mockEmployees`)
-4. **generateMockData 함수**: 동적 Mock 데이터 생성 함수 사용
-5. **console.log CRUD**: 저장/삭제 시 console.log만 출력하고 실제 API 호출 없음
+#### 🔍 발견된 주요 패턴

-**📊 현황 요약:**
+| 문제 유형 | 파일 수 | 설명 |
+|----------|---------|------|
+| **mockData.ts 파일** | 8개 | 별도 Mock 데이터 파일 (삭제 필요) |
+| **MOCK_* 상수** | 15개+ | 인라인 Mock 상수 |
+| **console.log CRUD** | 40개+ | API 대신 console.log 출력 |
+| **TODO 주석** | 30개+ | 미구현 기능 |

-| 분류 | 개수 | 상태 |
-|------|------|------|
-| 리스트 API 완료 | 12개 | Phase A-B |
-| 상세 페이지 Mock | 10개+ | 연동 필요 |
-| CRUD Mock (console.log) | 25개+ | 연동 필요 |
-| 전체 Mock | 30개+ | Phase C-H |
-| API 미존재 | 7개 | Phase I |
+#### 🚨 "완료" 표시됐지만 잔여 작업 있는 Phase

-**⚠️ 우선 연동 대상 (actions.ts 존재):**
- A-1 악성채권: `BadDebtDetail.tsx` → `actions.ts` 연동 *(다른 세션에서 진행)*
- A-2 팝업: `[id]/page.tsx`, `[id]/edit/page.tsx` → `actions.ts` 연동
- B-1~B-6: 상세 페이지 및 CRUD → `actions.ts` 연동
+| Phase | 항목 | 발견된 문제 |
+|-------|------|------------|
+| B-2 | 매입 관리 | **MOCK_ACCOUNTS, MOCK_VENDORS** 사용 (PurchaseDetailModal) |
+| C-1 | 직원 관리 | `TODO: 파일 업로드`, `console.log('Invite user')` |
+| D-4 | 근태 설정 | **MOCK_DEPARTMENTS** 사용 |
+| F-1~4 | 결재 시스템 | **MOCK_EMPLOYEES** 사용 (결재선/참조자 선택) |
+
+#### 📋 문서에 누락된 모듈 (Phase J~L로 추가됨)
+
+| 카테고리 | 경로 | Mock 사용 현황 |
+|----------|------|---------------|
+| **게시판** | `/board/*` | MOCK_BOARDS, MOCK_DEPARTMENTS |
+| **FAQ** | `/customer-center/faq` | MOCK_FAQS 전체 사용 |
+| **이벤트** | `/customer-center/events` | MOCK_EVENTS 전체 사용 |
+| **문의** | `/customer-center/inquiries` | MOCK_INQUIRIES, MOCK_REPLY, MOCK_COMMENTS |
+| **공지사항** | `/customer-center/notices` | MOCK_NOTICES 전체 사용 |
+| **공정관리** | `/master-data/process-management` | TODO + console.log |
+| **견적** | `/sales/quote-management` | TODO (writer, 발주처 데이터) |
+
+#### 📁 mockData.ts 삭제 대상
+
+```
+react/src/components/
+├── production/ProductionDashboard/mockData.ts   ← G-3
+├── production/WorkOrders/mockData.ts            ← G-1 (부분 사용)
+├── production/WorkResults/mockData.ts           ← G-2 (부분 사용)
+├── quality/InspectionManagement/mockData.ts     ← G-5
+├── material/ReceivingManagement/mockData.ts     ← H-1 연동 완료
+├── material/StockStatus/mockData.ts             ← H-2 연동 완료
+├── outbound/ShipmentManagement/mockData.ts      ← H-3 연동 완료
+└── reports/mockData.ts                          ← 확인 필요
+```

 ### 1.5 작업 진행 정책

 > **단위 작업 → 검수 → 승인 → 문서 업데이트 → 커밋** 순서로 진행

+### 1.6 세션 규칙 및 Serena 메모리 관리
+
+> **세션 간 일관성 보장을 위한 필수 규칙**
+
+#### 세션 시작 프로토콜 (필수)
+
+```
+1. Serena 메모리 로드
+   read_memory("mock-to-api-state")     → 현재 Phase/작업 확인
+   read_memory("mock-to-api-snapshot")  → 마지막 작업 내용 확인
+
+2. 현재 상태 확인
+   - 이 문서 읽기
+   - 현재 Phase의 기능별 상태 확인
+   - "다음 작업은 [Phase]-[번호]의 [기능] 입니다" 명시
+
+3. 작업 범위 명확화
+   - 사용자에게 작업 범위 확인
+   - "[Phase] 전체를 진행할까요, 특정 기능만 진행할까요?"
+```
+
+#### Serena 메모리 구조
+
+```javascript
+// mock-to-api-state
+{
+  "current_phase": "G",
+  "current_item": "G-1",
+  "current_feature": "목록 조회",
+  "progress": {
+    "G-1": { "목록": "완료", "상세": "진행중", "등록": "대기" }
+  },
+  "last_update": "2025-12-26 14:30"
+}
+
+// mock-to-api-snapshot
+"G-1 작업지시관리: 목록 조회 API 연동 완료.
+ 다음: 상세 조회 연동 예정"
+```
+
+#### 작업 완료 시 (필수)
+
+```
+1. 문서 업데이트
+   - 해당 기능 상태 변경 (⏳ → ✅)
+   - 변경 이력 추가
+
+2. Serena 메모리 저장
+   write_memory("mock-to-api-state", 현재 상태)
+   write_memory("mock-to-api-snapshot", 작업 내용 요약)
+
+3. 커밋
+   feat: [Phase명] 번호 작업명 - 기능 설명
+```
+
+### 1.7 작업 템플릿 (표준)
+
+> **각 기능별 작업 시 사용하는 표준 템플릿**
+
+```markdown
+## [Phase-번호] 페이지명 - [기능명] 연동
+
+**작업 대상:**
+- 컴포넌트: `ComponentName.tsx`
+- 액션: `actions.ts`
+- API: `GET/POST/PUT/DELETE /api/v1/endpoint`
+
+**작업 절차:**
+1. [ ] API 스펙 확인 (Swagger)
+2. [ ] actions.ts 함수 확인/생성
+3. [ ] 타입 정의 확인 (API ↔ Frontend)
+4. [ ] 컴포넌트에서 actions 호출
+5. [ ] console.log/MOCK 제거
+6. [ ] 브라우저 테스트
+
+**결과:**
+- [ ] 검수 요청
+- [ ] [승인] 문서 업데이트
+- [ ] [승인] 커밋
+```
+
 ```
 ┌─────────────────────────────────────────────────────────────────┐
 │  📋 작업 흐름 (페이지 단위)                                       │
@@ -285,7 +388,109 @@ ListClient.tsx (클라이언트)
 - **특성**: 단일 레코드 설정 관리 → 등록/삭제 불필요
 - **상태**: ✅ 완료

-### 2.10 상세 페이지 Mock 현황
+### 2.10 Phase J: 게시판 시스템
+
+> **2025-12-26 전수 조사 결과**: MOCK_BOARDS, MOCK_DEPARTMENTS 사용 중
+
+| # | 페이지 | React 경로 | 조회 | 등록 | 수정 | 삭제 | 비고 |
+|---|--------|-----------|------|------|------|------|------|
+| J-1 | 게시판 목록 | `/board` | 🔄 Mock | ⏭️ | ⏭️ | ⏭️ | MOCK_BOARDS 사용 |
+| J-2 | 게시글 상세 | `/board/[id]` | 🔄 Mock | ⏭️ | 🔄 | 🔄 | TODO + console.log |
+| J-3 | 게시글 작성/수정 | `/board/[id]/edit` | 🔄 Mock | 🔄 | 🔄 | ⏭️ | MOCK_BOARDS 사용 |
+| J-4 | 게시판 관리 | `/board/board-management` | 🔄 Mock | 🔄 | 🔄 | 🔄 | MOCK_DEPARTMENTS 사용 |
+
+**파일 구조:**
+```
+components/board/
+├── types.ts           ← MOCK_BOARDS (삭제 대상)
+├── BoardForm/         ← MOCK_BOARDS 사용
+├── BoardDetail/       ← TODO + console.log
+├── BoardList/         ← MOCK_BOARDS 사용
+└── BoardManagement/
+    ├── types.ts       ← MOCK_DEPARTMENTS (삭제 대상)
+    └── BoardForm.tsx  ← MOCK_DEPARTMENTS 사용
+```
+
+### 2.11 Phase K: 고객센터
+
+> **2025-12-26 전수 조사 결과**: 전체 Mock 데이터 사용 (MOCK_* 상수)
+
+| # | 페이지 | React 경로 | 조회 | 등록 | 수정 | 삭제 | 비고 |
+|---|--------|-----------|------|------|------|------|------|
+| K-1 | FAQ 관리 | `/customer-center/faq` | 🔄 Mock | 🔄 | 🔄 | 🔄 | **MOCK_FAQS** 전체 사용 |
+| K-2 | 이벤트 관리 | `/customer-center/events` | 🔄 Mock | 🔄 | 🔄 | 🔄 | **MOCK_EVENTS** 전체 사용 |
+| K-3 | 공지사항 관리 | `/customer-center/notices` | 🔄 Mock | 🔄 | 🔄 | 🔄 | **MOCK_NOTICES** 전체 사용 |
+| K-4 | 문의 관리 | `/customer-center/inquiries` | 🔄 Mock | 🔄 | 🔄 | 🔄 | **MOCK_INQUIRIES, MOCK_REPLY, MOCK_COMMENTS** |
+
+**파일 구조:**
+```
+components/customer-center/
+├── FAQManagement/
+│   ├── types.ts      ← MOCK_FAQS (삭제 대상)
+│   └── FAQList.tsx   ← MOCK_FAQS 사용
+├── EventManagement/
+│   ├── types.ts      ← MOCK_EVENTS (삭제 대상)
+│   └── EventList.tsx ← MOCK_EVENTS 사용
+├── NoticeManagement/
+│   ├── types.ts      ← MOCK_NOTICES (삭제 대상)
+│   └── NoticeList.tsx ← MOCK_NOTICES 사용
+└── InquiryManagement/
+    ├── types.ts      ← MOCK_INQUIRIES, MOCK_REPLY, MOCK_COMMENTS (삭제 대상)
+    ├── InquiryList.tsx ← MOCK_INQUIRIES 사용
+    ├── InquiryDetail.tsx ← TODO + console.log
+    └── InquiryForm.tsx ← TODO + console.log
+```
+
+### 2.12 Phase L: 기타 모듈
+
+> **2025-12-26 전수 조사 결과**: TODO + console.log 사용
+
+| # | 페이지 | React 경로 | 조회 | 등록 | 수정 | 삭제 | 비고 |
+|---|--------|-----------|------|------|------|------|------|
+| L-1 | 공정 관리 | `/master-data/process-management` | 🔄 | 🔄 | 🔄 | 🔄 | TODO + console.log |
+| L-2 | 견적 관리 | `/sales/quote-management` | 🔄 | 🔄 | 🔄 | 🔄 | TODO (writer, 발주처) |
+| L-3 | 종합 분석 | `/reports/comprehensive-analysis` | ✅ | ⏭️ | ⏭️ | ⏭️ | console.log (승인/반려) |
+
+**L-1 공정 관리:**
+- `ProcessListClient.tsx` - TODO: 삭제 확인 모달 및 API 연동
+- `ProcessForm.tsx` - console.log (등록/수정 데이터)
+
+**L-2 견적 관리:**
+- `QuoteRegistration.tsx` - TODO: 로그인 사용자 정보, 발주처 API
+
+**L-3 종합 분석:**
+- `ComprehensiveAnalysis/index.tsx` - console.log (승인/반려)
+
+### 2.13 Phase M: 잔여 작업 (Phase A-F 보완)
+
+> **2025-12-26 전수 조사 결과**: "완료" 표시됐지만 Mock/TODO 잔존
+
+| # | 페이지 | 문제 유형 | 상세 |
+|---|--------|----------|------|
+| M-1 | 매입 상세 모달 | **MOCK 상수** | `MOCK_ACCOUNTS`, `MOCK_VENDORS` 사용 (PurchaseDetailModal.tsx) |
+| M-2 | 직원 관리 | **TODO** | 파일 업로드 처리, Invite user console.log |
+| M-3 | 근태 설정 | **MOCK 상수** | `MOCK_DEPARTMENTS` 사용 |
+| M-4 | 결재 문서 생성 | **MOCK 상수** | `MOCK_EMPLOYEES` 사용 (ApprovalLineSection, ReferenceSection) |
+| M-5 | 결재함/기안함 | **console.log** | 승인/반려/수정/복제 버튼 |
+| M-6 | 구독 관리 | **TODO** | 자료 내보내기, 서비스 해지 |
+| M-7 | 계정 정보 | **TODO** | 탈퇴/사용중지 API 연동 |
+
+**M-1 매입 상세 모달 (PurchaseDetailModal.tsx):**
+```typescript
+// 삭제 필요
+const MOCK_ACCOUNTS = [...];
+const MOCK_VENDORS = [...];
+// → 계좌/거래처 API로 대체
+```
+
+**M-4 결재 문서 생성 (DocumentCreate/):**
+```typescript
+// 삭제 필요
+export const MOCK_EMPLOYEES: ApprovalPerson[] = [...];
+// → 직원 목록 API (getActiveEmployees)로 대체
+```
+
+### 2.14 상세 페이지 Mock 현황

 > 리스트 페이지 API 연동 완료 후 상세 페이지 연동 필요