import { Head, router, useForm } from '@inertiajs/react'; import { ChevronLeft } from 'lucide-react'; import { Badge } from '@/components/ui/badge'; import { Button } from '@/components/ui/button'; import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'; import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'; import AdminLayout from '@/layouts/admin-layout'; import { type Order } from '@/types'; const ORDER_STATUSES = ['new', 'pending', 'confirmed', 'packed', 'shipped', 'delivered', 'cancelled', 'returned']; const statusColors: Record = { new: 'bg-blue-100 text-blue-700', pending: 'bg-yellow-100 text-yellow-700', confirmed: 'bg-indigo-100 text-indigo-700', packed: 'bg-purple-100 text-purple-700', shipped: 'bg-orange-100 text-orange-700', delivered: 'bg-green-100 text-green-700', cancelled: 'bg-red-100 text-red-700', returned: 'bg-slate-100 text-slate-700', }; export default function AdminOrderShow({ order }: { order: Order }) { const { data, setData, patch, processing } = useForm({ status: order.order_status }); const updateStatus = () => patch(route('admin.orders.updateStatus', order.id)); return (
{/* Left: Items + summary */}
Order Items {order.items?.map((item) => ( ))}
Product SKU Price Qty Subtotal
{item.product_name} {item.sku} ৳{Number(item.price).toLocaleString()} {item.qty} ৳{Number(item.subtotal).toLocaleString()}
{/* Totals */}
Subtotal৳{Number(order.subtotal).toLocaleString()}
{Number(order.discount_amount) > 0 && (
Discount-৳{Number(order.discount_amount).toLocaleString()}
)}
Shipping৳{Number(order.shipping_charge).toLocaleString()}
Total৳{Number(order.total_amount).toLocaleString()}
{/* Right: Status + customer info */}
Update Status
Current: {order.order_status}
Customer
Name: {order.customer_name}
Phone: {order.customer_phone}
{order.customer_email &&
Email: {order.customer_email}
}
Payment: {order.payment_method} / {order.payment_status}
Shipping Address {order.shipping_address} {order.note && ( Note {order.note} )}
); }