feat: [자재투입] 배정완료 뱃지 토글 필터 — 미배정 항목만 표시
- 배정완료 뱃지 클릭 시 미배정 그룹만 필터링 (토글) - 다시 클릭하면 전체 표시 - 뱃지 텍스트: "미배정 N건" / "N / M 배정완료" 전환
This commit is contained in:
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user