feat: 統一進貨單 UI、修復庫存異動紀錄與廠商詳情顯示報錯

2026-01-27 17:23:31 +08:00
parent a7c445bd3f
commit 95d8dc2e84
24 changed files with 1613 additions and 466 deletions
--- a/resources/js/Components/Inventory/GoodsReceiptActions.tsx
+++ b/resources/js/Components/Inventory/GoodsReceiptActions.tsx
@@ -0,0 +1,101 @@
+import { useState } from "react";
+import { Eye, Trash2 } from "lucide-react";
+import { Button } from "@/Components/ui/button";
+import { Link, useForm } from "@inertiajs/react";
+import { toast } from "sonner";
+import { Can } from "@/Components/Permission/Can";
+import {
+    AlertDialog,
+    AlertDialogAction,
+    AlertDialogCancel,
+    AlertDialogContent,
+    AlertDialogDescription,
+    AlertDialogFooter,
+    AlertDialogHeader,
+    AlertDialogTitle,
+} from "@/Components/ui/alert-dialog";
+
+export interface GoodsReceipt {
+    id: number;
+    code: string;
+    warehouse_id: number;
+    warehouse?: { name: string };
+    vendor_id?: number;
+    vendor?: { name: string };
+    received_date: string;
+    status: string;
+    type?: string;
+    items_sum_total_amount?: number;
+    user?: { name: string };
+}
+
+export default function GoodsReceiptActions({
+    receipt,
+}: { receipt: GoodsReceipt }) {
+    const [showDeleteDialog, setShowDeleteDialog] = useState(false);
+    const { delete: destroy, processing } = useForm({});
+
+    const handleConfirmDelete = () => {
+        // @ts-ignore
+        destroy(route('goods-receipts.destroy', receipt.id), {
+            onSuccess: () => {
+                toast.success("進貨單已成功刪除");
+                setShowDeleteDialog(false);
+            },
+            onError: (errors: any) => toast.error(errors.error || "刪除過程中發生錯誤"),
+        });
+    };
+
+    return (
+        <div className="flex justify-center gap-2">
+            <Link href={route('goods-receipts.show', receipt.id)}>
+                <Button
+                    variant="outline"
+                    size="sm"
+                    className="button-outlined-primary"
+                    title="查看詳情"
+                >
+                    <Eye className="h-4 w-4" />
+                </Button>
+            </Link>
+
+            {/* Delete typically restricted for Goods Receipts, checking permission */}
+            <Can permission="goods_receipts.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>
+                        <AlertDialogHeader>
+                            <AlertDialogTitle>確認刪除進貨單</AlertDialogTitle>
+                            <AlertDialogDescription>
+                                確定要刪除進貨單 「{receipt.code}」 嗎？
+                                <br />
+                                <span className="text-red-500 font-bold mt-2 block">
+                                    注意：刪除進貨單將會扣除已入庫的庫存數量！
+                                </span>
+                            </AlertDialogDescription>
+                        </AlertDialogHeader>
+                        <AlertDialogFooter>
+                            <AlertDialogCancel className="button-outlined-primary">取消</AlertDialogCancel>
+                            <AlertDialogAction
+                                onClick={handleConfirmDelete}
+                                className="button-filled-error"
+                            >
+                                確認刪除
+                            </AlertDialogAction>
+                        </AlertDialogFooter>
+                    </AlertDialogContent>
+                </AlertDialog>
+            </Can>
+        </div>
+    );
+}