🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
30 KiB
React Mock → API 마이그레이션 - 잔여 작업
작성일: 2025-12-27 목적: 미완료 Mock → API 연동 작업 추적 원본 문서:
react-mock-to-api-migration-plan.md참조 구현: 단가관리 (/sales/pricing-management)
0. 로컬 개발 환경
도메인 구성
| 서비스 | 도메인 | 설명 |
|---|---|---|
| React (프론트엔드) | http://dev.sam.kr |
사용자 화면 |
| API (백엔드) | http://api.sam.kr |
REST API 서버 |
| MNG (운영관리자) | http://mng.sam.kr |
관리자 패널 |
테스트 URL 예시
# 종합분석 페이지
http://dev.sam.kr/reports/comprehensive-analysis
# API 직접 호출
http://api.sam.kr/api/v1/comprehensive-analysis
테스트 대상 테넌트
| 항목 | 값 | 비고 |
|---|---|---|
| Tenant ID | 287 | 프론트_테스트회사 |
| 테스트 User ID | 33 | 홍킬동 (hhhhhh@example.com) |
| 보조 User ID | 12 | Ops Admin (결재함/참조함 테스트용 기안자) |
⚠️ 주의: Seeder 및 테스트 데이터 생성 시 반드시
tenant_id = 287,user_id = 33사용
로그인 정보
| 사용자 | 비밀번호 | Tenant | |
|---|---|---|---|
| 홍킬동 | hhhhhh@example.com | (확인 필요) | 287 (기본) |
종합분석 페이지 작업 시 주의사항
⚠️ 필수: 종합분석은 여러 모듈의 데이터를 통합 표시하므로, 데이터 수정 시 관련 페이지 점검 필수
| 종합분석 섹션 | 원본 데이터 | 관련 페이지 (점검 대상) |
|---|---|---|
| 오늘의 이슈 (결재 대기) | approvals, approval_steps |
/approval/draft (기안함), /approval/pending (결재함), /approval/reference (참조함) |
| 월간 예상 지출 | expected_expenses |
/accounting/expected-expenses |
| 입금 현황 | deposits |
/accounting/deposits |
| 채권추심 | bad_debts |
/accounting/bad-debts |
| 미수금/여신한도 | clients |
/sales/clients |
작업 흐름:
종합분석 데이터 수정 → 종합분석 페이지 확인 → 관련 원본 페이지 점검
1. 작업 규칙
1.0 아키텍처 원칙 (필수)
React는 오직
api.sam.kr(api 프로젝트)만 호출한다
┌─────────────┐ ┌─────────────┐ ┌─────────────┐
│ react/ │ ───► │ api/ │ │ mng/ │
│ dev.sam.kr │ │ api.sam.kr │ │ mng.sam.kr │
│ (프론트엔드) │ │ (REST API) │ │ (관리자패널) │
└─────────────┘ └─────────────┘ └─────────────┘
│ │ │
│ ✅ 호출 허용 │ │
└────────────────────┘ │
│
❌ 절대 호출 금지 ─────────────────────────┘
규칙:
- React에서 mng API 직접 호출 절대 금지
- 필요한 API가 api 프로젝트에 없으면 api에 새로 개발
- mng의 모델/로직은 참조만 (코드 복사 또는 재구현)
1.1 작업 진행 정책
단위 작업 → 검수 → 승인 → 문서 업데이트 → 커밋 순서로 진행
1.2 세션 규칙 및 Serena 메모리 관리
세션 간 일관성 보장을 위한 필수 규칙
세션 시작 프로토콜 (필수)
1. Serena 메모리 로드
read_memory("mock-to-api-state") → 현재 Phase/작업 확인
read_memory("mock-to-api-snapshot") → 마지막 작업 내용 확인
2. 현재 상태 확인
- 이 문서 읽기
- 현재 Phase의 기능별 상태 확인
- "다음 작업은 [Phase]-[번호]의 [기능] 입니다" 명시
3. 작업 범위 명확화
- 사용자에게 작업 범위 확인
- "[Phase] 전체를 진행할까요, 특정 기능만 진행할까요?"
Serena 메모리 구조
// mock-to-api-state
{
"current_phase": "J",
"current_item": "J-1",
"current_feature": "게시판 목록",
"progress": {
"J-1": { "목록": "대기", "상세": "대기" }
},
"last_update": "2025-12-27"
}
// mock-to-api-snapshot
"Phase J 게시판 시스템 시작 예정"
작업 완료 시 (필수)
1. 문서 업데이트
- 해당 기능 상태 변경 (🔄 → ✅)
- 변경 이력 추가
2. Serena 메모리 저장
write_memory("mock-to-api-state", 현재 상태)
write_memory("mock-to-api-snapshot", 작업 내용 요약)
3. 커밋
feat: [Phase]-[번호] [페이지명] Mock → API 연동
1.3 작업 템플릿 (표준)
## [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. [ ] 브라우저 테스트
**결과:**
- [ ] 검수 요청
- [ ] [승인] 문서 업데이트
- [ ] [승인] 커밋
┌─────────────────────────────────────────────────────────────────┐
│ 📋 작업 흐름 (페이지 단위) │
├─────────────────────────────────────────────────────────────────┤
│ 1️⃣ 작업 시작: 대상 페이지 Mock → API 연동 작업 │
│ 2️⃣ 작업 완료: 코드 수정 완료 후 사용자에게 검수 요청 │
│ 3️⃣ 검수: 사용자가 기능 확인 (브라우저 테스트) │
│ 4️⃣ [승인] 문서 업데이트: 이 문서의 상태 갱신 │
│ 5️⃣ [승인] 커밋: Git 커밋 생성 │
│ 6️⃣ 다음 페이지로 이동 │
└─────────────────────────────────────────────────────────────────┘
⚠️ 중요 규칙:
- 각 단계에서
[승인]표시된 작업은 사용자 승인 후 진행
2. 잔여 작업 목록
2.1 Phase J: 게시판 시스템
상태: ✅ api 프로젝트에 게시판/게시글 API 완비 → React 연동 작업 가능
✅ api 프로젝트 게시판 API 아키텍처
핵심 설계: 시스템 게시판과 테넌트 게시판을 별도 엔드포인트로 분리하고, code 기반 URL 사용
시스템 게시판 (본사 운영) 테넌트 게시판 (테넌트 내부)
┌─────────────────────────────┐ ┌─────────────────────────────┐
│ /api/v1/system-boards/{code}│ │ /api/v1/boards/{code} │
│ - is_system = true │ │ - is_system = false │
│ - tenant_id = null │ │ - tenant_id = {current} │
│ - 메뉴 → global_menus │ │ - 메뉴 → menus │
└─────────────────────────────┘ └─────────────────────────────┘
장점:
- 동일한
board_code도 시스템/테넌트에서 독립 사용 가능 - API 호출 시
is_system플래그 불필요 - URL만으로 게시판 유형 구분 가능
- RESTful 원칙 준수
📌 시스템 게시판 API (System Boards)
| 기능 | Method | Endpoint (api.sam.kr) | 상태 |
|---|---|---|---|
| 시스템 게시판 목록 | GET | /api/v1/system-boards |
✅ |
| 시스템 게시판 상세 | GET | /api/v1/system-boards/{code} |
✅ |
| 시스템 게시판 필드 | GET | /api/v1/system-boards/{code}/fields |
✅ |
| 시스템 게시글 목록 | GET | /api/v1/system-boards/{code}/posts |
✅ |
| 시스템 게시글 상세 | GET | /api/v1/system-boards/{code}/posts/{id} |
✅ |
| 시스템 게시글 등록 | POST | /api/v1/system-boards/{code}/posts |
✅ |
| 시스템 게시글 수정 | PUT | /api/v1/system-boards/{code}/posts/{id} |
✅ |
| 시스템 게시글 삭제 | DELETE | /api/v1/system-boards/{code}/posts/{id} |
✅ |
| 시스템 댓글 CRUD | * | /api/v1/system-boards/{code}/posts/{id}/comments/* |
✅ |
📌 테넌트 게시판 API (Tenant Boards)
| 기능 | Method | Endpoint (api.sam.kr) | 상태 |
|---|---|---|---|
| 테넌트 게시판 목록 | GET | /api/v1/boards |
✅ |
| 테넌트 게시판 상세 | GET | /api/v1/boards/{code} |
🔄 변경 필요 (ID→code) |
| 테넌트 게시판 필드 | GET | /api/v1/boards/{code}/fields |
✅ |
| 테넌트 게시글 목록 | GET | /api/v1/boards/{code}/posts |
✅ |
| 테넌트 게시글 상세 | GET | /api/v1/boards/{code}/posts/{id} |
✅ |
| 테넌트 게시글 등록 | POST | /api/v1/boards/{code}/posts |
✅ |
| 테넌트 게시글 수정 | PUT | /api/v1/boards/{code}/posts/{id} |
✅ |
| 테넌트 게시글 삭제 | DELETE | /api/v1/boards/{code}/posts/{id} |
✅ |
| 테넌트 댓글 CRUD | * | /api/v1/boards/{code}/posts/{id}/comments/* |
✅ |
📌 관리자 게시판 API (Admin - mng.sam.kr)
| 기능 | Method | Endpoint (mng.sam.kr) | 상태 |
|---|---|---|---|
| 전체 게시판 목록 | GET | /boards (Blade) |
✅ |
| 게시판 등록 | POST | /boards |
✅ |
| 게시판 수정 | PUT | /boards/{id} |
✅ |
| 게시판 삭제 | DELETE | /boards/{id} |
✅ |
| 게시판 CRUD 시 메뉴 자동 연동 | - | mng + api 프로젝트 | ✅ 완료 |
📌 테넌트 게시판 메뉴 연동 (api 프로젝트)
2025-12-29 추가: 테넌트 게시판 생성/수정/삭제 시 메뉴 자동 연동
| 기능 | 트리거 | 메뉴 처리 | 상태 |
|---|---|---|---|
| 게시판 생성 | BoardService::createTenantBoard() |
/board 하위에 메뉴 자동 추가 |
✅ |
| 게시판 수정 | BoardService::updateTenantBoard() |
코드/이름 변경 시 메뉴 URL/이름 동기화 | ✅ |
| 게시판 삭제 | BoardService::deleteTenantBoard() |
메뉴 Soft Delete | ✅ |
구현 파일:
api/app/Services/MenuService.php- 게시판 메뉴 연동 메서드 추가api/app/Services/Boards/BoardService.php- MenuService 호출 로직 추가
🏗️ 게시판 시스템 아키텍처 (참조용)
EAV (Entity-Attribute-Value) 패턴 기반 통합 게시판:
boards (게시판 정의)
├── board_settings (EAV 필드 스키마)
├── posts (게시글)
│ └── post_custom_field_values (EAV 값 저장)
└── 첨부파일 (Polymorphic: files → fileable)
게시판 모델 주요 필드:
interface Board {
id: number;
tenant_id?: number; // null = 시스템 게시판
is_system: boolean; // 시스템/테넌트 구분
board_type: string; // notice, qna, faq, free, gallery, download
board_code: string; // 고유 코드
name: string;
description?: string;
editor_type: 'wysiwyg' | 'markdown' | 'text';
allow_files: boolean;
max_file_count: number;
max_file_size: number; // KB
extra_settings: { // JSON
allow_comment?: boolean;
allow_secret?: boolean;
write_roles?: string[];
read_roles?: string[];
};
is_active: boolean;
}
interface BoardSetting { // EAV 필드 스키마
id: number;
board_id: number;
name: string; // 필드명 (예: 카테고리)
field_key: string; // 필드 키 (예: category)
field_type: 'text' | 'number' | 'select' | 'date' | 'textarea' | 'checkbox' | 'radio' | 'file';
field_meta?: { // JSON (select 옵션, 기본값 등)
options?: string[];
default?: string;
};
is_required: boolean;
sort_order: number;
}
템플릿 시스템 (config/board_templates.php):
- 시스템 템플릿: notice, qna, faq, popup (본사 ↔ 테넌트 소통용)
- 테넌트 템플릿: free, gallery, download, notice, qna (테넌트 내부용)
📋 React 연동 작업 현황
| # | 페이지 | React 경로 | 조회 | 등록 | 수정 | 삭제 | API 연동 전략 |
|---|---|---|---|---|---|---|---|
| J-1 | 게시판 목록 | /board |
✅ | ⏭️ | ⏭️ | ✅ | ✅ 완료 (2025-12-29) - actions.ts getPosts/getMyPosts |
| J-2 | 게시글 상세 | /board/[boardCode]/[postId] |
✅ | ⏭️ | ⏭️ | ✅ | ✅ 완료 (2025-12-29) - actions.ts getPost/deletePost |
| J-3 | 게시글 작성/수정 | /board/[boardCode]/[postId]/edit |
✅ | ✅ | ✅ | ⏭️ | ✅ 완료 (2025-12-29) - actions.ts createPost/updatePost |
| J-4 | 게시판 관리 | /board/board-management |
✅ | ✅ | ✅ | ✅ | ✅ 완료 (2025-12-27) |
✅ Phase J 완료 (2025-12-29): 모든 게시판 Mock → API 연동 완료
파일 구조 (완료):
components/board/
├── types.ts ← ✅ Post, Comment, PostApiData 등 API 타입 정의
├── actions.ts ← ✅ Server Actions (getPosts, getPost, createPost, updatePost, deletePost)
├── BoardForm/ ← ✅ getBoards + createPost/updatePost API 연동
├── BoardDetail/ ← ✅ 게시글 상세 + 삭제 API 연동
├── BoardList/ ← ✅ 게시판별 필터링 + 페이지네이션 + 삭제
└── BoardManagement/
├── types.ts ← ✅ Board 관리 타입
├── actions.ts ← ✅ getBoards, createBoard, updateBoard, deleteBoard
└── index.tsx ← ✅ 게시판 CRUD 완료
라우트 변경:
- 기존:
/board/[id]→ 신규:/board/[boardCode]/[postId] - 삭제된 파일:
board/[id]/page.tsx,board/[id]/edit/page.tsx
2.2 Phase K: 고객센터
상태: ✅ React 연동 완료 (2025-12-29) -
shared/actions.ts통해 시스템 게시판 API 호출
🎯 통합 전략: 고객센터 = 게시판 템플릿 활용
각 고객센터 메뉴를 별도 board_code로 생성하여 통합 관리:
| 메뉴 | board_code | board_type | 템플릿 | 커스텀 필드 |
|---|---|---|---|---|
| FAQ | system-faq |
faq | system/faq | category (select) |
| 공지사항 | system-notice |
notice | system/notice | category (select) |
| 이벤트 | system-event |
notice | - | start_date, end_date, image_url |
| 1:1 문의 | system-qna |
qna | system/qna | inquiry_type, answer_status |
장점:
- 코드 중복 제거 (게시판 CRUD 재사용)
- 커스텀 필드로 각 메뉴 특성 반영
- 관리자 UI 통합 (mng.sam.kr/boards에서 일괄 관리)
📋 React 연동 작업 현황
| # | 페이지 | React 경로 | 조회 | 등록 | 수정 | 삭제 | API 연동 전략 |
|---|---|---|---|---|---|---|---|
| K-1 | FAQ 관리 | /customer-center/faq |
✅ | ⏭️ | ⏭️ | ⏭️ | ✅ 완료 (2025-12-29) - shared/actions.ts |
| K-2 | 이벤트 관리 | /customer-center/events |
✅ | ⏭️ | ⏭️ | ⏭️ | ✅ 완료 (2025-12-29) - shared/actions.ts |
| K-3 | 공지사항 관리 | /customer-center/notices |
✅ | ⏭️ | ⏭️ | ⏭️ | ✅ 완료 (2025-12-29) - shared/actions.ts |
| K-4 | 문의 관리 | /customer-center/inquiries |
✅ | ✅ | ✅ | ✅ | ✅ 완료 (2025-12-29) - shared/actions.ts + 댓글 CRUD |
파일 구조 → 연동 계획:
components/customer-center/
├── shared/
│ ├── types.ts ← 🆕 공통 Post, BoardField 타입
│ ├── actions.ts ← 🆕 게시글 CRUD Server Actions (board_code 파라미터)
│ └── PostForm.tsx ← 🆕 동적 폼 (커스텀필드 기반)
├── FAQManagement/
│ ├── types.ts ← 🔄 FAQ 특화 타입 (category 필드)
│ ├── actions.ts ← 🆕 board_code='system-faq' 고정
│ └── FAQList.tsx ← 🔄 카테고리별 그룹핑 UI
├── EventManagement/
│ ├── types.ts ← 🔄 Event 특화 타입 (start_date, end_date)
│ ├── actions.ts ← 🆕 board_code='system-event' 고정
│ └── EventList.tsx ← 🔄 진행중/예정/종료 필터
├── NoticeManagement/
│ ├── types.ts ← 🔄 Notice 특화 타입
│ ├── actions.ts ← 🆕 board_code='system-notice' 고정
│ └── NoticeList.tsx ← 🔄 공지 목록 UI
└── InquiryManagement/
├── types.ts ← 🔄 Inquiry 특화 타입 (answer_status)
├── actions.ts ← 🆕 board_code='system-qna' 고정
├── InquiryList.tsx ← 🔄 답변대기/완료 필터
├── InquiryDetail.tsx ← 🔄 문의 상세 + 답변 작성
└── InquiryForm.tsx ← 🔄 문의 등록 폼
🛠️ 구현 순서 (권장)
Step 1: mng에서 시스템 게시판 생성
mng.sam.kr/boards → 템플릿으로 생성:
- system-faq (FAQ 템플릿)
- system-notice (공지사항 템플릿)
- system-event (커스텀: 이벤트)
- system-qna (1:1문의 템플릿)
Step 2: React 공통 모듈 개발 (✅ 게시판/게시글 API 이미 완비)
react/src/lib/board/
├── types.ts ← API 타입 정의
├── actions.ts ← 게시글 CRUD Server Actions
└── utils.ts ← 커스텀필드 렌더링 유틸
Step 3: 각 메뉴별 연동
K-3 공지사항 (가장 단순) → K-1 FAQ → K-2 이벤트 → K-4 문의 (가장 복잡)
💡 커스텀 필드 동적 렌더링 전략
// 게시판 필드 스키마 기반 동적 폼 생성
function renderCustomField(field: BoardSetting, value: string | null) {
switch (field.field_type) {
case 'text': return <Input {...} />;
case 'select': return <Select options={field.field_meta?.options} {...} />;
case 'date': return <DatePicker {...} />;
case 'textarea': return <Textarea {...} />;
case 'checkbox': return <Checkbox {...} />;
// ...
}
}
// 게시글 작성 시 커스텀필드 값 저장
const formData = {
title: '...',
content: '...',
custom_fields: {
category: '이용안내', // field_key: value
answer_status: '대기중',
}
};
2.3 Phase L: 설정 및 시스템 관리
상태: 🔄 분석 완료 - 일부 API 연동 필요
📋 React 연동 작업 현황
| # | 페이지 | React 경로 | Mock 데이터 | API 연동 | 상태 | 작업 계획 |
|---|---|---|---|---|---|---|
| L-1 | 계정관리 | /settings/accounts |
❌ | ✅ CRUD | ✅ 완료 | 데이터 확인 |
| L-2 | 권한관리 | /settings/permissions |
✅ defaultPermissions + localStorage | ❌ | 🔴 미연동 | API 개발 필요 |
| L-3 | 직급관리 | /settings/ranks |
❌ | ✅ positions API (type=rank) | ✅ 완료 | 통합 positions 테이블 |
| L-4 | 직책관리 | /settings/titles |
❌ | ✅ positions API (type=title) | ✅ 완료 | 통합 positions 테이블 |
| L-5 | 출퇴근설정 | /settings/attendance-settings |
✅ MOCK_DEPARTMENTS | 🔄 부분 | 🟡 부분완료 | 부서 API 연동 필요 |
| L-6 | 휴가정책 | /settings/leave-policy |
❌ | ✅ GET/PUT | ✅ 완료 | 데이터 확인 |
| L-7 | 근무일정 | /settings/work-schedule |
❌ | ✅ GET/PUT | ✅ 완료 | 데이터 확인 |
| L-8 | 알림설정 | /settings/notification-settings |
❌ (fallback만) | ✅ GET/PUT | ✅ 완료 | 데이터 확인 |
| L-9 | 팝업관리 | /settings/popup-management |
⚠️ MOCK_POPUPS (미사용) | ✅ CRUD | ✅ 완료 | Mock 제거 |
| L-10 | 회사정보 | /company-info |
❌ | ✅ GET/PUT | ✅ 완료 | 데이터 확인 |
| L-11 | 구독관리 | /subscription |
❌ | ✅ 조회/취소 | ✅ 완료 | 데이터 확인 |
🛠️ 작업 계획 상세
🔴 API 개발 필요 (1개)
| 페이지 | 필요한 API | 모델/테이블 | 우선순위 |
|---|---|---|---|
| L-2 권한관리 | /api/v1/roles CRUD |
roles, role_permissions | 높음 |
✅ API 개발 완료 (2개) - 2025-12-30
| 페이지 | API | 모델/테이블 | 비고 |
|---|---|---|---|
| L-3 직급관리 | /api/v1/positions?type=rank |
positions | 통합 테이블 |
| L-4 직책관리 | /api/v1/positions?type=title |
positions | 통합 테이블 |
🟡 부분 연동 필요 (1개)
| 페이지 | 현재 상태 | 필요 작업 |
|---|---|---|
| L-5 출퇴근설정 | 설정 API 연동 완료 | 부서 목록 getDepartments() API 연동 필요 (MOCK_DEPARTMENTS 제거) |
⚠️ Mock 제거 필요 (1개)
| 파일 | 현재 상태 | 작업 |
|---|---|---|
PopupManagement/types.ts |
MOCK_POPUPS 정의됨 (실제 미사용) | 불필요한 Mock 코드 제거 |
📊 API 연동 완료 페이지 상세
| # | 페이지 | actions.ts 함수 | API Endpoint |
|---|---|---|---|
| L-1 | 계정관리 | getBankAccounts, createBankAccount, updateBankAccount, deleteBankAccount | /api/v1/bank-accounts |
| L-6 | 휴가정책 | getLeavePolicy, updateLeavePolicy | /api/v1/leave-policy |
| L-7 | 근무일정 | getWorkSetting, updateWorkSetting | /api/v1/settings/work |
| L-8 | 알림설정 | getNotificationSettings, saveNotificationSettings | /api/v1/settings/notifications |
| L-9 | 팝업관리 | getPopups, getPopupById, createPopup, updatePopup, deletePopup | /api/v1/popups |
| L-10 | 회사정보 | getCompanyInfo, updateCompanyInfo | /api/v1/tenants |
| L-11 | 구독관리 | getSubscriptionData, cancelSubscription, requestDataExport | /api/v1/subscriptions/* |
🗂️ 파일 구조
components/settings/
├── AccountManagement/
│ ├── index.tsx ← ✅ API 연동 완료
│ ├── actions.ts ← ✅ bank-accounts CRUD
│ ├── AccountDetail.tsx ← ✅ 상세/수정 API 연동
│ └── types.ts
├── PermissionManagement/
│ ├── index.tsx ← ❌ localStorage + defaultPermissions
│ ├── PermissionDetail.tsx
│ └── types.ts ← ❌ actions.ts 없음
├── RankManagement/
│ ├── index.tsx ← ✅ API 연동 완료 (positions API type=rank)
│ ├── RankDialog.tsx ← ✅ 수정 완료
│ └── types.ts ← ✅ 타입 정의 완료
├── TitleManagement/
│ ├── index.tsx ← ✅ API 연동 완료 (positions API type=title)
│ ├── TitleDialog.tsx ← ✅ 수정 완료
│ └── types.ts ← ✅ 타입 정의 완료
├── AttendanceSettingsManagement/
│ ├── index.tsx ← 🔄 부분 연동 (MOCK_DEPARTMENTS 사용)
│ ├── actions.ts ← ✅ 설정 API 연동
│ └── types.ts ← ✅ MOCK_DEPARTMENTS 정의
├── LeavePolicyManagement/
│ ├── index.tsx ← ✅ API 연동 완료
│ ├── actions.ts ← ✅ leave-policy GET/PUT
│ └── types.ts
├── WorkScheduleManagement/
│ ├── index.tsx ← ✅ API 연동 완료
│ ├── actions.ts ← ✅ settings/work GET/PUT
│ └── types.ts
├── NotificationSettings/
│ ├── index.tsx ← ✅ API 연동 완료
│ ├── actions.ts ← ✅ settings/notifications GET/PUT
│ └── types.ts
├── PopupManagement/
│ ├── index.tsx ← ✅ API 연동 완료
│ ├── PopupList.tsx ← ✅ 목록 API 연동
│ ├── PopupForm.tsx ← ✅ 등록/수정 API 연동
│ ├── actions.ts ← ✅ popups CRUD
│ └── types.ts ← ⚠️ MOCK_POPUPS (미사용, 제거 대상)
├── CompanyInfoManagement/
│ ├── index.tsx ← ✅ API 연동 완료
│ ├── actions.ts ← ✅ tenants GET/PUT
│ └── types.ts
└── SubscriptionManagement/
├── SubscriptionManagement.tsx ← ✅ API 연동 완료
├── actions.ts ← ✅ subscriptions API
└── types.ts
3. 잔여 Mock 파일 (정리 완료)
2025-12-29 정리 완료: 모든 미사용 Mock 파일 삭제, 유틸리티만 유지
3.1 Production/Quality Mock 파일 (✅ 정리 완료)
삭제된 파일 (4개):
react/src/components/
├── production/ProductionDashboard/mockData.ts ← ✅ 삭제 (미사용)
├── production/WorkOrders/mockData.ts ← ✅ 삭제 (미사용)
├── production/WorkResults/mockData.ts ← ✅ 삭제 (미사용)
└── reports/mockData.ts ← ✅ 삭제 (formatAmount 중복)
유틸리티만 유지 (1개):
react/src/components/
└── quality/InspectionManagement/mockData.ts ← ✅ 유틸리티만 유지
- inspectionItemsTemplate, inspectionTypeLabels
- statusColorMap, judgmentColorMap
- judgeMeasurement()
3.2 Settings Mock 데이터 (Phase L)
react/src/components/settings/
├── PermissionManagement/index.tsx ← defaultPermissions (하드코딩, 삭제 대상)
├── RankManagement/index.tsx ← defaultRanks (하드코딩, 삭제 대상)
├── TitleManagement/index.tsx ← defaultTitles (하드코딩, 삭제 대상)
├── AttendanceSettingsManagement/
│ └── types.ts ← MOCK_DEPARTMENTS (API 연동 필요)
└── PopupManagement/
└── types.ts ← MOCK_POPUPS (미사용, 제거 대상)
4. 참고 문서
- API 스펙: http://api.sam.kr/api-docs
- 원본 계획:
react-mock-to-api-migration-plan.md - API 개발 계획:
erp-api-development-plan-d1.0-changes.md - 표준 구현 참조:
/sales/pricing-management
5. 변경 이력
| 날짜 | 작업 | 상세 내용 |
|---|---|---|
| 2025-12-29 | 잔여 Mock 파일 정리 완료 | 미사용 Mock 파일 4개 삭제 (ProductionDashboard, WorkOrders, WorkResults, reports). InspectionManagement/mockData.ts 유틸리티만 유지 (inspectionItemsTemplate, statusColorMap, judgmentColorMap, judgeMeasurement). 304→68줄 감소 |
| 2025-12-29 | Phase L 설정 페이지 분석 완료 | 11개 설정 페이지 분석: 7개 API 연동 완료 (계정관리, 휴가정책, 근무일정, 알림설정, 팝업관리, 회사정보, 구독관리), 3개 API 개발 필요 (권한/직급/직책), 1개 부분 연동 필요 (출퇴근설정-부서). Mock 데이터: MOCK_DEPARTMENTS, MOCK_POPUPS, defaultPermissions/Ranks/Titles |
| 2025-12-29 | 검사 테이블 통합 및 출하 대시보드 수정 | 검사 시스템 통합: 레거시 검사 모델 삭제 (MaterialInspection, MaterialInspectionItem, MaterialReceipt) → 통합 검사 모델 추가 (Inspection.php - IQC/PQC/FQC), 품목 입고 모델 추가 (ItemReceipt.php). 출하 대시보드: ShipmentService stats() 프론트엔드 호환 필드 추가 (today_shipment_count, scheduled_count, shipping_count, urgent_count). 더미 데이터 tenant_id = 287로 수정 |
| 2025-12-29 | api 프로젝트 게시판 메뉴 자동 연동 | 테넌트 게시판 생성/수정/삭제 시 메뉴 자동 연동. MenuService::createMenuForBoard(), updateMenuForBoard(), deleteMenuForBoard() 추가. BoardService에서 호출. 부모 메뉴 /board 하위 배치 |
| 2025-12-29 | K-4 문의 댓글 API 연동 완료 | 댓글 CRUD API 연동 (getComments, createComment, updateComment, deleteComment). BoardComment 모델 replies() 추가, PostService user eager loading 추가, user.id localStorage 저장으로 본인 글 수정/삭제 버튼 표시 |
| 2025-12-29 | Phase J 게시판 시스템 React 연동 완료 | J-1~J-3 완료: board/actions.ts 생성 (getPosts, getPost, createPost, updatePost, deletePost). BoardList, BoardDetail, BoardForm 모두 API 연동. 라우트 변경: /board/[id] → /board/[boardCode]/[postId]. Toast sonner 통일, MOCK_BOARDS 완전 제거 |
| 2025-12-29 | Phase K 고객센터 API 연동 완료 확인 | K-1~K-4 모두 shared/actions.ts 통해 시스템 게시판 API 호출. FAQList, NoticeList, EventList, InquiryList/Form 모두 getPosts() 사용 |
| 2025-12-28 | 시스템 게시판 API 개발 완료 | /api/v1/system-boards/* 엔드포인트 12개 추가 (게시판 3개 + 게시글 5개 + 댓글 4개), SystemBoardController, SystemPostController, Swagger 문서 |
| 2025-12-27 | 게시판 API 아키텍처 개선 | 시스템/테넌트 게시판 엔드포인트 분리 (/system-boards/{code} vs /boards/{code}), ID 기반에서 code 기반 URL로 통일, 메뉴 자동 생성 기능 추가 예정 |
| 2025-12-27 | 종합분석 승인/반려 버그 수정 | ComprehensiveAnalysisService::getTodayIssue() - 현재 사용자가 결재자인 문서만 표시하도록 수정. 이전에는 테넌트의 모든 대기 결재가 표시되어 "결재 순서가 아닙니다" 오류 발생 |
| 2025-12-27 | 테스트 데이터 수정 | ComprehensiveAnalysisSeeder - User 33 (홍킬동) 기준으로 변경 |
| 2025-12-29 | 프로필 이미지 업로드 API 연동 | API: TenantUserProfileService::updateMe() 수정 - profile_photo_path, display_name 고정 필드 직접 처리. React: uploadProfileImage() 액션 추가, handleImageUpload() API 연동. URL 수정: types.ts에서 /storage/tenants/{path} 경로 사용. 심볼릭 링크: storage/app/public/tenants -> ../tenants 추가 |
| 2025-12-27 | 테스트 환경 정보 추가 | 테넌트/사용자 정보, 로그인 정보, 주의사항 추가 |