225 lines
8.5 KiB
TypeScript
225 lines
8.5 KiB
TypeScript
/**
|
|
* Incoterms 2020 - Wiki Page
|
|
*
|
|
* Detailed information about international commercial terms
|
|
*/
|
|
|
|
import Link from 'next/link';
|
|
import { Card, CardHeader, CardTitle, CardContent } from '@/components/ui/card';
|
|
|
|
const incoterms = [
|
|
{
|
|
code: 'EXW',
|
|
name: 'Ex Works',
|
|
description: 'Le vendeur met la marchandise à disposition dans ses locaux. L\'acheteur assume tous les risques et coûts.',
|
|
risk: 'Acheteur',
|
|
transport: 'Tous modes',
|
|
category: 'Départ',
|
|
},
|
|
{
|
|
code: 'FCA',
|
|
name: 'Free Carrier',
|
|
description: 'Le vendeur livre la marchandise au transporteur désigné par l\'acheteur.',
|
|
risk: 'Transfert à la livraison au transporteur',
|
|
transport: 'Tous modes',
|
|
category: 'Départ',
|
|
},
|
|
{
|
|
code: 'CPT',
|
|
name: 'Carriage Paid To',
|
|
description: 'Le vendeur paie le transport jusqu\'à destination. Le risque est transféré à la remise au transporteur.',
|
|
risk: 'Transfert à la livraison au transporteur',
|
|
transport: 'Tous modes',
|
|
category: 'Arrivée',
|
|
},
|
|
{
|
|
code: 'CIP',
|
|
name: 'Carriage and Insurance Paid To',
|
|
description: 'Comme CPT mais le vendeur doit aussi assurer la marchandise.',
|
|
risk: 'Transfert à la livraison au transporteur',
|
|
transport: 'Tous modes',
|
|
category: 'Arrivée',
|
|
},
|
|
{
|
|
code: 'DAP',
|
|
name: 'Delivered at Place',
|
|
description: 'Le vendeur livre la marchandise prête à être déchargée au lieu convenu.',
|
|
risk: 'Vendeur jusqu\'à destination',
|
|
transport: 'Tous modes',
|
|
category: 'Arrivée',
|
|
},
|
|
{
|
|
code: 'DPU',
|
|
name: 'Delivered at Place Unloaded',
|
|
description: 'Le vendeur livre et décharge la marchandise au lieu de destination.',
|
|
risk: 'Vendeur jusqu\'au déchargement',
|
|
transport: 'Tous modes',
|
|
category: 'Arrivée',
|
|
},
|
|
{
|
|
code: 'DDP',
|
|
name: 'Delivered Duty Paid',
|
|
description: 'Le vendeur assume tous les risques et coûts, y compris les droits de douane.',
|
|
risk: 'Vendeur (maximum)',
|
|
transport: 'Tous modes',
|
|
category: 'Arrivée',
|
|
},
|
|
{
|
|
code: 'FAS',
|
|
name: 'Free Alongside Ship',
|
|
description: 'Le vendeur livre la marchandise le long du navire au port d\'embarquement.',
|
|
risk: 'Transfert le long du navire',
|
|
transport: 'Maritime uniquement',
|
|
category: 'Maritime',
|
|
},
|
|
{
|
|
code: 'FOB',
|
|
name: 'Free On Board',
|
|
description: 'Le vendeur livre la marchandise à bord du navire. Très utilisé en maritime.',
|
|
risk: 'Transfert à bord du navire',
|
|
transport: 'Maritime uniquement',
|
|
category: 'Maritime',
|
|
},
|
|
{
|
|
code: 'CFR',
|
|
name: 'Cost and Freight',
|
|
description: 'Le vendeur paie le fret jusqu\'au port de destination. Le risque passe à bord.',
|
|
risk: 'Transfert à bord du navire',
|
|
transport: 'Maritime uniquement',
|
|
category: 'Maritime',
|
|
},
|
|
{
|
|
code: 'CIF',
|
|
name: 'Cost, Insurance and Freight',
|
|
description: 'Comme CFR mais le vendeur doit aussi assurer la marchandise.',
|
|
risk: 'Transfert à bord du navire',
|
|
transport: 'Maritime uniquement',
|
|
category: 'Maritime',
|
|
},
|
|
];
|
|
|
|
export default function IncotermsPage() {
|
|
const categories = ['Départ', 'Arrivée', 'Maritime'];
|
|
|
|
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">Incoterms 2020</h1>
|
|
</div>
|
|
<p className="mt-3 text-gray-600 max-w-3xl">
|
|
Les Incoterms (International Commercial Terms) sont des règles publiées par la Chambre de Commerce
|
|
Internationale (ICC) qui définissent les responsabilités des vendeurs et acheteurs dans les transactions
|
|
internationales. La version 2020 est entrée en vigueur le 1er janvier 2020.
|
|
</p>
|
|
</div>
|
|
|
|
{/* Key Points */}
|
|
<Card className="bg-blue-50 border-blue-200">
|
|
<CardContent className="pt-6">
|
|
<h3 className="font-semibold text-blue-900 mb-3">Points Clés</h3>
|
|
<ul className="list-disc list-inside space-y-2 text-blue-800">
|
|
<li>11 Incoterms au total : 7 multimodaux et 4 maritimes</li>
|
|
<li>Définissent le transfert des risques et des coûts</li>
|
|
<li>Ne définissent PAS le transfert de propriété</li>
|
|
<li>Doivent être suivis de la version (ex: FOB Incoterms 2020)</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
|
|
{/* Incoterms by category */}
|
|
{categories.map((category) => (
|
|
<div key={category} className="mt-8">
|
|
<h2 className="text-xl font-bold text-gray-900 mb-4">
|
|
{category === 'Maritime' ? '🚢 Incoterms Maritimes' :
|
|
category === 'Départ' ? '📤 Incoterms de Départ' : '📥 Incoterms d\'Arrivée'}
|
|
</h2>
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
{incoterms
|
|
.filter((term) => term.category === category)
|
|
.map((term) => (
|
|
<Card key={term.code} className="bg-white">
|
|
<CardHeader className="pb-2">
|
|
<CardTitle className="flex items-center gap-2">
|
|
<span className="px-3 py-1 bg-blue-600 text-white rounded-md font-mono">
|
|
{term.code}
|
|
</span>
|
|
<span className="text-lg">{term.name}</span>
|
|
</CardTitle>
|
|
</CardHeader>
|
|
<CardContent>
|
|
<p className="text-gray-600 mb-3">{term.description}</p>
|
|
<div className="space-y-1 text-sm">
|
|
<div className="flex justify-between">
|
|
<span className="text-gray-500">Risque:</span>
|
|
<span className="font-medium text-gray-900">{term.risk}</span>
|
|
</div>
|
|
<div className="flex justify-between">
|
|
<span className="text-gray-500">Transport:</span>
|
|
<span className="font-medium text-gray-900">{term.transport}</span>
|
|
</div>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
))}
|
|
|
|
{/* Visual diagram placeholder */}
|
|
<Card className="mt-8 bg-gray-50">
|
|
<CardContent className="pt-6">
|
|
<h3 className="font-semibold text-gray-900 mb-3">Transfert des Risques - Schéma</h3>
|
|
<div className="bg-white p-4 rounded-lg border">
|
|
<div className="flex items-center justify-between text-sm mb-2">
|
|
<span className="font-medium">Vendeur</span>
|
|
<span className="font-medium">Acheteur</span>
|
|
</div>
|
|
<div className="relative h-8 bg-gradient-to-r from-blue-500 to-green-500 rounded-full">
|
|
<div className="absolute inset-0 flex items-center justify-around text-white text-xs font-medium">
|
|
<span>EXW</span>
|
|
<span>FCA</span>
|
|
<span>FOB</span>
|
|
<span>CFR/CIF</span>
|
|
<span>DAP</span>
|
|
<span>DDP</span>
|
|
</div>
|
|
</div>
|
|
<p className="text-xs text-gray-500 mt-2 text-center">
|
|
Plus on va vers la droite, plus le vendeur assume de responsabilités
|
|
</p>
|
|
</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">Conseils Pratiques</h3>
|
|
<ul className="list-disc list-inside space-y-2 text-amber-800">
|
|
<li>Utilisez FOB ou CIF pour le maritime, FCA ou CIP pour le multimodal</li>
|
|
<li>Précisez toujours le lieu exact (ex: FOB Shanghai Port)</li>
|
|
<li>Vérifiez la cohérence entre l'Incoterm et la lettre de crédit</li>
|
|
<li>EXW et DDP sont les termes extrêmes - à utiliser avec précaution</li>
|
|
</ul>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
);
|
|
}
|