feat: add void action to inventory count index

resources/js/Pages/Inventory/Count/Show.tsx

@@ -1,5 +1,5 @@
 import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
-import { Head, useForm, Link } from '@inertiajs/react'; // Added Link
+import { Head, useForm, Link, router } from '@inertiajs/react'; // Added Link
 import {
     Table,
     TableBody,
@@ -56,11 +56,9 @@ export default function Show({ doc }: any) {
     };
 
     const handleReopen = () => {
-        if (confirm('確定要取消核准嗎？單據將回復為盤點中狀態，且庫存異動將被撤回（若已過帳）。')) {
-            router.visit(route('inventory.count.reopen', [doc.id]), {
-                method: 'put',
-            });
-        }
+        router.visit(route('inventory.count.reopen', [doc.id]), {
+            method: 'put',
+        });
     }
 
     const isCompleted = doc.status === 'completed';
@@ -123,16 +121,31 @@ export default function Show({ doc }: any) {
 
                             {isCompleted && (
                                 <Can permission="inventory.adjust">
-                                    <Button
-                                        variant="outline"
-                                        size="sm"
-                                        className="button-outlined-error"
-                                        onClick={handleReopen}
-                                        disabled={processing}
-                                    >
-                                        <RotateCcw className="w-4 h-4 mr-2" />
-                                        取消核准
-                                    </Button>
+                                    <AlertDialog>
+                                        <AlertDialogTrigger asChild>
+                                            <Button
+                                                variant="outline"
+                                                size="sm"
+                                                className="button-outlined-error"
+                                                disabled={processing}
+                                            >
+                                                <RotateCcw className="w-4 h-4 mr-2" />
+                                                取消核准
+                                            </Button>
+                                        </AlertDialogTrigger>
+                                        <AlertDialogContent>
+                                            <AlertDialogHeader>
+                                                <AlertDialogTitle>確定要取消核准嗎？</AlertDialogTitle>
+                                                <AlertDialogDescription>
+                                                    單據將回復為「盤點中」狀態，若已產生庫存異動將被撤回。此動作可讓您重新編輯盤點數量。
+                                                </AlertDialogDescription>
+                                            </AlertDialogHeader>
+                                            <AlertDialogFooter>
+                                                <AlertDialogCancel>取消</AlertDialogCancel>
+                                                <AlertDialogAction onClick={handleReopen} className="bg-red-600 hover:bg-red-700">確認取消核准</AlertDialogAction>
+                                            </AlertDialogFooter>
+                                        </AlertDialogContent>
+                                    </AlertDialog>
                                 </Can>
                             )}