import { Checkbox } from "@/components/ui/checkbox"
import { Badge } from "@/components/ui/badge"
import { type ColumnDef } from "@tanstack/react-table"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
import type { AvlDetailItem } from "../types"


// 테이블 컬럼 정의
export const columns: ColumnDef<AvlDetailItem>[] = [
  // 선택 컬럼
  // {
  //   id: "select",
  //   header: ({ table }) => (
  //     <Checkbox
  //       checked={
  //         table.getIsAllPageRowsSelected() ||
  //         (table.getIsSomePageRowsSelected() && "indeterminate")
  //       }
  //       onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
  //       aria-label="모든 행 선택"
  //     />
  //   ),
  //   cell: ({ row }) => (
  //     <Checkbox
  //       checked={row.getIsSelected()}
  //       onCheckedChange={(value) => row.toggleSelected(!!value)}
  //       aria-label="행 선택"
  //     />
  //   ),
  //   size: 50,
  //   enableSorting: false,
  //   enableHiding: false,
  // },
  // 기본 정보 그룹
  {
    header: "기본 정보",
    columns: [
      {
        accessorKey: "no",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="No." />
        ),
        size: 60,
      },
      {
        accessorKey: "equipBulkDivision",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="Equip/Bulk 구분" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("equipBulkDivision") as string
          return (
            <Badge variant="outline">
              {value || "-"}
            </Badge>
          )
        },
        size: 120,
      },
      {
        accessorKey: "disciplineName",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="설계공종" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("disciplineName") as string
          return <span>{value || "-"}</span>
        },
        size: 120,
      },
      {
        accessorKey: "materialNameCustomerSide",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="고객사 AVL 자재명" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("materialNameCustomerSide") as string
          return <span>{value || "-"}</span>
        },
        size: 150,
      },
      {
        accessorKey: "packageName",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="패키지 정보" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("packageName") as string
          return <span>{value || "-"}</span>
        },
        size: 130,
      },
      {
        accessorKey: "materialGroupCode",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="자재그룹코드" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("materialGroupCode") as string
          return <span>{value || "-"}</span>
        },
        size: 120,
      },
      {
        accessorKey: "materialGroupName",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="자재그룹명" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("materialGroupName") as string
          return <span>{value || "-"}</span>
        },
        size: 130,
      },
      {
        accessorKey: "vendorCode",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="협력업체코드" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("vendorCode") as string
          return <span>{value || "-"}</span>
        },
        size: 120,
      },
      {
        accessorKey: "vendorName",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="협력업체명" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("vendorName") as string
          return <span className="font-medium">{value || "-"}</span>
        },
        size: 140,
      },
      {
        accessorKey: "avlVendorName",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="AVL 등재업체명" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("avlVendorName") as string
          return <span>{value || "-"}</span>
        },
        size: 140,
      },
      {
        accessorKey: "tier",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="등급 (Tier)" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("tier") as string
          if (!value) return <span>-</span>
          
          const tierColor = {
            "Tier 1": "bg-green-100 text-green-800",
            "Tier 2": "bg-yellow-100 text-yellow-800", 
            "Tier 3": "bg-red-100 text-red-800"
          }[value] || "bg-gray-100 text-gray-800"
          
          return (
            <Badge className={tierColor}>
              {value}
            </Badge>
          )
        },
        size: 100,
      },
    ],
  },
  // FA 정보 그룹
  {
    header: "FA 정보",
    columns: [
      {
        accessorKey: "faTarget",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="FA 대상" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("faTarget") as boolean
          return (
            <Badge variant={value ? "default" : "secondary"}>
              {value ? "대상" : "비대상"}
            </Badge>
          )
        },
        size: 80,
      },
      {
        accessorKey: "faStatus",
        header: ({ column }) => (
          <DataTableColumnHeaderSimple column={column} title="FA 현황" />
        ),
        cell: ({ row }) => {
          const value = row.getValue("faStatus") as string
          return <span>{value || "-"}</span>
        },
        size: 100,
      },
    ],
  },
  // SHI Qualification 그룹
  {
    header: "SHI Qualification",
    columns: [
      {
        accessorKey: "shiAvl",
        header: "AVL",
        cell: ({ row }) => {
          const value = row.getValue("shiAvl") as boolean
          return (
            <Checkbox
              checked={value}
              disabled
              aria-label="SHI AVL 등재 여부"
            />
          )
        },
        size: 80,
      },
      {
        accessorKey: "shiBlacklist",
        header: "Blacklist",
        cell: ({ row }) => {
          const value = row.getValue("shiBlacklist") as boolean
          return (
            <Checkbox
              checked={value}
              disabled
              aria-label="SHI Blacklist 등재 여부"
            />
          )
        },
        size: 100,
      },
      {
        accessorKey: "shiBcc",
        header: "BCC",
        cell: ({ row }) => {
          const value = row.getValue("shiBcc") as boolean
          return (
            <Checkbox
              checked={value}
              disabled
              aria-label="SHI BCC 등재 여부"
            />
          )
        },
        size: 80,
      },
    ],
  },
]