import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout"; import { Head, Link } from "@inertiajs/react"; import { PageProps } from "@/types/global"; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@/Components/ui/table"; import { Button } from "@/Components/ui/button"; import { StatusBadge } from "@/Components/shared/StatusBadge"; import { ArrowLeft, FileText, Package } from "lucide-react"; import Pagination from "@/Components/shared/Pagination"; import { formatDate } from "@/utils/format"; interface Transaction { id: number; inventory_id: number; type: string; quantity: number; unit_cost: number; total_cost: number; actual_time: string; note: string | null; batch_no: string | null; user_id: number; created_at: string; warehouse_name: string; user_name: string; } interface ShowProps extends PageProps { product: { id: number; code: string; name: string; unit_name: string; }; transactions: { data: Transaction[]; links: any[]; total: number; from: number; to: number; current_page: number; last_page: number; per_page: number; }; filters: { date_from: string; date_to: string; warehouse_id: string; }; /** 報表頁面的完整篩選狀態（用於返回時恢復） */ reportFilters: { date_from: string; date_to: string; warehouse_id: string; category_id: string; search: string; per_page: string; report_page: string; }; warehouses: { id: number; name: string }[]; } export default function InventoryReportShow({ product, transactions, filters, reportFilters, warehouses }: ShowProps) { // 類型 Badge 顏色映射 // 類型 Badge 顏色映射 const getTypeBadgeVariant = (type: string): "success" | "destructive" | "neutral" => { switch (type) { case '入庫': case '手動入庫': case '調撥入庫': return "success"; case '出庫': case '調撥出庫': return "destructive"; default: return "neutral"; } }; return (
{/* 返回按鈕 */}
{/* 頁面標題 */}

庫存異動明細

查看商品「{product.name}」的所有庫存異動紀錄

{/* 商品資訊 & 篩選條件卡片 */}
{/* 商品資訊 */}

{product.name}

{product.code}
單位: {product.unit_name}
{/* 目前篩選條件 (唯讀) */}

目前篩選條件

日期範圍: {filters.date_from && filters.date_to ? `${filters.date_from} ~ ${filters.date_to}` : filters.date_from ? `${filters.date_from} 起` : filters.date_to ? `${filters.date_to} 止` : '全部期間'}
倉庫: {filters.warehouse_id ? warehouses.find(w => w.id.toString() === filters.warehouse_id)?.name || '未指定' : '全部倉庫'}
{/* 異動紀錄表格 */}

異動紀錄

共 {transactions.total} 筆紀錄
# 異動時間 類型 倉庫 異動數量 批號 經手人 備註 {transactions.data.length === 0 ? ( 無符合條件的資料 ) : ( transactions.data.map((tx, index) => ( {(transactions.from || 0) + index} {formatDate(tx.actual_time)} {tx.type} {tx.warehouse_name} 0 ? 'text-emerald-600' : tx.quantity < 0 ? 'text-red-600' : 'text-gray-500' }`}> {tx.quantity > 0 ? '+' : ''}{tx.quantity} {tx.batch_no || '-'} {tx.user_name || '-'} {tx.note || '-'} )) )}
{/* 底部分頁列 */}
共 {transactions.total} 筆紀錄
); }