表尾合计行,只计算最后一列
<el-table :data="tableData" border show-summary :summary-method="getSummaries" style="width: 100%">
<el-table-column prop="id" label="商品ID" width="180">
</el-table-column>
<el-table-column prop="name" label="商品编码">
</el-table-column>
<el-table-column prop="amount1" sortable label="商品信息">
</el-table-column>
<el-table-column prop="amount2" sortable label="售价">
</el-table-column>
<el-table-column prop="amount3" sortable label="数量(件)">
</el-table-column>
<el-table-column prop="val" sortable label="金额">
</el-table-column>
</el-table>
export default {
data() {
return {
tableData: [{
amount3: 11,
val: 1
}, {
amount3: 12,
val: 2
}, {
amount3: 13,
val: 3
}, {
amount3: 14,
val: 4
}, {
amount3: 15,
val: 5
}]
}
},
methods: {
getSummaries(param) {
const {
columns,
data
} = param
const sums = []
columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '总价'
//只计算最后一列
} else if (index === columns.length - 1) {
const values = data.map(item => Number(item[column.property]))
if (!values.every(value => isNaN(value))) {
sums[index] = values.reduce((prev, curr) => {
const value = Number(curr)
if (!isNaN(value)) {
return prev + curr
} else {
return prev
}
}, 0)
sums[index] += ' 元';
} else {
sums[index] = '';
}
} else {
sums[index] = ''
}
})
return sums
}
}
}