"use client"

import * as React from "react"
import { ColumnDef } from "@tanstack/react-table"
import { Badge } from "@/components/ui/badge"
import { Button } from "@/components/ui/button"
import { Checkbox } from "@/components/ui/checkbox"
import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header"
import { type ApprovalLog } from "../service"
import { formatDate } from "@/lib/utils"
import { MoreHorizontal, Eye } from "lucide-react"
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuItem,
  DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu"

interface GetColumnsProps {
  setRowAction: React.Dispatch<React.SetStateAction<{
    type: "view";
    row: { original: ApprovalLog };
  } | null>>;
}

export function getColumns({ setRowAction }: GetColumnsProps): ColumnDef<ApprovalLog>[] {
  return [
    {
      id: "select",
      header: ({ table }) => (
        <Checkbox
          checked={
            table.getIsAllPageRowsSelected() ||
            (table.getIsSomePageRowsSelected() && "indeterminate")
          }
          onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
          aria-label="Select all"
          className="translate-y-[2px]"
        />
      ),
      cell: ({ row }) => (
        <Checkbox
          checked={row.getIsSelected()}
          onCheckedChange={(value) => row.toggleSelected(!!value)}
          aria-label="Select row"
          className="translate-y-[2px]"
        />
      ),
      enableSorting: false,
      enableHiding: false,
    },
    {
      accessorKey: "apInfId",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="결재 ID" />
      ),
      cell: ({ row }) => {
        const apInfId = row.getValue("apInfId") as string;
        return (
          <div className="flex space-x-2">
            <span className="max-w-[150px] truncate font-mono text-sm">
              {apInfId}
            </span>
          </div>
        )
      },
    },
    {
      accessorKey: "subject",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="결재 제목" />
      ),
      cell: ({ row }) => {
        return (
          <div className="flex space-x-2">
            <span className="max-w-[300px] truncate font-medium">
              {row.getValue("subject")}
            </span>
          </div>
        )
      },
    },
    {
      accessorKey: "status",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="상태" />
      ),
      cell: ({ row }) => {
        const status = row.getValue("status") as string;
        
        // 클라이언트 측에서 상태 텍스트 변환
        const getStatusText = (status: string) => {
          const statusMap: Record<string, string> = {
            '-3': '암호화실패',
            '-2': '암호화중',
            '-1': '예약상신',
            '0': '보류',
            '1': '진행중',
            '2': '완결',
            '3': '반려',
            '4': '상신취소',
            '5': '전결',
            '6': '후완결'
          };
          return statusMap[status] || '알 수 없음';
        };

        const getStatusVariant = (status: string) => {
          switch (status) {
            case '2': return 'default'; // 완결
            case '3': return 'destructive'; // 반려
            case '4': return 'destructive'; // 상신취소
            case '5': return 'default'; // 전결
            case '6': return 'default'; // 후완결
            case '1': return 'secondary'; // 진행중
            default: return 'outline'; // 기타
          }
        };

        return (
          <div className="flex space-x-2">
            <Badge variant={getStatusVariant(status)}>
              {getStatusText(status)}
            </Badge>
          </div>
        )
      },
    },
    {
      accessorKey: "userId",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="사용자 ID" />
      ),
      cell: ({ row }) => {
        return (
          <div className="flex space-x-2">
            <span className="max-w-[120px] truncate">
              {row.getValue("userId") || "-"}
            </span>
          </div>
        )
      },
    },
    {
      accessorKey: "emailAddress",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="이메일" />
      ),
      cell: ({ row }) => {
        return (
          <div className="flex space-x-2">
            <span className="max-w-[200px] truncate">
              {row.getValue("emailAddress")}
            </span>
          </div>
        )
      },
    },
    {
      accessorKey: "sbmDt",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="상신일시" />
      ),
      cell: ({ row }) => {
        const sbmDt = row.getValue("sbmDt") as string;
        if (!sbmDt) return <span>-</span>;

        // YYYYMMDDHHMMSS 형식을 YYYY-MM-DD HH:MM:SS로 변환
        const formatted = sbmDt.replace(
          /(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/,
          '$1-$2-$3 $4:$5:$6'
        );

        return (
          <div className="flex space-x-2">
            <span className="max-w-[150px] truncate">
              {formatted}
            </span>
          </div>
        )
      },
    },
    {
      accessorKey: "urgYn",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="긴급" />
      ),
      cell: ({ row }) => {
        const urgYn = row.getValue("urgYn") as string;
        if (urgYn === 'Y') {
          return (
            <div className="flex space-x-2">
              <Badge variant="destructive">긴급</Badge>
            </div>
          );
        }
        return <span>-</span>;
      },
    },
    {
      accessorKey: "docSecuType",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="보안등급" />
      ),
      cell: ({ row }) => {
        const docSecuType = row.getValue("docSecuType") as string;
        const getSecurityVariant = (type: string) => {
          switch (type) {
            case 'CONFIDENTIAL_STRICT': return 'destructive';
            case 'CONFIDENTIAL': return 'secondary';
            default: return 'outline';
          }
        };

        const getSecurityText = (type: string) => {
          switch (type) {
            case 'CONFIDENTIAL_STRICT': return '극비';
            case 'CONFIDENTIAL': return '기밀';
            case 'PERSONAL': return '개인';
            default: return type || '개인';
          }
        };

        return (
          <div className="flex space-x-2">
            <Badge variant={getSecurityVariant(docSecuType)}>
              {getSecurityText(docSecuType)}
            </Badge>
          </div>
        )
      },
    },
    {
      accessorKey: "createdAt",
      header: ({ column }) => (
        <DataTableColumnHeaderSimple column={column} title="생성일" />
      ),
      cell: ({ row }) => {
        return (
          <div className="flex space-x-2">
            <span className="max-w-[150px] truncate">
              {formatDate(row.getValue("createdAt"))}
            </span>
          </div>
        )
      },
    },
    {
      id: "actions",
      cell: ({ row }) => {
        return (
          <DropdownMenu>
            <DropdownMenuTrigger asChild>
              <Button
                aria-label="Open menu"
                variant="ghost"
                className="flex size-8 p-0 data-[state=open]:bg-muted"
              >
                <MoreHorizontal className="size-4" aria-hidden="true" />
              </Button>
            </DropdownMenuTrigger>
            <DropdownMenuContent align="end" className="w-40">
              <DropdownMenuItem
                onClick={() => {
                  setRowAction({ type: "view", row });
                }}
              >
                <Eye className="mr-2 size-4" aria-hidden="true" />
                상세보기
              </DropdownMenuItem>
            </DropdownMenuContent>
          </DropdownMenu>
        );
      },
      enableSorting: false,
      enableHiding: false,
      size: 80,
    },
  ]
}