add downloadable content in vault

This commit is contained in:
LathanDevers
2026-08-01 22:24:49 +02:00
parent 6b93d21d19
commit ff6602dff3
9 changed files with 148 additions and 81 deletions
+7 -42
View File
@@ -1,6 +1,8 @@
import React from 'react';
import { useDocuments } from '@/hooks/useDocuments';
import {DocumentObject} from '@ui/DocumentObject'
import { Button } from '../ui/Button';
import { Card } from '../ui/Card';
interface DocumentsWidgetProps {
onSelectDocument: (id: string) => void;
@@ -8,19 +10,10 @@ interface DocumentsWidgetProps {
export function DocumentsWidget(){
const { documents } = useDocuments();
const getCategoryBadge = (category: string) => {
switch (category) {
case 'Audit': return 'bg-purple-50 text-purple-700 border-purple-200';
case 'Facture': return 'bg-slate-100 text-slate-700 border-slate-200';
case 'Rapport de conformité': return 'bg-emerald-50 text-emerald-700 border-emerald-200';
default: return 'bg-blue-50 text-blue-700 border-blue-200';
}
};
return (
<div className="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
<Card className='pb-7'>
<table className="min-w-full divide-y divide-slate-200">
<thead className="bg-slate-50">
<thead>
<tr>
<th scope="col" className="px-6 py-3 text-left text-xs font-semibold text-slate-500 uppercase tracking-wider">
Nom du fichier
@@ -36,41 +29,13 @@ export function DocumentsWidget(){
</th>
</tr>
</thead>
<tbody className="bg-white divide-y divide-slate-200">
<tbody className="divide-y divide-slate-200">
{documents.map((doc) => (
<tr key={doc.id} className="hover:bg-slate-50 transition-colors">
<td className="px-6 py-4 whitespace-nowrap">
<div className="flex items-center">
<svg className="shrink-0 h-6 w-6 text-slate-400 mr-3" 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>
<div className="text-sm font-medium text-slate-900">{doc.title}</div>
<div className="text-xs text-slate-500">{doc.file.size} PDF</div>
</div>
</div>
</td>
<td className="px-6 py-4 whitespace-nowrap">
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium border ${getCategoryBadge(doc.category)}`}>
{doc.category}
</span>
</td>
<td className="px-6 py-4 whitespace-nowrap text-sm text-slate-500">
{doc.created.split(" ")[0]+" "+doc.created.split(" ")[1].split(":")[0]+":"+doc.created.split(" ")[1].split(":")[1]}
</td>
<td className="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<Button className="text-blue-900 hover:text-blue-700 bg-blue-50 hover:bg-blue-100 px-3 py-1.5 rounded flex items-center justify-end ml-auto transition-colors">
<svg className="w-4 h-4 mr-1.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" />
</svg>
Télécharger
</Button>
</td>
</tr>
<DocumentObject doc={doc}></DocumentObject>
))}
</tbody>
</table>
</div>
</Card>
);
};
+1 -1
View File
@@ -13,7 +13,7 @@ export const TicketsWidget: React.FC<TicketsWidgetProps> = ({ onSelectTicket })
const { tickets, isLoading, error } = useTickets();
return (
<Card>
<Card className='pb-7'>
<CardContent className="p-0">
{/* En-tête du Widget */}
<div className="p-6 border-b border-slate-100">