xpeditis2.0/apps/frontend/app/dashboard/wiki/douanes/page.tsx
2026-01-19 10:48:19 +01:00

219 lines
8.6 KiB
TypeScript
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/**
* Procédures Douanières - Wiki Page
*
* Guide des formalités douanières import/export
*/
import Link from 'next/link';
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
const regimesDouaniers = [
{
code: 'IM4',
name: 'Mise en libre pratique',
description: 'Importation définitive avec paiement des droits et taxes. La marchandise entre dans le circuit économique.',
},
{
code: 'IM5',
name: 'Admission temporaire',
description: 'Importation temporaire avec suspension des droits. Pour les marchandises réexportées en l\'état.',
},
{
code: 'IM6',
name: 'Perfectionnement actif',
description: 'Importation pour transformation et réexportation. Suspension des droits sur les intrants.',
},
{
code: 'IM7',
name: 'Entrepôt douanier',
description: 'Stockage sous douane sans paiement des droits jusqu\'à la mise en consommation.',
},
{
code: 'EX1',
name: 'Exportation définitive',
description: 'Sortie définitive des marchandises du territoire douanier.',
},
{
code: 'EX2',
name: 'Exportation temporaire',
description: 'Sortie temporaire avec réimportation prévue en l\'état.',
},
{
code: 'EX3',
name: 'Perfectionnement passif',
description: 'Exportation pour transformation à l\'étranger et réimportation.',
},
];
const documentsDouane = [
{
name: 'DAU (Document Administratif Unique)',
description: 'Formulaire standard pour toutes les déclarations douanières dans l\'UE.',
obligatoire: true,
},
{
name: 'Facture commerciale',
description: 'Document de base indiquant la valeur des marchandises.',
obligatoire: true,
},
{
name: 'Liste de colisage',
description: 'Détail du contenu de chaque colis (poids, dimensions, contenu).',
obligatoire: true,
},
{
name: 'Certificat d\'origine',
description: 'Atteste l\'origine des marchandises pour les accords préférentiels.',
obligatoire: false,
},
{
name: 'Licence d\'importation/exportation',
description: 'Autorisation pour certaines marchandises réglementées.',
obligatoire: false,
},
{
name: 'Certificat sanitaire/phytosanitaire',
description: 'Pour les produits alimentaires, animaux et végétaux.',
obligatoire: false,
},
];
export default function DouanesPage() {
return (
<div className="space-y-6">
{/* Header with back link */}
<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>
Retour au Wiki
</Link>
</div>
{/* Title */}
<div className="mb-8">
<div className="flex items-center gap-3">
<span className="text-4xl">🛃</span>
<h1 className="text-3xl font-bold text-gray-900">Procédures Douanières</h1>
</div>
<p className="mt-3 text-gray-600 max-w-3xl">
Les formalités douanières sont obligatoires pour toute marchandise traversant une frontière.
Elles permettent le contrôle des échanges, la perception des droits et taxes, et l&apos;application
des réglementations commerciales.
</p>
</div>
{/* Key Concepts */}
<Card className="bg-blue-50 border-blue-200">
<CardContent className="pt-6">
<h3 className="font-semibold text-blue-900 mb-3">Concepts Clés</h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 text-blue-800">
<div>
<h4 className="font-medium">Valeur en douane</h4>
<p className="text-sm">Base de calcul des droits, généralement la valeur CIF (coût + assurance + fret).</p>
</div>
<div>
<h4 className="font-medium">Code SH / NC</h4>
<p className="text-sm">Classification tarifaire harmonisée des marchandises (6 ou 8 chiffres).</p>
</div>
<div>
<h4 className="font-medium">Origine</h4>
<p className="text-sm">Pays de fabrication ou de transformation substantielle de la marchandise.</p>
</div>
<div>
<h4 className="font-medium">OEA (Opérateur Économique Agréé)</h4>
<p className="text-sm">Statut de confiance accordé par les douanes pour des procédures simplifiées.</p>
</div>
</div>
</CardContent>
</Card>
{/* Régimes douaniers */}
<div className="mt-8">
<h2 className="text-xl font-bold text-gray-900 mb-4">📋 Régimes Douaniers</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
{regimesDouaniers.map((regime) => (
<Card key={regime.code} className="bg-white">
<CardHeader className="pb-2">
<CardTitle className="flex items-center gap-2">
<span className="px-3 py-1 bg-green-600 text-white rounded-md font-mono text-sm">
{regime.code}
</span>
<span className="text-lg">{regime.name}</span>
</CardTitle>
</CardHeader>
<CardContent>
<p className="text-gray-600">{regime.description}</p>
</CardContent>
</Card>
))}
</div>
</div>
{/* Documents requis */}
<div className="mt-8">
<h2 className="text-xl font-bold text-gray-900 mb-4">📄 Documents Requis</h2>
<Card className="bg-white">
<CardContent className="pt-6">
<div className="space-y-4">
{documentsDouane.map((doc) => (
<div key={doc.name} className="flex items-start gap-3 pb-4 border-b last:border-0">
<span className={`px-2 py-1 text-xs rounded ${doc.obligatoire ? 'bg-red-100 text-red-700' : 'bg-gray-100 text-gray-700'}`}>
{doc.obligatoire ? 'Obligatoire' : 'Selon cas'}
</span>
<div>
<h4 className="font-medium text-gray-900">{doc.name}</h4>
<p className="text-sm text-gray-600">{doc.description}</p>
</div>
</div>
))}
</div>
</CardContent>
</Card>
</div>
{/* Droits et taxes */}
<Card className="mt-8 bg-gray-50">
<CardContent className="pt-6">
<h3 className="font-semibold text-gray-900 mb-3">💰 Droits et Taxes</h3>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="bg-white p-4 rounded-lg border">
<h4 className="font-medium text-gray-900">Droits de douane</h4>
<p className="text-sm text-gray-600">Pourcentage appliqué sur la valeur en douane selon le code SH.</p>
<p className="text-xs text-gray-500 mt-2">Ex: 0% à 17% selon les produits</p>
</div>
<div className="bg-white p-4 rounded-lg border">
<h4 className="font-medium text-gray-900">TVA import</h4>
<p className="text-sm text-gray-600">Taxe sur la valeur ajoutée calculée sur (valeur + droits).</p>
<p className="text-xs text-gray-500 mt-2">France: 20%, 10%, 5.5% ou 2.1%</p>
</div>
<div className="bg-white p-4 rounded-lg border">
<h4 className="font-medium text-gray-900">Droits antidumping</h4>
<p className="text-sm text-gray-600">Droits additionnels pour protéger contre la concurrence déloyale.</p>
<p className="text-xs text-gray-500 mt-2">Variable selon origine et produit</p>
</div>
</div>
</CardContent>
</Card>
{/* Tips */}
<Card className="mt-8 bg-amber-50 border-amber-200">
<CardContent className="pt-6">
<h3 className="font-semibold text-amber-900 mb-3"> Points d&apos;Attention</h3>
<ul className="list-disc list-inside space-y-2 text-amber-800">
<li>Toujours vérifier le classement tarifaire avant l&apos;importation</li>
<li>Conserver tous les documents 3 ans minimum (contrôle a posteriori)</li>
<li>Anticiper les contrôles : certificats, licences, normes</li>
<li>Utiliser les accords de libre-échange pour réduire les droits</li>
<li>Attention aux marchandises à double usage (exportation)</li>
</ul>
</CardContent>
</Card>
</div>
);
}