<template>
<el-button @click="exportExcel" type="primary" icon="icon-daochu">导出</el-button>
</template>
<script>
import {postExcelFile} from '@/utils/public_func'
export default {
props: {
refName: {
type: String,
default: 'table'
},
conditions: Object,
url: String
},
methods: {
// 导出excel
exportExcel () {
let table = this.findTable(this)
if(!table){
this.$message({ message: '没找到可导出的表格', type: 'warning' })
return
}
const res = table.columns.reduce((t, v) => { // 根据table生成表头与表头变量名
if (v.property) {
t.headsName.push(v.label)
t.propsName.push(v.property)
}
return t
}, {headsName: [], propsName: []})
postExcelFile( // 导出的方法,这里不展示了
this.$store.state.common.breadcrumbList.at(-1).meta.title,
res.headsName,
res.propsName,
Object.entries({ ...this.conditions }),
this.$http.adornUrl(this.url)
)
},
findTable(x){ // 遍历实例树查找有无能打印的table
let vm = x.$parent
if(vm===undefined) return false
if(vm.$refs[this.refName]) return vm.$refs[this.refName]
return this.findTable(vm)
}
}
}
</script>
<style>
</style>
用的时候仅需:
1.引用
2.拆分出查询时候的params传入(最好放在computed中)
3.<export-excel :conditions="params" url="xxxxx"/>