1 files changed, 140 insertions, 0 deletions
diff --git a/lib/tech-vendor-possible-items/table/possible-items-table-columns.tsx b/lib/tech-vendor-possible-items/table/possible-items-table-columns.tsx
new file mode 100644
index 00000000..520c089e
--- /dev/null
+++ b/lib/tech-vendor-possible-items/table/possible-items-table-columns.tsx
@@ -0,0 +1,140 @@
+"use client";
+
+import { ColumnDef } from "@tanstack/react-table";
+import { Checkbox } from "@/components/ui/checkbox";
+import { DataTableColumnHeaderSimple } from "@/components/data-table/data-table-column-simple-header";
+import Link from "next/link";
+// 타입만 import
+type TechVendorPossibleItemsData = {
+  id: number;
+  vendorId: number;
+  vendorCode: string | null;
+  vendorName: string;
+  techVendorType: string;
+  itemCode: string;
+  createdAt: Date;
+  updatedAt: Date;
+};
+import { format } from "date-fns";
+import { ko } from "date-fns/locale";
+import { Badge } from "@/components/ui/badge";
+
+export function getColumns(): ColumnDef<TechVendorPossibleItemsData>[] {
+  return [
+    {
+      id: "select",
+      header: ({ table }) => (
+        <Checkbox
+          checked={
+            table.getIsAllPageRowsSelected() ||
+            (table.getIsSomePageRowsSelected() && "indeterminate")
+          }
+          onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}
+          aria-label="모두 선택"
+          className="translate-y-[2px]"
+        />
+      ),
+      cell: ({ row }) => (
+        <Checkbox
+          checked={row.getIsSelected()}
+          onCheckedChange={(value) => row.toggleSelected(!!value)}
+          aria-label="행 선택"
+          className="translate-y-[2px]"
+        />
+      ),
+      enableSorting: false,
+      enableHiding: false,
+    },
+    {
+      accessorKey: "itemCode",
+      header: ({ column }) => (
+        <DataTableColumnHeaderSimple column={column} title="아이템코드" />
+      ),
+      cell: ({ row }) => {
+        const itemCode = row.getValue("itemCode") as string;
+        return <div className="font-medium">{itemCode}</div>;
+      },
+    },
+    {
+      accessorKey: "vendorCode",
+      header: ({ column }) => (
+        <DataTableColumnHeaderSimple column={column} title="벤더코드" />
+      ),
+      cell: ({ row }) => {
+        const vendorCode = row.getValue("vendorCode") as string;
+        return <div className="font-medium">{vendorCode || "-"}</div>;
+      },
+    },
+    {
+      accessorKey: "vendorName",
+      header: ({ column }) => (
+        <DataTableColumnHeaderSimple column={column} title="벤더명" />
+      ),
+      cell: ({ row }) => {
+        const vendorName = row.getValue("vendorName") as string;
+        const vendorId = row.original.vendorId;
+        return (
+          <Link 
+            href={`/ko/evcp/tech-vendors/${vendorId}/info`}
+            className="max-w-[200px] truncate hover:underline"
+          >
+            {vendorName}
+          </Link>
+        );
+      },
+    },
+    {
+      accessorKey: "techVendorType",
+      header: ({ column }) => (
+        <DataTableColumnHeaderSimple column={column} title="벤더타입" />
+      ),
+      cell: ({ row }) => {
+        const techVendorType = row.getValue("techVendorType") as string;
+        
+        // JSON 배열인지 확인하고 파싱
+        let types: string[] = [];
+        try {
+          const parsed = JSON.parse(techVendorType || "[]");
+          types = Array.isArray(parsed) ? parsed : [techVendorType];
+        } catch {
+          types = [techVendorType];
+        }
+
+        return (
+          <div className="flex flex-wrap gap-1">
+            {types.map((type, index) => (
+              <Badge key={index} variant="secondary" className="text-xs">
+                {type}
+              </Badge>
+            ))}
+          </div>
+        );
+      },
+      filterFn: (row, id, value) => {
+        const techVendorType = row.getValue(id) as string;
+        try {
+          const parsed = JSON.parse(techVendorType || "[]");
+          const types = Array.isArray(parsed) ? parsed : [techVendorType];
+          return types.some(type => type.includes(value));
+        } catch {
+          return techVendorType?.includes(value) || false;
+        }
+      },
+    },
+
+    {
+      accessorKey: "createdAt",
+      header: ({ column }) => (
+        <DataTableColumnHeaderSimple column={column} title="생성일시" />
+      ),
+      cell: ({ row }) => {
+        const createdAt = row.getValue("createdAt") as Date;
+        return (
+          <div className="text-sm text-muted-foreground">
+            {format(createdAt, "yyyy-MM-dd HH:mm", { locale: ko })}
+          </div>
+        );
+      },
+    },
+  ];
+} 
+\ No newline at end of file