From cc2c3def63f47063d4fa8b01f9f61eafdd52805c Mon Sep 17 00:00:00 2001
From: rlaks5757 <rlaks5757@gmail.com>
Date: Tue, 1 Apr 2025 11:58:20 +0900
Subject: template-upload-dialog component 세분화
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/form-data/var-list-download-btn.tsx | 105 +++++++++++++++++++++++++
 1 file changed, 105 insertions(+)
 create mode 100644 components/form-data/var-list-download-btn.tsx

(limited to 'components/form-data/var-list-download-btn.tsx')

diff --git a/components/form-data/var-list-download-btn.tsx b/components/form-data/var-list-download-btn.tsx
new file mode 100644
index 00000000..964844ce
--- /dev/null
+++ b/components/form-data/var-list-download-btn.tsx
@@ -0,0 +1,105 @@
+"use client";
+
+import React, { FC } from "react";
+import { useToast } from "@/hooks/use-toast";
+import { toast as toastMessage } from "sonner";
+import { BookDown } from "lucide-react";
+import ExcelJS from "exceljs";
+import { saveAs } from "file-saver";
+import { Button } from "@/components/ui/button";
+import { DataTableColumnJSON } from "./form-data-table-columns";
+
+interface VarListDownloadBtnProps {
+  columnsJSON: DataTableColumnJSON[];
+  formCode: string;
+}
+
+export const VarListDownloadBtn: FC<VarListDownloadBtnProps> = ({
+  columnsJSON,
+  formCode,
+}) => {
+  const { toast } = useToast();
+
+  const downloadReportVarList = async () => {
+    try {
+      // Create a new workbook
+      const workbook = new ExcelJS.Workbook();
+
+      // 데이터 시트 생성
+      const worksheet = workbook.addWorksheet("Data");
+
+      // 유효성 검사용 숨김 시트 생성
+      const validationSheet = workbook.addWorksheet("ValidationData");
+      validationSheet.state = "hidden"; // 시트 숨김 처리
+
+      // 1. 데이터 시트에 헤더 추가
+      const headers = ["Table Column Label", "Report Variable"];
+      worksheet.addRow(headers);
+
+      // 헤더 스타일 적용
+      const headerRow = worksheet.getRow(1);
+      headerRow.font = { bold: true };
+      headerRow.alignment = { horizontal: "center" };
+      headerRow.eachCell((cell) => {
+        cell.fill = {
+          type: "pattern",
+          pattern: "solid",
+          fgColor: { argb: "FFCCCCCC" },
+        };
+      });
+
+      // 2. 데이터 행 추가
+      columnsJSON.forEach((row) => {
+        const { displayLabel, label } = row;
+
+        const labelConvert = label.replaceAll(" ", "_");
+
+        worksheet.addRow([displayLabel, labelConvert]);
+      });
+
+      // 3. 컬럼 너비 자동 조정
+      headers.forEach((col, idx) => {
+        const column = worksheet.getColumn(idx + 1);
+
+        // 최적 너비 계산
+        let maxLength = col.length;
+        columnsJSON.forEach((row) => {
+          const valueKey = idx === 0 ? "displayLabel" : "label";
+
+          const value = row[valueKey];
+          if (value !== undefined && value !== null) {
+            const valueLength = String(value).length;
+            if (valueLength > maxLength) {
+              maxLength = valueLength;
+            }
+          }
+        });
+
+        // 너비 설정 (최소 10, 최대 50)
+        column.width = Math.min(Math.max(maxLength + 2, 10), 50);
+      });
+
+      const buffer = await workbook.xlsx.writeBuffer();
+      saveAs(new Blob([buffer]), `${formCode}_report_varible_list.xlsx`);
+      toastMessage.success("Report Varible List File 다운로드 완료!");
+    } catch (err) {
+      console.log(err);
+      toast({
+        title: "Error",
+        description: "Variable List 파일을 찾을 수가 없습니다.",
+        variant: "destructive",
+      });
+    }
+  };
+
+  return (
+    <Button
+      variant="ghost"
+      className="relative p-2"
+      aria-label="Variable List Download"
+      onClick={downloadReportVarList}
+    >
+      <BookDown />
+    </Button>
+  );
+};
-- 
cgit v1.2.3


From d8a70fa8802ad066fee68aca54df7fa41461a841 Mon Sep 17 00:00:00 2001
From: rlaks5757 <rlaks5757@gmail.com>
Date: Wed, 2 Apr 2025 11:53:44 +0900
Subject: sample_temp_download_icon, var_list_download_icon 변경
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../form-data/form-data-report-temp-upload-dialog.tsx  | 18 +++++++++++-------
 .../form-data/form-data-report-temp-upload-tab.tsx     |  7 +++++--
 components/form-data/temp-download-btn.tsx             |  9 +++++++--
 components/form-data/var-list-download-btn.tsx         |  9 +++++++--
 public/icons/temp_sample_icon.svg                      |  4 ++++
 public/icons/var_list_icon.svg                         |  4 ++++
 6 files changed, 38 insertions(+), 13 deletions(-)
 create mode 100644 public/icons/temp_sample_icon.svg
 create mode 100644 public/icons/var_list_icon.svg

(limited to 'components/form-data/var-list-download-btn.tsx')

diff --git a/components/form-data/form-data-report-temp-upload-dialog.tsx b/components/form-data/form-data-report-temp-upload-dialog.tsx
index 51fe5aca..74cfe7c3 100644
--- a/components/form-data/form-data-report-temp-upload-dialog.tsx
+++ b/components/form-data/form-data-report-temp-upload-dialog.tsx
@@ -72,21 +72,25 @@ export const FormDataReportTempUploadDialog: FC<
               <TooltipProvider>
                 <Tooltip>
                   <TooltipTrigger asChild>
-                    <TempDownloadBtn />
+                    <div>
+                      <TempDownloadBtn />
+                    </div>
                   </TooltipTrigger>
                   <TooltipContent>
-                    <Label>Template Sample Download</Label>
+                    <Label>Template Sample File Download</Label>
                   </TooltipContent>
                 </Tooltip>
                 <Tooltip>
                   <TooltipTrigger asChild>
-                    <VarListDownloadBtn
-                      columnsJSON={columnsJSON}
-                      formCode={formCode}
-                    />
+                    <div>
+                      <VarListDownloadBtn
+                        columnsJSON={columnsJSON}
+                        formCode={formCode}
+                      />
+                    </div>
                   </TooltipTrigger>
                   <TooltipContent>
-                    <Label>Variable List Download</Label>
+                    <Label>Variable List File Download</Label>
                   </TooltipContent>
                 </Tooltip>
               </TooltipProvider>
diff --git a/components/form-data/form-data-report-temp-upload-tab.tsx b/components/form-data/form-data-report-temp-upload-tab.tsx
index c09ade28..5e6179a8 100644
--- a/components/form-data/form-data-report-temp-upload-tab.tsx
+++ b/components/form-data/form-data-report-temp-upload-tab.tsx
@@ -2,6 +2,7 @@
 
 import React, { FC, useState } from "react";
 import { useToast } from "@/hooks/use-toast";
+import { toast as toastMessage } from "sonner";
 import prettyBytes from "pretty-bytes";
 import { X, Loader2 } from "lucide-react";
 import { Badge } from "@/components/ui/badge";
@@ -92,6 +93,7 @@ export const FormDataReportTempUploadTab: FC<
         successCount++;
         setUploadProgress(Math.round((successCount / totalFiles) * 100));
       }
+      toastMessage.success("Template File 업로드 완료!");
     } catch (err) {
       console.error(err);
       toast({
@@ -102,11 +104,12 @@ export const FormDataReportTempUploadTab: FC<
     } finally {
       setIsUploading(false);
       setUploadProgress(0);
+      setSelectedFiles([])
     }
   };
 
   return (
-    <>
+    <div className='flex flex-col gap-4'>
       <div>
         <Label>Vendor Document Template File Upload(.docx)</Label>
         <Dropzone
@@ -164,7 +167,7 @@ export const FormDataReportTempUploadTab: FC<
           업로드
         </Button>
       </DialogFooter>
-    </>
+    </div>
   );
 };
 
diff --git a/components/form-data/temp-download-btn.tsx b/components/form-data/temp-download-btn.tsx
index 01fff569..a5f963e4 100644
--- a/components/form-data/temp-download-btn.tsx
+++ b/components/form-data/temp-download-btn.tsx
@@ -1,9 +1,9 @@
 "use client";
 
 import React from "react";
+import Image from "next/image";
 import { useToast } from "@/hooks/use-toast";
 import { toast as toastMessage } from "sonner";
-import { Download } from "lucide-react";
 import { saveAs } from "file-saver";
 import { Button } from "@/components/ui/button";
 import { getReportTempFileData } from "@/lib/forms/services";
@@ -34,7 +34,12 @@ export const TempDownloadBtn = () => {
       aria-label="Template Sample Download"
       onClick={downloadTempFile}
     >
-      <Download />
+      <Image
+        src="/icons/temp_sample_icon.svg"
+        alt="Template Sample Download Icon"
+        width={20}
+        height={20}
+      />
     </Button>
   );
 };
diff --git a/components/form-data/var-list-download-btn.tsx b/components/form-data/var-list-download-btn.tsx
index 964844ce..19bb26f9 100644
--- a/components/form-data/var-list-download-btn.tsx
+++ b/components/form-data/var-list-download-btn.tsx
@@ -1,9 +1,9 @@
 "use client";
 
 import React, { FC } from "react";
+import Image from "next/image";
 import { useToast } from "@/hooks/use-toast";
 import { toast as toastMessage } from "sonner";
-import { BookDown } from "lucide-react";
 import ExcelJS from "exceljs";
 import { saveAs } from "file-saver";
 import { Button } from "@/components/ui/button";
@@ -99,7 +99,12 @@ export const VarListDownloadBtn: FC<VarListDownloadBtnProps> = ({
       aria-label="Variable List Download"
       onClick={downloadReportVarList}
     >
-      <BookDown />
+      <Image
+        src="/icons/var_list_icon.svg"
+        alt="Template Sample Download Icon"
+        width={20}
+        height={20}
+      />
     </Button>
   );
 };
diff --git a/public/icons/temp_sample_icon.svg b/public/icons/temp_sample_icon.svg
new file mode 100644
index 00000000..4bf9aa6f
--- /dev/null
+++ b/public/icons/temp_sample_icon.svg
@@ -0,0 +1,4 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2 7.84496C2 5.33105 4.18739 3.5 6.62349 3.5H32.214C34.6501 3.5 36.8375 5.33105 36.8375 7.84496V24.2639C36.284 23.6142 35.6306 23.0581 34.9021 22.6214V16.8693H14.9028V33.5805H24.3253C24.7467 34.3354 25.2834 35.0124 25.9105 35.5859H6.62349C4.18739 35.5859 2 33.7548 2 31.2409V7.84496ZM3.93542 26.0942V31.2409C3.93542 32.4188 5.02153 33.5805 6.62349 33.5805H12.9674V26.0942H3.93542ZM12.9674 24.0888H3.93542V16.8693H12.9674V24.0888ZM3.93542 7.84496C3.93542 6.6671 5.02153 5.50537 6.62349 5.50537H32.214C33.816 5.50537 34.9021 6.6671 34.9021 7.84496V14.8639H3.93542V7.84496Z" fill="#020817"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M31.1936 36.4999C34.9526 36.4999 37.9999 33.4526 37.9999 29.6936C37.9999 25.9345 34.9526 22.8872 31.1936 22.8872C27.4345 22.8872 24.3872 25.9345 24.3872 29.6936C24.3872 33.4526 27.4345 36.4999 31.1936 36.4999ZM31.5577 34.632C31.3656 34.8538 31.0217 34.8538 30.8296 34.632L28.0307 31.4005C27.7603 31.0883 27.9819 30.6027 28.3947 30.6027H29.8689L29.8689 24.9645C29.8689 24.6983 30.0845 24.5889 30.3506 24.5888L32.0367 24.589C32.3028 24.589 32.5185 24.6983 32.5185 24.9645V30.6027H33.9926C34.4054 30.6027 34.627 31.0883 34.3567 31.4005L31.5577 34.632Z" fill="#020817"/>
+</svg>
diff --git a/public/icons/var_list_icon.svg b/public/icons/var_list_icon.svg
new file mode 100644
index 00000000..792b67be
--- /dev/null
+++ b/public/icons/var_list_icon.svg
@@ -0,0 +1,4 @@
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path fill-rule="evenodd" clip-rule="evenodd" d="M2 7.5C2 5.29086 3.79086 3.5 6 3.5H32.8374C35.0465 3.5 36.8374 5.29086 36.8374 7.5V24.0237C35.391 22.5854 33.3975 21.6965 31.1965 21.6965C27.2791 21.6965 24.0194 24.5121 23.3306 28.23H12.6416C11.9512 28.23 11.3916 28.7896 11.3916 29.48C11.3916 30.1703 11.9512 30.73 12.6416 30.73H23.2626C23.5093 32.6426 24.4315 34.3436 25.7821 35.5859H6C3.79086 35.5859 2 33.7951 2 31.5859V7.5ZM8.8916 9.41016C8.8916 8.7198 8.33196 8.16016 7.6416 8.16016C6.95125 8.16016 6.3916 8.7198 6.3916 9.41016V9.42266C6.3916 10.113 6.95125 10.6727 7.6416 10.6727C8.33196 10.6727 8.8916 10.113 8.8916 9.42266V9.41016ZM12.6416 8.16016C11.9512 8.16016 11.3916 8.7198 11.3916 9.41016C11.3916 10.1005 11.9512 10.6602 12.6416 10.6602H31.196C31.8864 10.6602 32.446 10.1005 32.446 9.41016C32.446 8.7198 31.8864 8.16016 31.196 8.16016H12.6416ZM7.6416 18.1948C8.33196 18.1948 8.8916 18.7545 8.8916 19.4448V19.4573C8.8916 20.1477 8.33196 20.7073 7.6416 20.7073C6.95125 20.7073 6.3916 20.1477 6.3916 19.4573V19.4448C6.3916 18.7545 6.95125 18.1948 7.6416 18.1948ZM11.3916 19.4448C11.3916 18.7545 11.9512 18.1948 12.6416 18.1948H31.196C31.8864 18.1948 32.446 18.7545 32.446 19.4448C32.446 20.1352 31.8864 20.6948 31.196 20.6948H12.6416C11.9512 20.6948 11.3916 20.1352 11.3916 19.4448ZM8.8916 29.48C8.8916 28.7896 8.33196 28.23 7.6416 28.23C6.95125 28.23 6.3916 28.7896 6.3916 29.48V29.4925C6.3916 30.1828 6.95125 30.7425 7.6416 30.7425C8.33196 30.7425 8.8916 30.1828 8.8916 29.4925V29.48Z" fill="#020817"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M31.1965 36.5028C34.9555 36.5028 38.0028 33.4555 38.0028 29.6965C38.0028 25.9374 34.9555 22.8901 31.1965 22.8901C27.4374 22.8901 24.3901 25.9374 24.3901 29.6965C24.3901 33.4555 27.4374 36.5028 31.1965 36.5028ZM31.5606 34.6349C31.3686 34.8567 31.0246 34.8567 30.8325 34.6349L28.0336 31.4034C27.7632 31.0912 27.9848 30.6057 28.3976 30.6057H29.8718L29.8718 24.9674C29.8718 24.7012 30.0875 24.5918 30.3535 24.5918L32.0396 24.5919C32.3057 24.5919 32.5214 24.7012 32.5214 24.9674V30.6057H33.9956C34.4084 30.6057 34.63 31.0912 34.3596 31.4034L31.5606 34.6349Z" fill="#020817"/>
+</svg>
-- 
cgit v1.2.3

