一种是点击全选,导出所有数据,一种是选择当前页选中的数据
<el-button @click='dc' type="primary" icon='el-icon-document' style='padding: 7px;margin-top: 0px;margin-left: 10px;'>导出会员</el-button>
<el-checkbox v-model="allCheck" style='width: 120px;line-height: 35px;text-indent: 1px;color: #77778d;' @change="allCheckEvent">全选所有</el-checkbox>
<el-table :data="list" tooltip-effect="dark" ref="recordTable" highlight-current-row :row-key="getRowKeys" border stripe @selection-change="handleSelectionChange"></el-table>
//全选所有
allCheckEvent() {
// console.log(this.allCheck) allCheck=true,就让表格全部选中,否则清除选中
if (this.allCheck) {
this.tableData2.forEach(row => {
this.$refs.recordTable.toggleRowSelection(row, true)
})
} else {
this.$refs.recordTable.clearSelection()
}
},
//选择表格的ID push到 this.xz_id
handleSelectionChange(val) {
// console.log(val)
this.xz_id.length = 0
val.forEach((res) => {
// console.log(res.id)
this.xz_id.push(res.id)
})
},
//全选导出
getRowKeys(row) {
// console.log(row)
return row.id
},
dc() {
// console.log(this.xz_id)
if (this.xz_id.length <= 0) {
this.$message.error('请选择你要导出的内容');
} else {
this.$axios({ // 用axios发送post请求
method: 'post',
url: this.$url + '/shop/master/user/export', // 请求地址
data: JSON.stringify(this.xz_id), // 参数
responseType: 'blob', // 表明返回服务器返回的数据类型
headers: {
'Content-Type': 'application/json'
}
}).then(res => { // 处理返回的文件流
const blob = new Blob([res.data]); //new Blob([res])中不加data就会返回下图中[objece objece]内容(少取一层)
const fileName = '会员.xlsx'; //下载文件名称
const elink = document.createElement('a');
elink.download = fileName;
elink.style.display = 'none';
elink.href = URL.createObjectURL(blob);
document.body.appendChild(elink);
elink.click();
URL.revokeObjectURL(elink.href); // 释放URL 对象
document.body.removeChild(elink);
})
}
},