docs: [receiving] 프론트엔드 전달용 품목검색 버그 수정 문서 추가

- 문제현상, 원인, 수정내용, 확인 체크리스트 포함
- INDEX.md 등록
This commit is contained in:
김보곤
2026-03-18 13:22:56 +09:00
parent bbedd58acf
commit 704807e07d
2 changed files with 139 additions and 0 deletions

View File

@@ -286,6 +286,7 @@ DB 도메인별:
| [vehicle-api.md](frontend/api-specs/vehicle-api.md) | 차량관리 API 명세 (20개 엔드포인트: 차량목록, 차량일지, 정비이력, 사진) |
| [stock-production-api.md](frontend/api-specs/stock-production-api.md) | 재고생산관리 API 명세 (기존 수주 API + STOCK 타입) |
| [stock-receiving-changes-20260317.md](frontend/api-specs/stock-receiving-changes-20260317.md) | 입고관리/재고현황 변경사항 (로트번호 자동채번, 재고 조정 이동, API 스펙) |
| [receiving-item-search-fix-20260318.md](frontend/api-specs/receiving-item-search-fix-20260318.md) | 입고등록 품목검색 버그 수정 (per_page/itemType 파라미터, 프론트엔드 전달용) |
| [ai-token-usage-api.md](frontend/api-specs/ai-token-usage-api.md) | AI 토큰사용량 API 명세 (2개 엔드포인트 + 화면 가이드 + 타입 정의) |
| [vehicle-react-implementation.md](plans/vehicle-react-implementation.md) | 차량관리 React 구현 요청서 (3개 메뉴, 컴포넌트 구조, 타입 정의) |
| [stock-production-react-request.md](plans/stock-production-react-request.md) | 재고생산관리 React 구현 요청서 (수주 화면 단순화, API 스펙 포함) |

View File

@@ -0,0 +1,138 @@
# 입고등록 품목 검색 버그 수정 (2026-03-18)
**날짜:** 2026-03-18
**작업자:** R&D실 (백엔드)
**대상:** React 프론트엔드
**API 상태:** 수정 완료, develop 배포 대기
---
## 문제 현상
입고등록 화면에서 품목코드 검색 시 두 가지 문제 발생:
1. **전체 품목 표시**: FG(완제품), PT(부품) 등 입고 대상이 아닌 품목까지 검색됨
2. **20건 제한**: `per_page=50`을 전송해도 항상 20건만 반환
---
## 원인
API와 React 간 **파라미터 이름 불일치**:
```
React (fetchItems) API (ItemsController)
───────────────── ────────────────────
per_page=50 ──→ ❌ 무시 size 파라미터만 읽음 (기본 20)
itemType=RM,SM,CS ──→ ❌ 무시 type / item_type만 읽음
```
---
## 수정 완료 항목
### 1. API — `ItemsController.php` (백엔드 수정 완료)
`GET /api/v1/items` 엔드포인트가 이제 다음 파라미터도 수용:
| 파라미터 | 설명 | 비고 |
|---------|------|------|
| `per_page` | 페이지당 건수 | 기존 `size`와 동일하게 동작 |
| `itemType` | 품목 유형 (camelCase) | 기존 `type`, `item_type`과 동일하게 동작 |
> 기존 `size`, `type`, `item_type` 파라미터는 변경 없이 그대로 동작한다 (하위호환).
### 2. React — `ReceivingDetail.tsx` (프론트엔드 수정 완료)
```typescript
// 변경 전
<ItemSearchModal
open={isItemSearchOpen}
onOpenChange={setIsItemSearchOpen}
onSelectItem={handleSelectItem}
/>
// 변경 후 — 원자재/부자재/소모품만 검색
<ItemSearchModal
open={isItemSearchOpen}
onOpenChange={setIsItemSearchOpen}
onSelectItem={handleSelectItem}
itemType="RM,SM,CS"
/>
```
### 3. React — `actions.ts` dead code 제거
`searchItems()` 함수, `ItemOption` 인터페이스, `MOCK_ITEMS` 상수를 제거했다.
실제 품목검색은 `ItemSearchModal``fetchItems()` (`lib/api/items.ts`)를 통해 이루어지며,
`actions.ts``searchItems()`는 어디서도 import하지 않는 미사용 코드였다.
---
## 품목 유형 필터 기준
입고등록에서 검색되는 품목:
| item_type | 한글 | 검색 여부 |
|-----------|------|:---------:|
| `RM` | 원자재 | ✅ |
| `SM` | 부자재 | ✅ |
| `CS` | 소모품 | ✅ |
| `FG` | 완제품 | ❌ |
| `PT` | 부품 | ❌ |
| `SF` | 반제품 | ❌ |
| `BN` | 절곡품 | ❌ |
---
## 프론트엔드 작업 사항
> **코드 수정은 이미 완료됨.** 아래는 `git pull` 후 확인할 내용.
### 확인 체크리스트
```
git pull origin develop
```
- [ ] 입고등록(`/material/receiving-management?mode=new`) 진입
- [ ] 품목코드 검색 모달 열기
- [ ] 아무 글자 입력 후 검색
- [ ] 검색 결과에 RM/SM/CS만 표시되는지 확인
- [ ] FG/PT 품목이 없는지 확인
- [ ] 품목이 20건 이상일 때 모두 표시되는지 확인
### 수정된 파일 (React)
| 파일 | 변경 내용 |
|------|----------|
| `src/components/material/ReceivingManagement/ReceivingDetail.tsx` | `ItemSearchModal``itemType="RM,SM,CS"` prop 추가 |
| `src/components/material/ReceivingManagement/actions.ts` | 미사용 `searchItems()` 함수 제거 (52줄) |
---
## API 호출 예시 (참고용)
```
GET /api/v1/items?search=철판&itemType=RM,SM,CS&per_page=50
응답:
{
"success": true,
"data": {
"data": [...], // RM/SM/CS 품목만
"per_page": 50, // 50건 기준 페이징
"total": 34
}
}
```
---
## 관련 문서
- [stock-receiving-changes-20260317.md](stock-receiving-changes-20260317.md) — 입고관리 전체 변경사항 (섹션 4 업데이트됨)
---
**최종 업데이트**: 2026-03-18