table中定义 show-summary :summary-method="getSummaries"
1、只有show-summary,el会统计当前列表的列数据
2、有:summary-method="getSummaries",可以自定义统计行的字段值
getSummaries方法:
getSummaries(param) {
const { columns, data } = param;
const sums = [];
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '总计';
return;
}
})
说明:
columns,是表格的列,从0开始
data,是列的行集合
return sums,返回统计的结果,这里也可以自定义为总的数据
<el-table :key="tableKey" v-loading="listLoading" :data="list" border fit highlight-current-row
style="width: 100%;" @selection-change="handleSelectionChange" show-summary :summary-method="getSummaries">
<el-table-column label="交易日期" prop="TRADEDATE"></el-table-column>
<el-table-column label="银行名称" prop="BANKNAME"></el-table-column>
<el-table-column label="缴款渠道名称" prop="CHANNELNAME"></el-table-column>
<el-table-column label="交易总笔数" prop="TRADECOUNT"></el-table-column>
<el-table-column label="支付总笔数" prop="PAYCOUNT"></el-table-column>
<el-table-column label="支付总金额" prop="PAYAMOUNT"></el-table-column>
<el-table-column label="退款总笔数" prop="REFUNDCOUNT"></el-table-column>
<el-table-column label="退款总金额" prop="REFUNDAMOUNT"></el-table-column>
<el-table-column label="应收总金额" prop="RECEIVABLEAMOUNT"></el-table-column>
<el-table-column label="渠道对账状态" prop="CHANNELSOASTATUSNAME"></el-table-column>
<el-table-column label="银行资金对账状态" prop="BANKSOASTATUSNAME"></el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button v-waves type="primary" @click="exportData(scope.row.ID)">下载对账文件</el-button>
<el-button v-if="scope.row.CHANELSOASTATUS==3" v-waves type="primary"
@click="ViewChacuo(scope.row.PAYNOTIFYNO)">查看差错明细</el-button>
</template>
</el-table-column>
</el-table>