feat(WEB): 절곡품 선생산→재고적재 Phase 2 - 수동 작업지시 및 재고 필터

- WorkOrderCreate: 수동 모드 품목 검색/추가/수량 관리 UI 구현
- WorkOrders/actions: items 파라미터 추가, searchItemsForWorkOrder 함수 추가
- StockStatusList: 품목분류(BENDING/SCREEN/STEEL/ALUMINUM) 필터 추가
- StockStatus/actions: itemCategory 파라미터 지원

src/components/production/WorkOrders/WorkOrderCreate.tsx

@@ -8,7 +8,7 @@
 
 import { useState, useEffect, useCallback } from 'react';
 import { useRouter } from 'next/navigation';
-import { ArrowLeft, FileText, X, Edit2, Loader2 } from 'lucide-react';
+import { ArrowLeft, FileText, X, Edit2, Loader2, Plus, Search, Trash2 } from 'lucide-react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { DatePicker } from '@/components/ui/date-picker';
@@ -28,13 +28,22 @@ import { SalesOrderSelectModal } from './SalesOrderSelectModal';
 import { AssigneeSelectModal } from './AssigneeSelectModal';
 import { toast } from 'sonner';
 import { isNextRedirectError } from '@/lib/utils/redirect-error';
-import { createWorkOrder, getProcessOptions, type ProcessOption } from './actions';
+import { createWorkOrder, getProcessOptions, searchItemsForWorkOrder, type ProcessOption, type ManualItemOption } from './actions';
 import { PROCESS_TYPE_LABELS, type ProcessType, type SalesOrder } from './types';
 import { workOrderCreateConfig } from './workOrderConfig';
 
 import { useDevFill } from '@/components/dev';
 import { generateWorkOrderData } from '@/components/dev/generators/workOrderData';
 
+// 수동 등록 품목
+interface ManualItem {
+  item_id?: number;
+  item_name: string;
+  specification: string;
+  quantity: number;
+  unit: string;
+}
+
 // Validation 에러 타입
 interface ValidationErrors {
   [key: string]: string;
@@ -98,6 +107,13 @@ export function WorkOrderCreate() {
   const [processOptions, setProcessOptions] = useState<ProcessOption[]>([]);
   const [isLoadingProcesses, setIsLoadingProcesses] = useState(true);
 
+  // 수동 등록 품목 관리
+  const [manualItems, setManualItems] = useState<ManualItem[]>([]);
+  const [itemSearchQuery, setItemSearchQuery] = useState('');
+  const [itemSearchResults, setItemSearchResults] = useState<ManualItemOption[]>([]);
+  const [isSearchingItems, setIsSearchingItems] = useState(false);
+  const [showItemSearch, setShowItemSearch] = useState(false);
+
   // 공정 옵션 로드
   useEffect(() => {
     async function loadProcessOptions() {
@@ -169,6 +185,50 @@ export function WorkOrderCreate() {
     });
   };
 
+  // 품목 검색 (수동 등록용)
+  const handleItemSearch = async (query: string) => {
+    setItemSearchQuery(query);
+    if (query.length < 1) {
+      setItemSearchResults([]);
+      return;
+    }
+    setIsSearchingItems(true);
+    const result = await searchItemsForWorkOrder(query, 'BENDING');
+    if (result.success) {
+      setItemSearchResults(result.data);
+    }
+    setIsSearchingItems(false);
+  };
+
+  // 검색 결과에서 품목 추가
+  const handleAddItem = (item: ManualItemOption) => {
+    // 이미 추가된 품목인지 확인
+    if (manualItems.some(mi => mi.item_id === item.id)) {
+      toast.error('이미 추가된 품목입니다.');
+      return;
+    }
+    setManualItems(prev => [...prev, {
+      item_id: item.id,
+      item_name: item.name,
+      specification: item.specification,
+      quantity: 1,
+      unit: item.unit,
+    }]);
+    setShowItemSearch(false);
+    setItemSearchQuery('');
+    setItemSearchResults([]);
+  };
+
+  // 품목 수량 변경
+  const handleItemQtyChange = (index: number, qty: number) => {
+    setManualItems(prev => prev.map((item, i) => i === index ? { ...item, quantity: qty } : item));
+  };
+
+  // 품목 삭제
+  const handleRemoveItem = (index: number) => {
+    setManualItems(prev => prev.filter((_, i) => i !== index));
+  };
+
   // 폼 제출
   const handleSubmit = async (): Promise<{ success: boolean; error?: string }> => {
     // Validation 체크
@@ -185,6 +245,9 @@ export function WorkOrderCreate() {
       if (!formData.projectName) {
         errors.projectName = '현장명을 입력해주세요';
       }
+      if (manualItems.length === 0) {
+        errors.items = '품목을 1개 이상 추가해주세요';
+      }
     }
 
     if (!formData.processId) {
@@ -216,6 +279,15 @@ export function WorkOrderCreate() {
         scheduledDate: formData.shipmentDate,
         assigneeIds: formData.assignees.map(id => parseInt(id)),
         note: formData.note || undefined,
+        ...(mode === 'manual' && manualItems.length > 0 ? {
+          items: manualItems.map(item => ({
+            item_id: item.item_id,
+            item_name: item.item_name,
+            specification: item.specification,
+            quantity: item.quantity,
+            unit: item.unit,
+          })),
+        } : {}),
       });
 
       if (!result.success) {
@@ -496,6 +568,143 @@ export function WorkOrderCreate() {
           </div>
         </section>
 
+        {/* 품목 (수동 등록 모드) */}
+        {mode === 'manual' && (
+          <section className="bg-muted/30 border rounded-lg p-6">
+            <div className="flex items-center justify-between mb-4">
+              <h3 className="font-semibold">
+                품목 목록
+                {manualItems.length > 0 && (
+                  <span className="text-sm font-normal text-muted-foreground ml-2">
+                    ({manualItems.length}개)
+                  </span>
+                )}
+              </h3>
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                onClick={() => setShowItemSearch(!showItemSearch)}
+              >
+                <Plus className="w-4 h-4 mr-1" />
+                품목 추가
+              </Button>
+            </div>
+
+            {/* 품목 검색 */}
+            {showItemSearch && (
+              <div className="mb-4 p-4 bg-white border rounded-lg space-y-3">
+                <div className="flex gap-2">
+                  <div className="relative flex-1">
+                    <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-muted-foreground" />
+                    <Input
+                      value={itemSearchQuery}
+                      onChange={(e) => handleItemSearch(e.target.value)}
+                      placeholder="절곡품 코드 또는 품목명으로 검색"
+                      className="pl-9"
+                    />
+                  </div>
+                  <Button
+                    type="button"
+                    variant="ghost"
+                    size="sm"
+                    onClick={() => { setShowItemSearch(false); setItemSearchResults([]); setItemSearchQuery(''); }}
+                  >
+                    <X className="w-4 h-4" />
+                  </Button>
+                </div>
+                {isSearchingItems && (
+                  <div className="flex items-center gap-2 text-sm text-muted-foreground py-2">
+                    <Loader2 className="w-4 h-4 animate-spin" />
+                    검색 중...
+                  </div>
+                )}
+                {itemSearchResults.length > 0 && (
+                  <div className="max-h-48 overflow-y-auto border rounded">
+                    {itemSearchResults.map((item) => (
+                      <button
+                        key={item.id}
+                        type="button"
+                        onClick={() => handleAddItem(item)}
+                        className="w-full text-left px-3 py-2 hover:bg-accent text-sm border-b last:border-b-0 flex justify-between items-center"
+                      >
+                        <div>
+                          <span className="font-medium">{item.code}</span>
+                          <span className="text-muted-foreground ml-2">{item.name}</span>
+                          {item.specification && (
+                            <span className="text-muted-foreground ml-1">({item.specification})</span>
+                          )}
+                        </div>
+                        <span className="text-xs text-muted-foreground">{item.unit}</span>
+                      </button>
+                    ))}
+                  </div>
+                )}
+                {itemSearchQuery.length > 0 && !isSearchingItems && itemSearchResults.length === 0 && (
+                  <p className="text-sm text-muted-foreground py-2">검색 결과가 없습니다.</p>
+                )}
+              </div>
+            )}
+
+            {/* 품목 목록 테이블 */}
+            {manualItems.length > 0 ? (
+              <div className="bg-white border rounded-lg overflow-hidden">
+                <table className="w-full text-sm">
+                  <thead className="bg-muted/50">
+                    <tr>
+                      <th className="text-left px-4 py-2 font-medium">No</th>
+                      <th className="text-left px-4 py-2 font-medium">품목명</th>
+                      <th className="text-left px-4 py-2 font-medium">규격</th>
+                      <th className="text-center px-4 py-2 font-medium w-28">수량</th>
+                      <th className="text-center px-4 py-2 font-medium w-16">단위</th>
+                      <th className="text-center px-4 py-2 font-medium w-16"></th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {manualItems.map((item, index) => (
+                      <tr key={index} className="border-t">
+                        <td className="px-4 py-2 text-muted-foreground">{index + 1}</td>
+                        <td className="px-4 py-2">{item.item_name}</td>
+                        <td className="px-4 py-2 text-muted-foreground">{item.specification || '-'}</td>
+                        <td className="px-4 py-2 text-center">
+                          <Input
+                            type="number"
+                            min={1}
+                            value={item.quantity}
+                            onChange={(e) => handleItemQtyChange(index, parseInt(e.target.value) || 1)}
+                            className="w-24 text-center mx-auto h-8"
+                          />
+                        </td>
+                        <td className="px-4 py-2 text-center text-muted-foreground">{item.unit}</td>
+                        <td className="px-4 py-2 text-center">
+                          <Button
+                            type="button"
+                            variant="ghost"
+                            size="sm"
+                            onClick={() => handleRemoveItem(index)}
+                            className="h-7 w-7 p-0 text-destructive hover:text-destructive"
+                          >
+                            <Trash2 className="w-4 h-4" />
+                          </Button>
+                        </td>
+                      </tr>
+                    ))}
+                  </tbody>
+                </table>
+              </div>
+            ) : (
+              <div className="text-center py-8 text-muted-foreground bg-white border rounded-lg">
+                <p>추가된 품목이 없습니다.</p>
+                <p className="text-sm mt-1">위의 &apos;품목 추가&apos; 버튼으로 절곡품을 검색하여 추가하세요.</p>
+              </div>
+            )}
+
+            {validationErrors.items && (
+              <p className="text-sm text-destructive mt-2">{validationErrors.items}</p>
+            )}
+          </section>
+        )}
+
         {/* 비고 */}
         <section className="bg-muted/30 border rounded-lg p-6">
           <h3 className="font-semibold mb-4">비고</h3>
@@ -508,7 +717,7 @@ export function WorkOrderCreate() {
           />
         </section>
       </div>
-  ), [mode, formData, validationErrors, processOptions, isLoadingProcesses, assigneeNames, getSelectedProcessCode]);
+  ), [mode, formData, validationErrors, processOptions, isLoadingProcesses, assigneeNames, getSelectedProcessCode, manualItems, showItemSearch, itemSearchQuery, itemSearchResults, isSearchingItems]);
 
   return (
     <>