summaryrefslogtreecommitdiff
path: root/lib/dolce/dialogs
diff options
context:
space:
mode:
Diffstat (limited to 'lib/dolce/dialogs')
-rw-r--r--lib/dolce/dialogs/add-detail-drawing-dialog.tsx376
-rw-r--r--lib/dolce/dialogs/b4-bulk-upload-dialog.tsx608
-rw-r--r--lib/dolce/dialogs/b4-upload-validation-dialog.tsx353
-rw-r--r--lib/dolce/dialogs/detail-drawing-dialog.tsx311
-rw-r--r--lib/dolce/dialogs/upload-files-to-detail-dialog.tsx314
5 files changed, 1962 insertions, 0 deletions
diff --git a/lib/dolce/dialogs/add-detail-drawing-dialog.tsx b/lib/dolce/dialogs/add-detail-drawing-dialog.tsx
new file mode 100644
index 00000000..290a226b
--- /dev/null
+++ b/lib/dolce/dialogs/add-detail-drawing-dialog.tsx
@@ -0,0 +1,376 @@
+"use client";
+
+import { useState, useCallback } from "react";
+import { useDropzone } from "react-dropzone";
+import {
+ Dialog,
+ DialogContent,
+ DialogHeader,
+ DialogTitle,
+ DialogFooter,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
+import { Input } from "@/components/ui/input";
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { Upload, X, FileIcon, Info } from "lucide-react";
+import { toast } from "sonner";
+import { UnifiedDwgReceiptItem, editDetailDwgReceipt, uploadFilesToDetailDrawing } from "../actions";
+import { v4 as uuidv4 } from "uuid";
+
+interface AddDetailDrawingDialogProps {
+ open: boolean;
+ onOpenChange: (open: boolean) => void;
+ drawing: UnifiedDwgReceiptItem | null;
+ vendorCode: string;
+ userId: string;
+ userName: string;
+ userEmail: string;
+ onComplete: () => void;
+ drawingKind: "B3" | "B4"; // 추가
+}
+
+// B3 벤더의 선택 옵션
+const B3_DRAWING_USAGE_OPTIONS = [
+ { value: "APP", label: "APPROVAL (승인용)" },
+ { value: "WOR", label: "WORKING (작업용)" },
+];
+
+const B3_REGISTER_KIND_OPTIONS: Record<string, Array<{ value: string; label: string; revisionRule: string }>> = {
+ APP: [
+ { value: "APPR", label: "승인용 도면 (Full)", revisionRule: "예: A, B, C 또는 R00, R01, R02" },
+ { value: "APPR-P", label: "승인용 도면 (Partial)", revisionRule: "예: A, B, C 또는 R00, R01, R02" },
+ ],
+ WOR: [
+ { value: "WORK", label: "작업용 입수도면 (Full)", revisionRule: "예: A, B, C 또는 R00, R01, R02" },
+ { value: "WORK-P", label: "작업용 입수도면 (Partial)", revisionRule: "예: A, B, C 또는 R00, R01, R02" },
+ ],
+};
+
+// B4 벤더(GTT)의 선택 옵션
+const B4_DRAWING_USAGE_OPTIONS = [
+ { value: "REC", label: "RECEIVE (입수용)" },
+];
+
+const B4_REGISTER_KIND_OPTIONS: Record<string, Array<{ value: string; label: string; revisionRule: string }>> = {
+ REC: [
+ { value: "RECP", label: "Pre. 도면입수", revisionRule: "예: R00, R01, R02, R03" },
+ { value: "RECW", label: "Working 도면입수", revisionRule: "예: R00, R01, R02, R03" },
+ ],
+};
+
+export function AddDetailDrawingDialog({
+ open,
+ onOpenChange,
+ drawing,
+ vendorCode,
+ userId,
+ userName,
+ userEmail,
+ onComplete,
+ drawingKind,
+}: AddDetailDrawingDialogProps) {
+ const [drawingUsage, setDrawingUsage] = useState<string>("");
+ const [registerKind, setRegisterKind] = useState<string>("");
+ const [revision, setRevision] = useState<string>("");
+ const [files, setFiles] = useState<File[]>([]);
+ const [isSubmitting, setIsSubmitting] = useState(false);
+
+ // 파일 드롭 핸들러
+ const onDrop = useCallback((acceptedFiles: File[]) => {
+ setFiles((prev) => [...prev, ...acceptedFiles]);
+ }, []);
+
+ const { getRootProps, getInputProps, isDragActive } = useDropzone({
+ onDrop,
+ multiple: true,
+ });
+
+ // 파일 제거
+ const removeFile = (index: number) => {
+ setFiles((prev) => prev.filter((_, i) => i !== index));
+ };
+
+ // 폼 초기화
+ const resetForm = () => {
+ setDrawingUsage("");
+ setRegisterKind("");
+ setRevision("");
+ setFiles([]);
+ };
+
+ // 제출
+ const handleSubmit = async () => {
+ if (!drawing) return;
+
+ // 유효성 검사
+ if (!drawingUsage) {
+ toast.error("도면용도를 선택하세요");
+ return;
+ }
+ if (!registerKind) {
+ toast.error("등록종류를 선택하세요");
+ return;
+ }
+ if (!revision.trim()) {
+ toast.error("Revision을 입력하세요");
+ return;
+ }
+ if (files.length === 0) {
+ toast.error("최소 1개 이상의 파일을 첨부해야 합니다");
+ return;
+ }
+
+ try {
+ setIsSubmitting(true);
+
+ // 파일 업로드 ID 생성
+ const uploadId = uuidv4();
+
+ // 상세도면 추가
+ const result = await editDetailDwgReceipt({
+ dwgList: [
+ {
+ Mode: "ADD",
+ Status: "Draft",
+ RegisterId: 0,
+ ProjectNo: drawing.ProjectNo,
+ Discipline: drawing.Discipline,
+ DrawingKind: drawing.DrawingKind,
+ DrawingNo: drawing.DrawingNo,
+ DrawingName: drawing.DrawingName,
+ RegisterGroupId: drawing.RegisterGroupId,
+ RegisterSerialNo: 0, // 자동 증가
+ RegisterKind: registerKind,
+ DrawingRevNo: revision,
+ Category: "TS", // To SHI (벤더가 SHI에게 제출)
+ Receiver: null,
+ Manager: "",
+ RegisterDesc: "",
+ UploadId: uploadId,
+ RegCompanyCode: vendorCode,
+ },
+ ],
+ userId,
+ userNm: userName,
+ vendorCode,
+ email: userEmail,
+ });
+
+ if (result > 0) {
+ // 파일 업로드 처리 (상세도면 추가 후)
+ if (files.length > 0) {
+ toast.info(`${files.length}개 파일 업로드를 진행합니다...`);
+
+ const formData = new FormData();
+ formData.append("uploadId", uploadId);
+ formData.append("userId", userId);
+ formData.append("fileCount", String(files.length));
+
+ files.forEach((file, index) => {
+ formData.append(`file_${index}`, file);
+ });
+
+ const uploadResult = await uploadFilesToDetailDrawing(formData);
+
+ if (uploadResult.success) {
+ toast.success(`상세도면 추가 및 ${uploadResult.uploadedCount}개 파일 업로드 완료`);
+ } else {
+ toast.warning(`상세도면은 추가되었으나 파일 업로드 실패: ${uploadResult.error}`);
+ }
+ } else {
+ toast.success("상세도면이 추가되었습니다");
+ }
+
+ resetForm();
+ onComplete();
+ } else {
+ toast.error("상세도면 추가에 실패했습니다");
+ }
+ } catch (error) {
+ console.error("상세도면 추가 실패:", error);
+ toast.error("상세도면 추가 중 오류가 발생했습니다");
+ } finally {
+ setIsSubmitting(false);
+ }
+ };
+
+ const handleCancel = () => {
+ resetForm();
+ onOpenChange(false);
+ };
+
+ // DrawingUsage가 변경되면 RegisterKind 초기화
+ const handleDrawingUsageChange = (value: string) => {
+ setDrawingUsage(value);
+ setRegisterKind("");
+ };
+
+ // 현재 선택 가능한 DrawingUsage 및 RegisterKind 옵션
+ const drawingUsageOptions = drawingKind === "B4" ? B4_DRAWING_USAGE_OPTIONS : B3_DRAWING_USAGE_OPTIONS;
+ const registerKindOptionsMap = drawingKind === "B4" ? B4_REGISTER_KIND_OPTIONS : B3_REGISTER_KIND_OPTIONS;
+
+ const registerKindOptions = drawingUsage
+ ? registerKindOptionsMap[drawingUsage] || []
+ : [];
+
+ // 선택된 RegisterKind의 Revision Rule
+ const revisionRule = registerKindOptions.find((opt) => opt.value === registerKind)?.revisionRule || "";
+
+ return (
+ <Dialog open={open} onOpenChange={onOpenChange}>
+ <DialogContent className="max-w-2xl">
+ <DialogHeader>
+ <DialogTitle>상세도면 추가</DialogTitle>
+ </DialogHeader>
+
+ <div className="space-y-6">
+ {/* 도면 정보 표시 */}
+ {drawing && (
+ <Alert>
+ <Info className="h-4 w-4" />
+ <AlertDescription>
+ <div className="font-medium">{drawing.DrawingNo}</div>
+ <div className="text-sm text-muted-foreground">{drawing.DrawingName}</div>
+ </AlertDescription>
+ </Alert>
+ )}
+
+ {/* 도면용도 선택 */}
+ <div className="space-y-2">
+ <Label>도면용도 (Drawing Usage)</Label>
+ <Select value={drawingUsage} onValueChange={handleDrawingUsageChange}>
+ <SelectTrigger>
+ <SelectValue placeholder="도면용도를 선택하세요" />
+ </SelectTrigger>
+ <SelectContent>
+ {drawingUsageOptions.map((option) => (
+ <SelectItem key={option.value} value={option.value}>
+ {option.label}
+ </SelectItem>
+ ))}
+ </SelectContent>
+ </Select>
+ </div>
+
+ {/* 등록종류 선택 */}
+ <div className="space-y-2">
+ <Label>등록종류 (Register Kind)</Label>
+ <Select
+ value={registerKind}
+ onValueChange={setRegisterKind}
+ disabled={!drawingUsage}
+ >
+ <SelectTrigger>
+ <SelectValue placeholder="등록종류를 선택하세요" />
+ </SelectTrigger>
+ <SelectContent>
+ {registerKindOptions.map((option) => (
+ <SelectItem key={option.value} value={option.value}>
+ {option.label}
+ </SelectItem>
+ ))}
+ </SelectContent>
+ </Select>
+ {revisionRule && (
+ <p className="text-sm text-muted-foreground">
+ Revision 입력 형식: {revisionRule}
+ </p>
+ )}
+ </div>
+
+ {/* Revision 입력 */}
+ <div className="space-y-2">
+ <Label>Revision</Label>
+ <Input
+ value={revision}
+ onChange={(e) => setRevision(e.target.value)}
+ placeholder="예: A, B, R00, R01"
+ disabled={!registerKind}
+ />
+ </div>
+
+ {/* 파일 업로드 */}
+ <div className="space-y-2">
+ <Label>첨부파일 (필수) *</Label>
+ <div
+ {...getRootProps()}
+ className={`
+ border-2 border-dashed rounded-lg p-8 text-center cursor-pointer
+ transition-colors
+ ${isDragActive ? "border-primary bg-primary/5" : "border-muted-foreground/25"}
+ ${files.length > 0 ? "py-4" : ""}
+ `}
+ >
+ <input {...getInputProps()} />
+ {files.length === 0 ? (
+ <div className="space-y-2">
+ <Upload className="h-8 w-8 mx-auto text-muted-foreground" />
+ <div>
+ <p className="text-sm font-medium">
+ 파일을 드래그하거나 클릭하여 선택
+ </p>
+ <p className="text-xs text-muted-foreground">
+ 여러 파일을 한 번에 업로드할 수 있습니다
+ </p>
+ </div>
+ </div>
+ ) : (
+ <div className="space-y-2">
+ <p className="text-sm font-medium">
+ {files.length}개 파일 선택됨
+ </p>
+ <p className="text-xs text-muted-foreground">
+ 추가로 파일을 드래그하거나 클릭하여 더 추가할 수 있습니다
+ </p>
+ </div>
+ )}
+ </div>
+
+ {/* 선택된 파일 목록 */}
+ {files.length > 0 && (
+ <div className="space-y-2 mt-4">
+ {files.map((file, index) => (
+ <div
+ key={index}
+ className="flex items-center gap-2 p-2 border rounded-lg"
+ >
+ <FileIcon className="h-4 w-4 text-muted-foreground" />
+ <span className="flex-1 text-sm truncate">{file.name}</span>
+ <span className="text-xs text-muted-foreground">
+ {(file.size / 1024).toFixed(2)} KB
+ </span>
+ <Button
+ variant="ghost"
+ size="icon"
+ onClick={() => removeFile(index)}
+ >
+ <X className="h-4 w-4" />
+ </Button>
+ </div>
+ ))}
+ </div>
+ )}
+ </div>
+ </div>
+
+ <DialogFooter>
+ <Button variant="outline" onClick={handleCancel} disabled={isSubmitting}>
+ 취소
+ </Button>
+ <Button onClick={handleSubmit} disabled={isSubmitting}>
+ {isSubmitting ? "처리 중..." : "추가"}
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ );
+}
+
diff --git a/lib/dolce/dialogs/b4-bulk-upload-dialog.tsx b/lib/dolce/dialogs/b4-bulk-upload-dialog.tsx
new file mode 100644
index 00000000..f4816328
--- /dev/null
+++ b/lib/dolce/dialogs/b4-bulk-upload-dialog.tsx
@@ -0,0 +1,608 @@
+"use client";
+
+import * as React from "react";
+import { useState } from "react";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Label } from "@/components/ui/label";
+import {
+ Select,
+ SelectContent,
+ SelectItem,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+import { FolderOpen, Loader2, ChevronRight, ChevronLeft, CheckCircle2 } from "lucide-react";
+import { toast } from "sonner";
+import { Progress } from "@/components/ui/progress";
+import {
+ validateB4FileName,
+ B4UploadValidationDialog,
+ type FileValidationResult,
+} from "./b4-upload-validation-dialog";
+import {
+ checkB4MappingStatus,
+ bulkUploadB4Files,
+ type MappingCheckItem,
+ type B4BulkUploadResult,
+} from "../actions";
+
+interface B4BulkUploadDialogProps {
+ open: boolean;
+ onOpenChange: (open: boolean) => void;
+ projectNo: string;
+ userId: string;
+ userName: string;
+ userEmail: string;
+ vendorCode: string;
+ onUploadComplete?: () => void;
+}
+
+// B4 GTT 옵션
+const B4_DRAWING_USAGE_OPTIONS = [
+ { value: "REC", label: "RECEIVE (입수용)" },
+];
+
+const B4_REGISTER_KIND_OPTIONS: Record<string, Array<{ value: string; label: string }>> = {
+ REC: [
+ { value: "RECP", label: "Pre. 도면입수" },
+ { value: "RECW", label: "Working 도면입수" },
+ ],
+};
+
+type UploadStep = "settings" | "files" | "validation" | "uploading" | "complete";
+
+export function B4BulkUploadDialog({
+ open,
+ onOpenChange,
+ projectNo,
+ userId,
+ userName,
+ userEmail,
+ vendorCode,
+ onUploadComplete,
+}: B4BulkUploadDialogProps) {
+ const [currentStep, setCurrentStep] = useState<UploadStep>("settings");
+ const [drawingUsage, setDrawingUsage] = useState<string>("REC");
+ const [registerKind, setRegisterKind] = useState<string>("");
+ const [selectedFiles, setSelectedFiles] = useState<File[]>([]);
+ const [isUploading, setIsUploading] = useState(false);
+ const [validationResults, setValidationResults] = useState<FileValidationResult[]>([]);
+ const [showValidationDialog, setShowValidationDialog] = useState(false);
+ const [isDragging, setIsDragging] = useState(false);
+ const [uploadProgress, setUploadProgress] = useState(0);
+ const [uploadResult, setUploadResult] = useState<B4BulkUploadResult | null>(null);
+
+ // 다이얼로그 닫을 때 초기화
+ React.useEffect(() => {
+ if (!open) {
+ setCurrentStep("settings");
+ setDrawingUsage("REC");
+ setRegisterKind("");
+ setSelectedFiles([]);
+ setValidationResults([]);
+ setShowValidationDialog(false);
+ setIsDragging(false);
+ setUploadProgress(0);
+ setUploadResult(null);
+ }
+ }, [open]);
+
+ // 파일 선택 핸들러
+ const handleFilesChange = (files: File[]) => {
+ if (files.length === 0) return;
+
+ // 중복 제거
+ const existingNames = new Set(selectedFiles.map((f) => f.name));
+ const newFiles = files.filter((f) => !existingNames.has(f.name));
+
+ if (newFiles.length === 0) {
+ toast.error("이미 선택된 파일입니다");
+ return;
+ }
+
+ setSelectedFiles((prev) => [...prev, ...newFiles]);
+ toast.success(`${newFiles.length}개 파일이 선택되었습니다`);
+ };
+
+ // Drag & Drop 핸들러
+ const handleDragEnter = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ setIsDragging(true);
+ };
+
+ const handleDragLeave = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ if (e.currentTarget === e.target) {
+ setIsDragging(false);
+ }
+ };
+
+ const handleDragOver = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ e.dataTransfer.dropEffect = "copy";
+ };
+
+ const handleDrop = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ setIsDragging(false);
+
+ const droppedFiles = Array.from(e.dataTransfer.files);
+ if (droppedFiles.length > 0) {
+ handleFilesChange(droppedFiles);
+ }
+ };
+
+ // 파일 제거
+ const handleRemoveFile = (index: number) => {
+ setSelectedFiles((prev) => prev.filter((_, i) => i !== index));
+ };
+
+ // 1단계 완료 (설정)
+ const handleSettingsNext = () => {
+ if (!registerKind) {
+ toast.error("등록종류를 선택하세요");
+ return;
+ }
+ setCurrentStep("files");
+ };
+
+ // 2단계 완료 (파일 선택)
+ const handleFilesNext = () => {
+ if (selectedFiles.length === 0) {
+ toast.error("파일을 선택해주세요");
+ return;
+ }
+ setCurrentStep("validation");
+ handleValidate();
+ };
+
+ // 검증 시작
+ const handleValidate = async () => {
+ try {
+ // 1단계: 파일명 파싱
+ const parseResults: FileValidationResult[] = selectedFiles.map((file) => {
+ const validation = validateB4FileName(file.name);
+ return {
+ file,
+ valid: validation.valid,
+ parsed: validation.parsed,
+ error: validation.error,
+ };
+ });
+
+ // 파싱에 실패한 파일이 있으면 바로 검증 다이얼로그 표시
+ const parsedFiles = parseResults.filter((r) => r.valid && r.parsed);
+ if (parsedFiles.length === 0) {
+ setValidationResults(parseResults);
+ setShowValidationDialog(true);
+ return;
+ }
+
+ // 2단계: 매핑 현황 조회
+ const mappingCheckItems: MappingCheckItem[] = parsedFiles.map((r) => ({
+ DrawingNo: r.parsed!.drawingNo,
+ RevNo: r.parsed!.revNo,
+ FileNm: r.file.name,
+ }));
+
+ const mappingResults = await checkB4MappingStatus(
+ projectNo,
+ mappingCheckItems
+ );
+
+ // 3단계: 검증 결과 병합
+ const finalResults: FileValidationResult[] = parseResults.map((parseResult) => {
+ if (!parseResult.valid || !parseResult.parsed) {
+ return parseResult;
+ }
+
+ // 매핑 결과 찾기
+ const mappingResult = mappingResults.find(
+ (m) =>
+ m.DrawingNo === parseResult.parsed!.drawingNo &&
+ m.RevNo === parseResult.parsed!.revNo
+ );
+
+ if (!mappingResult) {
+ return {
+ ...parseResult,
+ mappingStatus: "not_found" as const,
+ error: "DOLCE 시스템에서 도면을 찾을 수 없습니다",
+ };
+ }
+
+ // RegisterGroupId가 0이거나 MappingYN이 N이면 도면이 존재하지 않음
+ if (mappingResult.RegisterGroupId === 0 || mappingResult.MappingYN === "N") {
+ return {
+ ...parseResult,
+ mappingStatus: "not_found" as const,
+ error: "해당 도면번호가 프로젝트에 등록되어 있지 않습니다",
+ };
+ }
+
+ // DrawingMoveGbn이 "도면입수"가 아니면 업로드 불가
+ if (mappingResult.DrawingMoveGbn !== "도면입수") {
+ return {
+ ...parseResult,
+ mappingStatus: "not_found" as const,
+ error: "도면입수(GTT Deliverables)인 도면만 업로드 가능합니다",
+ };
+ }
+
+ // MappingYN이 Y이고 도면입수인 경우 업로드 가능
+ return {
+ ...parseResult,
+ mappingStatus: "available" as const,
+ drawingName: mappingResult.DrawingName || undefined,
+ registerGroupId: mappingResult.RegisterGroupId,
+ };
+ });
+
+ setValidationResults(finalResults);
+ setShowValidationDialog(true);
+ } catch (error) {
+ console.error("검증 실패:", error);
+ toast.error(
+ error instanceof Error ? error.message : "검증 중 오류가 발생했습니다"
+ );
+ }
+ };
+
+ // 업로드 확인
+ const handleConfirmUpload = async (validFiles: FileValidationResult[]) => {
+ setIsUploading(true);
+ setCurrentStep("uploading");
+ setShowValidationDialog(false);
+
+ // 진행률 시뮬레이션
+ const progressInterval = setInterval(() => {
+ setUploadProgress((prev) => {
+ if (prev >= 90) {
+ clearInterval(progressInterval);
+ return prev;
+ }
+ return prev + 10;
+ });
+ }, 500);
+
+ try {
+ // FormData 생성
+ const formData = new FormData();
+ formData.append("projectNo", projectNo);
+ formData.append("userId", userId);
+ formData.append("userName", userName);
+ formData.append("userEmail", userEmail);
+ formData.append("vendorCode", vendorCode);
+ formData.append("registerKind", registerKind); // RegisterKind 추가
+
+ // 파일 및 메타데이터 추가
+ validFiles.forEach((fileResult, index) => {
+ formData.append(`file_${index}`, fileResult.file);
+ formData.append(`drawingNo_${index}`, fileResult.parsed!.drawingNo);
+ formData.append(`revNo_${index}`, fileResult.parsed!.revNo);
+ formData.append(`fileName_${index}`, fileResult.file.name);
+ formData.append(
+ `registerGroupId_${index}`,
+ String(fileResult.registerGroupId || 0)
+ );
+ });
+
+ formData.append("fileCount", String(validFiles.length));
+
+ // 서버 액션 호출
+ const result: B4BulkUploadResult = await bulkUploadB4Files(formData);
+
+ clearInterval(progressInterval);
+ setUploadProgress(100);
+ setUploadResult(result);
+
+ if (result.success) {
+ setCurrentStep("complete");
+ toast.success(
+ `${result.successCount}/${validFiles.length}개 파일 업로드 완료`
+ );
+ } else {
+ setCurrentStep("files");
+ toast.error(result.error || "업로드 실패");
+ }
+ } catch (error) {
+ console.error("업로드 실패:", error);
+ toast.error(
+ error instanceof Error ? error.message : "업로드 중 오류가 발생했습니다"
+ );
+ } finally {
+ setIsUploading(false);
+ }
+ };
+
+ const registerKindOptions = drawingUsage
+ ? B4_REGISTER_KIND_OPTIONS[drawingUsage] || []
+ : [];
+
+ const handleDrawingUsageChange = (value: string) => {
+ setDrawingUsage(value);
+ setRegisterKind("");
+ };
+
+ return (
+ <>
+ <Dialog open={open} onOpenChange={onOpenChange}>
+ <DialogContent className="max-w-2xl">
+ <DialogHeader>
+ <DialogTitle>B4 일괄 업로드</DialogTitle>
+ <DialogDescription>
+ {currentStep === "settings" && "업로드 설정을 선택하세요"}
+ {currentStep === "files" && "파일명 형식: [버림] [DrawingNo] [RevNo].[확장자] (예: testfile GTT-DE-007 R01.pdf)"}
+ {currentStep === "validation" && "파일 검증 중..."}
+ </DialogDescription>
+ </DialogHeader>
+
+ <div className="space-y-4">
+ {/* 1단계: 설정 입력 */}
+ {currentStep === "settings" && (
+ <>
+ {/* 도면용도 선택 */}
+ <div className="space-y-2">
+ <Label>도면용도 (Drawing Usage) *</Label>
+ <Select value={drawingUsage} onValueChange={handleDrawingUsageChange}>
+ <SelectTrigger>
+ <SelectValue placeholder="도면용도를 선택하세요" />
+ </SelectTrigger>
+ <SelectContent>
+ {B4_DRAWING_USAGE_OPTIONS.map((option) => (
+ <SelectItem key={option.value} value={option.value}>
+ {option.label}
+ </SelectItem>
+ ))}
+ </SelectContent>
+ </Select>
+ </div>
+
+ {/* 등록종류 선택 */}
+ <div className="space-y-2">
+ <Label>등록종류 (Register Kind) *</Label>
+ <Select
+ value={registerKind}
+ onValueChange={setRegisterKind}
+ disabled={!drawingUsage}
+ >
+ <SelectTrigger>
+ <SelectValue placeholder="등록종류를 선택하세요" />
+ </SelectTrigger>
+ <SelectContent>
+ {registerKindOptions.map((option) => (
+ <SelectItem key={option.value} value={option.value}>
+ {option.label}
+ </SelectItem>
+ ))}
+ </SelectContent>
+ </Select>
+ <p className="text-sm text-muted-foreground">
+ 선택한 등록종류가 모든 파일에 적용됩니다
+ </p>
+ </div>
+ </>
+ )}
+
+ {/* 2단계: 파일 선택 */}
+ {currentStep === "files" && (
+ <>
+ {/* 파일 선택 영역 */}
+ <div
+ className={`border-2 border-dashed rounded-lg p-8 transition-all duration-200 ${
+ isDragging
+ ? "border-primary bg-primary/5 scale-[1.02]"
+ : "border-muted-foreground/30 hover:border-muted-foreground/50"
+ }`}
+ onDragEnter={handleDragEnter}
+ onDragLeave={handleDragLeave}
+ onDragOver={handleDragOver}
+ onDrop={handleDrop}
+ >
+ <input
+ type="file"
+ multiple
+ accept=".pdf,.doc,.docx,.xls,.xlsx,.dwg,.dxf,.zip"
+ onChange={(e) => handleFilesChange(Array.from(e.target.files || []))}
+ className="hidden"
+ id="b4-file-upload"
+ />
+ <label
+ htmlFor="b4-file-upload"
+ className="flex flex-col items-center justify-center cursor-pointer"
+ >
+ <FolderOpen
+ className={`h-12 w-12 mb-3 transition-colors ${
+ isDragging ? "text-primary" : "text-muted-foreground"
+ }`}
+ />
+ <p
+ className={`text-sm transition-colors ${
+ isDragging
+ ? "text-primary font-medium"
+ : "text-muted-foreground"
+ }`}
+ >
+ {isDragging
+ ? "파일을 여기에 놓으세요"
+ : "클릭하거나 파일을 드래그하여 선택"}
+ </p>
+ <p className="text-xs text-muted-foreground mt-1">
+ PDF, DOC, DOCX, XLS, XLSX, DWG, DXF, ZIP
+ </p>
+ </label>
+ </div>
+
+ {/* 선택된 파일 목록 */}
+ {selectedFiles.length > 0 && (
+ <div className="border rounded-lg p-4">
+ <div className="flex items-center justify-between mb-3">
+ <h4 className="text-sm font-medium">
+ 선택된 파일 ({selectedFiles.length}개)
+ </h4>
+ <Button
+ variant="ghost"
+ size="sm"
+ onClick={() => setSelectedFiles([])}
+ >
+ 전체 제거
+ </Button>
+ </div>
+ <div className="max-h-48 overflow-auto space-y-2">
+ {selectedFiles.map((file, index) => (
+ <div
+ key={index}
+ className="flex items-center justify-between p-2 rounded bg-muted/50"
+ >
+ <div className="flex-1 min-w-0">
+ <p className="text-sm truncate">{file.name}</p>
+ <p className="text-xs text-muted-foreground">
+ {(file.size / 1024 / 1024).toFixed(2)} MB
+ </p>
+ </div>
+ <Button
+ variant="ghost"
+ size="sm"
+ onClick={() => handleRemoveFile(index)}
+ >
+ 제거
+ </Button>
+ </div>
+ ))}
+ </div>
+ </div>
+ )}
+ </>
+ )}
+
+ {/* 3단계: 검증 중 표시 */}
+ {currentStep === "validation" && (
+ <div className="flex flex-col items-center justify-center py-12">
+ <Loader2 className="h-12 w-12 animate-spin text-primary mb-4" />
+ <p className="text-sm text-muted-foreground">
+ 파일 검증 중입니다...
+ </p>
+ </div>
+ )}
+
+ {/* 4단계: 업로드 진행 중 */}
+ {currentStep === "uploading" && (
+ <div className="space-y-6 py-8">
+ <div className="flex flex-col items-center">
+ <Loader2 className="h-12 w-12 animate-spin text-primary mb-4" />
+ <h3 className="text-lg font-semibold mb-2">파일 업로드 중...</h3>
+ <p className="text-sm text-muted-foreground">
+ 잠시만 기다려주세요
+ </p>
+ </div>
+ <div className="space-y-2">
+ <div className="flex justify-between text-sm">
+ <span>진행률</span>
+ <span>{uploadProgress}%</span>
+ </div>
+ <Progress value={uploadProgress} className="h-2" />
+ </div>
+ </div>
+ )}
+
+ {/* 5단계: 업로드 완료 */}
+ {currentStep === "complete" && uploadResult && (
+ <div className="space-y-6 py-8">
+ <div className="flex flex-col items-center">
+ <CheckCircle2 className="h-16 w-16 text-green-500 mb-4" />
+ <h3 className="text-lg font-semibold mb-2">업로드 완료!</h3>
+ <p className="text-sm text-muted-foreground">
+ {uploadResult.successCount}개 파일이 성공적으로 업로드되었습니다
+ </p>
+ </div>
+
+ {uploadResult.failCount && uploadResult.failCount > 0 && (
+ <div className="bg-yellow-50 dark:bg-yellow-950/30 border border-yellow-200 dark:border-yellow-800 rounded-lg p-4">
+ <p className="text-sm text-yellow-800 dark:text-yellow-200">
+ {uploadResult.failCount}개 파일 업로드 실패
+ </p>
+ </div>
+ )}
+
+ <div className="flex justify-center">
+ <Button
+ onClick={() => {
+ onOpenChange(false);
+ onUploadComplete?.();
+ }}
+ >
+ 확인
+ </Button>
+ </div>
+ </div>
+ )}
+ </div>
+
+ {/* 푸터 버튼 (uploading, complete 단계에서는 숨김) */}
+ {currentStep !== "uploading" && currentStep !== "complete" && currentStep !== "validation" && (
+ <DialogFooter>
+ {currentStep === "settings" && (
+ <>
+ <Button
+ variant="outline"
+ onClick={() => onOpenChange(false)}
+ >
+ 취소
+ </Button>
+ <Button
+ onClick={handleSettingsNext}
+ disabled={!registerKind}
+ >
+ 다음
+ <ChevronRight className="ml-2 h-4 w-4" />
+ </Button>
+ </>
+ )}
+
+ {currentStep === "files" && (
+ <>
+ <Button
+ variant="outline"
+ onClick={() => setCurrentStep("settings")}
+ >
+ <ChevronLeft className="mr-2 h-4 w-4" />
+ 이전
+ </Button>
+ <Button
+ onClick={handleFilesNext}
+ disabled={selectedFiles.length === 0}
+ >
+ 검증 시작
+ <ChevronRight className="ml-2 h-4 w-4" />
+ </Button>
+ </>
+ )}
+ </DialogFooter>
+ )}
+ </DialogContent>
+ </Dialog>
+
+ {/* 검증 다이얼로그 */}
+ <B4UploadValidationDialog
+ open={showValidationDialog}
+ onOpenChange={setShowValidationDialog}
+ validationResults={validationResults}
+ onConfirmUpload={handleConfirmUpload}
+ isUploading={isUploading}
+ />
+ </>
+ );
+}
+
diff --git a/lib/dolce/dialogs/b4-upload-validation-dialog.tsx b/lib/dolce/dialogs/b4-upload-validation-dialog.tsx
new file mode 100644
index 00000000..b274d604
--- /dev/null
+++ b/lib/dolce/dialogs/b4-upload-validation-dialog.tsx
@@ -0,0 +1,353 @@
+"use client";
+
+import { Button } from "@/components/ui/button";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog";
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { Badge } from "@/components/ui/badge";
+import { CheckCircle2, XCircle, AlertCircle, Upload } from "lucide-react";
+
+export interface ParsedFileInfo {
+ drawingNo: string;
+ revNo: string;
+ fileName: string;
+}
+
+export interface FileValidationResult {
+ file: File;
+ valid: boolean;
+ parsed?: ParsedFileInfo;
+ error?: string;
+ mappingStatus?: "available" | "not_found";
+ drawingName?: string;
+ registerGroupId?: number;
+}
+
+interface B4UploadValidationDialogProps {
+ open: boolean;
+ onOpenChange: (open: boolean) => void;
+ validationResults: FileValidationResult[];
+ onConfirmUpload: (validFiles: FileValidationResult[]) => void;
+ isUploading: boolean;
+}
+
+/**
+ * B4 파일명 검증 함수
+ * 형식: [버림] [DrawingNo] [RevNo].[확장자]
+ * 예시: "testfile GTT-DE-007 R01.pdf" → DrawingNo: "GTT-DE-007", RevNo: "R01"
+ */
+export function validateB4FileName(fileName: string): {
+ valid: boolean;
+ parsed?: ParsedFileInfo;
+ error?: string;
+} {
+ try {
+ // 확장자 분리
+ const lastDotIndex = fileName.lastIndexOf(".");
+ if (lastDotIndex === -1) {
+ return {
+ valid: false,
+ error: "파일 확장자가 없습니다",
+ };
+ }
+
+ const extension = fileName.substring(lastDotIndex + 1);
+ const nameWithoutExt = fileName.substring(0, lastDotIndex);
+
+ // 공백으로 분리
+ const parts = nameWithoutExt.split(" ").filter(p => p.trim() !== "");
+
+ // 최소 3개 파트 필요: [버림], DrawingNo, RevNo
+ if (parts.length < 3) {
+ return {
+ valid: false,
+ error: `공백이 최소 2개 있어야 합니다 (현재: ${parts.length - 1}개). 형식: [버림] [DrawingNo] [RevNo].[확장자]`,
+ };
+ }
+
+ // 첫 번째 토큰은 버림
+ const drawingNo = parts[1];
+ const revNo = parts[2];
+
+ // 필수 항목이 비어있지 않은지 확인
+ if (!drawingNo || drawingNo.trim() === "") {
+ return {
+ valid: false,
+ error: "도면번호(DrawingNo)가 비어있습니다",
+ };
+ }
+
+ if (!revNo || revNo.trim() === "") {
+ return {
+ valid: false,
+ error: "리비전 번호(RevNo)가 비어있습니다",
+ };
+ }
+
+ return {
+ valid: true,
+ parsed: {
+ drawingNo: drawingNo.trim(),
+ revNo: revNo.trim(),
+ fileName: fileName,
+ },
+ };
+ } catch (error) {
+ return {
+ valid: false,
+ error: error instanceof Error ? error.message : "알 수 없는 오류",
+ };
+ }
+}
+
+/**
+ * B4 업로드 전 파일 검증 다이얼로그
+ */
+export function B4UploadValidationDialog({
+ open,
+ onOpenChange,
+ validationResults,
+ onConfirmUpload,
+ isUploading,
+}: B4UploadValidationDialogProps) {
+ const validFiles = validationResults.filter((r) => r.valid && r.mappingStatus === "available");
+ const notFoundFiles = validationResults.filter((r) => r.valid && r.mappingStatus === "not_found");
+ const invalidFiles = validationResults.filter((r) => !r.valid);
+
+ const handleUpload = () => {
+ if (validFiles.length > 0) {
+ onConfirmUpload(validFiles);
+ }
+ };
+
+ const handleCancel = () => {
+ if (!isUploading) {
+ onOpenChange(false);
+ }
+ };
+
+ return (
+ <Dialog open={open} onOpenChange={onOpenChange}>
+ <DialogContent className="max-w-4xl max-h-[85vh] flex flex-col">
+ <DialogHeader className="flex-shrink-0">
+ <DialogTitle>B4 일괄 업로드 검증</DialogTitle>
+ <DialogDescription>
+ 선택한 파일의 파일명 형식과 매핑 가능 여부를 검증합니다
+ </DialogDescription>
+ </DialogHeader>
+
+ <div className="space-y-4 overflow-auto flex-1 pr-2">
+ {/* 요약 통계 */}
+ <div className="grid grid-cols-4 gap-3">
+ <div className="rounded-lg border p-3">
+ <div className="text-sm text-muted-foreground">전체</div>
+ <div className="text-2xl font-bold">{validationResults.length}</div>
+ </div>
+ <div className="rounded-lg border p-3 bg-green-50 dark:bg-green-950/30">
+ <div className="text-sm text-green-600 dark:text-green-400">업로드 가능</div>
+ <div className="text-2xl font-bold text-green-600 dark:text-green-400">
+ {validFiles.length}
+ </div>
+ </div>
+ <div className="rounded-lg border p-3 bg-orange-50 dark:bg-orange-950/30">
+ <div className="text-sm text-orange-600 dark:text-orange-400">도면 없음</div>
+ <div className="text-2xl font-bold text-orange-600 dark:text-orange-400">
+ {notFoundFiles.length}
+ </div>
+ </div>
+ <div className="rounded-lg border p-3 bg-red-50 dark:bg-red-950/30">
+ <div className="text-sm text-red-600 dark:text-red-400">형식 오류</div>
+ <div className="text-2xl font-bold text-red-600 dark:text-red-400">
+ {invalidFiles.length}
+ </div>
+ </div>
+ </div>
+
+ {/* 경고 메시지 */}
+ {validFiles.length === 0 && (
+ <Alert variant="destructive">
+ <XCircle className="h-4 w-4" />
+ <AlertDescription>
+ 업로드 가능한 파일이 없습니다. 파일명 형식을 확인하거나 이미 매핑된 파일은 제외해주세요.
+ </AlertDescription>
+ </Alert>
+ )}
+
+ {(notFoundFiles.length > 0 || invalidFiles.length > 0) && validFiles.length > 0 && (
+ <Alert>
+ <AlertCircle className="h-4 w-4" />
+ <AlertDescription>
+ 일부 파일에 문제가 있습니다. 업로드 가능한 {validFiles.length}개 파일만 업로드됩니다.
+ </AlertDescription>
+ </Alert>
+ )}
+
+ {/* 파일 목록 */}
+ <div className="max-h-[50vh] overflow-auto rounded-md border p-4">
+ <div className="space-y-4">
+ {/* 업로드 가능 파일 */}
+ {validFiles.length > 0 && (
+ <div className="space-y-2">
+ <h4 className="text-sm font-semibold text-green-600 dark:text-green-400 flex items-center gap-2">
+ <CheckCircle2 className="h-4 w-4" />
+ 업로드 가능 ({validFiles.length}개)
+ </h4>
+ {validFiles.map((result, index) => (
+ <div
+ key={index}
+ className="rounded-lg border border-green-200 dark:border-green-800 bg-green-50 dark:bg-green-950/30 p-3"
+ >
+ <div className="flex items-start justify-between gap-2">
+ <div className="flex-1 min-w-0">
+ <div className="font-mono text-sm break-all">
+ {result.file.name}
+ </div>
+ {result.parsed && (
+ <div className="flex flex-wrap gap-1 mt-2">
+ <Badge variant="outline" className="text-xs">
+ 도면: {result.parsed.drawingNo}
+ </Badge>
+ <Badge variant="outline" className="text-xs">
+ Rev: {result.parsed.revNo}
+ </Badge>
+ {result.drawingName && (
+ <Badge variant="outline" className="text-xs">
+ {result.drawingName}
+ </Badge>
+ )}
+ </div>
+ )}
+ </div>
+ <CheckCircle2 className="h-5 w-5 text-green-600 dark:text-green-400 shrink-0" />
+ </div>
+ </div>
+ ))}
+ </div>
+ )}
+
+ {/* 도면을 찾을 수 없는 파일 */}
+ {notFoundFiles.length > 0 && (
+ <div className="space-y-2 mt-4">
+ <h4 className="text-sm font-semibold text-orange-600 dark:text-orange-400 flex items-center gap-2">
+ <XCircle className="h-4 w-4" />
+ 도면을 찾을 수 없음 ({notFoundFiles.length}개)
+ </h4>
+ {notFoundFiles.map((result, index) => (
+ <div
+ key={index}
+ className="rounded-lg border border-orange-200 dark:border-orange-800 bg-orange-50 dark:bg-orange-950/30 p-3"
+ >
+ <div className="flex items-start justify-between gap-2">
+ <div className="flex-1 min-w-0">
+ <div className="font-mono text-sm break-all">
+ {result.file.name}
+ </div>
+ <div className="text-xs text-orange-700 dark:text-orange-300 mt-1">
+ ✗ 해당 도면번호가 프로젝트에 등록되어 있지 않습니다
+ </div>
+ {result.parsed && (
+ <div className="flex flex-wrap gap-1 mt-2">
+ <Badge variant="outline" className="text-xs">
+ 도면: {result.parsed.drawingNo}
+ </Badge>
+ <Badge variant="outline" className="text-xs">
+ Rev: {result.parsed.revNo}
+ </Badge>
+ </div>
+ )}
+ </div>
+ <XCircle className="h-5 w-5 text-orange-600 dark:text-orange-400 shrink-0" />
+ </div>
+ </div>
+ ))}
+ </div>
+ )}
+
+ {/* 형식 오류 파일 */}
+ {invalidFiles.length > 0 && (
+ <div className="space-y-2 mt-4">
+ <h4 className="text-sm font-semibold text-red-600 dark:text-red-400 flex items-center gap-2">
+ <XCircle className="h-4 w-4" />
+ 파일명 형식 오류 ({invalidFiles.length}개)
+ </h4>
+ {invalidFiles.map((result, index) => (
+ <div
+ key={index}
+ className="rounded-lg border border-red-200 dark:border-red-800 bg-red-50 dark:bg-red-950/30 p-3"
+ >
+ <div className="flex items-start justify-between gap-2">
+ <div className="flex-1 min-w-0">
+ <div className="font-mono text-sm break-all">
+ {result.file.name}
+ </div>
+ {result.error && (
+ <div className="text-xs text-red-600 dark:text-red-400 mt-1">
+ ✗ {result.error}
+ </div>
+ )}
+ </div>
+ <XCircle className="h-5 w-5 text-red-600 dark:text-red-400 shrink-0" />
+ </div>
+ </div>
+ ))}
+ </div>
+ )}
+ </div>
+ </div>
+
+ {/* 형식 안내 */}
+ <div className="rounded-lg bg-blue-50 dark:bg-blue-950/30 border border-blue-200 dark:border-blue-800 p-3">
+ <div className="text-sm font-medium text-blue-900 dark:text-blue-100 mb-1">
+ 📋 올바른 파일명 형식
+ </div>
+ <code className="text-xs text-blue-700 dark:text-blue-300">
+ [버림] [DrawingNo] [RevNo].[확장자]
+ </code>
+ <div className="text-xs text-blue-600 dark:text-blue-400 mt-1">
+ 예: testfile GTT-DE-007 R01.pdf
+ </div>
+ <div className="text-xs text-blue-600 dark:text-blue-400 mt-1">
+ ※ 첫 번째 단어는 무시되며, 공백으로 구분됩니다
+ </div>
+ <div className="text-xs text-blue-600 dark:text-blue-400 mt-1">
+ ※ 네 번째 이상의 단어가 있으면 무시됩니다
+ </div>
+ </div>
+ </div>
+
+ <DialogFooter className="flex-shrink-0">
+ <Button
+ variant="outline"
+ onClick={handleCancel}
+ disabled={isUploading}
+ >
+ 취소
+ </Button>
+ <Button
+ onClick={handleUpload}
+ disabled={validFiles.length === 0 || isUploading}
+ >
+ {isUploading ? (
+ <>
+ <div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2" />
+ 업로드 중...
+ </>
+ ) : (
+ <>
+ <Upload className="h-4 w-4 mr-2" />
+ 업로드 ({validFiles.length}개)
+ </>
+ )}
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ );
+}
+
diff --git a/lib/dolce/dialogs/detail-drawing-dialog.tsx b/lib/dolce/dialogs/detail-drawing-dialog.tsx
new file mode 100644
index 00000000..a06c9688
--- /dev/null
+++ b/lib/dolce/dialogs/detail-drawing-dialog.tsx
@@ -0,0 +1,311 @@
+"use client";
+
+import { useState, useEffect, useCallback } from "react";
+import {
+ Dialog,
+ DialogContent,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Skeleton } from "@/components/ui/skeleton";
+import { Plus, RefreshCw, Upload, Loader2 } from "lucide-react";
+import { toast } from "sonner";
+import {
+ UnifiedDwgReceiptItem,
+ DetailDwgReceiptItem,
+ FileInfoItem,
+ fetchDetailDwgReceiptList,
+ fetchFileInfoList,
+} from "../actions";
+import { DrawingListTable } from "../table/drawing-list-table";
+import { detailDrawingColumns } from "../table/detail-drawing-columns";
+import { createFileListColumns } from "../table/file-list-columns";
+import { AddDetailDrawingDialog } from "./add-detail-drawing-dialog";
+import { UploadFilesToDetailDialog } from "./upload-files-to-detail-dialog";
+
+interface DetailDrawingDialogProps {
+ drawing: UnifiedDwgReceiptItem | null;
+ open: boolean;
+ onOpenChange: (open: boolean) => void;
+ vendorCode: string;
+ userId: string;
+ userName: string;
+ userEmail: string;
+ drawingKind: "B3" | "B4";
+}
+
+export function DetailDrawingDialog({
+ drawing,
+ open,
+ onOpenChange,
+ vendorCode,
+ userId,
+ userName,
+ userEmail,
+ drawingKind,
+}: DetailDrawingDialogProps) {
+ const [detailDrawings, setDetailDrawings] = useState<DetailDwgReceiptItem[]>([]);
+ const [selectedDetail, setSelectedDetail] = useState<DetailDwgReceiptItem | null>(null);
+ const [files, setFiles] = useState<FileInfoItem[]>([]);
+ const [isLoading, setIsLoading] = useState(false);
+ const [isLoadingFiles, setIsLoadingFiles] = useState(false);
+ const [addDialogOpen, setAddDialogOpen] = useState(false);
+ const [uploadFilesDialogOpen, setUploadFilesDialogOpen] = useState(false);
+
+ // 상세도면 목록 로드
+ const loadDetailDrawings = useCallback(async () => {
+ if (!drawing) return;
+
+ try {
+ setIsLoading(true);
+ const data = await fetchDetailDwgReceiptList({
+ project: drawing.ProjectNo,
+ drawingNo: drawing.DrawingNo,
+ discipline: drawing.Discipline,
+ drawingKind: drawing.DrawingKind,
+ userId: "", // 조회 시 모든 사용자의 상세도면을 보기 위해 빈 문자열 전달
+ });
+ setDetailDrawings(data);
+
+ // 첫 번째 상세도면 자동 선택
+ if (data.length > 0 && !selectedDetail) {
+ setSelectedDetail(data[0]);
+ }
+ } catch (error) {
+ console.error("상세도면 로드 실패:", error);
+ toast.error("상세도면 로드에 실패했습니다");
+ } finally {
+ setIsLoading(false);
+ }
+ }, [drawing, selectedDetail]);
+
+ // 파일 목록 로드
+ const loadFiles = useCallback(async () => {
+ if (!selectedDetail) {
+ setFiles([]);
+ return;
+ }
+
+ try {
+ setIsLoadingFiles(true);
+ const data = await fetchFileInfoList(selectedDetail.UploadId);
+ setFiles(data);
+ } catch (error) {
+ console.error("파일 목록 로드 실패:", error);
+ toast.error("파일 목록 로드에 실패했습니다");
+ } finally {
+ setIsLoadingFiles(false);
+ }
+ }, [selectedDetail]);
+
+ // 다이얼로그 열릴 때 데이터 로드
+ useEffect(() => {
+ if (open && drawing) {
+ loadDetailDrawings();
+ } else {
+ setDetailDrawings([]);
+ setSelectedDetail(null);
+ setFiles([]);
+ }
+ }, [open, drawing, loadDetailDrawings]);
+
+ // 선택된 상세도면 변경 시 파일 목록 로드
+ useEffect(() => {
+ if (selectedDetail) {
+ loadFiles();
+ }
+ }, [selectedDetail, loadFiles]);
+
+ const handleDownload = async (file: FileInfoItem) => {
+ try {
+ toast.info("파일 다운로드를 준비 중입니다...");
+
+ // 파일 생성자의 userId를 사용하여 다운로드
+ const response = await fetch("/api/dolce/download", {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json",
+ },
+ body: JSON.stringify({
+ fileId: file.FileId,
+ userId: file.CreateUserId, // 파일 생성자의 ID 사용
+ fileName: file.FileName,
+ }),
+ });
+
+ if (!response.ok) {
+ throw new Error("파일 다운로드 실패");
+ }
+
+ const blob = await response.blob();
+ const url = window.URL.createObjectURL(blob);
+ const a = document.createElement("a");
+ a.href = url;
+ a.download = file.FileName;
+ document.body.appendChild(a);
+ a.click();
+ window.URL.revokeObjectURL(url);
+ document.body.removeChild(a);
+
+ toast.success("파일 다운로드가 완료되었습니다");
+ } catch (error) {
+ console.error("파일 다운로드 실패:", error);
+ toast.error("파일 다운로드에 실패했습니다");
+ }
+ };
+
+ const handleRefresh = () => {
+ loadDetailDrawings();
+ };
+
+ const handleAddComplete = () => {
+ setAddDialogOpen(false);
+ loadDetailDrawings();
+ };
+
+ const handleUploadComplete = () => {
+ setUploadFilesDialogOpen(false);
+ loadFiles();
+ };
+
+ const fileColumns = createFileListColumns({ onDownload: handleDownload });
+
+ // RegisterId + UploadId 조합으로 고유 ID 생성
+ const getDetailDrawingId = (detail: DetailDwgReceiptItem) => {
+ return `${detail.RegisterId}_${detail.UploadId}`;
+ };
+
+ // B4인 경우 "도면입수"인 건만 상세도면 추가 및 파일 첨부 가능
+ // B3인 경우 모든 건에 대해 가능
+ const canAddDetailDrawing = drawingKind === "B3" ||
+ (drawingKind === "B4" && drawing && 'DrawingMoveGbn' in drawing && drawing.DrawingMoveGbn === "도면입수");
+
+ return (
+ <>
+ <Dialog open={open} onOpenChange={onOpenChange}>
+ <DialogContent className="max-w-[95vw] h-[90vh] flex flex-col">
+ <DialogHeader>
+ <DialogTitle className="flex flex-col gap-1">
+ <span>상세도면 정보</span>
+ {drawing && (
+ <span className="text-sm font-normal text-muted-foreground">
+ {drawing.DrawingNo} | 프로젝트: {drawing.ProjectNo} | Discipline: {drawing.Discipline} | 종류: {drawing.DrawingKind}
+ </span>
+ )}
+ </DialogTitle>
+ </DialogHeader>
+
+ <div className="flex-1 overflow-hidden flex flex-col gap-4">
+ {/* 상단: 상세도면 리스트 */}
+ <Card className="flex-1 overflow-hidden flex flex-col">
+ <CardHeader className="flex-row items-center justify-between py-3">
+ <CardTitle className="text-base">상세도면 목록</CardTitle>
+ <div className="flex gap-2">
+ <Button
+ variant="outline"
+ size="sm"
+ onClick={handleRefresh}
+ disabled={isLoading}
+ >
+ <RefreshCw className={`h-4 w-4 mr-2 ${isLoading ? "animate-spin" : ""}`} />
+ 새로고침
+ </Button>
+ {canAddDetailDrawing && (
+ <Button
+ variant="default"
+ size="sm"
+ onClick={() => setAddDialogOpen(true)}
+ >
+ <Plus className="h-4 w-4 mr-2" />
+ 상세도면 추가
+ </Button>
+ )}
+ </div>
+ </CardHeader>
+ <CardContent className="flex-1 overflow-y-auto p-4">
+ <DrawingListTable<DetailDwgReceiptItem, unknown>
+ columns={detailDrawingColumns}
+ data={detailDrawings}
+ onRowClick={setSelectedDetail}
+ selectedRow={selectedDetail || undefined}
+ getRowId={(row) => getDetailDrawingId(row)}
+ />
+ </CardContent>
+ </Card>
+
+ {/* 하단: 첨부파일 리스트 */}
+ <Card className="flex-1 overflow-hidden flex flex-col">
+ <CardHeader className="flex-row items-center justify-between py-3">
+ <CardTitle className="text-base">
+ 첨부파일 목록
+ {selectedDetail && ` - Rev. ${selectedDetail.DrawingRevNo}`}
+ </CardTitle>
+ {selectedDetail && canAddDetailDrawing && (
+ <Button
+ variant="default"
+ size="sm"
+ onClick={() => setUploadFilesDialogOpen(true)}
+ >
+ <Upload className="h-4 w-4 mr-2" />
+ 파일 업로드
+ </Button>
+ )}
+ </CardHeader>
+ <CardContent className="flex-1 overflow-y-auto p-4">
+ {!selectedDetail ? (
+ <div className="h-full flex items-center justify-center text-muted-foreground">
+ 상세도면을 선택하세요
+ </div>
+ ) : isLoadingFiles ? (
+ <div className="space-y-4">
+ <div className="flex items-center justify-center gap-2 text-muted-foreground py-8">
+ <Loader2 className="h-5 w-5 animate-spin" />
+ <span>Loading files...</span>
+ </div>
+ <div className="space-y-2">
+ <Skeleton className="h-10 w-full" />
+ <Skeleton className="h-10 w-full" />
+ <Skeleton className="h-10 w-full" />
+ </div>
+ </div>
+ ) : (
+ <DrawingListTable
+ columns={fileColumns}
+ data={files}
+ />
+ )}
+ </CardContent>
+ </Card>
+ </div>
+ </DialogContent>
+ </Dialog>
+
+ <AddDetailDrawingDialog
+ open={addDialogOpen}
+ onOpenChange={setAddDialogOpen}
+ drawing={drawing}
+ vendorCode={vendorCode}
+ userId={userId}
+ userName={userName}
+ userEmail={userEmail}
+ onComplete={handleAddComplete}
+ drawingKind={drawingKind}
+ />
+
+ {selectedDetail && (
+ <UploadFilesToDetailDialog
+ open={uploadFilesDialogOpen}
+ onOpenChange={setUploadFilesDialogOpen}
+ uploadId={selectedDetail.UploadId}
+ drawingNo={selectedDetail.DrawingNo}
+ revNo={selectedDetail.DrawingRevNo}
+ userId={userId}
+ onUploadComplete={handleUploadComplete}
+ />
+ )}
+ </>
+ );
+}
+
diff --git a/lib/dolce/dialogs/upload-files-to-detail-dialog.tsx b/lib/dolce/dialogs/upload-files-to-detail-dialog.tsx
new file mode 100644
index 00000000..1d8ac582
--- /dev/null
+++ b/lib/dolce/dialogs/upload-files-to-detail-dialog.tsx
@@ -0,0 +1,314 @@
+"use client";
+
+import * as React from "react";
+import { useState } from "react";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle,
+} from "@/components/ui/dialog";
+import { Button } from "@/components/ui/button";
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { Upload, FolderOpen, Loader2, X, FileText, AlertCircle } from "lucide-react";
+import { toast } from "sonner";
+import { uploadFilesToDetailDrawing, type UploadFilesResult } from "../actions";
+
+interface UploadFilesToDetailDialogProps {
+ open: boolean;
+ onOpenChange: (open: boolean) => void;
+ uploadId: string;
+ drawingNo: string;
+ revNo: string;
+ userId: string;
+ onUploadComplete?: () => void;
+}
+
+export function UploadFilesToDetailDialog({
+ open,
+ onOpenChange,
+ uploadId,
+ drawingNo,
+ revNo,
+ userId,
+ onUploadComplete,
+}: UploadFilesToDetailDialogProps) {
+ const [selectedFiles, setSelectedFiles] = useState<File[]>([]);
+ const [isUploading, setIsUploading] = useState(false);
+ const [isDragging, setIsDragging] = useState(false);
+
+ // 다이얼로그 닫을 때 초기화
+ React.useEffect(() => {
+ if (!open) {
+ setSelectedFiles([]);
+ setIsDragging(false);
+ }
+ }, [open]);
+
+ // 파일 선택 핸들러
+ const handleFilesChange = (files: File[]) => {
+ if (files.length === 0) return;
+
+ // 파일 크기 및 확장자 검증
+ const MAX_FILE_SIZE = 1024 * 1024 * 1024; // 1GB
+ const FORBIDDEN_EXTENSIONS = ['exe', 'com', 'dll', 'vbs', 'js', 'asp', 'aspx', 'bat', 'cmd'];
+
+ const validFiles: File[] = [];
+ const invalidFiles: string[] = [];
+
+ files.forEach((file) => {
+ // 크기 검증
+ if (file.size > MAX_FILE_SIZE) {
+ invalidFiles.push(`${file.name}: 파일 크기가 1GB를 초과합니다`);
+ return;
+ }
+
+ // 확장자 검증
+ const extension = file.name.split('.').pop()?.toLowerCase();
+ if (extension && FORBIDDEN_EXTENSIONS.includes(extension)) {
+ invalidFiles.push(`${file.name}: 금지된 파일 형식입니다 (.${extension})`);
+ return;
+ }
+
+ validFiles.push(file);
+ });
+
+ if (invalidFiles.length > 0) {
+ invalidFiles.forEach((msg) => toast.error(msg));
+ }
+
+ if (validFiles.length > 0) {
+ // 중복 제거
+ const existingNames = new Set(selectedFiles.map((f) => f.name));
+ const newFiles = validFiles.filter((f) => !existingNames.has(f.name));
+
+ if (newFiles.length === 0) {
+ toast.error("이미 선택된 파일입니다");
+ return;
+ }
+
+ setSelectedFiles((prev) => [...prev, ...newFiles]);
+ toast.success(`${newFiles.length}개 파일이 선택되었습니다`);
+ }
+ };
+
+ // Drag & Drop 핸들러
+ const handleDragEnter = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ setIsDragging(true);
+ };
+
+ const handleDragLeave = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ if (e.currentTarget === e.target) {
+ setIsDragging(false);
+ }
+ };
+
+ const handleDragOver = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ e.dataTransfer.dropEffect = "copy";
+ };
+
+ const handleDrop = (e: React.DragEvent) => {
+ e.preventDefault();
+ e.stopPropagation();
+ setIsDragging(false);
+
+ const droppedFiles = Array.from(e.dataTransfer.files);
+ if (droppedFiles.length > 0) {
+ handleFilesChange(droppedFiles);
+ }
+ };
+
+ // 파일 제거
+ const handleRemoveFile = (index: number) => {
+ setSelectedFiles((prev) => prev.filter((_, i) => i !== index));
+ };
+
+ // 업로드 처리
+ const handleUpload = async () => {
+ if (selectedFiles.length === 0) {
+ toast.error("파일을 선택해주세요");
+ return;
+ }
+
+ setIsUploading(true);
+
+ try {
+ // FormData 생성
+ const formData = new FormData();
+ formData.append("uploadId", uploadId);
+ formData.append("userId", userId);
+ formData.append("fileCount", String(selectedFiles.length));
+
+ selectedFiles.forEach((file, index) => {
+ formData.append(`file_${index}`, file);
+ });
+
+ // 서버 액션 호출
+ const result: UploadFilesResult = await uploadFilesToDetailDrawing(formData);
+
+ if (result.success) {
+ toast.success(`${result.uploadedCount}개 파일 업로드 완료`);
+ onOpenChange(false);
+ onUploadComplete?.();
+ } else {
+ toast.error(result.error || "업로드 실패");
+ }
+ } catch (error) {
+ console.error("업로드 실패:", error);
+ toast.error(
+ error instanceof Error ? error.message : "업로드 중 오류가 발생했습니다"
+ );
+ } finally {
+ setIsUploading(false);
+ }
+ };
+
+ return (
+ <Dialog open={open} onOpenChange={onOpenChange}>
+ <DialogContent className="max-w-2xl">
+ <DialogHeader>
+ <DialogTitle>파일 업로드</DialogTitle>
+ <DialogDescription>
+ {drawingNo} - Rev. {revNo}에 파일을 업로드합니다
+ </DialogDescription>
+ </DialogHeader>
+
+ <div className="space-y-4">
+ {/* 안내 메시지 */}
+ <Alert>
+ <AlertCircle className="h-4 w-4" />
+ <AlertDescription>
+ 선택한 상세도면의 UploadId에 파일을 추가합니다. 파일 업로드 후 자동으로 메타데이터가 저장됩니다.
+ </AlertDescription>
+ </Alert>
+
+ {/* 파일 선택 영역 */}
+ <div
+ className={`border-2 border-dashed rounded-lg p-8 transition-all duration-200 ${
+ isDragging
+ ? "border-primary bg-primary/5 scale-[1.02]"
+ : "border-muted-foreground/30 hover:border-muted-foreground/50"
+ }`}
+ onDragEnter={handleDragEnter}
+ onDragLeave={handleDragLeave}
+ onDragOver={handleDragOver}
+ onDrop={handleDrop}
+ >
+ <input
+ type="file"
+ multiple
+ accept=".pdf,.doc,.docx,.xls,.xlsx,.dwg,.dxf,.zip"
+ onChange={(e) => handleFilesChange(Array.from(e.target.files || []))}
+ className="hidden"
+ id="detail-file-upload"
+ />
+ <label
+ htmlFor="detail-file-upload"
+ className="flex flex-col items-center justify-center cursor-pointer"
+ >
+ <FolderOpen
+ className={`h-12 w-12 mb-3 transition-colors ${
+ isDragging ? "text-primary" : "text-muted-foreground"
+ }`}
+ />
+ <p
+ className={`text-sm transition-colors ${
+ isDragging
+ ? "text-primary font-medium"
+ : "text-muted-foreground"
+ }`}
+ >
+ {isDragging
+ ? "파일을 여기에 놓으세요"
+ : "클릭하거나 파일을 드래그하여 선택"}
+ </p>
+ <p className="text-xs text-muted-foreground mt-1">
+ PDF, DOC, DOCX, XLS, XLSX, DWG, DXF, ZIP (max 1GB per file)
+ </p>
+ </label>
+ </div>
+
+ {/* 선택된 파일 목록 */}
+ {selectedFiles.length > 0 && (
+ <div className="border rounded-lg p-4">
+ <div className="flex items-center justify-between mb-3">
+ <h4 className="text-sm font-medium">
+ 선택된 파일 ({selectedFiles.length}개)
+ </h4>
+ <Button
+ variant="ghost"
+ size="sm"
+ onClick={() => setSelectedFiles([])}
+ disabled={isUploading}
+ >
+ 전체 제거
+ </Button>
+ </div>
+ <div className="max-h-48 overflow-auto space-y-2">
+ {selectedFiles.map((file, index) => (
+ <div
+ key={index}
+ className="flex items-center justify-between p-2 rounded bg-muted/50"
+ >
+ <div className="flex items-center gap-2 flex-1 min-w-0">
+ <FileText className="h-4 w-4 text-muted-foreground shrink-0" />
+ <div className="flex-1 min-w-0">
+ <p className="text-sm truncate">{file.name}</p>
+ <p className="text-xs text-muted-foreground">
+ {(file.size / 1024 / 1024).toFixed(2)} MB
+ </p>
+ </div>
+ </div>
+ <Button
+ variant="ghost"
+ size="sm"
+ onClick={() => handleRemoveFile(index)}
+ disabled={isUploading}
+ >
+ <X className="h-4 w-4" />
+ </Button>
+ </div>
+ ))}
+ </div>
+ </div>
+ )}
+ </div>
+
+ <DialogFooter>
+ <Button
+ variant="outline"
+ onClick={() => onOpenChange(false)}
+ disabled={isUploading}
+ >
+ 취소
+ </Button>
+ <Button
+ onClick={handleUpload}
+ disabled={selectedFiles.length === 0 || isUploading}
+ >
+ {isUploading ? (
+ <>
+ <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+ 업로드 중...
+ </>
+ ) : (
+ <>
+ <Upload className="mr-2 h-4 w-4" />
+ 업로드 ({selectedFiles.length}개)
+ </>
+ )}
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ );
+}
+
generated by cgit v1.2.3 (git 2.39.1) at 2025-12-07 07:53:14 +0000