From d1c2ea2199c0bf3a2b60d1195ec74097e447b41e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=B3=B4=EA=B3=A4?=
 <lightone2017@codebridge-x.com>
Date: Sun, 22 Mar 2026 17:28:39 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20[=EC=9E=90=EC=9E=AC=ED=88=AC=EC=9E=85]?=
 =?UTF-8?q?=20=EB=B0=B0=EC=A0=95=EC=99=84=EB=A3=8C=20=EB=B1=83=EC=A7=80=20?=
 =?UTF-8?q?=ED=86=A0=EA=B8=80=20=ED=95=84=ED=84=B0=20=E2=80=94=20=EB=AF=B8?=
 =?UTF-8?q?=EB=B0=B0=EC=A0=95=20=ED=95=AD=EB=AA=A9=EB=A7=8C=20=ED=91=9C?=
 =?UTF-8?q?=EC=8B=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 배정완료 뱃지 클릭 시 미배정 그룹만 필터링 (토글)
- 다시 클릭하면 전체 표시
- 뱃지 텍스트: "미배정 N건" / "N / M 배정완료" 전환
---
 .../WorkerScreen/MaterialInputModal.tsx       | 26 ++++++++++++++-----
 1 file changed, 19 insertions(+), 7 deletions(-)

diff --git a/src/components/production/WorkerScreen/MaterialInputModal.tsx b/src/components/production/WorkerScreen/MaterialInputModal.tsx
index da05aa5e..64d3ce49 100644
--- a/src/components/production/WorkerScreen/MaterialInputModal.tsx
+++ b/src/components/production/WorkerScreen/MaterialInputModal.tsx
@@ -87,6 +87,7 @@ export function MaterialInputModal({
   const [manualAllocations, setManualAllocations] = useState<Map<string, number>>(new Map());
   const [isLoading, setIsLoading] = useState(false);
   const [isSubmitting, setIsSubmitting] = useState(false);
+  const [showUnfulfilledOnly, setShowUnfulfilledOnly] = useState(false);
   const materialsLoadedRef = useRef(false);
 
   // 재공품 여부 판별 — 재공품이면 검색 시 원자재(RM)만 조회
@@ -538,13 +539,18 @@ export function MaterialInputModal({
                 }).length;
                 const total = materialGroups.length;
                 return (
-                  <span className={cn(
-                    "text-xs font-semibold px-2.5 py-1 rounded-full",
-                    fulfilled === total ? "bg-emerald-100 text-emerald-700" : "bg-amber-100 text-amber-700"
-                  )}>
+                  <button
+                    onClick={() => setShowUnfulfilledOnly(prev => !prev)}
+                    className={cn(
+                      "text-xs font-semibold px-2.5 py-1 rounded-full cursor-pointer transition-colors",
+                      showUnfulfilledOnly
+                        ? "bg-amber-200 text-amber-800 ring-2 ring-amber-400"
+                        : fulfilled === total ? "bg-emerald-100 text-emerald-700 hover:bg-emerald-200" : "bg-amber-100 text-amber-700 hover:bg-amber-200"
+                    )}
+                  >
                     {fulfilled === total ? <Check className="h-3 w-3 inline mr-0.5" /> : null}
-                    {fulfilled} / {total} 배정완료
-                  </span>
+                    {showUnfulfilledOnly ? `미배정 ${total - fulfilled}건` : `${fulfilled} / ${total} 배정완료`}
+                  </button>
                 );
               })()}
             </div>
@@ -642,7 +648,13 @@ export function MaterialInputModal({
             </div>
           ) : (
             <div className="space-y-4 flex-1 overflow-y-auto min-h-0">
-              {materialGroups.map((group, groupIdx) => {
+              {materialGroups.filter((group) => {
+                if (!showUnfulfilledOnly) return true;
+                const target = getGroupTargetQty(group);
+                if (target <= 0 && group.alreadyInputted <= 0) return false;
+                const allocated = group.lots.reduce((sum, lot) => sum + (allocations.get(getLotKey(lot, group.groupKey)) || 0), 0);
+                return allocated < target;
+              }).map((group, groupIdx) => {
                 // 같은 카테고리 내 순번 계산 (①②③...)
                 const categoryIndex = group.category
                   ? materialGroups.slice(0, groupIdx).filter(g => g.category === group.category).length