diff options
Diffstat (limited to 'lib/project-doc-templates/table/template-detail-dialog.tsx')
| -rw-r--r-- | lib/project-doc-templates/table/template-detail-dialog.tsx | 121 |
1 files changed, 121 insertions, 0 deletions
diff --git a/lib/project-doc-templates/table/template-detail-dialog.tsx b/lib/project-doc-templates/table/template-detail-dialog.tsx new file mode 100644 index 00000000..0810a58a --- /dev/null +++ b/lib/project-doc-templates/table/template-detail-dialog.tsx @@ -0,0 +1,121 @@ +// lib/project-doc-template/template-detail-dialog.tsx +"use client"; + +import * as React from "react"; +import { + Dialog, + DialogContent, + DialogHeader, + DialogTitle, +} from "@/components/ui/dialog"; +import { Badge } from "@/components/ui/badge"; +import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"; +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; +import { ProjectDocTemplateEditor } from "./project-doc-template-editor"; +import { getProjectDocTemplateById } from "@/lib/project-doc-templates/service"; +import type { ProjectDocTemplate } from "@/db/schema/project-doc-templates"; +import { formatDateTime } from "@/lib/utils"; +import { FileText, Clock, User, GitBranch, Variable } from "lucide-react"; + +interface TemplateDetailDialogProps { + template: ProjectDocTemplate; + open: boolean; + onOpenChange: (open: boolean) => void; +} + +export function TemplateDetailDialog({ + template, + open, + onOpenChange, +}: TemplateDetailDialogProps) { + const [templateDetail, setTemplateDetail] = React.useState<any>(null); + const [isLoading, setIsLoading] = React.useState(true); + + // 템플릿 상세 정보 로드 + React.useEffect(() => { + if (open && template.id) { + setIsLoading(true); + getProjectDocTemplateById(template.id) + .then(setTemplateDetail) + .catch(console.error) + .finally(() => setIsLoading(false)); + } + }, [open, template.id]); + + return ( + <Dialog open={open} onOpenChange={onOpenChange}> + <DialogContent className="max-w-7xl h-[90vh] p-0 flex flex-col"> + <DialogHeader className="px-6 py-4 border-b"> + <DialogTitle className="flex items-center justify-between"> + <div className="flex items-center gap-2"> + <FileText className="h-5 w-5" /> + {template.templateName} + </div> + <div className="flex gap-2"> + <Badge variant="outline">v{template.version}</Badge> + {template.isLatest && <Badge variant="default">최신</Badge>} + <Badge variant="secondary">{template.status}</Badge> + </div> + </DialogTitle> + </DialogHeader> + + <Tabs defaultValue="viewer" className="flex-1 flex flex-col"> + <TabsList className="mx-6 mt-2"> + <TabsTrigger value="viewer">문서 보기</TabsTrigger> + <TabsTrigger value="history">버전 히스토리</TabsTrigger> + </TabsList> + + <TabsContent value="viewer" className="flex-1 mt-0"> + <div className="h-full"> + <ProjectDocTemplateEditor + templateId={template.id} + filePath={template.filePath} + fileName={template.fileName} + // mode="view" // 읽기 전용 모드 + /> + </div> + </TabsContent> + + + <TabsContent value="history" className="flex-1 overflow-y-auto px-6"> + <div className="space-y-4 py-4"> + {templateDetail?.versionHistory && templateDetail.versionHistory.length > 0 ? ( + templateDetail.versionHistory.map((version: any) => ( + <Card key={version.id} className={version.id === template.id ? "border-primary" : ""}> + <CardHeader> + <CardTitle className="text-base flex items-center justify-between"> + <div className="flex items-center gap-2"> + <GitBranch className="h-4 w-4" /> + 버전 {version.version} + </div> + <div className="flex gap-2"> + {version.isLatest && <Badge variant="default">최신</Badge>} + {version.id === template.id && <Badge variant="secondary">현재</Badge>} + </div> + </CardTitle> + </CardHeader> + <CardContent> + <div className="text-sm space-y-1"> + <p> + <span className="text-muted-foreground">생성일:</span> {formatDateTime(version.createdAt, "KR")} + </p> + <p> + <span className="text-muted-foreground">생성자:</span> {version.createdByName || '-'} + </p> + <p> + <span className="text-muted-foreground">파일:</span> {version.fileName} + </p> + </div> + </CardContent> + </Card> + )) + ) : ( + <p className="text-sm text-muted-foreground">버전 히스토리가 없습니다.</p> + )} + </div> + </TabsContent> + </Tabs> + </DialogContent> + </Dialog> + ); +}
\ No newline at end of file |