diff options
Diffstat (limited to 'lib/bidding/detail/table/bidding-document-upload-dialog.tsx')
| -rw-r--r-- | lib/bidding/detail/table/bidding-document-upload-dialog.tsx | 462 |
1 files changed, 462 insertions, 0 deletions
diff --git a/lib/bidding/detail/table/bidding-document-upload-dialog.tsx b/lib/bidding/detail/table/bidding-document-upload-dialog.tsx new file mode 100644 index 00000000..f1633ea3 --- /dev/null +++ b/lib/bidding/detail/table/bidding-document-upload-dialog.tsx @@ -0,0 +1,462 @@ +'use client' + +import * as React from 'react' +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, +} from '@/components/ui/dialog' +import { Button } from '@/components/ui/button' +import { Input } from '@/components/ui/input' +import { Label } from '@/components/ui/label' +import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select' +import { Textarea } from '@/components/ui/textarea' +import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card' +import { Badge } from '@/components/ui/badge' +import { + Table, + TableBody, + TableCell, + TableHead, + TableHeader, + TableRow, +} from '@/components/ui/table' +import { + Upload, + FileText, + Download, + Trash2 +} from 'lucide-react' +import { useToast } from '@/hooks/use-toast' +import { useTransition } from 'react' +import { downloadFile } from '@/lib/file-download' +import { + uploadBiddingDocument, + getBiddingDocuments, + deleteBiddingDocument +} from '../service' + +interface UploadedDocument { + id: number + biddingId: number + companyId: number | null + documentType: string + fileName: string + originalFileName: string + fileSize: number | null + filePath: string + title: string | null + description: string | null + uploadedAt: string + uploadedBy: string +} + +interface BiddingDocumentUploadDialogProps { + open: boolean + onOpenChange: (open: boolean) => void + biddingId: number + userId: string + onSuccess?: () => void +} + +const documentTypes = [ + { value: 'notice', label: '입찰공고서' }, + { value: 'specification', label: '사양서' }, + { value: 'specification_meeting', label: '사양설명회' }, + { value: 'contract_draft', label: '계약서 초안' }, + { value: 'financial_doc', label: '재무 관련 문서' }, + { value: 'technical_doc', label: '기술 관련 문서' }, + { value: 'certificate', label: '인증서류' }, + { value: 'pr_document', label: 'PR 문서' }, + { value: 'spec_document', label: 'SPEC 문서' }, + { value: 'evaluation_doc', label: '평가 관련 문서' }, + { value: 'bid_attachment', label: '입찰 첨부파일' }, + { value: 'other', label: '기타' } +] + +export function BiddingDocumentUploadDialog({ + open, + onOpenChange, + biddingId, + userId, + onSuccess +}: BiddingDocumentUploadDialogProps) { + const { toast } = useToast() + const [isPending, startTransition] = useTransition() + const [documents, setDocuments] = React.useState<UploadedDocument[]>([]) + const [isLoading, setIsLoading] = React.useState(false) + + // 업로드 폼 상태 + const [selectedFile, setSelectedFile] = React.useState<File | null>(null) + const [documentType, setDocumentType] = React.useState<string>('') + const [title, setTitle] = React.useState('') + const [description, setDescription] = React.useState('') + + // 다이얼로그가 열릴 때 문서 목록 로드 + React.useEffect(() => { + if (open) { + loadDocuments() + resetForm() + } + }, [open, biddingId]) + + const resetForm = () => { + setSelectedFile(null) + setDocumentType('') + setTitle('') + setDescription('') + } + + const loadDocuments = async () => { + setIsLoading(true) + try { + // 서버 액션 직접 호출 + const docs = await getBiddingDocuments(biddingId) + const mappedDocs = docs.map((doc: any) => ({ + ...doc, + uploadedAt: doc.uploadedAt?.toString() || '', + uploadedBy: doc.uploadedBy || '' + })) + setDocuments(mappedDocs) + } catch (error) { + console.error('Failed to load documents:', error) + toast({ + title: '오류', + description: '문서 목록을 불러오는데 실패했습니다.', + variant: 'destructive', + }) + } finally { + setIsLoading(false) + } + } + + const handleFileSelect = (event: React.ChangeEvent<HTMLInputElement>) => { + const files = event.target.files + if (!files || files.length === 0) return + + const file = files[0] + + // 파일 크기 체크 (50MB 제한) + if (file.size > 50 * 1024 * 1024) { + toast({ + title: '파일 크기 초과', + description: '파일 크기가 50MB를 초과합니다.', + variant: 'destructive', + }) + return + } + + // 파일 타입 체크 + const allowedTypes = [ + 'application/pdf', + 'application/msword', + 'application/vnd.openxmlformats-officedocument.wordprocessingml.document', + 'application/vnd.ms-excel', + 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet', + 'image/jpeg', + 'image/png', + 'application/zip' + ] + + if (!allowedTypes.includes(file.type)) { + toast({ + title: '지원하지 않는 파일 형식', + description: 'PDF, Word, Excel, 이미지, ZIP 파일만 업로드 가능합니다.', + variant: 'destructive', + }) + return + } + + setSelectedFile(file) + } + + const handleUpload = async () => { + if (!selectedFile || !documentType) { + toast({ + title: '입력 오류', + description: '파일과 문서 타입을 선택해주세요.', + variant: 'destructive', + }) + return + } + + startTransition(async () => { + try { + // 서버 액션 직접 호출 + const result = await uploadBiddingDocument( + biddingId, + selectedFile, + documentType, + title, + description, + userId + ) + + if (result.success) { + toast({ + title: '업로드 완료', + description: result.message || '문서가 성공적으로 업로드되었습니다.', + }) + resetForm() + await loadDocuments() + onSuccess?.() + } else { + toast({ + title: '업로드 실패', + description: result.error || '문서 업로드에 실패했습니다.', + variant: 'destructive', + }) + } + } catch (error) { + console.error('Upload error:', error) + toast({ + title: '업로드 실패', + description: '문서 업로드 중 오류가 발생했습니다.', + variant: 'destructive', + }) + } + }) + } + + // 파일 다운로드 + const handleDownload = (document: UploadedDocument) => { + startTransition(async () => { + try { + await downloadFile(document.filePath, document.originalFileName, { + showToast: true + }) + } catch (error) { + toast({ + title: '다운로드 실패', + description: '파일 다운로드에 실패했습니다.', + variant: 'destructive', + }) + } + }) + } + + // 파일 삭제 + const handleDelete = (document: UploadedDocument) => { + if (!confirm(`"${document.originalFileName}" 파일을 삭제하시겠습니까?`)) { + return + } + + startTransition(async () => { + try { + // 서버 액션 직접 호출 + const result = await deleteBiddingDocument(document.id, biddingId, userId) + + if (result.success) { + toast({ + title: '삭제 완료', + description: result.message || '문서가 성공적으로 삭제되었습니다.', + }) + await loadDocuments() + onSuccess?.() + } else { + toast({ + title: '삭제 실패', + description: result.error || '문서 삭제에 실패했습니다.', + variant: 'destructive', + }) + } + } catch (error) { + console.error('Delete error:', error) + toast({ + title: '삭제 실패', + description: '문서 삭제 중 오류가 발생했습니다.', + variant: 'destructive', + }) + } + }) + } + + // 파일 크기 포맷팅 + const formatFileSize = (bytes: number | null) => { + if (!bytes) return '-' + if (bytes === 0) return '0 Bytes' + const k = 1024 + const sizes = ['Bytes', 'KB', 'MB', 'GB'] + const i = Math.floor(Math.log(bytes) / Math.log(k)) + return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i] + } + + const getDocumentTypeLabel = (type: string) => { + return documentTypes.find(dt => dt.value === type)?.label || type + } + + return ( + <Dialog open={open} onOpenChange={onOpenChange}> + <DialogContent className="max-w-4xl max-h-[90vh] overflow-y-auto"> + <DialogHeader> + <DialogTitle className="flex items-center gap-2"> + <FileText className="w-5 h-5" /> + 입찰 문서 등록 + </DialogTitle> + <DialogDescription> + 입찰 관련 문서를 업로드하고 관리할 수 있습니다. + </DialogDescription> + </DialogHeader> + + <div className="space-y-6"> + {/* 파일 업로드 섹션 */} + <Card> + <CardHeader> + <CardTitle className="text-lg">새 문서 업로드</CardTitle> + </CardHeader> + <CardContent className="space-y-4"> + <div className="grid grid-cols-1 md:grid-cols-2 gap-4"> + <div className="space-y-2"> + <Label htmlFor="document-type">문서 타입 *</Label> + <Select value={documentType} onValueChange={setDocumentType}> + <SelectTrigger> + <SelectValue placeholder="문서 타입을 선택하세요" /> + </SelectTrigger> + <SelectContent> + {documentTypes.map((type) => ( + <SelectItem key={type.value} value={type.value}> + {type.label} + </SelectItem> + ))} + </SelectContent> + </Select> + </div> + + <div className="space-y-2"> + <Label htmlFor="file-upload">파일 선택 *</Label> + <Input + id="file-upload" + type="file" + accept=".pdf,.doc,.docx,.xls,.xlsx,.jpg,.jpeg,.png,.zip" + onChange={handleFileSelect} + disabled={isPending} + /> + <p className="text-xs text-muted-foreground"> + 지원 형식: PDF, Word, Excel, 이미지, ZIP (최대 50MB) + </p> + </div> + </div> + + <div className="space-y-2"> + <Label htmlFor="title">제목</Label> + <Input + id="title" + placeholder="문서 제목을 입력하세요" + value={title} + onChange={(e) => setTitle(e.target.value)} + /> + </div> + + <div className="space-y-2"> + <Label htmlFor="description">설명</Label> + <Textarea + id="description" + placeholder="문서에 대한 설명을 입력하세요" + value={description} + onChange={(e) => setDescription(e.target.value)} + rows={3} + /> + </div> + + <div className="flex justify-end"> + <Button + onClick={handleUpload} + disabled={!selectedFile || !documentType || isPending} + > + <Upload className="w-4 h-4 mr-2" /> + 업로드 + </Button> + </div> + </CardContent> + </Card> + + {/* 업로드된 문서 목록 */} + {isLoading ? ( + <div className="text-center py-4"> + <p className="text-muted-foreground">문서 목록을 불러오는 중...</p> + </div> + ) : documents.length > 0 ? ( + <Card> + <CardHeader> + <CardTitle className="text-lg flex items-center gap-2"> + 업로드된 문서 + <Badge variant="secondary">{documents.length}개</Badge> + </CardTitle> + </CardHeader> + <CardContent> + <Table> + <TableHeader> + <TableRow> + <TableHead>문서 타입</TableHead> + <TableHead>파일명</TableHead> + <TableHead>크기</TableHead> + <TableHead>업로드일</TableHead> + <TableHead className="w-24">작업</TableHead> + </TableRow> + </TableHeader> + <TableBody> + {documents.map((doc) => ( + <TableRow key={doc.id}> + <TableCell> + <Badge variant="outline"> + {getDocumentTypeLabel(doc.documentType)} + </Badge> + </TableCell> + <TableCell> + <div className="flex items-center gap-2"> + <FileText className="w-4 h-4 text-gray-500" /> + <span className="truncate max-w-48" title={doc.originalFileName}> + {doc.originalFileName} + </span> + </div> + </TableCell> + <TableCell className="text-sm text-gray-500"> + {formatFileSize(doc.fileSize)} + </TableCell> + <TableCell className="text-sm text-gray-500"> + {new Date(doc.uploadedAt).toLocaleDateString('ko-KR')} + </TableCell> + <TableCell> + <div className="flex items-center gap-1"> + <Button + variant="outline" + size="sm" + onClick={() => handleDownload(doc)} + disabled={isPending} + title="다운로드" + > + <Download className="w-3 h-3" /> + </Button> + <Button + variant="outline" + size="sm" + onClick={() => handleDelete(doc)} + disabled={isPending} + title="삭제" + className="text-red-600 hover:text-red-700" + > + <Trash2 className="w-3 h-3" /> + </Button> + </div> + </TableCell> + </TableRow> + ))} + </TableBody> + </Table> + </CardContent> + </Card> + ) : ( + <Card> + <CardContent className="text-center py-8"> + <FileText className="w-12 h-12 mx-auto mb-4 opacity-50" /> + <p className="text-gray-500">업로드된 문서가 없습니다</p> + </CardContent> + </Card> + )} + </div> + </DialogContent> + </Dialog> + ) +} |