import { useState, useEffect } from "react"; import { Plus, Package, Search, RotateCcw, ChevronDown, ChevronUp } from 'lucide-react'; import { Button } from "@/Components/ui/button"; import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout"; import { Head, router, Link } from "@inertiajs/react"; import Pagination from "@/Components/shared/Pagination"; import { Can } from "@/Components/Permission/Can"; import { SearchableSelect } from "@/Components/ui/searchable-select"; import { Input } from "@/Components/ui/input"; import { Label } from "@/Components/ui/label"; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@/Components/ui/table"; import { StatusBadge } from "@/Components/shared/StatusBadge"; interface Props { orders: { data: any[]; links: any[]; }; filters: { search?: string; status?: string; }; warehouses: { id: number; name: string }[]; } export default function ShippingOrderIndex({ orders, filters, warehouses }: Props) { const [search, setSearch] = useState(filters.search || ""); const [status, setStatus] = useState(filters.status || "all"); const handleFilter = () => { router.get( route('delivery-notes.index'), { search, status: status === 'all' ? undefined : status, }, { preserveState: true, replace: true } ); }; const handleReset = () => { setSearch(""); setStatus("all"); router.get(route('delivery-notes.index')); }; const getStatusBadge = (status: string) => { switch (status) { case 'draft': return 草稿; case 'completed': return 已過帳; case 'cancelled': return 已取消; default: return {status}; } }; return (

出貨單管理

建立出貨單並執行過帳扣庫存

setSearch(e.target.value)} className="pl-10 h-9 block" onKeyDown={(e) => e.key === 'Enter' && handleFilter()} />
出貨單號 客戶名稱 倉庫 出貨日期 總金額 狀態 建立者 操作 {orders.data.length > 0 ? ( orders.data.map((order) => ( {order.doc_no} {order.customer_name || '-'} {order.warehouse_name} {order.shipping_date} ${Number(order.grand_total).toLocaleString()} {getStatusBadge(order.status)} {order.creator_name} )) ) : ( 尚無出貨單資料 )}
); }