feat: Add document template management functionality

- Created migration script to add `docx_templates` table with necessary fields and indexes. - Implemented API routes for uploading, fetching, and deleting document templates. - Developed document generation feature using selected templates and project data. - Added UI components for template upload and listing, including a modal for document generation. - Integrated document generation into the project view page, allowing users to generate documents based on selected templates. - Enhanced error handling and user feedback for template operations.
2025-12-16 09:50:19 +01:00
parent abad26b68a
commit c0d357efdd
12 changed files with 1291 additions and 3 deletions
--- a/src/components/TemplateList.js
+++ b/src/components/TemplateList.js
@@ -0,0 +1,146 @@
+"use client";
+
+import { useState } from "react";
+import Button from "@/components/ui/Button";
+import Badge from "@/components/ui/Badge";
+
+export default function TemplateList({ templates, onTemplateDeleted }) {
+	const [deletingId, setDeletingId] = useState(null);
+
+	const handleDelete = async (templateId) => {
+		if (!confirm("Czy na pewno chcesz usunąć ten szablon?")) {
+			return;
+		}
+
+		setDeletingId(templateId);
+
+		try {
+			const response = await fetch(`/api/templates/${templateId}`, {
+				method: "DELETE",
+			});
+
+			if (response.ok) {
+				onTemplateDeleted(templateId);
+			} else {
+				alert("Błąd podczas usuwania szablonu");
+			}
+		} catch (error) {
+			console.error("Delete error:", error);
+			alert("Błąd podczas usuwania szablonu");
+		} finally {
+			setDeletingId(null);
+		}
+	};
+
+	const formatFileSize = (bytes) => {
+		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 formatDate = (dateString) => {
+		return new Date(dateString).toLocaleDateString("pl-PL", {
+			year: "numeric",
+			month: "2-digit",
+			day: "2-digit",
+			hour: "2-digit",
+			minute: "2-digit",
+		});
+	};
+
+	if (templates.length === 0) {
+		return (
+			<div className="text-center py-12">
+				<div className="text-gray-400 mb-4">
+					<svg
+						className="w-12 h-12 mx-auto"
+						fill="none"
+						stroke="currentColor"
+						viewBox="0 0 24 24"
+					>
+						<path
+							strokeLinecap="round"
+							strokeLinejoin="round"
+							strokeWidth={1.5}
+							d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
+						/>
+					</svg>
+				</div>
+				<h3 className="text-lg font-medium text-gray-900 mb-2">
+					Brak szablonów
+				</h3>
+				<p className="text-gray-500">
+					Dodaj swój pierwszy szablon dokumentów DOCX.
+				</p>
+			</div>
+		);
+	}
+
+	return (
+		<div className="space-y-4">
+			<h3 className="text-lg font-medium text-gray-900">
+				Dostępne szablony ({templates.length})
+			</h3>
+
+			<div className="space-y-3">
+				{templates.map((template) => (
+					<div
+						key={template.template_id}
+						className="border border-gray-200 rounded-lg p-4 hover:bg-gray-50 transition-colors"
+					>
+						<div className="flex items-start justify-between">
+							<div className="flex-1">
+								<div className="flex items-center gap-2 mb-1">
+									<h4 className="font-medium text-gray-900">
+										{template.template_name}
+									</h4>
+									<Badge variant="success" size="xs">
+										Aktywny
+									</Badge>
+								</div>
+
+								{template.description && (
+									<p className="text-sm text-gray-600 mb-2">
+										{template.description}
+									</p>
+								)}
+
+								<div className="flex items-center gap-4 text-sm text-gray-500">
+									<span>
+										Plik: {template.original_filename}
+									</span>
+									<span>
+										Rozmiar: {formatFileSize(template.file_size)}
+									</span>
+									<span>
+										Dodano: {formatDate(template.created_at)}
+									</span>
+								</div>
+							</div>
+
+							<div className="flex gap-2 ml-4">
+								<Button
+									variant="outline"
+									size="sm"
+									onClick={() => window.open(template.file_path, "_blank")}
+								>
+									Pobierz
+								</Button>
+								<Button
+									variant="danger"
+									size="sm"
+									onClick={() => handleDelete(template.template_id)}
+									disabled={deletingId === template.template_id}
+								>
+									{deletingId === template.template_id ? "Usuwanie..." : "Usuń"}
+								</Button>
+							</div>
+						</div>
+					</div>
+				))}
+			</div>
+		</div>
+	);
+}