feat(F-140): completed feature

This commit is contained in:
chattie
2026-08-22 13:16:27 +02:00
parent 5748c00623
commit 926add3c97
15 changed files with 340 additions and 23 deletions

View File

@@ -525,6 +525,77 @@ export default function OrderDetailPage() {
{/* Sidebar */}
<div className="space-y-6">
{/* F-140: Customer + Addresses + Payment */}
{(order.email || order.customerName) && (
<div className="bg-white border border-gray-200 rounded-xl p-6">
<h2 className="font-bold text-gray-900 mb-4">Cliente</h2>
<div className="space-y-1 text-sm">
{order.customerName && <p className="font-medium text-gray-900">{order.customerName}</p>}
{order.email && <p className="text-gray-600">{order.email}</p>}
{(order.phone || order.customerPhone) && (
<p className="text-gray-600">{order.customerPhone || order.phone}</p>
)}
</div>
</div>
)}
{order.shippingAddress && (
<div className="bg-white border border-gray-200 rounded-xl p-6">
<h2 className="font-bold text-gray-900 mb-4">Dirección de envío</h2>
<div className="space-y-1 text-sm text-gray-700">
<p className="font-medium">{order.shippingAddress.recipientName}</p>
<p>{order.shippingAddress.street}</p>
<p>{order.shippingAddress.postalCode} {order.shippingAddress.city}</p>
<p>{order.shippingAddress.country}</p>
</div>
</div>
)}
{order.billingAddress && (
<div className="bg-white border border-gray-200 rounded-xl p-6">
<h2 className="font-bold text-gray-900 mb-4">Dirección de facturación</h2>
<div className="space-y-1 text-sm text-gray-700">
<p className="font-medium">{order.billingAddress.recipientName}</p>
<p>{order.billingAddress.street}</p>
<p>{order.billingAddress.postalCode} {order.billingAddress.city}</p>
<p>{order.billingAddress.country}</p>
</div>
</div>
)}
{order.payment && (
<div className="bg-white border border-gray-200 rounded-xl p-6">
<h2 className="font-bold text-gray-900 mb-4">Pago</h2>
<div className="space-y-1 text-sm">
<div className="flex justify-between">
<span className="text-gray-600">Método</span>
<span className="font-medium text-gray-900 capitalize">{order.payment.provider.replace(/_/g, ' ')}</span>
</div>
{order.payment.last4 && (
<div className="flex justify-between">
<span className="text-gray-600">Últimos 4</span>
<span className="font-mono font-medium text-gray-900">····{order.payment.last4}</span>
</div>
)}
<div className="flex justify-between">
<span className="text-gray-600">Importe</span>
<span className="font-medium text-gray-900">{formatPrice(order.payment.amountCents)}</span>
</div>
<div className="flex justify-between items-center">
<span className="text-gray-600">Estado</span>
<span className={`inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium ${
order.payment.status === 'succeeded' ? 'bg-green-100 text-green-800' :
order.payment.status === 'failed' ? 'bg-red-100 text-red-800' :
order.payment.status === 'refunded' ? 'bg-amber-100 text-amber-800' :
'bg-gray-100 text-gray-800'
}`}>
{order.payment.status}
</span>
</div>
</div>
</div>
)}
{/* F-140 already shown above — keep existing Envío section */}
{/* Envío */}
<div className="bg-white border border-gray-200 rounded-xl p-6">
<h2 className="font-bold text-gray-900 mb-4">Envío</h2>

View File

@@ -99,6 +99,22 @@ export interface OrderItem {
createdAt: string;
}
export interface Address {
recipientName: string;
street: string;
city: string;
postalCode: string;
country: string;
}
export interface PaymentInfo {
provider: string;
status: string;
amountCents: number;
last4: string | null;
createdAt: string;
}
export interface Order {
id: string;
userId: string;
@@ -111,7 +127,14 @@ export interface Order {
trackingNumber?: string | null;
courier?: string | null;
idempotencyKey: string | null;
customerName?: string | null;
customerPhone?: string | null;
email?: string | null;
phone?: string | null;
items: OrderItem[];
shippingAddress?: Address | null;
billingAddress?: Address | null;
payment?: PaymentInfo | null;
createdAt: string;
updatedAt: string;
}