feat: scTable优化表格导出

This commit is contained in:
caoqianming 2025-11-02 00:51:15 +08:00
parent 176ad3e233
commit c8bd8fa2c4
1 changed files with 19 additions and 7 deletions

View File

@ -50,8 +50,8 @@
<el-button icon="el-icon-download" circle style="margin-left: 15px"></el-button> <el-button icon="el-icon-download" circle style="margin-left: 15px"></el-button>
</template> </template>
<div><el-button type="primary" size="small" @click="exportExcel(0)">1导出本页数据</el-button></div> <div><el-button type="primary" size="small" @click="exportExcel(0)">1导出本页数据</el-button></div>
<div style="margin-top: 2px;" v-if="hExportExcel"><el-button type="primary" size="small" @click="exportExcel(1)">2导出本页数据</el-button></div> <div style="margin-top: 2px;" v-if="hExportCols"><el-button type="primary" size="small" @click="exportExcel(1)">2导出本页数据</el-button></div>
<div style="margin-top: 2px;" v-if="hExportExcel"><el-button type="primary" size="small" @click="exportExcel(2)">3导出全部数据</el-button></div> <div style="margin-top: 2px;" v-if="hExportCols"><el-button type="primary" size="small" @click="exportExcel(2)">3导出全部数据</el-button></div>
</el-popover> </el-popover>
<el-popover v-if="column" placement="top" title="列设置" :width="500" trigger="click" :hide-after="0" <el-popover v-if="column" placement="top" title="列设置" :width="500" trigger="click" :hide-after="0"
@show="customColumnShow = true" @after-leave="customColumnShow = false"> @show="customColumnShow = true" @after-leave="customColumnShow = false">
@ -90,7 +90,7 @@
import config from "@/config/table"; import config from "@/config/table";
import columnSetting from "./columnSetting"; import columnSetting from "./columnSetting";
import { genTree } from "@/utils/verificate"; import { genTree } from "@/utils/verificate";
import { domToExcel } from "@/utils/exportExcel"; import { domToExcel, dataToExcel } from "@/utils/exportExcel";
export default { export default {
name: "scTable", name: "scTable",
components: { components: {
@ -124,7 +124,8 @@ export default {
hideRefresh: { type: Boolean, default: false }, hideRefresh: { type: Boolean, default: false },
hideSetting: { type: Boolean, default: false }, hideSetting: { type: Boolean, default: false },
hideExport: { type: Boolean, default: false }, hideExport: { type: Boolean, default: false },
hExportExcel: { type: Function, default: null }, hExportCols: { type: Array, default: null },
hExportName: { type: String, default: null },
paginationLayout: { type: String, default: config.paginationLayout }, paginationLayout: { type: String, default: config.paginationLayout },
}, },
watch: { watch: {
@ -320,9 +321,20 @@ export default {
} }
} }
else if (type === 1) { else if (type === 1) {
this.hExportExcel(this.tableData); dataToExcel(this.hExportCols, this.tableData, this.hExportName?this.hExportName:'表格数据')
}else if (type === 2) { }else if (type === 2) {
var c = Object.assign({}, this.query, this.tableParams, {[this.orderStr]: this.order}, {page: 0}) const extractHeaderKeys = (columns) =>{
const keys = columns.map(item => {
// key
return item.key.split('.')[0];
});
//
return [...new Set(keys)].join(',');
}
var c = Object.assign({}, this.query, this.tableParams, {[this.orderStr]: this.order}, {page: 0},
{query: "{" + extractHeaderKeys(this.hExportCols) + "}"}
)
let ElLoading = this.$loading({ let ElLoading = this.$loading({
lock: true, lock: true,
text: '数据请求中,请稍后...', text: '数据请求中,请稍后...',
@ -330,7 +342,7 @@ export default {
}) })
this.apiObj.req(c).then(res=>{ this.apiObj.req(c).then(res=>{
ElLoading.close(); ElLoading.close();
this.hExportExcel(res); dataToExcel(this.hExportCols, res, this.hExportName?this.hExportName:'表格数据')
}).catch(err=>{ }).catch(err=>{
ElLoading.close(); ElLoading.close();
console.log(err) console.log(err)