import { Head, Link } from '@inertiajs/react'; import { ArrowRight, CheckCircle2, Package } from 'lucide-react'; import PublicLayout from '@/layouts/public-layout'; import { Button } from '@/components/ui/button'; import { Badge } from '@/components/ui/badge'; interface OrderItem { product_id: number | null; name: string; image?: string | null; quantity: number; unit_price: number; total_price: number; note?: string | null; } interface DeliveryDetails { first_name: string; last_name: string; address: string; country: string; region: string; city: string; postal_code: string; phone: string; } interface StatusMeta { label: string; badge: string; description?: string; } interface OrderDetailProps { order: { id: number; reference: string; status: string; status_meta?: StatusMeta; subtotal: number; items_count: number; created_at: string | null; items: OrderItem[]; delivery: DeliveryDetails; }; statusMeta?: Record; } const currency = new Intl.NumberFormat('fr-FR', { style: 'currency', currency: 'TND', }); export default function OrderShowPage({ order, statusMeta }: OrderDetailProps) { const delivery = order.delivery; const hasItems = order.items.length > 0; const meta = order.status_meta ?? (statusMeta ? statusMeta[order.status] : undefined); return (

Merci pour votre commande !

Commande #{order.reference} enregistree {order.created_at && ( <> {' '}le{' '} {new Date(order.created_at).toLocaleDateString('fr-FR', { day: '2-digit', month: '2-digit', year: 'numeric', })} )} .

Resume de commande

Les informations principales de cette commande.

{meta && ( {meta.label} )}

Reference: #{order.reference}
Nombre d'articles: {order.items_count}
Montant total: {currency.format(order.subtotal)}

Adresse de livraison

{delivery.first_name} {delivery.last_name}

{delivery.address}

{delivery.postal_code} {delivery.city}

{delivery.region}, {delivery.country}

Telephone : {delivery.phone}

Articles commandes

{hasItems ? ( order.items.map((item, index) => (

{item.name}

Quantite : {item.quantity} • Prix unitaire : {currency.format(item.unit_price)}

{item.note &&

Note : {item.note}

}

{currency.format(item.total_price)}

)) ) : (

Aucun article n'est associe a cette commande.

)}

); }