UI優化: 全系統狀態標籤 (StatusBadge) 統一化重構完成 (Phase 3 & 4)

resources/js/Pages/Production/Show.tsx

@@ -10,7 +10,7 @@ import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout";
 import { Head, Link, useForm, router } from "@inertiajs/react";
 import { getBreadcrumbs } from "@/utils/breadcrumb";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/Components/ui/table";
-import { Badge } from "@/Components/ui/badge";
+import { StatusBadge } from "@/Components/shared/StatusBadge";
 import ProductionOrderStatusBadge from '@/Components/ProductionOrder/ProductionOrderStatusBadge';
 import { ProductionStatusProgressBar } from '@/Components/ProductionOrder/ProductionStatusProgressBar';
 import { PRODUCTION_ORDER_STATUS, ProductionOrderStatus } from '@/constants/production-order';
@@ -348,9 +348,9 @@ export default function ProductionShow({ productionOrder, warehouses, auth }: Pr
                             <Link2 className="h-5 w-5 text-primary-main" />
                             原料耗用與追溯
                         </h2>
-                        <Badge variant="outline" className="text-grey-3 font-medium">
+                        <StatusBadge variant="neutral" className="text-grey-3 font-medium">
                             共 {productionOrder.items.length} 項物料
-                        </Badge>
+                        </StatusBadge>
                     </div>
 
                     {productionOrder.items.length === 0 ? (