大海
25 lines
925 B
TypeScript
25 lines
925 B
TypeScript
import type { Product } from "@/types";
|
|
import { Card } from "@/components/ui/Card";
|
|
|
|
interface ProductCardProps {
|
|
product: Product;
|
|
onClick?: () => void;
|
|
}
|
|
|
|
export function ProductCard({ product, onClick }: ProductCardProps) {
|
|
return (
|
|
<Card onClick={onClick} className="overflow-hidden p-0">
|
|
<div className="aspect-square bg-gray-100 flex items-center justify-center text-4xl">
|
|
{product.images?.[0] ? <img src={product.images[0]} alt={product.title} className="w-full h-full object-cover" /> : "📦"}
|
|
</div>
|
|
<div className="p-3">
|
|
<h3 className="font-medium text-sm text-gray-800 truncate">{product.title}</h3>
|
|
<div className="flex items-center justify-between mt-1">
|
|
<span className="text-red-500 font-bold">¥{product.price}</span>
|
|
<span className="text-xs text-gray-400">库存 {product.stock}</span>
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
);
|
|
}
|