# 입출고관리 화면 구현 가이드

> **화면명**: 입출고관리
> **파일**: 입출고관리.html
> **분류**: 물류관리
> **구현 가능**: ⚠️ 부분 (그룹화 테이블 필요)

---

## 1. 화면 개요

자재/제품의 입고 및 출고 내역을 통합 관리하는 화면입니다.

### 핵심 기능
- 입출고 내역 조회/검색
- 그룹화 기능 (입출고구분, 창고, 카테고리별)
- 엑셀 업로드/다운로드

---

## 2. 화면 레이아웃

```
┌─────────────────────────────────────────────────────────────────┐
│ [입출고구분▼][카테고리▼][창고▼][품목코드][품목명][기간][초기화][검색]│
│                                          [사용자옵션][업로드][다운로드]│
├─────────────────────────────────────────────────────────────────┤
│ 📋 입출고 내역                         전체 150건                │
│ ─────────────────────────────────────────────────────────────  │
│ Group by: [입출고구분▼]                                         │
│ ─────────────────────────────────────────────────────────────  │
│ │▼ 입고 (80)                                                   │
│ │  │IN-001|구매입고|2026-01-30|본사창고|P-001|원자재A|100|KG   │
│ │  │IN-002|생산입고|2026-01-30|제1창고|P-002|제품A  |50 |EA   │
│ │▼ 출고 (70)                                                   │
│ │  │OUT-001|판매출고|2026-01-30|본사창고|P-003|제품B|30|EA    │
└─────────────────────────────────────────────────────────────────┘
```

---

## 3. V2 컴포넌트 매핑

| HTML 영역 | V2 컴포넌트 | 상태 |
|-----------|-------------|------|
| 검색 섹션 | `v2-table-search-widget` | ✅ 가능 |
| 입출고 목록 (그룹화) | `v2-table-list` | ⚠️ 그룹화 미지원 |

---

## 4. 테이블 정의

```typescript
columns: [
  { id: 'checkbox', type: 'checkbox', width: 50 },
  { id: 'inout_type', label: '입출고구분', width: 100 },
  { id: 'category', label: '카테고리', width: 120 },
  { id: 'doc_no', label: '전표번호', width: 120 },
  { id: 'process_date', label: '처리일자', width: 100 },
  { id: 'warehouse', label: '창고', width: 120 },
  { id: 'location', label: '위치', width: 100 },
  { id: 'item_code', label: '품목코드', width: 120 },
  { id: 'item_name', label: '품목명', width: 200 },
  { id: 'quantity', label: '수량', width: 100, align: 'right' },
  { id: 'unit', label: '단위', width: 60 },
  { id: 'lot_no', label: '로트번호', width: 120 },
  { id: 'customer', label: '거래처', width: 120 },
  { id: 'manager', label: '담당자', width: 100 },
  { id: 'remark', label: '비고', width: 200 }
]
```

---

## 5. 검색 조건

| 필드명 | 컴포넌트 | 옵션 |
|--------|----------|------|
| 입출고구분 | `v2-select` | 입고, 출고 |
| 카테고리 | `v2-select` | 구매입고, 생산입고, 반품입고, 판매출고, 생산출고 등 |
| 창고 | `v2-select` | 본사창고, 제1창고, 제2창고 |
| 품목코드 | `v2-input` | - |
| 품목명 | `v2-input` | - |
| 기간 | `v2-date` | dateRange: true |

---

## 6. 그룹화 기능 (v2-grouped-table 필요)

```typescript
groupByOptions: [
  { id: 'inout_type', label: '입출고구분' },
  { id: 'category', label: '카테고리' },
  { id: 'warehouse', label: '창고' },
  { id: 'item_code', label: '품목코드' },
  { id: 'process_date', label: '처리일자' },
  { id: 'customer', label: '거래처' }
]
```

---

## 7. 현재 구현 가능 범위

### ✅ 가능
- 검색 영역
- 일반 테이블 목록

### ⚠️ 부분 가능
- 그룹화 없이 필터로 대체

### ❌ 불가능
- 동적 그룹화

---

## 8. 간소화 구현 JSON

```json
{
  "screen_code": "INOUT_MAIN",
  "screen_name": "입출고관리",
  "components": [
    {
      "type": "v2-table-search-widget",
      "position": { "x": 0, "y": 0, "w": 12, "h": 2 },
      "config": {
        "searchFields": [
          { "type": "select", "id": "inout_type", "placeholder": "입출고구분",
            "options": [
              { "value": "IN", "label": "입고" },
              { "value": "OUT", "label": "출고" }
            ]
          },
          { "type": "select", "id": "category", "placeholder": "카테고리",
            "options": [
              { "value": "purchase", "label": "구매입고" },
              { "value": "production_in", "label": "생산입고" },
              { "value": "return_in", "label": "반품입고" },
              { "value": "sales", "label": "판매출고" },
              { "value": "production_out", "label": "생산출고" }
            ]
          },
          { "type": "select", "id": "warehouse", "placeholder": "창고" },
          { "type": "input", "id": "item_code", "placeholder": "품목코드" },
          { "type": "input", "id": "item_name", "placeholder": "품목명" },
          { "type": "date", "id": "date_range", "placeholder": "처리일자", "dateRange": true }
        ],
        "buttons": [
          { "label": "초기화", "action": "reset" },
          { "label": "검색", "action": "search", "variant": "primary" }
        ]
      }
    },
    {
      "type": "v2-table-list",
      "position": { "x": 0, "y": 2, "w": 12, "h": 10 },
      "config": {
        "title": "입출고 내역",
        "entityId": "inventory_transaction",
        "showTotalCount": true,
        "columns": [
          { "id": "inout_type", "label": "입출고구분", "width": 100 },
          { "id": "category", "label": "카테고리", "width": 120 },
          { "id": "doc_no", "label": "전표번호", "width": 120 },
          { "id": "process_date", "label": "처리일자", "width": 100 },
          { "id": "warehouse", "label": "창고", "width": 120 },
          { "id": "item_code", "label": "품목코드", "width": 120 },
          { "id": "item_name", "label": "품목명", "width": 200 },
          { "id": "quantity", "label": "수량", "width": 100, "align": "right" },
          { "id": "unit", "label": "단위", "width": 60 }
        ]
      }
    }
  ]
}
```

**v2-grouped-table 개발 시 그룹화 기능 추가 가능**