g/ember-market-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update page.tsx

Browse Source
This commit is contained in:
NotII
2025-04-21 15:44:41 +01:00
parent 63c7d602e4
commit 6a0f2ff803
1 changed files with 91 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

95
app/dashboard/orders/[id]/page.tsx
View File

@@ -61,6 +61,14 @@ interface Order {
}>;
totalPrice: number;
trackingNumber?: string;
telegramUsername?: string;
telegramBuyerId?: string;
review?: {
text: string;
date: string;
stars: number;
_id: string;
};
}
interface OrderInList extends Order {
@@ -551,19 +559,19 @@ export default function OrderDetailsPage() {
{productNames[product.productId] || "Loading..."}
</TableCell>
<TableCell className="text-right">{product.quantity}</TableCell>
<TableCell className="text-right">${product.pricePerUnit.toFixed(2)}</TableCell>
<TableCell className="text-right">${product.totalItemPrice.toFixed(2)}</TableCell>
<TableCell className="text-right">£{product.pricePerUnit.toFixed(2)}</TableCell>
<TableCell className="text-right">£{product.totalItemPrice.toFixed(2)}</TableCell>
</TableRow>
))}
<TableRow>
<TableCell colSpan={2} />
<TableCell className="text-right font-medium">Shipping ({order?.shippingMethod.type})</TableCell>
<TableCell className="text-right">${order?.shippingMethod.price.toFixed(2)}</TableCell>
<TableCell className="text-right">£{order?.shippingMethod.price.toFixed(2)}</TableCell>
</TableRow>
<TableRow>
<TableCell colSpan={2} />
<TableCell className="text-right font-bold">Total</TableCell>
<TableCell className="text-right font-bold">${order?.totalPrice.toFixed(2)}</TableCell>
<TableCell className="text-right font-bold">£{order?.totalPrice.toFixed(2)}</TableCell>
</TableRow>
</TableBody>
</Table>
@@ -576,6 +584,44 @@ export default function OrderDetailsPage() {
<CardTitle className="text-lg font-medium">Customer Details</CardTitle>
</CardHeader>
<CardContent className="space-y-4">
{(order?.telegramUsername || order?.telegramBuyerId) && (
<div className="space-y-2">
<Label className="text-sm font-medium text-zinc-500">Telegram Information</Label>
<div className="space-y-1">
{order?.telegramUsername && (
<div className="flex items-center justify-between">
<span className="text-sm text-zinc-400">Username</span>
<div className="flex items-center gap-2">
<code className="px-2 py-1 text-sm bg-zinc-950 rounded">@{order.telegramUsername}</code>
<Button
variant="outline"
size="sm"
onClick={() => copyToClipboard(order.telegramUsername || "")}
>
<Clipboard className="h-4 w-4" />
</Button>
</div>
</div>
)}
{order?.telegramBuyerId && (
<div className="flex items-center justify-between">
<span className="text-sm text-zinc-400">Buyer ID</span>
<div className="flex items-center gap-2">
<code className="px-2 py-1 text-sm bg-zinc-950 rounded">{order?.telegramBuyerId}</code>
<Button
variant="outline"
size="sm"
onClick={() => copyToClipboard(order?.telegramBuyerId?.toString() || "")}
>
<Clipboard className="h-4 w-4" />
</Button>
</div>
</div>
)}
</div>
</div>
)}
<div>
<Label className="text-sm font-medium text-zinc-500">PGP Address</Label>
<div className="flex items-start gap-2 mt-1">
@@ -741,6 +787,47 @@ export default function OrderDetailsPage() {
</CardContent>
</Card>
)}
{/* Review Card */}
{order?.review && (
<Card>
<CardHeader>
<CardTitle className="text-lg font-medium">Customer Review</CardTitle>
</CardHeader>
<CardContent className="space-y-3">
<div className="flex items-center gap-1">
{[...Array(5)].map((_, i) => (
<svg
key={i}
className={`w-4 h-4 ${
i < (order?.review?.stars || 0)
? "text-yellow-400"
: "text-zinc-600"
}`}
fill="currentColor"
viewBox="0 0 20 20"
>
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z" />
</svg>
))}
</div>
<div className="text-sm text-zinc-400">
{new Date(order?.review?.date || '').toLocaleString('en-GB', {
day: 'numeric',
month: 'short',
year: 'numeric',
hour: '2-digit',
minute: '2-digit',
second: '2-digit',
hour12: false
})}
</div>
<div className="text-sm">
{order?.review?.text}
</div>
</CardContent>
</Card>
)}
</div>
</div>
</div>