From 32a372a9b3bda52cece001acb03c5e84c422abf2 Mon Sep 17 00:00:00 2001
From: SeongHyun Kim <kksh7842@gmail.com>
Date: Mon, 6 Apr 2026 11:53:55 +0900
Subject: [PATCH] =?UTF-8?q?fix:=20=EC=99=84=EB=A3=8C=20=EC=B9=B4=EB=93=9C?=
 =?UTF-8?q?=20=EA=B3=B5=EC=A0=95=20=ED=91=9C=EC=8B=9C=EB=A5=BC=20=ED=95=B4?=
 =?UTF-8?q?=EB=8B=B9=20=EC=B9=B4=EB=93=9C=EC=9D=98=20seq=20=EA=B8=B0?=
 =?UTF-8?q?=EC=A4=80=EC=9C=BC=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 이전: 완료 카드는 모든 공정을 ✓로 표시 (전체 완료)
- 이후: 카드의 seq_no 이하만 ✓, 이후는 ○ 표시
- 예: seq1 완료 → ✓○○ (1/3 완료), seq3 완료 → ✓✓✓ (전체 완료)
---
 .../hardcoded/production/WorkOrderList.tsx    | 38 ++++++++++++-------
 1 file changed, 25 insertions(+), 13 deletions(-)

diff --git a/frontend/components/pop/hardcoded/production/WorkOrderList.tsx b/frontend/components/pop/hardcoded/production/WorkOrderList.tsx
index b354f923..870b847c 100644
--- a/frontend/components/pop/hardcoded/production/WorkOrderList.tsx
+++ b/frontend/components/pop/hardcoded/production/WorkOrderList.tsx
@@ -307,25 +307,37 @@ function CompressedProcessSteps({
   const currentIdx = sorted.findIndex((p) => p.seq_no === currentSeqNo);
   if (currentIdx < 0) return null;
 
-  // For completed status: show all as checkmarks
+  // For completed status: show progress up to current card's seq position
   if (status === "completed") {
+    const currentSeqNum = parseInt(currentSeqNo, 10);
+    const allDone = currentIdx === sorted.length - 1; // 마지막 공정이면 전체 완료
     return (
       <div
         className="flex items-center justify-center gap-0.5 mb-3 py-2 px-3 bg-green-50 rounded-xl cursor-pointer hover:bg-green-100 transition"
         onClick={onClick}
       >
-        {sorted.map((proc, idx) => (
-          <React.Fragment key={proc.id}>
-            {idx > 0 && <span className="w-3 h-0.5 bg-green-400 shrink-0" />}
-            <span
-              className="rounded-full bg-green-500 text-white flex items-center justify-center shrink-0 text-[9px] font-bold"
-              style={{ width: idx === currentIdx ? 28 : 24, height: idx === currentIdx ? 28 : 24, fontSize: idx === currentIdx ? 10 : 9 }}
-            >
-              &#10003;
-            </span>
-          </React.Fragment>
-        ))}
-        <span className="text-[10px] text-green-600 font-bold ml-2">전체 완료</span>
+        {sorted.map((proc, idx) => {
+          const seqNum = parseInt(proc.seq_no, 10);
+          const isDone = seqNum <= currentSeqNum; // 현재 카드 seq 이하만 완료
+          return (
+            <React.Fragment key={proc.id}>
+              {idx > 0 && <span className={`w-3 h-0.5 ${isDone ? "bg-green-400" : "bg-gray-300"} shrink-0`} />}
+              <span
+                className={`rounded-full flex items-center justify-center shrink-0 text-[9px] font-bold ${
+                  isDone
+                    ? "bg-green-500 text-white"
+                    : "bg-gray-200 text-gray-400"
+                }`}
+                style={{ width: idx === currentIdx ? 28 : 24, height: idx === currentIdx ? 28 : 24, fontSize: idx === currentIdx ? 10 : 9 }}
+              >
+                {isDone ? "\u2713" : idx + 1}
+              </span>
+            </React.Fragment>
+          );
+        })}
+        <span className="text-[10px] text-green-600 font-bold ml-2">
+          {allDone ? "전체 완료" : `${currentIdx + 1}/${sorted.length} 완료`}
+        </span>
       </div>
     );
   }