path: root/lib/avl/table/avl-table-columns.tsx

import { Checkbox } from "@/components/ui/checkbox"
import { Button } from "@/components/ui/button"
import { Badge } from "@/components/ui/badge"
import { Eye, Edit, Trash2, History } from "lucide-react"
import { type ColumnDef } from "@tanstack/react-table"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
import { AvlListItem } from "../types"

interface GetColumnsProps {
  selectedRows?: number[]
  onRowSelect?: (id: number, selected: boolean) => void
}

// 테이블 메타 타입 확장
declare module "@tanstack/react-table" {
  interface TableMeta<TData> {
    onCellUpdate?: (id: string, field: keyof TData, newValue: string | boolean) => Promise<void>
    onCellCancel?: (id: string, field: keyof TData) => void
    onAction?: (action: string, data?: Partial<AvlListItem>) => void
    onSaveEmptyRow?: (tempId: string) => Promise<void>
    onCancelEmptyRow?: (tempId: string) => void
    isEmptyRow?: (id: string) => boolean
  }
}

// 테이블 컬럼 정의 함수
export function getColumns({ selectedRows = [], onRowSelect }: GetColumnsProps): ColumnDef<AvlListItem>[] {
  const columns: ColumnDef<AvlListItem>[] = [
    // 기본 정보 그룹
    {
      header: "AVL 정보",
      columns: [
      {
        id: "select",
        header: () => <div className="text-center">선택</div>,
        cell: ({ row }) => (
          <div className="flex justify-center">
            <Checkbox
              checked={selectedRows.includes(row.original.id)}
              onCheckedChange={(checked) => {
                onRowSelect?.(row.original.id, !!checked)
              }}
              aria-label="행 선택"
              className="translate-y-[2px]"
            />
          </div>
        ),
        enableSorting: false,
        enableHiding: false,
        size: 40,
      },
      {
        accessorKey: "no",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="No" />
        ),
        cell: ({ getValue }) => <div className="text-center">{getValue() as number}</div>,
        size: 60,
      },
      {
        accessorKey: "isTemplate",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="AVL 분류" />
        ),
        cell: ({ getValue }) => {
          const value = getValue() as boolean
          return (
            <div className="text-center">
              {value ? "표준 AVL" : "프로젝트 AVL"}
            </div>
          )
        },
        size: 120,
      },
      {
        accessorKey: "constructionSector",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="공사부문" />
        ),
        cell: ({ getValue }) => {
          const value = getValue() as string
          return (
            <div className="text-center">
              {value}
            </div>
          )
        },
        size: 100,
      },
      {
        accessorKey: "projectCode",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="프로젝트 코드" />
        ),
        cell: ({ getValue }) => {
          const value = getValue() as string
          return (
            <div className="text-center">
              {value}
            </div>
          )
        },
        size: 140,
      },
      {
        accessorKey: "shipType",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="선종" />
        ),
        cell: ({ getValue }) => {
          const value = getValue() as string
          return (
            <div className="text-center">
              {value}
            </div>
          )
        },
        size: 100,
      },
      {
        accessorKey: "avlKind",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="AVL 종류" />
        ),
        cell: ({ getValue }) => {
          const value = getValue() as string
          return (
            <div className="text-center">
              {value}
            </div>
          )
        },
        size: 120,
      },
      {
        accessorKey: "htDivision",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="H/T 구분" />
        ),
        cell: ({ getValue }) => {
          const value = getValue() as string
          return (
            <div className="text-center">
              {value}
            </div>
          )
        },
        size: 80,
      },
      {
        accessorKey: "rev",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="Rev" />
        ),
        cell: ({ getValue, row, table }) => {
          const value = getValue() as number
          return (
            <div className="flex items-center gap-1">
              <Badge variant="outline" className="font-mono">
                {value || 1}
              </Badge>
              <Button
                variant="ghost"
                size="sm"
                className="h-6 w-6 p-0"
                onClick={() => table.options.meta?.onAction?.('view-history', row.original)}
                title="리비전 히스토리 보기"
              >
                <History className="h-3 w-3" />
              </Button>
            </div>
          )
        },
        size: 100,
      },
    ],
  },

  // 집계 그룹
  {
    header: "등록정보",
    columns: [
      {
        accessorKey: "PKG",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="PKG" />
        ),
      },
      {
        accessorKey: "materialGroup",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="자재그룹" />
        ),
      },
      {
        accessorKey: "vendor",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="협력업체" />
        ),
      },
      {
        accessorKey: "Tier",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="Tier" />
        ),
      },
      {
        accessorKey: "ownerSuggestion",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="선주 제안" />
        ),
      },
      {
        accessorKey: "shiSuggestion",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="SHI 제안" />
        ),
      },
    ],
  },

  // 등록 정보 그룹
  {
    header: "작성정보",
    columns: [
      {
        accessorKey: "createdAt",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="등록일" />
        ),
        cell: ({ getValue }) => {
          const date = getValue() as string
          return <div className="text-center text-sm">{date}</div>
        },
        size: 100,
      },
      {
        accessorKey: "createdBy",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="등록자" />
        ),
        cell: ({ getValue }) => {
          const date = getValue() as string
          return <div className="text-center text-sm">{date}</div>
        },
        size: 100,
      },
      {
        accessorKey: "updatedAt",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="최종변경일" />
        ),
        cell: ({ getValue }) => {
          const date = getValue() as string
          return <div className="text-center text-sm">{date}</div>
        },
        size: 100,
      },
      {
        accessorKey: "updatedBy",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="최종변경자" />
        ),
        cell: ({ getValue }) => {
          const date = getValue() as string
          return <div className="text-center text-sm">{date}</div>
        },
        size: 100,
      },
    ],
  },

  // 액션 그룹
  {
    id: "actions",
    header: "액션",
    columns: [
      {
        id: "actions",
        header: () => <div className="text-center">액션</div>,
        cell: ({ row, table }) => {
          const isEmptyRow = table.options.meta?.isEmptyRow?.(row.id) || false

          if (isEmptyRow) {
            return (
              <div className="flex items-center justify-center gap-1">
                <Button
                  variant="ghost"
                  size="sm"
                  onClick={() => table.options.meta?.onSaveEmptyRow?.(row.id)}
                  className="h-8 w-8 p-0"
                >
                  저장
                </Button>
                <Button
                  variant="ghost"
                  size="sm"
                  onClick={() => table.options.meta?.onCancelEmptyRow?.(row.id)}
                  className="h-8 w-8 p-0 text-destructive hover:text-destructive"
                >
                  취소
                </Button>
              </div>
            )
          }

          return (
            <div className="flex items-center justify-center gap-1">
              <Button
                variant="ghost"
                size="sm"
                onClick={() => table.options.meta?.onAction?.("view-detail", { id: row.original.id })}
                className="h-8 w-8 p-0"
                title="상세보기"
              >
                <Eye className="h-4 w-4" />
              </Button>
            </div>
          )
        },
        enableSorting: false,
        enableHiding: false,
        size: 120,
      },
      ],
    },
  ]

  return columns
}