From cc2c3def63f47063d4fa8b01f9f61eafdd52805c Mon Sep 17 00:00:00 2001 From: rlaks5757 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 = ({ + 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 ( + + ); +}; -- cgit v1.2.3 From d8a70fa8802ad066fee68aca54df7fa41461a841 Mon Sep 17 00:00:00 2001 From: rlaks5757 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< - +
+ +
- +
- +
+ +
- +
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 ( - <> +
- +
); }; 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} > - + Template Sample Download Icon ); }; 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 = ({ aria-label="Variable List Download" onClick={downloadReportVarList} > - + Template Sample Download Icon ); }; 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 @@ + + + + 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 @@ + + + + -- cgit v1.2.3