elementUI el-table 合计行 滚动条放在下方样式与合计行统计方法

2019/07/31 15:40
阅读数 1.7K

CSS

/*table一条合计行滚动条样式*/
.el-table{
    overflow: auto;
}
.el-table .el-table__body-wrapper,
.el-table .el-table__header-wrapper,
.el-table .el-table__footer-wrapper{
    overflow: visible;
}
.el-table::after{
    position:relative !important;
}

  合计行统计方法:

getSummaries(param) {
                const { columns, data } = param;
                const sums = [];
                columns.forEach((column, index) => {
                    if (index === 0) {
                        sums[index] = '合计';
                        return;
                    }
                    const values = data.map(item => {
                        return Number(item[column.property])
                    });
                    const flag = values.every(value => {
                        if(index == 3){ // if(column.property == 'money'){}
                            return true
                        }else{
                            return isNaN(value)
                        }
                    })
                    if (!flag) {
                        sums[index] = values.reduce((prev, curr) => {
                            const value = Number(curr);
                            if (!isNaN(value)) {
                                return prev + curr;
                            } else {
                                return prev;
                            }
                        }, 0);
                        sums[index] += '';
                    }
                });

                return sums;
            },

  

展开阅读全文
打赏
0
0 收藏
分享
加载中
更多评论
打赏
0 评论
0 收藏
0
分享
返回顶部
顶部