78 lines
2.6 KiB
TypeScript
78 lines
2.6 KiB
TypeScript
import { FileText, Settings, Wrench } from 'lucide-react'
|
||
import React from 'react'
|
||
import { useNavigate } from 'react-router-dom'
|
||
import { Template } from '../../type/template'
|
||
import { Button } from '../ui/button'
|
||
import { Card, CardContent, CardHeader, CardTitle } from '../ui/card'
|
||
|
||
interface TemplateCardProps {
|
||
template: Template
|
||
onDelete: (template: Template) => void
|
||
isSelected?: boolean
|
||
}
|
||
|
||
const TemplateCard: React.FC<TemplateCardProps> = ({
|
||
template,
|
||
onDelete,
|
||
isSelected = false,
|
||
}) => {
|
||
const navigate = useNavigate()
|
||
|
||
// Шаблон считается готовым, когда есть хотя бы один элемент и загружена
|
||
// Excel-таблица (что подтверждается наличием mergedCells).
|
||
const isConfigured =
|
||
template.elements.length > 0 && (template.mergedCells?.length ?? 0) > 0
|
||
|
||
return (
|
||
<Card className={isSelected ? 'border-2 border-blue-500' : ''}>
|
||
<CardHeader className="pb-4">
|
||
<CardTitle className="text-base font-medium">{template.name}</CardTitle>
|
||
</CardHeader>
|
||
<CardContent className="pt-0">
|
||
{template.description && (
|
||
<p className="mb-3 line-clamp-2 text-sm text-muted-foreground">
|
||
{template.description}
|
||
</p>
|
||
)}
|
||
<div className="mb-3 flex justify-between text-xs text-muted-foreground">
|
||
<span>
|
||
Создан: {new Date(template.createdAt).toLocaleDateString()}
|
||
</span>
|
||
<span>
|
||
Обновлён: {new Date(template.updatedAt).toLocaleDateString()}
|
||
</span>
|
||
</div>
|
||
<div className="flex items-center gap-2">
|
||
<Button
|
||
size="sm"
|
||
className="flex-1"
|
||
disabled={!isConfigured}
|
||
onClick={() => navigate(`/templates/${template.id}/protocols`)}
|
||
>
|
||
<FileText className="mr-2 h-3 w-3" />
|
||
{isConfigured ? 'Создать протокол' : 'Требует настройки'}
|
||
</Button>
|
||
<Button
|
||
size="sm"
|
||
variant="outline"
|
||
className="h-8 w-8 p-0"
|
||
onClick={() => navigate(`/templates/${template.id}/edit`)}
|
||
>
|
||
<Settings className="h-3 w-3" />
|
||
</Button>
|
||
<Button
|
||
size="sm"
|
||
variant="outline"
|
||
className="h-8 w-8 p-0"
|
||
onClick={() => navigate(`/templates/${template.id}/elements`)}
|
||
>
|
||
<Wrench className="h-3 w-3" />
|
||
</Button>
|
||
</div>
|
||
</CardContent>
|
||
</Card>
|
||
)
|
||
}
|
||
|
||
export default TemplateCard
|