1 files changed, 90 insertions, 0 deletions
diff --git a/lib/basic-contract/status-detail/basic-contracts-detail-table.tsx b/lib/basic-contract/status-detail/basic-contracts-detail-table.tsx
new file mode 100644
index 00000000..2698842e
--- /dev/null
+++ b/lib/basic-contract/status-detail/basic-contracts-detail-table.tsx
@@ -0,0 +1,90 @@
+"use client"
+
+import * as React from "react"
+import { DataTable } from "@/components/data-table/data-table"
+import { useDataTable } from "@/hooks/use-data-table"
+import { DataTableAdvancedToolbar } from "@/components/data-table/data-table-advanced-toolbar"
+import type {
+    DataTableAdvancedFilterField,
+    DataTableRowAction,
+} from "@/types/table"
+import { getDetailColumns } from "./basic-contracts-detail-columns"
+import { getBasicContractsByTemplateId } from "@/lib/basic-contract/service"
+import { BasicContractView } from "@/db/schema"
+import { BasicContractDetailTableToolbarActions } from "./basic-contract-detail-table-toolbar-actions"
+
+interface BasicContractsDetailTableProps {
+    templateId: number
+    promises: Promise<
+        [
+            Awaited<ReturnType<typeof getBasicContractsByTemplateId>>,
+        ]
+    >
+}
+
+export function BasicContractsDetailTable({ templateId, promises }: BasicContractsDetailTableProps) {
+    const [rowAction, setRowAction] =
+        React.useState<DataTableRowAction<BasicContractView> | null>(null)
+
+    const [{ data, pageCount }] = React.use(promises)
+
+    console.log(data,"data")
+
+    const columns = React.useMemo(
+        () => getDetailColumns({ setRowAction }),
+        [setRowAction]
+    )
+
+    const advancedFilterFields: DataTableAdvancedFilterField<BasicContractView>[] = [
+        { id: "vendorName", label: "업체명", type: "text" },
+        { id: "vendorCode", label: "업체코드", type: "text" },
+        {
+            id: "status",
+            label: "진행상태",
+            type: "select",
+            options: [
+                { label: "발송완료", value: "PENDING" },
+                { label: "협력업체 서명완료", value: "VENDOR_SIGNED" },
+                { label: "구매팀 서명완료", value: "BUYER_SIGNED" },
+                { label: "법무검토 요청", value: "LEGAL_REVIEW_REQUESTED" },
+                { label: "법무검토 완료", value: "LEGAL_REVIEW_COMPLETED" },
+                { label: "계약완료", value: "COMPLETED" },
+                { label: "거절됨", value: "REJECTED" },
+            ]
+        },
+        { id: "requestedByName", label: "요청자", type: "text" },
+        { id: "createdAt", label: "요청일", type: "date" },
+        { id: "deadline", label: "마감일", type: "date" },
+        { id: "vendorSignedAt", label: "협력업체 서명일", type: "date" },
+        { id: "buyerSignedAt", label: "구매팀 서명일", type: "date" },
+        { id: "completedAt", label: "계약완료일", type: "date" },
+    ]
+
+    const { table } = useDataTable({
+        data,
+        columns,
+        pageCount,
+        enablePinning: true,
+        enableAdvancedFilter: true,
+        initialState: {
+            sorting: [{ id: "createdAt", desc: true }],
+            columnPinning: { right: ["actions"] },
+        },
+        getRowId: (originalRow) => String(originalRow.id),
+        shallow: false,
+        clearOnDefault: true,
+    })
+
+    return (
+        <>
+            <DataTable table={table}>
+                <DataTableAdvancedToolbar
+                    table={table}
+                    filterFields={advancedFilterFields}
+                >
+                    <BasicContractDetailTableToolbarActions table={table} />
+                </DataTableAdvancedToolbar>
+            </DataTable>
+        </>
+    )
+}
+\ No newline at end of file