/**
 * 庫存統計資訊元件
 */

interface InventoryStatsProps {
    totalItems: number;
    totalQuantity: number;
    lowStockItems: number;
}

export default function InventoryStats({
    totalItems,
    totalQuantity,
    lowStockItems,
}: InventoryStatsProps) {
    return (
        <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
            <div className="bg-white p-4 rounded-lg border shadow-sm">
                <p className="text-sm text-gray-500">在庫品項</p>
                <p className="text-2xl font-bold">{totalItems} 項</p>
            </div>
            <div className="bg-white p-4 rounded-lg border shadow-sm">
                <p className="text-sm text-gray-500">在庫總量</p>
                <p className="text-2xl font-bold">{totalQuantity.toLocaleString()} 個</p>
            </div>
            <div className="bg-white p-4 rounded-lg border shadow-sm">
                <p className="text-sm text-gray-500 font-medium text-red-600">低庫存告警</p>
                <p className="text-2xl font-bold text-red-600">{lowStockItems} 項</p>
            </div>
        </div>
    );
}