feat(procurement): 統一採購單按鈕樣式與術語更名為「作廢」，並加強權限控管

resources/js/Components/PurchaseOrder/PurchaseOrderActions.tsx

@@ -46,28 +46,32 @@ export function PurchaseOrderActions({
                 </Button>
             </Link>
             <Can permission="purchase_orders.edit">
-                <Link href={`/purchase-orders/${order.id}/edit`}>
+                {order.status === 'draft' && (
+                    <Link href={`/purchase-orders/${order.id}/edit`}>
+                        <Button
+                            variant="outline"
+                            size="sm"
+                            className="button-outlined-primary"
+                            title="編輯"
+                        >
+                            <Pencil className="h-4 w-4" />
+                        </Button>
+                    </Link>
+                )}
+            </Can>
+            <Can permission="purchase_orders.delete">
+                {order.status === 'draft' && (
                     <Button
                         variant="outline"
                         size="sm"
-                        className="button-outlined-primary"
-                        title="編輯"
+                        className="button-outlined-error"
+                        title="刪除"
+                        onClick={() => setShowDeleteDialog(true)}
+                        disabled={processing}
                     >
-                        <Pencil className="h-4 w-4" />
+                        <Trash2 className="h-4 w-4" />
                     </Button>
-                </Link>
-            </Can>
-            <Can permission="purchase_orders.delete">
-                <Button
-                    variant="outline"
-                    size="sm"
-                    className="button-outlined-error"
-                    title="刪除"
-                    onClick={() => setShowDeleteDialog(true)}
-                    disabled={processing}
-                >
-                    <Trash2 className="h-4 w-4" />
-                </Button>
+                )}
 
                 <AlertDialog open={showDeleteDialog} onOpenChange={setShowDeleteDialog}>
                     <AlertDialogContent>

resources/js/Components/ui/button.tsx

@@ -24,6 +24,7 @@ const buttonVariants = cva(
         default: "h-9 px-4 py-2 has-[>svg]:px-3",
         sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
         lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+        xl: "h-14 px-12 text-lg font-bold rounded-xl shadow-lg transition-all hover:scale-[1.02] active:scale-[0.98] gap-2",
         icon: "size-9 rounded-md",
       },
     },