first commit

source-code/ERP(B-ba)-廠商管理/src/App.tsx

@@ -0,0 +1,93 @@
+/**
+ * 應用程式主元件
+ */
+
+import { useState } from "react";
+import NavigationSidebar from "./components/NavigationSidebar";
+import VendorManagement from "./components/VendorManagement/VendorManagement";
+import VendorDetail from "./components/VendorManagement/VendorDetail";
+import { Toaster } from "./components/ui/sonner";
+import { useVendors } from "./hooks/useVendors";
+import { mockSuppliers } from "./data/mockSuppliers";
+import { mockProducts } from "./data/mockProducts";
+import { ROUTES } from "./constants/app";
+
+export default function App() {
+  const [currentPage, setCurrentPage] = useState(ROUTES.VENDOR_MANAGEMENT);
+  const [selectedVendorId, setSelectedVendorId] = useState<string | null>(null);
+  
+  const {
+    suppliers,
+    addSupplier,
+    updateSupplier,
+    deleteSupplier,
+    addSupplyProduct,
+    updateSupplyProduct,
+    removeSupplyProduct,
+  } = useVendors(mockSuppliers, mockProducts);
+
+  // 處理查看廠商詳情
+  const handleViewVendorDetail = (vendorId: string) => {
+    setSelectedVendorId(vendorId);
+    setCurrentPage("vendor-detail");
+  };
+
+  // 處理返回廠商列表
+  const handleBackToVendorList = () => {
+    setSelectedVendorId(null);
+    setCurrentPage(ROUTES.VENDOR_MANAGEMENT);
+  };
+
+  // 處理導航
+  const handleNavigate = (path: string) => {
+    setSelectedVendorId(null);
+    setCurrentPage(path);
+  };
+
+  // 取得選中的廠商
+  const selectedVendor = selectedVendorId 
+    ? suppliers.find(s => s.id === selectedVendorId) 
+    : null;
+
+  // 渲染當前頁面
+  const renderPage = () => {
+    // 廠商詳情頁
+    if (currentPage === "vendor-detail" && selectedVendor) {
+      return (
+        <VendorDetail
+          supplier={selectedVendor}
+          products={mockProducts}
+          onBack={handleBackToVendorList}
+          onAddSupplyProduct={addSupplyProduct}
+          onUpdateSupplyProduct={updateSupplyProduct}
+          onRemoveSupplyProduct={removeSupplyProduct}
+        />
+      );
+    }
+
+    // 廠商管理頁面
+    return (
+      <VendorManagement
+        suppliers={suppliers}
+        products={mockProducts}
+        onAddSupplier={addSupplier}
+        onUpdateSupplier={updateSupplier}
+        onDeleteSupplier={deleteSupplier}
+        onViewDetail={handleViewVendorDetail}
+      />
+    );
+  };
+
+  return (
+    <div className="flex min-h-screen bg-background">
+      {/* 側邊欄導航 */}
+      <NavigationSidebar currentPath={currentPage} onNavigate={handleNavigate} />
+
+      {/* 主要內容區 */}
+      <main className="flex-1 overflow-auto">{renderPage()}</main>
+
+      {/* Toast 通知 */}
+      <Toaster />
+    </div>
+  );
+}