feat: [자재투입] 배정 자재 없을 때도 재고 검색/강제입고 기능 표시

This commit is contained in:
김보곤
2026-03-22 13:12:48 +09:00
parent 6ccd246b14
commit 9fa5a88266

View File

@@ -546,8 +546,70 @@ export function MaterialInputModal({
{isLoading ? (
<ContentSkeleton type="table" rows={4} />
) : materials.length === 0 ? (
<div className="border rounded-lg py-12 text-center text-sm text-gray-500">
.
<div className="border rounded-lg overflow-hidden">
<div className="py-8 text-center text-sm text-gray-500">
.
</div>
{/* 자재 없을 때도 재고 검색 + 강제입고 가능 */}
<div className="px-4 py-3 bg-blue-50 border-t space-y-2">
<div className="flex items-center gap-2">
<Search className="h-3.5 w-3.5 text-blue-500 shrink-0" />
<input
type="text"
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
onKeyDown={(e) => e.key === 'Enter' && handleStockSearch(searchQuery)}
placeholder="품목코드 또는 자재명으로 재고 검색"
className="flex-1 text-xs px-2 py-1.5 border rounded bg-white"
/>
<Button size="sm" variant="outline" className="h-7 text-xs" onClick={() => handleStockSearch(searchQuery)}>
{isSearching ? <Loader2 className="h-3 w-3 animate-spin" /> : '검색'}
</Button>
</div>
{searchResults.length > 0 ? (
<div className="space-y-1">
<p className="text-[11px] text-blue-600 font-medium">{searchResults.length} :</p>
{searchResults.map((s, si) => (
<div key={`${s.itemId}-${si}`} className={cn(
"text-[11px] px-2 py-1.5 rounded border",
s.availableQty > 0 ? "bg-white border-emerald-200" : "bg-gray-50 border-gray-200"
)}>
<div className="flex justify-between items-center">
<span className="font-medium">{s.itemCode}</span>
<span className={s.availableQty > 0 ? "text-emerald-600 font-semibold" : "text-gray-400"}>
{formatNumber(s.availableQty)} EA
</span>
</div>
<div className="text-gray-500">{s.itemName}</div>
{s.lots.length > 0 && s.lots.slice(0, 3).map((l, li) => (
<div key={li} className="text-[10px] text-gray-400 ml-2">
LOT {l.lotNo} | {formatNumber(l.availableQty)} EA | FIFO #{l.fifoOrder}
</div>
))}
</div>
))}
</div>
) : isSearching ? (
<p className="text-[11px] text-gray-400 flex items-center gap-1"><Loader2 className="h-3 w-3 animate-spin" /> ...</p>
) : searchQuery && (
<p className="text-[11px] text-red-500"> </p>
)}
{searchQuery && (
<Button
size="sm"
variant="outline"
className="w-full h-8 text-xs border-orange-300 text-orange-600 hover:bg-orange-50"
disabled={isForceCreating}
onClick={() => {
const firstResult = searchResults[0];
if (firstResult) handleForceReceiving(firstResult.itemId, firstResult.itemCode);
}}
>
{isForceCreating ? <Loader2 className="h-3 w-3 animate-spin mr-1" /> : <Zap className="h-3 w-3 mr-1" />}
[DEV]
</Button>
)}
</div>
</div>
) : (
<div className="space-y-4 flex-1 overflow-y-auto min-h-0">