之前做的导出按钮都是直接调用API,并且是由前端主导并下载到本地,而这个导出按钮是完全通过接口由后端主导并下载的,嗖记录一下--
以下是通过后端导出接口传参导出要导出表单的指定数据并传到数据库:
<el-row class="tableb">
<div class="public_tablebutton">
<el-button-group>
<el-tooltip class="item" effect="dark" content="导出文件" placement="top-end">
<el-button @click="exportfile"> <img src="转存失败，建议直接上传图片文件 ../../assets/commonImg/commonicon/export.png" alt="转存失败，建议直接上传图片文件">
</el-button>
</el-tooltip>
<el-tooltip class="item" effect="dark" content="打印列表" placement="top-end">
<el-button @click="printData"> <img src="转存失败，建议直接上传图片文件 ../../assets/commonImg/commonicon/print.png" alt="转存失败，建议直接上传图片文件">
</el-button>
</el-tooltip>
</el-button-group>
</div>
</el-row>
exportfile () {
const data = {
exportColumns:[
{
fieldName:'优惠券类别编码',
keyName:'voucherCategoryCode',
sortNum:0,
valueType:'string'
},
{
fieldName:'优惠券编码',
keyName:'voucherCode',
sortNum:1,
valueType:'string'
},
{
fieldName:'优惠券单号',
keyName:'voucherNo',
sortNum:2,
valueType:'string'
},
{
fieldName:'导出时间',
keyName:'exportedTime',
sortNum:3,
valueType:'string'
}
],
pageSizeName:'limit',
pageNoName:'page',
fileName:'礼券日志',
exportedTime:'2023-08-29 00:00:00',
exportParameter:{
limit:10,
page:1,
},
path:'IP地址' + '/rediancrm-platform-coupon/coupon/voucher/voucherInfo/voucherLogList',
refreshToken:sessionStorage.getItem('refreshToken')
}
if (this.listData.length == 0) {
this.$message({
message: '没有数据可导出',
type: 'warning'
});
} else {
// var filter = this.beforeform;
getlist.exportFile('rediancrm-platform-report/export/report/addExportTask', data, this.exportSuccess);
}
},
exportSuccess (msg, check) {
if (check == 1) {
this.$message({
message: msg,
type: 'success'
});
} else {
this.$message(msg);
}
},
以下是通过后端查询接口调出刚刚上传的导出表单数据:
getTaBleList() {
this.loadingTable = true;
this.$postReport('export/report/queryExportTask', {
page:this.page.num,
limit:this.page.size,
order: 'id desc'
})
.then(res => {
if (res.data.code== '0') {
this.loadingTable = false;
this.listData = res.data.data.list;
this.page.total = res.data.data.total * 1;
} else {
this.$message.error(res.data.msg);
this.listData = [];
this.loadingTable = false;
this.page.total = 0;
}
})
.catch(err => {
this.loadingTable = false;
});
},
后边再通过点击列表侧的下载按钮调出window即可
