diff --git a/frontend/src/views/chart/components/table/TableNormal.vue b/frontend/src/views/chart/components/table/TableNormal.vue index ca6b6821cf..71d58e12dd 100644 --- a/frontend/src/views/chart/components/table/TableNormal.vue +++ b/frontend/src/views/chart/components/table/TableNormal.vue @@ -11,6 +11,8 @@ :header-row-style="table_header_class" :row-style="getRowStyle" class="table-class" + show-summary + :summary-method="summaryMethod" > tableMaxHeight) { + that.height = tableMaxHeight + 'px' + } else { + that.height = 'auto' + } + }, 10) }, initStyle() { if (this.chart.customAttr) { @@ -139,6 +147,15 @@ export default { this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha) } } + + // 修改footer合计样式 + const s_table = document.getElementsByClassName('elx-table--footer')[0] + // console.log(s_table) + let s = '' + for (const i in this.table_header_class) { + s += i + ':' + this.table_header_class[i] + ';' + } + s_table.setAttribute('style', s) }, getRowStyle({ row, rowIndex }) { if (rowIndex % 2 === 0) { @@ -146,6 +163,32 @@ export default { } else { return this.table_item_class } + }, + summaryMethod({ columns, data }) { + const means = [] // 合计 + columns.forEach((column, columnIndex) => { + if (columnIndex === 0) { + means.push('合计') + } else { + const values = data.map(item => Number(item[column.property])) + // 合计 + if (!values.every(value => isNaN(value))) { + means[columnIndex] = values.reduce((prev, curr) => { + const value = Number(curr) + if (!isNaN(value)) { + return prev + curr + } else { + return prev + } + }, 0) + means[columnIndex] = means[columnIndex].toFixed(2) + } else { + means[columnIndex] = '' + } + } + }) + // 返回一个二维数组的表尾合计(不要平均值,就不要在数组中添加) + return [means] } } }