170 lines
6.1 KiB
Markdown
170 lines
6.1 KiB
Markdown
# 검사정보관리 화면 구현 가이드
|
|
|
|
> **화면명**: 검사정보관리
|
|
> **파일**: 검사정보관리.html
|
|
> **분류**: 품질관리
|
|
> **구현 가능**: ✅ 완전 (현재 V2 컴포넌트)
|
|
|
|
---
|
|
|
|
## 1. 화면 개요
|
|
|
|
품질 검사 결과를 등록하고 관리하는 화면입니다.
|
|
|
|
### 핵심 기능
|
|
- 검사 유형별 탭 (수입검사, 공정검사, 출하검사)
|
|
- 검사 결과 등록/수정
|
|
- 불량 처리 연계
|
|
- 검사 이력 관리
|
|
|
|
---
|
|
|
|
## 2. 화면 레이아웃
|
|
|
|
```
|
|
┌─────────────────────────────────────────────────────────────────┐
|
|
│ [기간] [품목] [거래처] [검사결과▼] [초기화][조회] [사용자옵션][엑셀]│
|
|
├─────────────────────────────────────────────────────────────────┤
|
|
│ [🔍수입검사(25)][⚙️공정검사(18)][📦출하검사(12)] │
|
|
├─────────────────────────────────────────────────────────────────┤
|
|
│ 📋 수입검사 목록 [신규등록] │
|
|
│ ───────────────────────────────────────────────────────────── │
|
|
│ │□|검사번호 |검사일 |품목명 |검사수량|합격수량|불량수량|결과│
|
|
│ │□|IQC-001 |2026-01-30|원자재A |100 |98 |2 |합격│
|
|
│ │□|IQC-002 |2026-01-30|원자재B |200 |195 |5 |합격│
|
|
│ │□|IQC-003 |2026-01-29|부품C |50 |30 |20 |불합격│
|
|
└─────────────────────────────────────────────────────────────────┘
|
|
```
|
|
|
|
---
|
|
|
|
## 3. V2 컴포넌트 매핑
|
|
|
|
| HTML 영역 | V2 컴포넌트 | 상태 |
|
|
|-----------|-------------|------|
|
|
| 검색 섹션 | `v2-table-search-widget` | ✅ 가능 |
|
|
| 검사유형 탭 | `v2-tabs-widget` | ✅ 가능 |
|
|
| 검사 목록 | `v2-table-list` | ✅ 가능 |
|
|
|
|
---
|
|
|
|
## 4. 탭 구성
|
|
|
|
```typescript
|
|
tabs: [
|
|
{ id: 'incoming', label: '수입검사', icon: '🔍', count: 25 },
|
|
{ id: 'process', label: '공정검사', icon: '⚙️', count: 18 },
|
|
{ id: 'shipping', label: '출하검사', icon: '📦', count: 12 }
|
|
]
|
|
```
|
|
|
|
---
|
|
|
|
## 5. 테이블 정의
|
|
|
|
```typescript
|
|
columns: [
|
|
{ id: 'checkbox', type: 'checkbox', width: 50 },
|
|
{ id: 'inspect_no', label: '검사번호', width: 120 },
|
|
{ id: 'inspect_date', label: '검사일', width: 100 },
|
|
{ id: 'item_code', label: '품목코드', width: 100 },
|
|
{ id: 'item_name', label: '품목명', width: 200 },
|
|
{ id: 'lot_no', label: '로트번호', width: 120 },
|
|
{ id: 'inspect_qty', label: '검사수량', width: 100, align: 'right' },
|
|
{ id: 'pass_qty', label: '합격수량', width: 100, align: 'right' },
|
|
{ id: 'fail_qty', label: '불량수량', width: 100, align: 'right' },
|
|
{ id: 'result', label: '결과', width: 80 },
|
|
{ id: 'inspector', label: '검사자', width: 100 }
|
|
]
|
|
```
|
|
|
|
---
|
|
|
|
## 6. 검색 조건
|
|
|
|
| 필드명 | 컴포넌트 | 설정 |
|
|
|--------|----------|------|
|
|
| 기간 | `v2-date` | dateRange: true |
|
|
| 품목 | `v2-input` | placeholder: "품목" |
|
|
| 거래처 | `v2-input` | placeholder: "거래처" |
|
|
| 검사결과 | `v2-select` | 전체, 합격, 불합격, 조건부합격 |
|
|
|
|
---
|
|
|
|
## 7. 구현 JSON
|
|
|
|
```json
|
|
{
|
|
"screen_code": "INSPECTION_MAIN",
|
|
"screen_name": "검사정보관리",
|
|
"components": [
|
|
{
|
|
"type": "v2-table-search-widget",
|
|
"position": { "x": 0, "y": 0, "w": 12, "h": 2 },
|
|
"config": {
|
|
"searchFields": [
|
|
{ "type": "date", "id": "date_range", "placeholder": "검사기간", "dateRange": true },
|
|
{ "type": "input", "id": "item_name", "placeholder": "품목" },
|
|
{ "type": "input", "id": "supplier", "placeholder": "거래처" },
|
|
{ "type": "select", "id": "result", "placeholder": "검사결과",
|
|
"options": [
|
|
{ "value": "pass", "label": "합격" },
|
|
{ "value": "fail", "label": "불합격" },
|
|
{ "value": "conditional", "label": "조건부합격" }
|
|
]
|
|
}
|
|
],
|
|
"buttons": [
|
|
{ "label": "초기화", "action": "reset" },
|
|
{ "label": "조회", "action": "search", "variant": "primary" }
|
|
]
|
|
}
|
|
},
|
|
{
|
|
"type": "v2-tabs-widget",
|
|
"position": { "x": 0, "y": 2, "w": 12, "h": 10 },
|
|
"config": {
|
|
"tabs": [
|
|
{ "id": "incoming", "label": "수입검사" },
|
|
{ "id": "process", "label": "공정검사" },
|
|
{ "id": "shipping", "label": "출하검사" }
|
|
],
|
|
"tabContent": {
|
|
"type": "v2-table-list",
|
|
"config": {
|
|
"entityId": "inspection",
|
|
"filterByTab": true,
|
|
"tabFilterField": "inspect_type",
|
|
"buttons": [
|
|
{ "label": "신규등록", "action": "create", "variant": "primary" }
|
|
],
|
|
"columns": [
|
|
{ "id": "inspect_no", "label": "검사번호", "width": 120 },
|
|
{ "id": "inspect_date", "label": "검사일", "width": 100 },
|
|
{ "id": "item_name", "label": "품목명", "width": 200 },
|
|
{ "id": "lot_no", "label": "로트번호", "width": 120 },
|
|
{ "id": "inspect_qty", "label": "검사수량", "width": 100 },
|
|
{ "id": "pass_qty", "label": "합격수량", "width": 100 },
|
|
{ "id": "fail_qty", "label": "불량수량", "width": 100 },
|
|
{ "id": "result", "label": "결과", "width": 80 }
|
|
]
|
|
}
|
|
}
|
|
}
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## 8. 구현 체크리스트
|
|
|
|
- [x] 검색 영역: v2-table-search-widget
|
|
- [x] 검사유형 탭: v2-tabs-widget
|
|
- [x] 검사 목록 테이블: v2-table-list
|
|
- [ ] 검사 등록 모달
|
|
- [ ] 불량 처리 연계
|
|
|
|
**현재 V2 컴포넌트로 핵심 기능 구현 가능**
|