111 lines
4.1 KiB
TypeScript
111 lines
4.1 KiB
TypeScript
import { getTranslations } from 'next-intl/server';
|
|
import { Link } from '@/i18n/navigation';
|
|
import { Card, CardContent } from '@/components/ui/card';
|
|
import { ShieldCheck } from 'lucide-react';
|
|
|
|
export default async function DouanesPage() {
|
|
const t = await getTranslations('dashboard.wikiPages');
|
|
|
|
const regimes = t.raw('douanes.regimes') as Array<{
|
|
code: string;
|
|
name: string;
|
|
description: string;
|
|
}>;
|
|
const documents = t.raw('douanes.documents') as Array<{
|
|
name: string;
|
|
mandatory: boolean;
|
|
description: string;
|
|
}>;
|
|
const duties = t.raw('douanes.duties') as Array<{ type: string; description: string }>;
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex items-center gap-4 mb-6">
|
|
<Link
|
|
href="/dashboard/wiki"
|
|
className="flex items-center text-blue-600 hover:text-blue-800 transition-colors"
|
|
>
|
|
<svg className="w-5 h-5 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
strokeWidth={2}
|
|
d="M15 19l-7-7 7-7"
|
|
/>
|
|
</svg>
|
|
{t('backToWiki')}
|
|
</Link>
|
|
</div>
|
|
|
|
<div className="mb-8">
|
|
<div className="flex items-center gap-3">
|
|
<ShieldCheck className="w-10 h-10 text-blue-600" />
|
|
<h1 className="text-3xl font-bold text-gray-900">{t('douanes.title')}</h1>
|
|
</div>
|
|
<p className="mt-3 text-gray-600 max-w-3xl">{t('douanes.description')}</p>
|
|
</div>
|
|
|
|
<div className="mt-8">
|
|
<h2 className="text-xl font-bold text-gray-900 mb-4">{t('douanes.regimesTitle')}</h2>
|
|
<div className="overflow-x-auto">
|
|
<table className="w-full text-sm bg-white rounded-lg border">
|
|
<thead className="bg-gray-50">
|
|
<tr>
|
|
<th className="text-left p-3 font-medium">{t('douanes.colCode')}</th>
|
|
<th className="text-left p-3 font-medium">{t('douanes.colName')}</th>
|
|
<th className="text-left p-3 font-medium">{t('douanes.colDescription')}</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{regimes.map(r => (
|
|
<tr key={r.code} className="border-t hover:bg-gray-50">
|
|
<td className="p-3 font-mono font-bold text-blue-600">{r.code}</td>
|
|
<td className="p-3 font-medium">{r.name}</td>
|
|
<td className="p-3 text-gray-600">{r.description}</td>
|
|
</tr>
|
|
))}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mt-8">
|
|
<h2 className="text-xl font-bold text-gray-900 mb-4">{t('douanes.documentsTitle')}</h2>
|
|
<div className="space-y-3">
|
|
{documents.map(doc => (
|
|
<Card key={doc.name} className="bg-white">
|
|
<CardContent className="py-3">
|
|
<div className="flex items-center gap-3">
|
|
<span
|
|
className={`px-2 py-0.5 text-xs rounded font-medium ${doc.mandatory ? 'bg-red-100 text-red-700' : 'bg-gray-100 text-gray-600'}`}
|
|
>
|
|
{doc.mandatory ? t('mandatoryLabel') : t('optionalLabel')}
|
|
</span>
|
|
<div>
|
|
<span className="font-medium text-gray-900">{doc.name}</span>
|
|
<span className="text-sm text-gray-500 ml-2">— {doc.description}</span>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
|
|
<div className="mt-8">
|
|
<h2 className="text-xl font-bold text-gray-900 mb-4">{t('douanes.dutiesTitle')}</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
|
|
{duties.map(d => (
|
|
<Card key={d.type} className="bg-white">
|
|
<CardContent className="pt-4">
|
|
<h4 className="font-semibold text-gray-900 mb-2">{d.type}</h4>
|
|
<p className="text-sm text-gray-600">{d.description}</p>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|