import { useState } from "react"; import { Plus, Warehouse as WarehouseIcon } from 'lucide-react'; import { Button } from "@/Components/ui/button"; import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout"; import { Head, router } from "@inertiajs/react"; import WarehouseDialog from "@/Components/Warehouse/WarehouseDialog"; import TransferOrderDialog from "@/Components/Warehouse/TransferOrderDialog"; import SearchToolbar from "@/Components/shared/SearchToolbar"; import WarehouseCard from "@/Components/Warehouse/WarehouseCard"; import WarehouseEmptyState from "@/Components/Warehouse/WarehouseEmptyState"; import { Warehouse } from "@/types/warehouse"; import Pagination from "@/Components/shared/Pagination"; import { toast } from "sonner"; import { getBreadcrumbs } from "@/utils/breadcrumb"; import { Can } from "@/Components/Permission/Can"; interface PageProps { warehouses: { data: Warehouse[]; links: any[]; current_page: number; last_page: number; total: number; }; filters: { search?: string; }; } export default function WarehouseIndex({ warehouses, filters }: PageProps) { // 篩選狀態 const [searchTerm, setSearchTerm] = useState(filters.search || ""); // 對話框狀態 const [isDialogOpen, setIsDialogOpen] = useState(false); const [editingWarehouse, setEditingWarehouse] = useState(null); const [transferOrderDialogOpen, setTransferOrderDialogOpen] = useState(false); // 搜尋處理 const handleSearch = (term: string) => { setSearchTerm(term); router.get(route('warehouses.index'), { search: term }, { preserveState: true, preserveScroll: true, replace: true, }); }; // 導航處理 const handleViewInventory = (warehouseId: string | number) => { router.get(`/warehouses/${warehouseId}/inventory`); }; // 倉庫操作處理函式 const handleAddWarehouse = () => { setEditingWarehouse(null); setIsDialogOpen(true); }; const handleEditWarehouse = (warehouse: Warehouse) => { setEditingWarehouse(warehouse); setIsDialogOpen(true); }; // 接收 Dialog 回傳的資料並呼叫後端 const handleSaveWarehouse = (data: Partial) => { if (editingWarehouse) { router.put(route('warehouses.update', editingWarehouse.id), data, { onSuccess: () => setIsDialogOpen(false), }); } else { router.post(route('warehouses.store'), data, { onSuccess: () => setIsDialogOpen(false), }); } }; const handleDeleteWarehouse = (id: string | number) => { router.delete(route('warehouses.destroy', id), { onSuccess: () => { toast.success('倉庫已刪除'); setEditingWarehouse(null); }, onError: (errors: any) => { console.error(errors); } }); }; const handleAddTransferOrder = () => { setTransferOrderDialogOpen(true); }; const handleSaveTransferOrder = (data: any) => { router.post(route('transfer-orders.store'), data, { onSuccess: () => { toast.success('撥補單已建立且庫存已轉移'); setTransferOrderDialogOpen(false); }, onError: (errors) => { toast.error('建立撥補單失敗'); console.error(errors); } }); }; return (
{/* 頁面標題 */}

倉庫管理

管理倉庫地點、負責人與庫存監控

{/* 工具列 */}
{/* 搜尋框 */}
{/* 操作按鈕 */}
{/* 倉庫卡片列表 */} {warehouses.data.length === 0 ? ( ) : (
{warehouses.data.map((warehouse) => ( 0} onViewInventory={() => handleViewInventory(warehouse.id)} onEdit={handleEditWarehouse} /> ))}
)} {/* 分頁 */}
{/* 倉庫對話框 */} {/* 撥補單對話框 */}
); }