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 --- lib/vendor-document-list/table/doc-table.tsx | 110 +++++++++++++++++++++++++++ 1 file changed, 110 insertions(+) create mode 100644 lib/vendor-document-list/table/doc-table.tsx (limited to 'lib/vendor-document-list/table/doc-table.tsx') diff --git a/lib/vendor-document-list/table/doc-table.tsx b/lib/vendor-document-list/table/doc-table.tsx new file mode 100644 index 00000000..f70ce365 --- /dev/null +++ b/lib/vendor-document-list/table/doc-table.tsx @@ -0,0 +1,110 @@ +"use client" + +import * as React from "react" +import type { + DataTableAdvancedFilterField, + DataTableFilterField, + DataTableRowAction, +} from "@/types/table" + +import { useDataTable } from "@/hooks/use-data-table" +import { DataTable } from "@/components/data-table/data-table" +import { getColumns } from "./doc-table-column" +import { getVendorDocuments } from "../service" +import { DocumentStagesView } from "@/db/schema/vendorDocu" +import { useEffect } from "react" +import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar" +import { DocTableToolbarActions } from "./doc-table-toolbar-actions" +import { DeleteDocumentsDialog } from "./delete-docs-dialog" + +interface DocumentListTableProps { + promises: Promise<[Awaited>]> + selectedPackageId: number + projectType: "ship" | "plant"; +} + +export function DocumentsTable({ + promises, + selectedPackageId, + projectType, +}: DocumentListTableProps) { + // 1) 데이터를 가져옴 (server component -> use(...) pattern) + const [{ data, pageCount }] = React.use(promises) + + console.log(data) + + const [rowAction, setRowAction] = React.useState | null>(null) + + + + const columns = React.useMemo( + () => getColumns({ setRowAction }), + [setRowAction] + ) + + // Filter fields + const filterFields: DataTableFilterField[] = [] + + const advancedFilterFields: DataTableAdvancedFilterField[] = [ + { + id: "docNumber", + label: "Doc Number", + type: "text", + }, + { + id: "title", + label: "Doc Title", + type: "text", + }, + { + id: "createdAt", + label: "Created at", + type: "date", + }, + { + id: "updatedAt", + label: "Updated at", + type: "date", + }, + ] + + // useDataTable 훅으로 react-table 구성 + const { table } = useDataTable({ + data: data, // <-- 여기서 tableData 사용 + columns, + pageCount, + filterFields, + enablePinning: true, + enableAdvancedFilter: true, + initialState: { + sorting: [{ id: "createdAt", desc: true }], + columnPinning: { right: ["actions"] }, + }, + getRowId: (originalRow) => String(originalRow.documentId), + shallow: false, + clearOnDefault: true, + columnResizeMode: "onEnd", + + }) + return ( + <> + + + + + + + setRowAction(null)} + documents={rowAction?.row.original ? [rowAction?.row.original] : []} + showTrigger={false} + onSuccess={() => rowAction?.row.toggleSelected(false)} + /> + + ) +} \ No newline at end of file -- cgit v1.2.3