fix: Grid excel download rename
parent
a18cd21cae
commit
f8e270dc74
@ -0,0 +1,111 @@
|
|||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import { IconFileExport } from '@tabler/icons';
|
||||||
|
import { Button } from '@mui/material';
|
||||||
|
import * as Excel from 'exceljs';
|
||||||
|
import saveAs from 'file-saver';
|
||||||
|
import { useAlert } from 'react-alert';
|
||||||
|
|
||||||
|
const ExcelDownloadGrid = ({ fileName, gridColumns, excelDatas, isDisabled = true }) => {
|
||||||
|
const alert = useAlert();
|
||||||
|
|
||||||
|
const handleExcelDownload = () => {
|
||||||
|
if (!excelDatas || excelDatas.length === 0) {
|
||||||
|
alert.show('다운로드할 대상이 없습니다.[데이타 조회후 실행]');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const workbook = new Excel.Workbook();
|
||||||
|
const worksheet = workbook.addWorksheet('Sheet'); // sheet 이름이 My Sheet
|
||||||
|
/*
|
||||||
|
// subject
|
||||||
|
worksheet.mergeCells('A2:I2');
|
||||||
|
const customCell = worksheet.getCell('A2');
|
||||||
|
customCell.font = {
|
||||||
|
name: 'Comic Sans MS',
|
||||||
|
family: 4,
|
||||||
|
size: 20,
|
||||||
|
underline: true,
|
||||||
|
bold: true
|
||||||
|
};
|
||||||
|
customCell.value = 'Subject';
|
||||||
|
*/
|
||||||
|
const headerRow = worksheet.addRow();
|
||||||
|
worksheet.getRow(1).font = { bold: true };
|
||||||
|
|
||||||
|
gridColumns.forEach((col, idx) => {
|
||||||
|
const currentColumnWidth = col.width;
|
||||||
|
worksheet.getColumn(idx + 1).width = currentColumnWidth !== undefined ? currentColumnWidth / 6 : 20;
|
||||||
|
const cell = headerRow.getCell(idx + 1);
|
||||||
|
cell.value = col.headerName;
|
||||||
|
});
|
||||||
|
|
||||||
|
// if (this.state.excelFilterEnabled === true) {
|
||||||
|
worksheet.autoFilter = {
|
||||||
|
from: {
|
||||||
|
row: 1,
|
||||||
|
column: 1
|
||||||
|
},
|
||||||
|
to: {
|
||||||
|
row: 1,
|
||||||
|
column: gridColumns.length
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
worksheet.properties.outlineProperties = {
|
||||||
|
summaryBelow: false,
|
||||||
|
summaryRight: false
|
||||||
|
};
|
||||||
|
|
||||||
|
excelDatas.forEach((row) => {
|
||||||
|
const dataRow = worksheet.addRow();
|
||||||
|
|
||||||
|
// eslint-disable-next-line guard-for-in,no-restricted-syntax
|
||||||
|
for (const [k, v] of Object.entries(row)) {
|
||||||
|
// eslint-disable-next-line no-plusplus
|
||||||
|
|
||||||
|
// eslint-disable-next-line consistent-return
|
||||||
|
gridColumns.forEach((col, idx) => {
|
||||||
|
if (col.field === k) {
|
||||||
|
const cell = dataRow.getCell(idx + 1);
|
||||||
|
cell.value = v;
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
/*
|
||||||
|
// Footer
|
||||||
|
const rowCount = worksheet.rowCount;
|
||||||
|
worksheet.mergeCells(`A${rowCount}:I${rowCount + 1}`);
|
||||||
|
worksheet.getRow(1).font = { bold: true };
|
||||||
|
worksheet.getCell(`A${rowCount}`).font = {
|
||||||
|
name: 'Comic Sans MS',
|
||||||
|
family: 4,
|
||||||
|
size: 20,
|
||||||
|
underline: true,
|
||||||
|
bold: true
|
||||||
|
};
|
||||||
|
|
||||||
|
worksheet.getCell(`A${rowCount}`).value = 'Custom Footer here';
|
||||||
|
*/
|
||||||
|
|
||||||
|
workbook.xlsx.writeBuffer().then((buffer) => {
|
||||||
|
saveAs(new Blob([buffer], { type: 'application/octet-stream' }), `${fileName}.xlsx`);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Button disabled={isDisabled} variant="contained" size="small" startIcon={<IconFileExport />} onClick={handleExcelDownload}>
|
||||||
|
엑셀다운로드
|
||||||
|
</Button>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
ExcelDownloadGrid.propTypes = {
|
||||||
|
fileName: PropTypes.string.isRequired,
|
||||||
|
gridColumns: PropTypes.array.isRequired,
|
||||||
|
excelDatas: PropTypes.array.isRequired,
|
||||||
|
isDisabled: PropTypes.bool.isRequired
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ExcelDownloadGrid;
|
Loading…
Reference in New Issue