|
|
@@ -4,7 +4,7 @@ import { useForm } from 'react-hook-form';
|
|
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
|
import { format } from 'date-fns';
|
|
|
import { toast } from 'sonner';
|
|
|
-import { Search, Edit, Eye } from 'lucide-react';
|
|
|
+import { Search, Edit, Eye, Package } from 'lucide-react';
|
|
|
|
|
|
// 使用共享UI组件包的具体路径导入
|
|
|
import { Button } from '@d8d/shared-ui-components/components/ui/button';
|
|
|
@@ -670,6 +670,61 @@ export const OrderManagement = () => {
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
+ {/* 订单商品信息 */}
|
|
|
+ <div>
|
|
|
+ <h4 className="font-medium mb-3 flex items-center gap-2">
|
|
|
+ <Package className="h-4 w-4" />
|
|
|
+ 订单商品
|
|
|
+ </h4>
|
|
|
+ <div className="border rounded-md overflow-hidden">
|
|
|
+ <div className="bg-muted px-4 py-2 border-b">
|
|
|
+ <div className="grid grid-cols-12 gap-4 text-sm font-medium">
|
|
|
+ <div className="col-span-5">商品信息</div>
|
|
|
+ <div className="col-span-2 text-center">单价</div>
|
|
|
+ <div className="col-span-2 text-center">数量</div>
|
|
|
+ <div className="col-span-3 text-right">小计</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="divide-y">
|
|
|
+ {selectedOrder.orderGoods?.map((item, index) => (
|
|
|
+ <div key={item.id || index} className="px-4 py-3">
|
|
|
+ <div className="grid grid-cols-12 gap-4 items-center">
|
|
|
+ <div className="col-span-5 flex items-center gap-3">
|
|
|
+ {item.imageFile && (
|
|
|
+ <img
|
|
|
+ src={item.imageFile.fullUrl}
|
|
|
+ alt={item.goodsName}
|
|
|
+ className="w-12 h-12 rounded-md object-cover"
|
|
|
+ />
|
|
|
+ )}
|
|
|
+ <div>
|
|
|
+ <p className="font-medium text-sm">{item.goodsName}</p>
|
|
|
+ {item.specification && (
|
|
|
+ <p className="text-xs text-muted-foreground">{item.specification}</p>
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className="col-span-2 text-center text-sm">
|
|
|
+ {formatAmount(item.price)}
|
|
|
+ </div>
|
|
|
+ <div className="col-span-2 text-center text-sm">
|
|
|
+ {item.num}
|
|
|
+ </div>
|
|
|
+ <div className="col-span-3 text-right text-sm font-medium">
|
|
|
+ {formatAmount(item.price * item.num)}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ ))}
|
|
|
+ </div>
|
|
|
+ {selectedOrder.orderGoods?.length === 0 && (
|
|
|
+ <div className="text-center py-8 text-muted-foreground">
|
|
|
+ 暂无商品信息
|
|
|
+ </div>
|
|
|
+ )}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
{selectedOrder.remark && (
|
|
|
<div>
|
|
|
<h4 className="font-medium mb-2">管理员备注</h4>
|