153 lines
3.8 KiB
Vue
153 lines
3.8 KiB
Vue
<template>
|
|
<!--<v-btn :ripple="false" @click="downloadExcelFile">액셀</v-btn>-->
|
|
<a-button
|
|
@click="downloadExcelFile"
|
|
v-bind="$attrs"
|
|
type="default"
|
|
class="btn-default"
|
|
icon="file-excel"
|
|
:size="size"
|
|
>액셀</a-button>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import Utility from '~/plugins/utility';
|
|
import XLSX from 'xlsx';
|
|
import { mapState } from 'vuex';
|
|
|
|
export default {
|
|
name: 'btnExeclDownload',
|
|
props: {
|
|
parentPrgmId: {
|
|
type: String,
|
|
require: true,
|
|
},
|
|
gridName: {
|
|
type: String,
|
|
require: false,
|
|
},
|
|
dataPath: {
|
|
type: Object,
|
|
require: false,
|
|
default: null,
|
|
},
|
|
parentModalDataName: {
|
|
type: String,
|
|
require: false,
|
|
default: null,
|
|
},
|
|
myModalKey: {
|
|
type: String,
|
|
require: false,
|
|
default: null,
|
|
},
|
|
size: {
|
|
type: String,
|
|
require: false,
|
|
default: "default", // small, middle, large
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
xlsData: [],
|
|
xlsHeader: [],
|
|
};
|
|
},
|
|
computed: {
|
|
...mapState({
|
|
menuNm: state => state.activeMenuInfo.menuNm,
|
|
pageData(state) {
|
|
if (this.parentModalDataName == null) {
|
|
return state.pageData[this.parentPrgmId];
|
|
}
|
|
return state.pageData[this.parentPrgmId][this.parentModalDataName][
|
|
this.myModalKey
|
|
];
|
|
},
|
|
}),
|
|
tableId() {
|
|
return this.pageData.xlsFileInfo.tableId;
|
|
},
|
|
newXlsData() {
|
|
return this.pageData.xlsFileInfo[this.gridName].rowData;
|
|
},
|
|
},
|
|
methods: {
|
|
setExcelData() {
|
|
const xlsRowData = this.newXlsData || this.pageData[this.gridName].data;
|
|
const xlsHeader = this.pageData[this.gridName].column;
|
|
|
|
let tmpData = [];
|
|
let tmpMap = {};
|
|
xlsRowData.map(item => {
|
|
xlsHeader.map(v => {
|
|
if (v.hidden == null || v.hidden == undefined) {
|
|
if (v.excelType == null || v.excelType == undefined) {
|
|
Object.assign(tmpMap, { [v.header]: item[v.name] || '' });
|
|
} else if (v.excelType == 'number') {
|
|
if (v.excelFormatter == null || v.excelFormatter == undefined) {
|
|
Object.assign(tmpMap, {
|
|
[v.header]: parseFloat(item[v.name].replace(',', '')) || 0,
|
|
});
|
|
} else {
|
|
//Object.assign(tmpMap, { [v.header]: Utility.setFormatIntDecimal(item[v.name], v.excelFormatter)) || Utility.setFormatIntDecimal(0, v.excelFormatter))});
|
|
Object.assign(tmpMap, {
|
|
[v.header]:
|
|
parseFloat(
|
|
Utility.setFormatIntDecimal(
|
|
item[v.name],
|
|
v.excelFormatter,
|
|
).replace(',', ''),
|
|
) ||
|
|
parseFloat(
|
|
Utility.setFormatIntDecimal(0, v.excelFormatter).replace(
|
|
',',
|
|
'',
|
|
),
|
|
),
|
|
});
|
|
}
|
|
}
|
|
}
|
|
|
|
return tmpMap;
|
|
});
|
|
tmpData = tmpData.concat(tmpMap);
|
|
tmpMap = {};
|
|
});
|
|
this.xlsData = tmpData;
|
|
tmpData = null;
|
|
tmpMap = null;
|
|
xlsHeader.map(v => {
|
|
if (v.hidden == null || v.hidden == undefined) {
|
|
// this.xlsHeader.push(v.header);
|
|
this.xlsHeader.push(String(v.header));
|
|
}
|
|
});
|
|
},
|
|
async downloadExcelFile() {
|
|
if (!this.tableId) await this.setExcelData(); // 들어온 JSON 데이타 가공
|
|
// console.log("this.setExcelData()", this.setExcelData());
|
|
const fileName = this.pageData.xlsFileInfo[this.gridName].fileName;
|
|
const workBook = XLSX.utils.book_new(); // 새 시트 생성
|
|
const excelData = this.tableId
|
|
? // 테이블 그대로 가져올때
|
|
XLSX.utils.table_to_sheet(document.getElementById(this.tableId))
|
|
: // JSON 형식으로 가져올때
|
|
XLSX.utils.json_to_sheet(this.xlsData, { header: this.xlsHeader });
|
|
|
|
const sheetName = this.pageData.xlsFileInfo[this.gridName].sheetName;
|
|
XLSX.utils.book_append_sheet(workBook, excelData, sheetName); // 시트 명명, 데이터 지정
|
|
XLSX.writeFile(
|
|
workBook,
|
|
`${fileName ? fileName : this.menuNm.replace(/(\s*)/g, '')}.xlsx`,
|
|
); // 엑셀파일 만듬
|
|
this.xlsHeader = [];
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped lang="scss">
|
|
</style>
|