diff --git a/src/components/material/ReceivingManagement/ReceivingDetail.tsx b/src/components/material/ReceivingManagement/ReceivingDetail.tsx index 5b1e5525..89dee42c 100644 --- a/src/components/material/ReceivingManagement/ReceivingDetail.tsx +++ b/src/components/material/ReceivingManagement/ReceivingDetail.tsx @@ -16,7 +16,8 @@ import { useState, useCallback, useEffect } from 'react'; import { useRouter } from 'next/navigation'; -import { Upload, FileText } from 'lucide-react'; +import { FileText, X } from 'lucide-react'; +import { FileDropzone } from '@/components/ui/file-dropzone'; import { InspectionModalV2 } from '@/app/[locale]/(protected)/quality/qms/components/InspectionModalV2'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; @@ -79,6 +80,9 @@ export function ReceivingDetail({ id, mode = 'view' }: Props) { // 폼 데이터 (등록/수정 모드용) const [formData, setFormData] = useState>(INITIAL_FORM_DATA); + // 업로드된 파일 상태 (File 객체) + const [uploadedFile, setUploadedFile] = useState(null); + // 수입검사 성적서 모달 상태 const [isInspectionModalOpen, setIsInspectionModalOpen] = useState(false); @@ -403,18 +407,53 @@ export function ReceivingDetail({ id, mode = 'view' }: Props) { {/* 업체 제공 성적서 자료 - 파일 업로드 */}
-
-
- - 클릭하여 파일을 찾거나, 마우스로 파일을 끌어오세요. -
+
+ {uploadedFile || formData.certificateFileName ? ( +
+ + + {uploadedFile?.name || formData.certificateFileName} + + {uploadedFile && ( + + {(uploadedFile.size / (1024 * 1024)).toFixed(1)}MB + + )} + +
+ ) : ( + { + const file = files[0]; + if (file) { + setUploadedFile(file); + handleInputChange('certificateFileName', file.name); + } + }} + accept=".pdf,.jpg,.jpeg,.png,.doc,.docx,.xls,.xlsx" + maxSize={20} + compact + title="클릭하여 파일을 찾거나, 마우스로 파일을 끌어오세요" + description="PDF, 이미지, 문서 파일 (최대 20MB)" + /> + )}
); - }, [formData]); + }, [formData, uploadedFile]); // ===== 커스텀 헤더 액션 (view/edit 모드) ===== const customHeaderActions = (isViewMode || isEditMode) && detail ? (