/** * 查看採購單詳情頁面 */ import { ArrowLeft, ShoppingCart, Send, CheckCircle, XCircle, RotateCcw } from "lucide-react"; import { Button } from "@/Components/ui/button"; import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout"; import { Head, Link, useForm, usePage, router } from "@inertiajs/react"; import { StatusProgressBar } from "@/Components/PurchaseOrder/StatusProgressBar"; import PurchaseOrderStatusBadge from "@/Components/PurchaseOrder/PurchaseOrderStatusBadge"; import CopyButton from "@/Components/shared/CopyButton"; import { PurchaseOrderItemsTable } from "@/Components/PurchaseOrder/PurchaseOrderItemsTable"; import type { PurchaseOrder } from "@/types/purchase-order"; import { formatCurrency, formatDateTime } from "@/utils/format"; import { getShowBreadcrumbs } from "@/utils/breadcrumb"; import { toast } from "sonner"; import { PageProps } from "@/types/global"; interface Props { order: PurchaseOrder; } export default function ViewPurchaseOrderPage({ order }: Props) { return (

{/* Header */}

查看採購單

單號：{order.poNumber}

{/* 狀態流程條 */}

{/* 基本資訊與品項 */}

{/* 基本資訊卡片 */}

基本資訊

採購單編號

{order.poNumber}

供應商 {order.supplierName}

申請單位 (申請人) {order.warehouse_name} ({order.createdBy})

建立日期 {formatDateTime(order.createdAt)}

下單日期 {order.orderDate || "-"}

預計到貨日期 {order.expectedDate || "-"}

{order.remark && (

備註

{order.remark}

)}

{/* 發票資訊卡片 */} {(order.invoiceNumber || order.invoiceDate || (order.invoiceAmount !== null && order.invoiceAmount !== undefined)) && (

發票資訊

{order.invoiceNumber && (

發票號碼

{order.invoiceNumber}

)} {order.invoiceDate && (

發票日期 {order.invoiceDate}

)} {order.invoiceAmount !== null && order.invoiceAmount !== undefined && (

發票金額 {formatCurrency(order.invoiceAmount)}

)}

)} {/* 採購項目卡片 */}

採購項目清單

小計 {formatCurrency(order.totalAmount)}

稅額 {formatCurrency(order.taxAmount || 0)}

總計 (含稅) {formatCurrency(order.grandTotal || (order.totalAmount + (order.taxAmount || 0)))}

{/* 操作按鈕 (底部) */}

); } function PurchaseOrderActions({ order }: { order: PurchaseOrder }) { const { auth } = usePage().props; const permissions = auth.user?.permissions || []; const { processing } = useForm({ status: order.status, }); const handleUpdateStatus = (newStatus: string, actionName: string) => { const formData = { vendor_id: order.supplierId, warehouse_id: order.warehouse_id, order_date: order.orderDate, expected_delivery_date: order.expectedDate ? new Date(order.expectedDate).toISOString().split('T')[0] : null, items: order.items.map((item: any) => ({ productId: item.productId, quantity: item.quantity, unitId: item.unitId, subtotal: item.subtotal, })), tax_amount: order.taxAmount, status: newStatus, remark: order.remark || "", }; router.patch(route('purchase-orders.update', order.id), formData, { onSuccess: () => toast.success(`採購單已${actionName === '取消' ? '作廢' : actionName}`), onError: (errors: any) => { console.error("Status Update Error:", errors); toast.error(errors.error || "操作失敗"); } }); }; // 權限判斷 (包含超級管理員檢查) const isSuperAdmin = auth.user?.roles?.some((r: any) => r.name === 'super-admin'); const canApprove = isSuperAdmin || permissions.includes('purchase_orders.approve'); const canCancel = isSuperAdmin || permissions.includes('purchase_orders.cancel'); const canEdit = isSuperAdmin || permissions.includes('purchase_orders.edit'); const canView = isSuperAdmin || permissions.includes('purchase_orders.view'); // 送審權限：擁有檢視或編輯權限的人都可以送審 const canSubmit = canEdit || canView; return (

{['draft', 'pending', 'approved'].includes(order.status) && canCancel && ( )} {order.status === 'pending' && canApprove && ( )}

{order.status === 'draft' && canSubmit && ( )} {order.status === 'pending' && canApprove && ( )}

); }