diff options
Diffstat (limited to 'lib/edp-progress/table/edp-progress-table-columns.tsx')
| -rw-r--r-- | lib/edp-progress/table/edp-progress-table-columns.tsx | 108 |
1 files changed, 108 insertions, 0 deletions
diff --git a/lib/edp-progress/table/edp-progress-table-columns.tsx b/lib/edp-progress/table/edp-progress-table-columns.tsx new file mode 100644 index 00000000..dc0e87e2 --- /dev/null +++ b/lib/edp-progress/table/edp-progress-table-columns.tsx @@ -0,0 +1,108 @@ +"use client"; +import * as React from "react"; +import { type ColumnDef } from "@tanstack/react-table"; +import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"; +import { Badge } from "@/components/ui/badge"; + +export type EDPVendorRow = { + vendorId: number; + vendorName: string; + totalForms: number; + totalTags: number; + totalRequiredFields: number; + totalFilledFields: number; + completionPercentage: number; +}; + +function renderCompletionBadge(value: number | string | undefined) { + const num = typeof value === "string" ? Number(value) : (value ?? 0); + + // Show '-' for vendors with no EDP data (0% completion) + if (num === 0) { + return ( + <Badge variant="outline"> + - + </Badge> + ); + } + + const variant: "success" | "secondary" | "destructive" = + num >= 80 ? "success" : num >= 50 ? "secondary" : "destructive"; + return ( + <Badge variant={variant}>{num}%</Badge> + ); +} + +export function getColumns(): ColumnDef<EDPVendorRow>[] { + const cols: ColumnDef<EDPVendorRow>[] = [ + { + accessorKey: "vendorName", + header: ({ column }) => ( + <DataTableColumnHeaderSimple column={column} title={"벤더명"} /> + ), + cell: ({ row }) => row.getValue("vendorName") as string, + meta: { excelHeader: "Vendor Name" }, + enableResizing: true, + size: 80, + minSize: 50, + maxSize: 150, + }, + { + accessorKey: "totalForms", + header: ({ column }) => ( + <DataTableColumnHeaderSimple column={column} title={"폼 개수"} /> + ), + cell: ({ row }) => String(row.getValue("totalForms") ?? 0), + meta: { excelHeader: "Total Forms" }, + size: 30, + minSize: 30, + maxSize: 120, + }, + { + accessorKey: "totalTags", + header: ({ column }) => ( + <DataTableColumnHeaderSimple column={column} title={"태그 개수"} /> + ), + cell: ({ row }) => String(row.getValue("totalTags") ?? 0), + meta: { excelHeader: "Total Tags" }, + size: 30, + minSize: 30, + maxSize: 120, + }, + { + accessorKey: "totalRequiredFields", + header: ({ column }) => ( + <DataTableColumnHeaderSimple column={column} title={"전체 필드"} /> + ), + cell: ({ row }) => String(row.getValue("totalRequiredFields") ?? 0), + meta: { excelHeader: "Total Required Fields" }, + size: 30, + minSize: 30, + maxSize: 120, + }, + { + accessorKey: "totalFilledFields", + header: ({ column }) => ( + <DataTableColumnHeaderSimple column={column} title={"입력 필드"} /> + ), + cell: ({ row }) => String(row.getValue("totalFilledFields") ?? 0), + meta: { excelHeader: "Total Filled Fields" }, + size: 30, + minSize: 30, + maxSize: 120, + }, + { + accessorKey: "completionPercentage", + header: ({ column }) => ( + <DataTableColumnHeaderSimple column={column} title={"완성도(%)"} /> + ), + cell: ({ row }) => renderCompletionBadge(row.getValue("completionPercentage") as number | string), + meta: { excelHeader: "Completion %" }, + size: 30, + minSize: 30, + maxSize: 120, + }, + ]; + + return cols; +} |
