diff options
Diffstat (limited to 'lib/tech-vendors/rfq-history-table/tech-vendor-rfq-history-table.tsx')
| -rw-r--r-- | lib/tech-vendors/rfq-history-table/tech-vendor-rfq-history-table.tsx | 120 |
1 files changed, 120 insertions, 0 deletions
diff --git a/lib/tech-vendors/rfq-history-table/tech-vendor-rfq-history-table.tsx b/lib/tech-vendors/rfq-history-table/tech-vendor-rfq-history-table.tsx new file mode 100644 index 00000000..642c2d9c --- /dev/null +++ b/lib/tech-vendors/rfq-history-table/tech-vendor-rfq-history-table.tsx @@ -0,0 +1,120 @@ +"use client"
+
+import * as React from "react"
+import type {
+ DataTableAdvancedFilterField,
+ DataTableFilterField,
+ DataTableRowAction,
+} from "@/types/table"
+
+import { toSentenceCase } from "@/lib/utils"
+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 { getColumns, type TechVendorRfqHistoryRow } from "./tech-vendor-rfq-history-table-columns"
+import { getTechVendorRfqHistory } from "../service"
+import { TechVendorRfqHistoryTableToolbarActions } from "./tech-vendor-rfq-history-table-toolbar-actions"
+import { getRFQStatusIcon } from "@/lib/tasks/utils"
+import { TooltipProvider } from "@/components/ui/tooltip"
+
+interface TechVendorRfqHistoryTableProps {
+ promises: Promise<
+ [
+ Awaited<ReturnType<typeof getTechVendorRfqHistory>>,
+ ]
+ >
+}
+
+export function TechVendorRfqHistoryTable({ promises }: TechVendorRfqHistoryTableProps) {
+ const [{ data, pageCount }] = React.use(promises)
+
+ const [rowAction, setRowAction] = React.useState<DataTableRowAction<TechVendorRfqHistoryRow> | null>(null)
+
+ // rowAction 처리 (향후 확장 가능)
+ React.useEffect(() => {
+ if (rowAction?.type === "update") {
+ // TODO: 상세보기 모달 등 구현
+ console.log("View details for:", rowAction.row.original)
+ setRowAction(null)
+ }
+ }, [rowAction])
+
+ const columns = React.useMemo(() => getColumns({
+ setRowAction,
+ }), [setRowAction]);
+
+ const filterFields: DataTableFilterField<TechVendorRfqHistoryRow>[] = [
+ {
+ id: "rfqCode",
+ label: "RFQ 코드",
+ placeholder: "RFQ 코드 검색...",
+ },
+ {
+ id: "status",
+ label: "상태",
+ options: ["DRAFT", "PUBLISHED", "EVALUATION", "AWARDED"].map((status) => ({
+ label: toSentenceCase(status),
+ value: status,
+ icon: getRFQStatusIcon(status as "DRAFT" | "PUBLISHED" | "EVALUATION" | "AWARDED"),
+ })),
+ },
+ {
+ id: "projectCode",
+ label: "프로젝트 코드",
+ placeholder: "프로젝트 코드 검색...",
+ }
+ ]
+
+ const advancedFilterFields: DataTableAdvancedFilterField<TechVendorRfqHistoryRow>[] = [
+ { id: "rfqCode", label: "RFQ 코드", type: "text" },
+ { id: "description", label: "RFQ 제목", type: "text" },
+ { id: "projectCode", label: "프로젝트 코드", type: "text" },
+ { id: "projectName", label: "프로젝트명", type: "text" },
+ {
+ id: "status",
+ label: "상태",
+ type: "multi-select",
+ options: ["DRAFT", "PUBLISHED", "EVALUATION", "AWARDED"].map((status) => ({
+ label: toSentenceCase(status),
+ value: status,
+ icon: getRFQStatusIcon(status as "DRAFT" | "PUBLISHED" | "EVALUATION" | "AWARDED"),
+ })),
+ },
+ { id: "dueDate", label: "마감일", type: "date" },
+ { id: "createdAt", label: "생성일", type: "date" },
+ ]
+
+ const { table } = useDataTable({
+ data,
+ columns,
+ pageCount,
+ filterFields,
+ enablePinning: true,
+ enableAdvancedFilter: true,
+ initialState: {
+ sorting: [{ id: "createdAt", desc: true }],
+ columnPinning: { right: ["actions"] },
+ },
+ getRowId: (originalRow) => String(originalRow.id),
+ shallow: true,
+ clearOnDefault: true,
+ })
+
+ return (
+ <>
+ <TooltipProvider>
+ <DataTable
+ table={table}
+ >
+ <DataTableAdvancedToolbar
+ table={table}
+ filterFields={advancedFilterFields}
+ shallow={false}
+ >
+ <TechVendorRfqHistoryTableToolbarActions table={table} />
+ </DataTableAdvancedToolbar>
+ </DataTable>
+ </TooltipProvider>
+ </>
+ )
+}
\ No newline at end of file |
