initial commit

1 files changed, 106 insertions, 0 deletions

diff --git a/lib/vendors/contacts-table/contact-table-toolbar-actions.tsx b/lib/vendors/contacts-table/contact-table-toolbar-actions.tsx
new file mode 100644
index 00000000..8aef6953
--- /dev/null
+++ b/lib/vendors/contacts-table/contact-table-toolbar-actions.tsx
@@ -0,0 +1,106 @@
+"use client"
+
+import * as React from "react"
+import { type Table } from "@tanstack/react-table"
+import { Download, Upload } from "lucide-react"
+import { toast } from "sonner"
+
+import { exportTableToExcel } from "@/lib/export"
+import { Button } from "@/components/ui/button"
+
+
+// 만약 서버 액션이나 API 라우트를 이용해 업로드 처리한다면 import
+import { importTasksExcel } from "@/lib/tasks/service" // 예시
+import {  VendorContact } from "@/db/schema/vendors"
+import { AddContactDialog } from "./add-contact-dialog"
+
+interface VendorsTableToolbarActionsProps {
+  table: Table<VendorContact>
+  vendorId: number
+}
+
+export function VendorsTableToolbarActions({ table,vendorId }: VendorsTableToolbarActionsProps) {
+  // 파일 input을 숨기고, 버튼 클릭 시 참조해 클릭하는 방식
+  const fileInputRef = React.useRef<HTMLInputElement>(null)
+
+  // 파일이 선택되었을 때 처리
+  async function onFileChange(event: React.ChangeEvent<HTMLInputElement>) {
+    const file = event.target.files?.[0]
+    if (!file) return
+
+    // 파일 초기화 (동일 파일 재업로드 시에도 onChange가 트리거되도록)
+    event.target.value = ""
+
+    // 서버 액션 or API 호출
+    try {
+      // 예: 서버 액션 호출
+      const { errorFile, errorMessage } = await importTasksExcel(file)
+
+      if (errorMessage) {
+        toast.error(errorMessage)
+      }
+      if (errorFile) {
+        // 에러 엑셀을 다운로드
+        const url = URL.createObjectURL(errorFile)
+        const link = document.createElement("a")
+        link.href = url
+        link.download = "errors.xlsx"
+        link.click()
+        URL.revokeObjectURL(url)
+      } else {
+        // 성공
+        toast.success("Import success")
+        // 필요 시 revalidateTag("tasks") 등
+      }
+
+    } catch (err) {
+      toast.error("파일 업로드 중 오류가 발생했습니다.")
+      
+    }
+  }
+
+  function handleImportClick() {
+    // 숨겨진 <input type="file" /> 요소를 클릭
+    fileInputRef.current?.click()
+  }
+
+  return (
+    <div className="flex items-center gap-2">
+
+      <AddContactDialog vendorId={vendorId}/>
+
+      {/** 3) Import 버튼 (파일 업로드) */}
+      <Button variant="outline" size="sm" className="gap-2" onClick={handleImportClick}>
+        <Upload className="size-4" aria-hidden="true" />
+        <span className="hidden sm:inline">Import</span>
+      </Button>
+      {/*
+        실제로는 숨겨진 input과 연결:
+        - accept=".xlsx,.xls" 등으로 Excel 파일만 업로드 허용
+      */}
+      <input
+        ref={fileInputRef}
+        type="file"
+        accept=".xlsx,.xls"
+        className="hidden"
+        onChange={onFileChange}
+      />
+
+      {/** 4) Export 버튼 */}
+      <Button
+        variant="outline"
+        size="sm"
+        onClick={() =>
+          exportTableToExcel(table, {
+            filename: "tasks",
+            excludeColumns: ["select", "actions"],
+          })
+        }
+        className="gap-2"
+      >
+        <Download className="size-4" aria-hidden="true" />
+        <span className="hidden sm:inline">Export</span>
+      </Button>
+    </div>
+  )
+}
\ No newline at end of file