From 1a2241c40e10193c5ff7008a7b7b36cc1d855d96 Mon Sep 17 00:00:00 2001
From: joonhoekim <26rote@gmail.com>
Date: Tue, 25 Mar 2025 15:55:45 +0900
Subject: initial commit

---
 .../vendor-table/vendor-list/vendor-list-table.tsx | 142 +++++++++++++++++++++
 1 file changed, 142 insertions(+)
 create mode 100644 lib/rfqs/vendor-table/vendor-list/vendor-list-table.tsx

(limited to 'lib/rfqs/vendor-table/vendor-list/vendor-list-table.tsx')

diff --git a/lib/rfqs/vendor-table/vendor-list/vendor-list-table.tsx b/lib/rfqs/vendor-table/vendor-list/vendor-list-table.tsx
new file mode 100644
index 00000000..c436eebd
--- /dev/null
+++ b/lib/rfqs/vendor-table/vendor-list/vendor-list-table.tsx
@@ -0,0 +1,142 @@
+"use client"
+
+import * as React from "react"
+import { ClientDataTable } from "@/components/client-data-table/data-table"
+import { DataTableRowAction, getColumns } from "./vendor-list-table-column"
+import { DataTableAdvancedFilterField } from "@/types/table"
+import { addItemToVendors, getAllVendors } from "../../service"
+import { Loader2, Plus } from "lucide-react"
+import { Button } from "@/components/ui/button"
+import { useToast } from "@/hooks/use-toast"
+
+export interface VendorData {
+  id: number
+  vendorName: string
+  vendorCode: string | null
+  taxId: string
+  address: string | null
+  country: string | null
+  phone: string | null
+  email: string | null
+  website: string | null
+  status: string
+  createdAt: Date
+  updatedAt: Date
+}
+
+interface VendorsListTableProps {
+  rfqId: number
+}
+
+export function VendorsListTable({ rfqId }: VendorsListTableProps) {
+  const { toast } = useToast()
+  const [rowAction, setRowAction] =
+    React.useState<DataTableRowAction<VendorData> | null>(null)
+  
+  // Changed to array for multiple selection
+  const [selectedVendorIds, setSelectedVendorIds] = React.useState<number[]>([])
+  const [isSubmitting, setIsSubmitting] = React.useState(false)
+  
+  const columns = React.useMemo(
+    () => getColumns({ setRowAction, setSelectedVendorIds }),
+    [setRowAction, setSelectedVendorIds]
+  )
+  
+  const [vendors, setVendors] = React.useState<VendorData[]>([])
+  const [isLoading, setIsLoading] = React.useState(false)
+  
+  React.useEffect(() => {
+    async function loadAllVendors() {
+      setIsLoading(true)
+      try {
+        const allVendors = await getAllVendors()
+        setVendors(allVendors)
+      } catch (error) {
+        console.error("벤더 목록 로드 오류:", error)
+        toast({
+          title: "Error",
+          description: "Failed to load vendors",
+          variant: "destructive",
+        })
+      } finally {
+        setIsLoading(false)
+      }
+    }
+    loadAllVendors()
+  }, [toast])
+  
+  const advancedFilterFields: DataTableAdvancedFilterField<VendorData>[] = []
+  
+  async function handleAddVendors() {
+    if (selectedVendorIds.length === 0) return // Safety check
+    
+    setIsSubmitting(true)
+    try {
+      // Update to use the multiple vendor service
+      const result = await addItemToVendors(rfqId, selectedVendorIds)
+      
+      if (result.success) {
+        toast({
+          title: "Success",
+          description: `Added items to ${selectedVendorIds.length} vendors`,
+        })
+        // Reset selection after successful addition
+        setSelectedVendorIds([])
+      } else {
+        toast({
+          title: "Error",
+          description: result.error || "Failed to add items to vendors",
+          variant: "destructive",
+        })
+      }
+    } catch (err) {
+      console.error("Failed to add vendors:", err)
+      toast({
+        title: "Error",
+        description: "An unexpected error occurred",
+        variant: "destructive",
+      })
+    } finally {
+      setIsSubmitting(false)
+    }
+  }
+  
+  // If loading, show a flex container that fills the parent and centers the spinner
+  if (isLoading) {
+    return (
+      <div className="flex h-full w-full items-center justify-center">
+        <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
+      </div>
+    )
+  }
+  
+  // Otherwise, show the table
+  return (
+    <ClientDataTable
+      data={vendors}
+      columns={columns}
+      advancedFilterFields={advancedFilterFields}
+    >
+      <div className="flex items-center gap-2">
+        <Button 
+          variant="default" 
+          size="sm"
+          onClick={handleAddVendors}
+          disabled={selectedVendorIds.length === 0 || isSubmitting}
+        >
+          {isSubmitting ? (
+            <>
+              <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+              Adding...
+            </>
+          ) : (
+            <>
+              <Plus className="mr-2 h-4 w-4" />
+              Add Vendors ({selectedVendorIds.length})
+            </>
+          )}
+        </Button>
+      </div>
+    </ClientDataTable>
+  )
+}
\ No newline at end of file
-- 
cgit v1.2.3