diff options
Diffstat (limited to 'lib/b-rfq/attachment/attachment-table.tsx')
| -rw-r--r-- | lib/b-rfq/attachment/attachment-table.tsx | 190 |
1 files changed, 190 insertions, 0 deletions
diff --git a/lib/b-rfq/attachment/attachment-table.tsx b/lib/b-rfq/attachment/attachment-table.tsx new file mode 100644 index 00000000..4c547000 --- /dev/null +++ b/lib/b-rfq/attachment/attachment-table.tsx @@ -0,0 +1,190 @@ +"use client" + +import * as React from "react" +import { type DataTableAdvancedFilterField, type DataTableFilterField } from "@/types/table" +import { useDataTable } from "@/hooks/use-data-table" +import { DataTable } from "@/components/data-table/data-table" +import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar" +import { VendorResponsesPanel } from "./vendor-responses-panel" +import { Separator } from "@/components/ui/separator" +import { FileText } from "lucide-react" +import { getRfqAttachments, getVendorResponsesForAttachment } from "../service" +import { getAttachmentColumns } from "./attachment-columns" +import { RfqAttachmentsTableToolbarActions } from "./attachment-toolbar-action" + +interface RfqAttachmentsTableProps { + promises: Promise<Awaited<ReturnType<typeof getRfqAttachments>>> + rfqId: number +} + +export function RfqAttachmentsTable({ promises, rfqId }: RfqAttachmentsTableProps) { + const { data, pageCount } = React.use(promises) + + // 선택된 첨부파일과 벤더 응답 데이터 + const [selectedAttachment, setSelectedAttachment] = React.useState<any>(null) + const [vendorResponses, setVendorResponses] = React.useState<any[]>([]) + const [isLoadingResponses, setIsLoadingResponses] = React.useState(false) + + const columns = React.useMemo( + () => getAttachmentColumns({ + onSelectAttachment: setSelectedAttachment + }), + [] + ) + + // 첨부파일 선택 시 벤더 응답 데이터 로드 + React.useEffect(() => { + if (!selectedAttachment) { + setVendorResponses([]) + return + } + + const loadVendorResponses = async () => { + setIsLoadingResponses(true) + try { + const responses = await getVendorResponsesForAttachment( + selectedAttachment.id, + 'INITIAL' // 또는 현재 RFQ 상태에 따라 결정 + ) + setVendorResponses(responses) + } catch (error) { + console.error('Failed to load vendor responses:', error) + setVendorResponses([]) + } finally { + setIsLoadingResponses(false) + } + } + + loadVendorResponses() + }, [selectedAttachment]) + + /** + * 필터 필드 정의 + */ + const filterFields: DataTableFilterField<any>[] = [ + { + id: "fileName", + label: "파일명", + placeholder: "파일명으로 검색...", + }, + { + id: "attachmentType", + label: "문서 타입", + options: [ + { label: "구매 문서", value: "구매", count: 0 }, + { label: "설계 문서", value: "설계", count: 0 }, + ], + }, + { + id: "fileType", + label: "파일 형식", + options: [ + { label: "PDF", value: "pdf", count: 0 }, + { label: "Excel", value: "xlsx", count: 0 }, + { label: "Word", value: "docx", count: 0 }, + { label: "기타", value: "기타", count: 0 }, + ], + }, + ] + + /** + * 고급 필터 필드 + */ + const advancedFilterFields: DataTableAdvancedFilterField<any>[] = [ + { + id: "fileName", + label: "파일명", + type: "text", + }, + { + id: "originalFileName", + label: "원본 파일명", + type: "text", + }, + { + id: "serialNo", + label: "시리얼 번호", + type: "text", + }, + { + id: "description", + label: "설명", + type: "text", + }, + { + id: "attachmentType", + label: "문서 타입", + type: "multi-select", + options: [ + { label: "구매 문서", value: "구매" }, + { label: "설계 문서", value: "설계" }, + ], + }, + { + id: "fileType", + label: "파일 형식", + type: "multi-select", + options: [ + { label: "PDF", value: "pdf" }, + { label: "Excel", value: "xlsx" }, + { label: "Word", value: "docx" }, + { label: "기타", value: "기타" }, + ], + }, + { + id: "createdAt", + label: "등록일", + type: "date", + }, + ] + + const { table } = useDataTable({ + data, + columns, + pageCount, + filterFields, + enableAdvancedFilter: true, + initialState: { + sorting: [{ id: "createdAt", desc: true }], + columnPinning: { right: ["actions"] }, + }, + getRowId: (originalRow) => originalRow.id.toString(), + shallow: false, + clearOnDefault: true, + }) + + return ( + <div className="space-y-6"> + {/* 메인 테이블 */} + <div className="h-full w-full"> + <DataTable table={table} className="h-full"> + <DataTableAdvancedToolbar + table={table} + filterFields={advancedFilterFields} + shallow={false} + > + <RfqAttachmentsTableToolbarActions table={table} rfqId={rfqId} /> + </DataTableAdvancedToolbar> + </DataTable> + </div> + + {/* 벤더 응답 현황 패널 */} + {selectedAttachment && ( + <> + <Separator /> + <VendorResponsesPanel + attachment={selectedAttachment} + responses={vendorResponses} + isLoading={isLoadingResponses} + onRefresh={() => { + // 새로고침 로직 + if (selectedAttachment) { + setSelectedAttachment({ ...selectedAttachment }) + } + }} + /> + </> + )} + </div> + ) +}
\ No newline at end of file |