SamProject/sam-react-prod
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: [WEB] 중간검사 모달 스타일을 수입검사 모달과 동일하게 변경

Browse Source 
- Dialog 레이아웃: p-0, flex col, max-h-[90vh] 적용
- 헤더/스크롤/하단 3영역 분리 (판정+버튼 하단 고정)
- 토글 버튼 스타일 통일 (black/gray-100 border)
- 인풋 h-11 rounded-lg border-gray-300 적용
- 라벨 text-sm font-bold span으로 변경
- 검사완료 버튼 bg-black, 취소 버튼 outline 스타일
This commit is contained in:
권혁성
2026-02-07 05:10:29 +09:00
parent 1fca5ed477
commit 61bf95b58e
1 changed files with 145 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

290
src/components/production/WorkerScreen/InspectionInputModal.tsx
View File

@@ -20,7 +20,6 @@ import {
} from '@/components/ui/dialog'; } from '@/components/ui/dialog';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Input } from '@/components/ui/input'; import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label';
import { Textarea } from '@/components/ui/textarea'; import { Textarea } from '@/components/ui/textarea';
import { cn } from '@/lib/utils'; import { cn } from '@/lib/utils';
@@ -82,15 +81,15 @@ function StatusToggle({
onChange: (v: 'good' | 'bad') => void; onChange: (v: 'good' | 'bad') => void;
}) { }) {
return ( return (
<div className="flex gap-2"> <div className="flex gap-2 flex-1">
<button <button
type="button" type="button"
onClick={() => onChange('good')} onClick={() => onChange('good')}
className={cn( className={cn(
'px-4 py-2 rounded-lg text-sm font-medium transition-colors', 'flex-1 py-2.5 rounded-lg text-sm font-bold transition-colors',
value === 'good' value === 'good'
? 'bg-orange-500 text-white' ? 'bg-black text-white'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300' : 'bg-gray-100 text-gray-700 border border-gray-300 hover:bg-gray-200'
)} )}
> >
양호 양호
@@ -99,10 +98,10 @@ function StatusToggle({
type="button" type="button"
onClick={() => onChange('bad')} onClick={() => onChange('bad')}
className={cn( className={cn(
'px-4 py-2 rounded-lg text-sm font-medium transition-colors', 'flex-1 py-2.5 rounded-lg text-sm font-bold transition-colors',
value === 'bad' value === 'bad'
? 'bg-gray-700 text-white' ? 'bg-black text-white'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300' : 'bg-gray-100 text-gray-700 border border-gray-300 hover:bg-gray-200'
)} )}
> >
불량 불량
@@ -120,15 +119,15 @@ function OkNgToggle({
onChange: (v: 'ok' | 'ng') => void; onChange: (v: 'ok' | 'ng') => void;
}) { }) {
return ( return (
<div className="flex gap-2"> <div className="flex gap-2 flex-1">
<button <button
type="button" type="button"
onClick={() => onChange('ok')} onClick={() => onChange('ok')}
className={cn( className={cn(
'px-6 py-2 rounded-lg text-sm font-medium transition-colors', 'flex-1 py-2.5 rounded-lg text-sm font-bold transition-colors',
value === 'ok' value === 'ok'
? 'bg-gray-700 text-white' ? 'bg-black text-white'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300' : 'bg-gray-100 text-gray-700 border border-gray-300 hover:bg-gray-200'
)} )}
> >
OK OK
@@ -137,10 +136,10 @@ function OkNgToggle({
type="button" type="button"
onClick={() => onChange('ng')} onClick={() => onChange('ng')}
className={cn( className={cn(
'px-6 py-2 rounded-lg text-sm font-medium transition-colors', 'flex-1 py-2.5 rounded-lg text-sm font-bold transition-colors',
value === 'ng' value === 'ng'
? 'bg-gray-700 text-white' ? 'bg-black text-white'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300' : 'bg-gray-100 text-gray-700 border border-gray-300 hover:bg-gray-200'
)} )}
> >
NG NG
@@ -158,15 +157,15 @@ function JudgmentToggle({
onChange: (v: 'pass' | 'fail') => void; onChange: (v: 'pass' | 'fail') => void;
}) { }) {
return ( return (
<div className="flex gap-2"> <div className="flex gap-2 flex-1">
<button <button
type="button" type="button"
onClick={() => onChange('pass')} onClick={() => onChange('pass')}
className={cn( className={cn(
'px-4 py-2 rounded-lg text-sm font-medium transition-colors', 'flex-1 py-2.5 rounded-lg text-sm font-bold transition-colors',
value === 'pass' value === 'pass'
? 'bg-orange-500 text-white' ? 'bg-orange-600 text-white'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300' : 'bg-gray-100 text-gray-700 border border-gray-300 hover:bg-gray-200'
)} )}
> >
적합 적합
@@ -175,10 +174,10 @@ function JudgmentToggle({
type="button" type="button"
onClick={() => onChange('fail')} onClick={() => onChange('fail')}
className={cn( className={cn(
'px-4 py-2 rounded-lg text-sm font-medium transition-colors', 'flex-1 py-2.5 rounded-lg text-sm font-bold transition-colors',
value === 'fail' value === 'fail'
? 'bg-gray-700 text-white' ? 'bg-black text-white'
: 'bg-gray-200 text-gray-700 hover:bg-gray-300' : 'bg-gray-100 text-gray-700 border border-gray-300 hover:bg-gray-200'
)} )}
> >
부적합 부적합
@@ -286,79 +285,79 @@ export function InspectionInputModal({
return ( return (
<Dialog open={open} onOpenChange={onOpenChange}> <Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent className="w-[95vw] max-w-[500px] sm:max-w-[500px]"> <DialogContent className="w-[95vw] max-w-[500px] sm:max-w-[500px] max-h-[90vh] flex flex-col p-0">
<DialogHeader> <DialogHeader className="px-6 pt-6 pb-0 shrink-0">
<DialogTitle className="text-lg font-bold"> <DialogTitle className="text-lg font-bold">
{PROCESS_TITLES[processType]} {PROCESS_TITLES[processType]}
</DialogTitle> </DialogTitle>
</DialogHeader> </DialogHeader>
<div className="space-y-6 mt-4 max-h-[70vh] overflow-y-auto pr-2"> <div className="flex-1 min-h-0 overflow-y-auto px-5 py-4 space-y-5">
{/* 제품명 */} {/* 기본 정보 (읽기전용) */}
<div className="space-y-2"> <div className="space-y-3">
<Label className="text-muted-foreground">제품명</Label> <div className="space-y-1.5">
<Input <span className="text-sm font-bold">제품명</span>
value={formData.productName} <Input
readOnly value={formData.productName}
className="" readOnly
/> className="h-11 bg-gray-100 border-gray-300 rounded-lg"
</div> />
</div>
{/* 규격 */} <div className="space-y-1.5">
<div className="space-y-2"> <span className="text-sm font-bold">규격</span>
<Label className="text-muted-foreground">규격</Label> <Input
<Input value={formData.specification}
value={formData.specification} readOnly
readOnly className="h-11 bg-gray-100 border-gray-300 rounded-lg"
className="" />
/> </div>
</div> </div>
{/* ===== 재고생산 (bending_wip) 검사 항목 ===== */} {/* ===== 재고생산 (bending_wip) 검사 항목 ===== */}
{processType === 'bending_wip' && ( {processType === 'bending_wip' && (
<> <>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 절곡상태</Label> <span className="text-sm font-bold">검모양 절곡상태</span>
<StatusToggle <StatusToggle
value={formData.bendingStatus || null} value={formData.bendingStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, bendingStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, bendingStatus: v }))}
/> />
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">길이 (1,000)</Label> <span className="text-sm font-bold">길이 (1,000)</span>
<Input <Input
type="number" type="number"
placeholder="1,000" placeholder="1,000"
value={formData.length ?? ''} value={formData.length ?? ''}
onChange={(e) => handleNumberChange('length', e.target.value)} onChange={(e) => handleNumberChange('length', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">너비 (1,000)</Label> <span className="text-sm font-bold">너비 (1,000)</span>
<Input <Input
type="number" type="number"
placeholder="1,000" placeholder="1,000"
value={formData.width ?? ''} value={formData.width ?? ''}
onChange={(e) => handleNumberChange('width', e.target.value)} onChange={(e) => handleNumberChange('width', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">간격 (1,000)</Label> <span className="text-sm font-bold">간격 (1,000)</span>
<div className="flex gap-2"> <div className="flex gap-2">
<Input <Input
type="number" type="number"
placeholder="①" placeholder="①"
className="" className="h-11 rounded-lg border-gray-300"
/> />
<Input <Input
type="number" type="number"
placeholder="1,000" placeholder="1,000"
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
@@ -369,51 +368,51 @@ export function InspectionInputModal({
{/* ===== 스크린 검사 항목 ===== */} {/* ===== 스크린 검사 항목 ===== */}
{processType === 'screen' && ( {processType === 'screen' && (
<> <>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 가공상태</Label> <span className="text-sm font-bold">검모양 가공상태</span>
<StatusToggle <StatusToggle
value={formData.processingStatus || null} value={formData.processingStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, processingStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, processingStatus: v }))}
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 재봉상태</Label> <span className="text-sm font-bold">검모양 재봉상태</span>
<StatusToggle <StatusToggle
value={formData.sewingStatus || null} value={formData.sewingStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, sewingStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, sewingStatus: v }))}
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 조립상태</Label> <span className="text-sm font-bold">검모양 조립상태</span>
<StatusToggle <StatusToggle
value={formData.assemblyStatus || null} value={formData.assemblyStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, assemblyStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, assemblyStatus: v }))}
/> />
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">길이 (1,000)</Label> <span className="text-sm font-bold">길이 (1,000)</span>
<Input <Input
type="number" type="number"
placeholder="1,000" placeholder="1,000"
value={formData.length ?? ''} value={formData.length ?? ''}
onChange={(e) => handleNumberChange('length', e.target.value)} onChange={(e) => handleNumberChange('length', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">너비 (1,000)</Label> <span className="text-sm font-bold">너비 (1,000)</span>
<Input <Input
type="number" type="number"
placeholder="1,000" placeholder="1,000"
value={formData.width ?? ''} value={formData.width ?? ''}
onChange={(e) => handleNumberChange('width', e.target.value)} onChange={(e) => handleNumberChange('width', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">간격 (400 이하)</Label> <span className="text-sm font-bold">간격 (400 이하)</span>
<OkNgToggle <OkNgToggle
value={formData.gapStatus || null} value={formData.gapStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, gapStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, gapStatus: v }))}
@@ -425,50 +424,50 @@ export function InspectionInputModal({
{/* ===== 슬랫 검사 항목 ===== */} {/* ===== 슬랫 검사 항목 ===== */}
{processType === 'slat' && ( {processType === 'slat' && (
<> <>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 가공상태</Label> <span className="text-sm font-bold">검모양 가공상태</span>
<StatusToggle <StatusToggle
value={formData.processingStatus || null} value={formData.processingStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, processingStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, processingStatus: v }))}
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 조립상태</Label> <span className="text-sm font-bold">검모양 조립상태</span>
<StatusToggle <StatusToggle
value={formData.assemblyStatus || null} value={formData.assemblyStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, assemblyStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, assemblyStatus: v }))}
/> />
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">① 높이 (16.5 ± 1)</Label> <span className="text-sm font-bold">① 높이 (16.5 ± 1)</span>
<Input <Input
type="number" type="number"
placeholder="16.5" placeholder="16.5"
value={formData.height1 ?? ''} value={formData.height1 ?? ''}
onChange={(e) => handleNumberChange('height1', e.target.value)} onChange={(e) => handleNumberChange('height1', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">② 높이 (14.5 ± 1)</Label> <span className="text-sm font-bold">② 높이 (14.5 ± 1)</span>
<Input <Input
type="number" type="number"
placeholder="14.5" placeholder="14.5"
value={formData.height2 ?? ''} value={formData.height2 ?? ''}
onChange={(e) => handleNumberChange('height2', e.target.value)} onChange={(e) => handleNumberChange('height2', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">길이 (0)</Label> <span className="text-sm font-bold">길이 (0)</span>
<Input <Input
type="number" type="number"
placeholder="0" placeholder="0"
value={formData.length ?? ''} value={formData.length ?? ''}
onChange={(e) => handleNumberChange('length', e.target.value)} onChange={(e) => handleNumberChange('length', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</> </>
@@ -477,61 +476,61 @@ export function InspectionInputModal({
{/* ===== 조인트바 검사 항목 ===== */} {/* ===== 조인트바 검사 항목 ===== */}
{processType === 'slat_jointbar' && ( {processType === 'slat_jointbar' && (
<> <>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 가공상태</Label> <span className="text-sm font-bold">검모양 가공상태</span>
<StatusToggle <StatusToggle
value={formData.processingStatus || null} value={formData.processingStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, processingStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, processingStatus: v }))}
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 조립상태</Label> <span className="text-sm font-bold">검모양 조립상태</span>
<StatusToggle <StatusToggle
value={formData.assemblyStatus || null} value={formData.assemblyStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, assemblyStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, assemblyStatus: v }))}
/> />
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">① 높이 (16.5 ± 1)</Label> <span className="text-sm font-bold">① 높이 (16.5 ± 1)</span>
<Input <Input
type="number" type="number"
placeholder="16.5" placeholder="16.5"
value={formData.height1 ?? ''} value={formData.height1 ?? ''}
onChange={(e) => handleNumberChange('height1', e.target.value)} onChange={(e) => handleNumberChange('height1', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">② 높이 (14.5 ± 1)</Label> <span className="text-sm font-bold">② 높이 (14.5 ± 1)</span>
<Input <Input
type="number" type="number"
placeholder="14.5" placeholder="14.5"
value={formData.height2 ?? ''} value={formData.height2 ?? ''}
onChange={(e) => handleNumberChange('height2', e.target.value)} onChange={(e) => handleNumberChange('height2', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">③ 길이 (300 ± 1)</Label> <span className="text-sm font-bold">③ 길이 (300 ± 1)</span>
<Input <Input
type="number" type="number"
placeholder="300" placeholder="300"
value={formData.length3 ?? ''} value={formData.length3 ?? ''}
onChange={(e) => handleNumberChange('length3', e.target.value)} onChange={(e) => handleNumberChange('length3', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">④ 간격 (150 ± 1)</Label> <span className="text-sm font-bold">④ 간격 (150 ± 1)</span>
<Input <Input
type="number" type="number"
placeholder="150" placeholder="150"
value={formData.gap4 ?? ''} value={formData.gap4 ?? ''}
onChange={(e) => handleNumberChange('gap4', e.target.value)} onChange={(e) => handleNumberChange('gap4', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
@@ -541,40 +540,40 @@ export function InspectionInputModal({
{/* ===== 절곡 검사 항목 ===== */} {/* ===== 절곡 검사 항목 ===== */}
{processType === 'bending' && ( {processType === 'bending' && (
<> <>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">검모양 절곡상태</Label> <span className="text-sm font-bold">검모양 절곡상태</span>
<StatusToggle <StatusToggle
value={formData.bendingStatus || null} value={formData.bendingStatus || null}
onChange={(v) => setFormData((prev) => ({ ...prev, bendingStatus: v }))} onChange={(v) => setFormData((prev) => ({ ...prev, bendingStatus: v }))}
/> />
</div> </div>
<div className="grid grid-cols-2 gap-4"> <div className="grid grid-cols-2 gap-3">
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">길이 (1,000)</Label> <span className="text-sm font-bold">길이 (1,000)</span>
<Input <Input
type="number" type="number"
placeholder="1,000" placeholder="1,000"
value={formData.length ?? ''} value={formData.length ?? ''}
onChange={(e) => handleNumberChange('length', e.target.value)} onChange={(e) => handleNumberChange('length', e.target.value)}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">너비 (N/A)</Label> <span className="text-sm font-bold">너비 (N/A)</span>
<Input <Input
type="text" type="text"
placeholder="N/A" placeholder="N/A"
value={formData.width ?? 'N/A'} value={formData.width ?? 'N/A'}
readOnly readOnly
className="" className="h-11 bg-gray-100 border-gray-300 rounded-lg"
/> />
</div> </div>
</div> </div>
<div className="space-y-3"> <div className="space-y-3">
<Label className="text-muted-foreground">간격</Label> <span className="text-sm font-bold">간격</span>
{gapPoints.map((point, index) => ( {gapPoints.map((point, index) => (
<div key={index} className="grid grid-cols-3 gap-2 items-center"> <div key={index} className="grid grid-cols-3 gap-2 items-center">
<span className="text-muted-foreground text-sm">⑤{index + 1}</span> <span className="text-gray-500 text-sm font-medium">⑤{index + 1}</span>
<Input <Input
type="number" type="number"
placeholder={String(30 + index * 10)} placeholder={String(30 + index * 10)}
@@ -587,7 +586,7 @@ export function InspectionInputModal({
}; };
setGapPoints(newPoints); setGapPoints(newPoints);
}} }}
className="" className="h-11 rounded-lg border-gray-300"
/> />
<Input <Input
type="number" type="number"
@@ -601,7 +600,7 @@ export function InspectionInputModal({
}; };
setGapPoints(newPoints); setGapPoints(newPoints);
}} }}
className="" className="h-11 rounded-lg border-gray-300"
/> />
</div> </div>
))} ))}
@@ -609,44 +608,45 @@ export function InspectionInputModal({
</> </>
)} )}
{/* 공통: 판정 */} {/* 부적합 내용 */}
<div className="space-y-2"> <div className="space-y-1.5">
<Label className="text-muted-foreground">판정</Label> <span className="text-sm font-bold">부적합 내용</span>
<JudgmentToggle
value={formData.judgment}
onChange={(v) => setFormData((prev) => ({ ...prev, judgment: v }))}
/>
</div>
{/* 공통: 부적합 내용 */}
<div className="space-y-2">
<Label className="text-muted-foreground">부적합 내용</Label>
<Textarea <Textarea
value={formData.nonConformingContent} value={formData.nonConformingContent}
onChange={(e) => onChange={(e) =>
setFormData((prev) => ({ ...prev, nonConformingContent: e.target.value })) setFormData((prev) => ({ ...prev, nonConformingContent: e.target.value }))
} }
placeholder="입력 시 '일련번호: 내용' 형태로 취합되어 표시" placeholder="입력 시 '일련번호: 내용' 형태로 취합되어 표시"
className="min-h-[80px]" className="min-h-[80px] rounded-lg border-gray-300"
/> />
</div> </div>
</div> </div>
{/* 버튼 영역 */} {/* 하단 고정: 판정 + 버튼 */}
<div className="flex gap-3 mt-6"> <div className="shrink-0 border-t bg-white px-5 pb-5 pt-3 shadow-[0_-4px_6px_-1px_rgba(0,0,0,0.05)]">
<Button <div className="space-y-2 mb-4">
variant="outline" <span className="text-sm font-bold">판정</span>
onClick={handleCancel} <JudgmentToggle
className="flex-1" value={formData.judgment}
> onChange={(v) => setFormData((prev) => ({ ...prev, judgment: v }))}
취소 />
</Button> </div>
<Button <div className="flex gap-3">
onClick={handleComplete} <Button
className="flex-1 bg-orange-500 hover:bg-orange-600 text-white" variant="outline"
> onClick={handleCancel}
검사 완료 className="flex-1 h-11 rounded-lg border-gray-300 font-bold"
</Button> >
취소
</Button>
<Button
variant="ghost"
onClick={handleComplete}
className="flex-1 h-11 rounded-lg bg-black hover:bg-gray-800 text-white font-bold"
>
검사 완료
</Button>
</div>
</div> </div>
</DialogContent> </DialogContent>
</Dialog> </Dialog>