"use client"

import * as React from "react"
import { type ColumnDef } from "@tanstack/react-table"
import { FileTextIcon } from "lucide-react"
import { Button } from "@/components/ui/button"
import { Badge } from "@/components/ui/badge"
import { Checkbox } from "@/components/ui/checkbox"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
import { VendorPO, VendorPOActionType } from "./types"
import { VendorPOActions } from "./vendor-po-actions"

interface GetVendorColumnsProps {
  setRowAction: React.Dispatch<React.SetStateAction<{ row: { original: VendorPO }; type: VendorPOActionType } | null>>
  selectedRows?: number[]
  onRowSelect?: (id: number, selected: boolean) => void
}

export function getVendorColumns({ setRowAction, selectedRows = [], onRowSelect }: GetVendorColumnsProps): ColumnDef<VendorPO>[] {
  return [
    // 선택 체크박스 (1개만 선택 가능)
    {
      id: "select",
      header: () => <div className="text-center">선택</div>,
      cell: ({ row }) => (
        <div className="flex justify-center">
          <Checkbox
            checked={selectedRows.includes(row.original.id)}
            onCheckedChange={(checked) => {
              if (onRowSelect) {
                onRowSelect(row.original.id, !!checked)
              }
            }}
            aria-label="행 선택"
          />
        </div>
      ),
      enableSorting: false,
      enableHiding: false,
      size: 40,
    },

    // No. (ID)
    {
      accessorKey: "id",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="No." />
      ),
      cell: ({ row }) => {
        const id = row.getValue("id") as number
        return <div className="text-sm font-mono">{id}</div>
      },
      size: 60,
    },

    // PO/계약번호
    {
      accessorKey: "contractNo",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="PO/계약번호" />
      ),
      cell: ({ row }) => {
        const contractNo = row.getValue("contractNo") as string
        return (
          <div className="font-medium">
            {contractNo}
          </div>
        )
      },
      size: 120,
    },

    // Rev. / 품번 (PO 버전)
    {
      accessorKey: "poVersion",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="Rev. / 품번" />
      ),
      cell: ({ row }) => {
        const version = row.getValue("poVersion") as number
        return <div className="text-sm font-medium">{version || '-'}</div>
      },
      size: 80,
    },

    // 계약상태
    {
      accessorKey: "contractStatus",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="계약상태" />
      ),
      cell: ({ row }) => {
        const status = row.getValue("contractStatus") as string
        return (
          <Badge variant="outline">
            {status || '-'}
          </Badge>
        )
      },
      size: 100,
    },

    // 계약종류
    {
      accessorKey: "contractType",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="계약종류" />
      ),
      cell: ({ row }) => {
        const type = row.getValue("contractType") as string
        return <Badge variant="outline">{type || '-'}</Badge>
      },
      size: 100,
    },

    // 상세품목 (버튼)
    {
      id: "itemsAction",
      header: () => <div className="text-center">상세품목</div>,
      cell: ({ row }) => (
        <div className="flex justify-center">
          <Button
            variant="outline"
            size="sm"
            className="h-8 px-2"
            onClick={() => setRowAction({ row, type: "view-items" })}
          >
            <FileTextIcon className="h-3.5 w-3.5 mr-1" />
            보기
          </Button>
        </div>
      ),
      enableSorting: false,
      size: 80,
    },

    // 프로젝트
    {
      accessorKey: "projectName",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="프로젝트" />
      ),
      cell: ({ row }) => {
        const projectName = row.getValue("projectName") as string
        return (
          <div className="max-w-[150px] truncate" title={projectName}>
            {projectName || '-'}
          </div>
        )
      },
      size: 150,
    },

    // 계약명/자재내역
    {
      accessorKey: "contractName",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="계약명/자재내역" />
      ),
      cell: ({ row }) => {
        const contractName = row.getValue("contractName") as string
        return (
          <div className="max-w-[200px] truncate" title={contractName}>
            {contractName || '-'}
          </div>
        )
      },
      size: 200,
    },

    // PO/계약기간
    {
      accessorKey: "contractPeriod",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="PO/계약기간" />
      ),
      cell: ({ row }) => {
        const period = row.getValue("contractPeriod") as string
        return (
          <div className="text-sm whitespace-nowrap">
            {period || '-'}
          </div>
        )
      },
      size: 150,
    },

    // PO/계약금액
    {
      accessorKey: "totalAmount",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="PO/계약금액" />
      ),
      cell: ({ row }) => {
        const amount = row.getValue("totalAmount") as string | number
        return <div className="text-sm text-right font-mono">{amount || '-'}</div>
      },
      size: 120,
    },

    // 계약통화
    {
      accessorKey: "currency",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="계약통화" />
      ),
      cell: ({ row }) => {
        const currency = row.getValue("currency") as string
        return <div className="text-sm font-mono">{currency || '-'}</div>
      },
      size: 80,
    },

    // 지불조건
    {
      accessorKey: "paymentTerms",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="지불조건" />
      ),
      cell: ({ row }) => {
        const terms = row.getValue("paymentTerms") as string
        return (
          <div className="max-w-[120px] truncate text-sm" title={terms}>
            {terms || '-'}
          </div>
        )
      },
      size: 120,
    },

    // Tax
    {
      accessorKey: "tax",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="Tax" />
      ),
      cell: ({ row }) => {
        const tax = row.getValue("tax") as string
        return <div className="text-sm">{tax || '-'}</div>
      },
      size: 80,
    },

    // 환율
    {
      accessorKey: "exchangeRate",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="환율" />
      ),
      cell: ({ row }) => {
        const rate = row.getValue("exchangeRate") as string
        return <div className="text-sm font-mono">{rate || '-'}</div>
      },
      size: 100,
    },

    // 인도조건
    {
      accessorKey: "deliveryTerms",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="인도조건" />
      ),
      cell: ({ row }) => {
        const terms = row.getValue("deliveryTerms") as string
        return <div className="text-sm">{terms || '-'}</div>
      },
      size: 100,
    },

    // 구매/계약담당
    {
      accessorKey: "purchaseManager",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="구매/계약담당" />
      ),
      cell: ({ row }) => {
        const manager = row.getValue("purchaseManager") as string
        return <div className="text-sm">{manager || '-'}</div>
      },
      size: 120,
    },

    // PO/계약수신일
    {
      accessorKey: "poReceiveDate",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="PO/계약수신일" />
      ),
      cell: ({ row }) => {
        const date = row.getValue("poReceiveDate") as string
        return <div className="text-sm">{date || '-'}</div>
      },
      size: 120,
    },

    // 계약체결일
    {
      accessorKey: "contractDate",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="계약체결일" />
      ),
      cell: ({ row }) => {
        const date = row.getValue("contractDate") as string
        return <div className="text-sm">{date || '-'}</div>
      },
      size: 120,
    },

    // 데이터 및 룰이 없어 구현불가한 컬럼 주석 처리 --> 안내됨
    // L/C No.
    // {
    //   accessorKey: "lcNo",
    //   header: ({ column }) => (
    //     <DataTableColumnHeaderSimple column={column} title="L/C No." />
    //   ),
    //   cell: ({ row }) => {
    //     const lcNo = row.getValue("lcNo") as string
    //     return <div className="text-sm">{lcNo || '-'}</div>
    //   },
    //   size: 120,
    // },

    // 납품대금 연동제 대상
    {
      accessorKey: "priceIndexTarget",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="납품대금 연동제 대상" />
      ),
      cell: ({ row }) => {
        const target = row.getValue("priceIndexTarget") as string | boolean
        return <div className="text-sm">{target?.toString() || '-'}</div>
      },
      size: 140,
    },

    // 연계 PO/계약번호
    {
      accessorKey: "linkedContractNo",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="연계 PO/계약번호" />
      ),
      cell: ({ row }) => {
        const linkedNo = row.getValue("linkedContractNo") as string
        return <div className="text-sm">{linkedNo || '-'}</div>
      },
      size: 140,
    },

    // 최종수정일
    {
      accessorKey: "lastModifiedDate",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="최종수정일" />
      ),
      cell: ({ row }) => {
        const date = row.getValue("lastModifiedDate") as string
        return <div className="text-sm">{date || '-'}</div>
      },
      size: 120,
    },

    // 최종수정자
    {
      accessorKey: "lastModifiedBy",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="최종수정자" />
      ),
      cell: ({ row }) => {
        const user = row.getValue("lastModifiedBy") as string
        return <div className="text-sm">{user || '-'}</div>
      },
      size: 120,
    },

    // 액션 버튼들
    {
      id: "actions",
      enableHiding: false,
      header: () => <div className="text-center">액션</div>,
      cell: ({ row }) => <VendorPOActions row={row} setRowAction={setRowAction} />,
      size: 120,
      minSize: 100,
    },
  ]
}