first commit

resources/js/Components/Warehouse/Inventory/InventoryStats.tsx

@@ -0,0 +1,32 @@
+/**
+ * 庫存統計資訊元件
+ */
+
+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>
+    );
+}