From fefca6304eefea94f41057f9f934b0e19ceb54bb Mon Sep 17 00:00:00 2001 From: 0-Zz-ang Date: Fri, 22 Aug 2025 13:47:37 +0900 Subject: (박서영)Compliance 설문/응답 리스트 생성 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../table/compliance-survey-templates-columns.tsx | 176 +++++++++++++++++++++ 1 file changed, 176 insertions(+) create mode 100644 lib/compliance/table/compliance-survey-templates-columns.tsx (limited to 'lib/compliance/table/compliance-survey-templates-columns.tsx') diff --git a/lib/compliance/table/compliance-survey-templates-columns.tsx b/lib/compliance/table/compliance-survey-templates-columns.tsx new file mode 100644 index 00000000..a5919447 --- /dev/null +++ b/lib/compliance/table/compliance-survey-templates-columns.tsx @@ -0,0 +1,176 @@ +"use client"; + +import * as React from "react"; +import { type ColumnDef } from "@tanstack/react-table"; +import { format } from "date-fns"; +import { ko } from "date-fns/locale"; +import { Badge } from "@/components/ui/badge"; +import { Button } from "@/components/ui/button"; +import { Checkbox } from "@/components/ui/checkbox"; +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuTrigger, + DropdownMenuShortcut, +} from "@/components/ui/dropdown-menu"; +import { MoreHorizontal, Eye, Edit, Trash2 } from "lucide-react"; +import type { DataTableRowAction } from "@/types/table"; +import { complianceSurveyTemplates } from "@/db/schema/compliance"; +import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"; + +interface GetColumnsProps { + setRowAction: React.Dispatch | null>>; +} + +export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef[] { + // ---------------------------------------------------------------- + // 1) select 컬럼 (체크박스) + // ---------------------------------------------------------------- + const selectColumn: ColumnDef = { + id: "select", + header: ({ table }) => ( + table.toggleAllPageRowsSelected(!!value)} + aria-label="Select all" + className="translate-y-0.5" + /> + ), + cell: ({ row }) => ( + row.toggleSelected(!!value)} + aria-label="Select row" + className="translate-y-0.5" + /> + ), + size: 40, + enableSorting: false, + enableHiding: false, + }; + + // ---------------------------------------------------------------- + // 2) actions 컬럼 (Dropdown 메뉴) + // ---------------------------------------------------------------- + const actionsColumn: ColumnDef = { + id: "actions", + header: "작업", + enableHiding: false, + cell: ({ row }) => { + const template = row.original; + + return ( + + + + + + setRowAction({ type: 'update', row: row })}> + + Edit + + setRowAction({ type: 'delete', row: row })}> + + Delete + ⌘⌫ + + window.location.href = `/evcp/compliance/${template.id}`}> + + Detail + + + + ); + }, + size: 40, + }; + + // ---------------------------------------------------------------- + // 3) 일반 컬럼들 (정렬 가능) + // ---------------------------------------------------------------- + const dataColumns: ColumnDef[] = [ + { + accessorKey: "name", + header: ({ column }) => ( + + ), + cell: ({ row }) => ( +
{row.getValue("name")}
+ ), + enableResizing: true, + }, + { + accessorKey: "description", + header: ({ column }) => ( + + ), + cell: ({ row }) => ( +
{row.getValue("description")}
+ ), + enableResizing: true, + }, + { + accessorKey: "version", + header: ({ column }) => ( + + ), + cell: ({ row }) => ( + {row.getValue("version")} + ), + enableResizing: true, + }, + { + accessorKey: "isActive", + header: ({ column }) => ( + + ), + cell: ({ row }) => { + const isActive = row.getValue("isActive") as boolean; + return ( + + {isActive ? "활성" : "비활성"} + + ); + }, + enableResizing: true, + }, + { + accessorKey: "createdAt", + header: ({ column }) => ( + + ), + cell: ({ row }) => { + const date = row.getValue("createdAt") as Date; + return date ? format(new Date(date), 'yyyy-MM-dd', { locale: ko }) : '-'; + }, + enableResizing: true, + }, + { + accessorKey: "updatedAt", + header: ({ column }) => ( + + ), + cell: ({ row }) => { + const date = row.getValue("updatedAt") as Date; + return date ? format(new Date(date), 'yyyy-MM-dd', { locale: ko }) : '-'; + }, + enableResizing: true, + }, + ]; + + // ---------------------------------------------------------------- + // 4) 최종 컬럼 배열: select, dataColumns, actions + // ---------------------------------------------------------------- + return [ + selectColumn, + ...dataColumns, + actionsColumn, + ]; +} -- cgit v1.2.3