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/StepDetail.tsx

@@ -0,0 +1,139 @@
+'use client';
+
+/**
+ * 단계 상세 뷰 컴포넌트
+ *
+ * 기획서 스크린샷 2 기준:
+ * - 기본 정보: 단계코드, 단계명, 필수여부, 승인여부, 검사여부, 상태
+ * - 연결 정보: 유형(팝업/없음), 도달(입고완료 자재 목록 등)
+ * - 완료 정보: 유형(선택 완료 시 완료/클릭 시 완료)
+ */
+
+import { useRouter } from 'next/navigation';
+import { ArrowLeft, Edit } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Badge } from '@/components/ui/badge';
+import { PageLayout } from '@/components/organisms/PageLayout';
+import { PageHeader } from '@/components/organisms/PageHeader';
+import { useMenuStore } from '@/store/menuStore';
+import type { ProcessStep } from '@/types/process';
+
+interface StepDetailProps {
+  step: ProcessStep;
+  processId: string;
+}
+
+export function StepDetail({ step, processId }: StepDetailProps) {
+  const router = useRouter();
+  const sidebarCollapsed = useMenuStore((state) => state.sidebarCollapsed);
+
+  const handleEdit = () => {
+    router.push(
+      `/ko/master-data/process-management/${processId}/steps/${step.id}?mode=edit`
+    );
+  };
+
+  const handleBack = () => {
+    router.push(`/ko/master-data/process-management/${processId}`);
+  };
+
+  return (
+    <PageLayout>
+      <PageHeader title="단계 상세" />
+
+      <div className="space-y-6 pb-24">
+        {/* 기본 정보 */}
+        <Card>
+          <CardHeader className="bg-muted/50">
+            <CardTitle className="text-base">기본 정보</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-6">
+            <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6">
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">단계코드</div>
+                <div className="font-medium font-mono">{step.stepCode}</div>
+              </div>
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">단계명</div>
+                <div className="font-medium">{step.stepName}</div>
+              </div>
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">필수여부</div>
+                <Badge variant={step.isRequired ? 'default' : 'outline'}>
+                  {step.isRequired ? '필수' : '선택'}
+                </Badge>
+              </div>
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">승인여부</div>
+                <Badge variant={step.needsApproval ? 'default' : 'outline'}>
+                  {step.needsApproval ? '필요' : '불필요'}
+                </Badge>
+              </div>
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">검사여부</div>
+                <Badge variant={step.needsInspection ? 'default' : 'outline'}>
+                  {step.needsInspection ? '필요' : '불필요'}
+                </Badge>
+              </div>
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">상태</div>
+                <Badge variant={step.isActive ? 'default' : 'secondary'}>
+                  {step.isActive ? '사용' : '미사용'}
+                </Badge>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+
+        {/* 연결 정보 */}
+        <Card>
+          <CardHeader className="bg-muted/50">
+            <CardTitle className="text-base">연결 정보</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-6">
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">유형</div>
+                <div className="font-medium">{step.connectionType}</div>
+              </div>
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">도달</div>
+                <div className="font-medium">{step.connectionTarget || '-'}</div>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+
+        {/* 완료 정보 */}
+        <Card>
+          <CardHeader className="bg-muted/50">
+            <CardTitle className="text-base">완료 정보</CardTitle>
+          </CardHeader>
+          <CardContent className="pt-6">
+            <div className="grid grid-cols-1 sm:grid-cols-2 gap-6">
+              <div className="space-y-1">
+                <div className="text-sm text-muted-foreground">유형</div>
+                <div className="font-medium">{step.completionType}</div>
+              </div>
+            </div>
+          </CardContent>
+        </Card>
+      </div>
+
+      {/* 하단 액션 버튼 (sticky) */}
+      <div
+        className={`fixed bottom-6 ${sidebarCollapsed ? 'left-[156px]' : 'left-[316px]'} right-[48px] px-6 py-3 bg-background/95 backdrop-blur rounded-xl border shadow-lg z-50 transition-all duration-300 flex items-center justify-between`}
+      >
+        <Button variant="outline" onClick={handleBack}>
+          <ArrowLeft className="h-4 w-4 mr-2" />
+          공정으로 돌아가기
+        </Button>
+        <Button onClick={handleEdit}>
+          <Edit className="h-4 w-4 mr-2" />
+          수정
+        </Button>
+      </div>
+    </PageLayout>
+  );
+}