feat(WEB): 공정관리/작업지시/작업자화면 기능 강화 및 템플릿 개선

- 공정관리: ProcessDetail/ProcessForm/ProcessList 개선, StepDetail/StepForm 신규 추가
- 작업지시: WorkOrderDetail/Edit/List UI 개선, 작업지시서 문서 추가
- 작업자화면: WorkerScreen 대폭 개선, MaterialInputModal/WorkLogModal 수정, WorkItemCard 신규
- 영업주문: 주문 상세 페이지 개선
- 입고관리: 상세/actions 수정
- 템플릿: IntegratedDetailTemplate/IntegratedListTemplateV2/UniversalListPage 기능 확장
- UI: confirm-dialog 개선

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

src/components/process-management/ProcessListClient.tsx

@@ -11,8 +11,7 @@
 
 import { useState, useMemo, useCallback, useEffect } from 'react';
 import { useRouter } from 'next/navigation';
-import { Wrench, Plus, Pencil, Trash2 } from 'lucide-react';
-import { Button } from '@/components/ui/button';
+import { Wrench, Plus } from 'lucide-react';
 import { TableCell, TableRow } from '@/components/ui/table';
 import { Checkbox } from '@/components/ui/checkbox';
 import { Badge } from '@/components/ui/badge';
@@ -21,7 +20,6 @@ import {
   type UniversalListConfig,
   type SelectionHandlers,
   type RowClickHandlers,
-  type TabOption,
   type ListParams,
 } from '@/components/templates/UniversalListPage';
 import { ListMobileCard, InfoField } from '@/components/organisms/MobileCard';
@@ -179,13 +177,6 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
     }
   }, [allProcesses]);
 
-  // ===== 탭 옵션 =====
-  const tabs: TabOption[] = useMemo(() => [
-    { value: 'all', label: '전체', count: stats.total },
-    { value: '사용중', label: '사용중', count: stats.active },
-    { value: '미사용', label: '미사용', count: stats.inactive },
-  ], [stats]);
-
   // ===== UniversalListPage Config =====
   const config: UniversalListConfig<Process> = useMemo(
     () => ({
@@ -242,14 +233,12 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
       // 테이블 컬럼
       columns: [
         { key: 'no', label: '번호', className: 'w-[60px] text-center' },
-        { key: 'processCode', label: '공정코드', className: 'w-[100px]' },
-        { key: 'processName', label: '공정명', className: 'min-w-[250px]' },
-        { key: 'processType', label: '구분', className: 'w-[80px] text-center' },
+        { key: 'processCode', label: '공정번호', className: 'w-[120px]' },
+        { key: 'processName', label: '공정명', className: 'min-w-[200px]' },
         { key: 'department', label: '담당부서', className: 'w-[120px]' },
-        { key: 'classificationRules', label: '분류규칙', className: 'w-[80px] text-center' },
-        { key: 'requiredWorkers', label: '인원', className: 'w-[60px] text-center' },
+        { key: 'steps', label: '단계', className: 'w-[80px] text-center' },
+        { key: 'items', label: '품목', className: 'w-[80px] text-center' },
         { key: 'status', label: '상태', className: 'w-[80px] text-center' },
-        { key: 'actions', label: '작업', className: 'w-[100px] text-center' },
       ],
 
       // 클라이언트 사이드 필터링
@@ -271,10 +260,26 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
         onEndDateChange: setEndDate,
       },
 
-      // 탭 필터 (공통 컴포넌트에서 처리)
-      tabFilter: (item, tabValue) => {
-        if (tabValue === 'all') return true;
-        return item.status === tabValue;
+      // 필터 설정 (상태 필터)
+      filterConfig: [
+        {
+          key: 'status',
+          label: '상태',
+          type: 'single' as const,
+          options: [
+            { value: '사용중', label: '사용' },
+            { value: '미사용', label: '미사용' },
+          ],
+          allOptionLabel: '전체',
+        },
+      ],
+      initialFilters: { status: '' },
+
+      // 커스텀 필터 함수 (상태 필터)
+      customFilterFn: (items: Process[], filterValues: Record<string, string | string[]>) => {
+        const statusFilter = filterValues.status as string;
+        if (!statusFilter) return items;
+        return items.filter(item => item.status === statusFilter);
       },
 
       // 검색 필터
@@ -288,10 +293,6 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
         );
       },
 
-      // 탭 (공통 컴포넌트에서 Card 안에 렌더링)
-      tabs,
-      defaultTab: 'all',
-
       // 등록 버튼 (공통 컴포넌트에서 오른쪽에 렌더링)
       createButton: {
         label: '공정 등록',
@@ -309,6 +310,9 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
         globalIndex: number,
         handlers: SelectionHandlers & RowClickHandlers<Process>
       ) => {
+        const itemCount = process.classificationRules
+          .filter(r => r.registrationType === 'individual')
+          .reduce((sum, r) => sum + (r.items?.length || 0), 0);
         return (
           <TableRow
             key={process.id}
@@ -323,63 +327,19 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
             </TableCell>
             <TableCell className="text-center text-muted-foreground">{globalIndex}</TableCell>
             <TableCell className="font-medium">{process.processCode}</TableCell>
-            <TableCell>
-              <div>
-                <div className="font-medium">{process.processName}</div>
-                {process.description && (
-                  <div className="text-sm text-muted-foreground">{process.description}</div>
-                )}
-              </div>
-            </TableCell>
-            <TableCell className="text-center">
-              <Badge variant="secondary">{process.processType}</Badge>
-            </TableCell>
+            <TableCell>{process.processName}</TableCell>
             <TableCell>{process.department}</TableCell>
-            <TableCell className="text-center">
-              {process.classificationRules.length > 0 ? (
-                <Badge variant="outline">{process.classificationRules.length}</Badge>
-              ) : (
-                <span className="text-muted-foreground">-</span>
-              )}
-            </TableCell>
-            <TableCell className="text-center">{process.requiredWorkers}명</TableCell>
+            <TableCell className="text-center">{process.workSteps.length}</TableCell>
+            <TableCell className="text-center">{itemCount > 0 ? itemCount : '-'}</TableCell>
             <TableCell className="text-center" onClick={(e) => e.stopPropagation()}>
               <Badge
                 variant={process.status === '사용중' ? 'default' : 'secondary'}
                 className="cursor-pointer"
                 onClick={() => handleToggleStatus(process.id)}
               >
-                {process.status}
+                {process.status === '사용중' ? '사용' : '미사용'}
               </Badge>
             </TableCell>
-            <TableCell className="text-center">
-              {handlers.isSelected && (
-                <div className="flex items-center justify-center gap-2">
-                  <Button
-                    variant="ghost"
-                    size="icon"
-                    className="h-8 w-8"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      handleEdit(process);
-                    }}
-                  >
-                    <Pencil className="h-4 w-4" />
-                  </Button>
-                  <Button
-                    variant="ghost"
-                    size="icon"
-                    className="h-8 w-8 text-destructive hover:text-destructive"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      handleDeleteClick(process.id);
-                    }}
-                  >
-                    <Trash2 className="h-4 w-4" />
-                  </Button>
-                </div>
-              )}
-            </TableCell>
           </TableRow>
         );
       },
@@ -391,6 +351,9 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
         globalIndex: number,
         handlers: SelectionHandlers & RowClickHandlers<Process>
       ) => {
+        const itemCount = process.classificationRules
+          .filter(r => r.registrationType === 'individual')
+          .reduce((sum, r) => sum + (r.items?.length || 0), 0);
         return (
           <ListMobileCard
             key={process.id}
@@ -414,60 +377,21 @@ export default function ProcessListClient({ initialData = [], initialStats }: Pr
                   handleToggleStatus(process.id);
                 }}
               >
-                {process.status}
+                {process.status === '사용중' ? '사용' : '미사용'}
               </Badge>
             }
             infoGrid={
               <div className="grid grid-cols-2 gap-x-4 gap-y-3">
-                <InfoField label="구분" value={process.processType} />
                 <InfoField label="담당부서" value={process.department} />
-                <InfoField label="인원" value={`${process.requiredWorkers}명`} />
-                <InfoField
-                  label="분류규칙"
-                  value={process.classificationRules.length > 0 ? `${process.classificationRules.length}개` : '-'}
-                />
-                {process.description && (
-                  <div className="col-span-2">
-                    <InfoField label="설명" value={process.description} />
-                  </div>
-                )}
+                <InfoField label="단계" value={`${process.workSteps.length}개`} />
+                <InfoField label="품목" value={itemCount > 0 ? `${itemCount}개` : '-'} />
               </div>
             }
-            actions={
-              handlers.isSelected ? (
-                <div className="flex gap-2">
-                  <Button
-                    variant="default"
-                    size="default"
-                    className="flex-1 h-11"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      handleEdit(process);
-                    }}
-                  >
-                    <Pencil className="h-4 w-4 mr-2" />
-                    수정
-                  </Button>
-                  <Button
-                    variant="outline"
-                    size="default"
-                    className="flex-1 h-11 border-red-200 text-red-600 hover:border-red-300 bg-transparent"
-                    onClick={(e) => {
-                      e.stopPropagation();
-                      handleDeleteClick(process.id);
-                    }}
-                  >
-                    <Trash2 className="h-4 w-4 mr-2" />
-                    삭제
-                  </Button>
-                </div>
-              ) : undefined
-            }
           />
         );
       },
     }),
-    [tabs, handleCreate, handleRowClick, handleEdit, handleDeleteClick, handleToggleStatus, handleBulkDelete, startDate, endDate, searchQuery]
+    [handleCreate, handleRowClick, handleToggleStatus, handleBulkDelete, startDate, endDate, searchQuery]
   );
 
   return (