diff options
Diffstat (limited to 'lib/rfqs-tech/vendor-table')
| -rw-r--r-- | lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table-column.tsx | 2 | ||||
| -rw-r--r-- | lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table.tsx | 68 |
2 files changed, 51 insertions, 19 deletions
diff --git a/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table-column.tsx b/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table-column.tsx index bfcbe75b..f9c5d9df 100644 --- a/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table-column.tsx +++ b/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table-column.tsx @@ -14,13 +14,11 @@ export interface DataTableRowAction<TData> { } interface GetColumnsProps { - setRowAction: React.Dispatch<React.SetStateAction<DataTableRowAction<VendorData> | null>> setSelectedVendorIds: React.Dispatch<React.SetStateAction<number[]>> // Changed to array } /** getColumns: return array of ColumnDef for 'vendors' data */ export function getColumns({ - setRowAction, setSelectedVendorIds, // Changed parameter name }: GetColumnsProps): ColumnDef<VendorData>[] { return [ diff --git a/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table.tsx b/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table.tsx index e34a5052..defbac86 100644 --- a/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table.tsx +++ b/lib/rfqs-tech/vendor-table/vendor-list/vendor-list-table.tsx @@ -2,7 +2,7 @@ import * as React from "react" import { ClientDataTable } from "@/components/client-data-table/data-table" -import { DataTableRowAction, getColumns } from "./vendor-list-table-column" +import { getColumns } from "./vendor-list-table-column" import { DataTableAdvancedFilterField } from "@/types/table" import { addItemToVendors, getAllVendors } from "../../service" import { Loader2, Plus } from "lucide-react" @@ -30,27 +30,63 @@ interface VendorsListTableProps { 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) + const columns = React.useMemo( + () => getColumns({ setSelectedVendorIds }), + [setSelectedVendorIds] + ) + + // 고급 필터 필드 정의 + const advancedFilterFields: DataTableAdvancedFilterField<VendorData>[] = [ + { + id: "vendorName", + label: "Vendor Name", + type: "text", + }, + { + id: "vendorCode", + label: "Vendor Code", + type: "text", + }, + { + id: "status", + label: "Status", + type: "select", + options: [ + { label: "Active", value: "ACTIVE" }, + { label: "Inactive", value: "INACTIVE" }, + { label: "Pending", value: "PENDING" }, + ], + }, + { + id: "country", + label: "Country", + type: "text", + }, + { + id: "email", + label: "Email", + type: "text", + }, + ] + + // 초기 데이터 로드 React.useEffect(() => { - async function loadAllVendors() { + async function loadVendors() { setIsLoading(true) try { - const allVendors = await getAllVendors() - setVendors(allVendors) + const result = await getAllVendors() + + if (result.data) { + setVendors(result.data) + } } catch (error) { console.error("협력업체 목록 로드 오류:", error) toast({ @@ -62,11 +98,10 @@ export function VendorsListTable({ rfqId }: VendorsListTableProps) { setIsLoading(false) } } - loadAllVendors() + + loadVendors() }, [toast]) - const advancedFilterFields: DataTableAdvancedFilterField<VendorData>[] = [] - async function handleAddVendors() { if (selectedVendorIds.length === 0) return // Safety check @@ -100,9 +135,9 @@ export function VendorsListTable({ rfqId }: VendorsListTableProps) { setIsSubmitting(false) } } - + // If loading, show a flex container that fills the parent and centers the spinner - if (isLoading) { + if (isLoading && vendors.length === 0) { return ( <div className="flex h-full w-full items-center justify-center"> <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" /> @@ -110,7 +145,6 @@ export function VendorsListTable({ rfqId }: VendorsListTableProps) { ) } - // Otherwise, show the table return ( <ClientDataTable data={vendors} |
