SamProject/sam-react-prod
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
07374c826c965ce4b4bb2d2dd0d54bdc4b84a8e4
sam-react-prod/claudedocs/archive/sessions/[NEXT-2025-12-13] item-file-upload-session-context.md
유병철 07374c826c refactor(WEB): claudedocs 재정리 및 AuthContext/Zustand/유틸 코드 개선 
- claudedocs 폴더 구조 재정리: archive/sessions, guides/migration·mobile·universal-list, refactoring 분류
- 오래된 세션 컨텍스트/체크리스트 문서 정리 (아카이브 이동 또는 삭제)
- AuthContext → authStore(Zustand) 전환 시작, RootProvider 간소화
- GenericCRUDDialog 공통 다이얼로그 컴포넌트 추가
- PermissionDialog 삭제 → GenericCRUDDialog로 대체
- RankDialog/TitleDialog GenericCRUDDialog 기반으로 리팩토링
- toast-utils.ts 삭제 (미사용)
- fileDownload.ts 개선, excel-download.ts 정리
- menuStore/themeStore Zustand 셀렉터 최적화
- useColumnSettings/useTableColumnStore 기능 보강
- 세금계산서/견적/작업자화면/결재 등 소규모 개선

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-23 17:17:13 +09:00

2.9 KiB
Raw Blame History

품목관리 파일 업로드 세션 컨텍스트

세션 정보

  • 날짜: 2025-12-13
  • 커밋: c026130 - feat: 품목관리 파일 업로드 기능 개선

완료된 작업

1. 파일 업로드 API 파라미터 추가

  • src/lib/api/items.ts의 uploadItemFile 함수에 fieldKey, fileId 파라미터 추가
  • FormData에 field_key, file_id 필드 append

2. 타입 정의 추가

  • src/types/item.ts에 ItemFile, ItemFiles 인터페이스 추가
export interface ItemFile {
  id: number;
  file_name: string;
  file_path: string;
}

export interface ItemFiles {
  bending_diagram?: ItemFile[];
  specification?: ItemFile[];
  certification?: ItemFile[];
}

3. DynamicItemForm 파일 데이터 파싱

  • 새 API 구조 (files 객체) 지원
  • 기존 API 구조 폴백 유지 (하위 호환)
  • 파일 ID 상태 추가: existingSpecificationFileId, existingCertificationFileId, existingBendingDiagramFileId

4. 시방서/인정서 파일 UI 개선

  • 기존: 파일명 표시 + 별도 파일 선택 input
  • 변경: 파일 있으면 [파일명] [⬇️] [✏️] [🗑️] 버튼 UI
  • 파일 없으면 기존 파일 선택 UI 표시

진행 중 (백엔드 대기)

파일 업로드 500 에러

  • 증상: POST /api/proxy/items/{id}/files → 500 에러
  • 원인: 백엔드에서 field_key, file_id 파라미터 처리 미구현
  • Next.js 프록시 로그:
📎 File field: file = 230601_test.pdf (70976 bytes)
📎 Form field: type = certification
📎 Form field: field_key = certification_file
📎 Form field: file_id = 0
🔵 Response status: 500
  • 상태: 프론트엔드 준비 완료, 백엔드 수정 대기 중

다음 세션 TODO

1. DynamicItemForm index.tsx 분리 작업

  • 현재 2000줄+ → 500줄 이하 목표
  • 컴포넌트 분리:
    • FormHeader
    • ValidationAlert
    • DynamicSectionRenderer
    • 파일 업로드 섹션
    • BOM 섹션
  • hooks/utils 정리

2. 파일 업로드 테스트 (백엔드 완료 후)

  • 신규 품목 등록 → 파일 업로드 → 수정 페이지 확인
  • 다운로드/수정/삭제 버튼 동작 검증
  • 파일 덮어쓰기 (file_id: 0) 동작 확인

API 구조 참고

새 API 응답 구조 (조회)

{
  "files": {
    "bending_diagram": [{ "id": 1, "file_name": "벤딩도.pdf", "file_path": "/uploads/..." }],
    "specification": [{ "id": 2, "file_name": "규격서.pdf", "file_path": "/uploads/..." }],
    "certification": [{ "id": 3, "file_name": "인정서.pdf", "file_path": "/uploads/..." }]
  }
}

파일 업로드 요청 (FormData)

file: [File]
type: specification | certification | bending_diagram
field_key: specification_file | certification_file | bending_diagram
file_id: 0 (덮어쓰기) | 1, 2, 3... (추가)

주요 파일 위치

  • 타입: src/types/item.ts
  • API: src/lib/api/items.ts
  • 폼: src/components/items/DynamicItemForm/index.tsx
  • 프록시: src/app/api/proxy/[...path]/route.ts