|
|
|
|
@ -1,53 +1,54 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div
|
|
|
|
|
ref="tableContainer"
|
|
|
|
|
:style="bg_class"
|
|
|
|
|
style="padding: 8px; width: 100%; height: 100%; overflow: hidden"
|
|
|
|
|
>
|
|
|
|
|
<el-row style="height: 100%">
|
|
|
|
|
<p v-show="title_show" ref="title" :style="title_class">
|
|
|
|
|
{{ chart.title }}
|
|
|
|
|
</p>
|
|
|
|
|
<div ref="tableContainer" :style="bg_class" style="padding: 8px;width: 100%;height: 100%;overflow: hidden;">
|
|
|
|
|
<el-row style="height: 100%;">
|
|
|
|
|
<p v-show="title_show" ref="title" :style="title_class">{{ chart.title }}</p>
|
|
|
|
|
<ux-grid
|
|
|
|
|
ref="plxTable"
|
|
|
|
|
size="mini"
|
|
|
|
|
style="width: 100%"
|
|
|
|
|
style="width: 100%;"
|
|
|
|
|
:height="height"
|
|
|
|
|
:checkbox-config="{ highlight: true }"
|
|
|
|
|
:checkbox-config="{highlight: true}"
|
|
|
|
|
:width-resize="true"
|
|
|
|
|
:header-row-style="table_header_class"
|
|
|
|
|
:row-style="getRowStyle"
|
|
|
|
|
:merge-cells="mergeCells"
|
|
|
|
|
class="table-class"
|
|
|
|
|
show-overflow="tooltip"
|
|
|
|
|
show-header-overflow="tooltip"
|
|
|
|
|
:class="chart.id"
|
|
|
|
|
:show-summary="showSummary"
|
|
|
|
|
:summary-method="summaryMethod"
|
|
|
|
|
>
|
|
|
|
|
<ux-table-column
|
|
|
|
|
v-for="field in fields"
|
|
|
|
|
:key="Math.random()"
|
|
|
|
|
:field="field.dataeaseName"
|
|
|
|
|
v-for="(field, index) in fields"
|
|
|
|
|
:key="field.dataeaseName+index"
|
|
|
|
|
:field="field.subFields?'':field.dataeaseName"
|
|
|
|
|
:resizable="true"
|
|
|
|
|
sortable
|
|
|
|
|
:fixed="field.fixed"
|
|
|
|
|
:title="field.name"
|
|
|
|
|
>
|
|
|
|
|
<!-- <template slot="header">-->
|
|
|
|
|
<!-- <span>{{ field.name }}</span>-->
|
|
|
|
|
<!-- </template>-->
|
|
|
|
|
<template v-if="field.subFields">
|
|
|
|
|
<ux-table-column
|
|
|
|
|
v-for="(subfield) in field.subFields"
|
|
|
|
|
:key="subfield.dataeaseName"
|
|
|
|
|
:field="subfield.dataeaseName"
|
|
|
|
|
:resizable="true"
|
|
|
|
|
:title="subfield.name"
|
|
|
|
|
/>
|
|
|
|
|
</template>
|
|
|
|
|
</ux-table-column>
|
|
|
|
|
</ux-grid>
|
|
|
|
|
|
|
|
|
|
<el-row v-show="chart.type === 'table-info'" class="table-page">
|
|
|
|
|
<span class="total-style">
|
|
|
|
|
{{ $t('chart.total') }}
|
|
|
|
|
<span>{{
|
|
|
|
|
chart.data && chart.data.tableRow ? chart.data.tableRow.length : 0
|
|
|
|
|
}}</span>
|
|
|
|
|
<span>{{ (chart.data && chart.data.tableRow)?chart.data.tableRow.length:0 }}</span>
|
|
|
|
|
{{ $t('chart.items') }}
|
|
|
|
|
</span>
|
|
|
|
|
<el-pagination
|
|
|
|
|
small
|
|
|
|
|
:current-page="currentPage.page"
|
|
|
|
|
:page-sizes="[10, 20, 50, 100]"
|
|
|
|
|
:page-sizes="[10,20,50,100]"
|
|
|
|
|
:page-size="currentPage.pageSize"
|
|
|
|
|
:pager-count="5"
|
|
|
|
|
layout="sizes, prev, pager, next"
|
|
|
|
|
@ -89,6 +90,7 @@ export default {
|
|
|
|
|
return {
|
|
|
|
|
fields: [],
|
|
|
|
|
height: 'auto',
|
|
|
|
|
mergeCells: [],
|
|
|
|
|
title_class: {
|
|
|
|
|
margin: '0 0',
|
|
|
|
|
width: '100%',
|
|
|
|
|
@ -105,7 +107,7 @@ export default {
|
|
|
|
|
table_header_class: {
|
|
|
|
|
fontSize: '12px',
|
|
|
|
|
color: '#606266',
|
|
|
|
|
background: '#e8eaec',
|
|
|
|
|
backgroundColor: '#e8eaec',
|
|
|
|
|
height: '36px'
|
|
|
|
|
},
|
|
|
|
|
table_item_class: {
|
|
|
|
|
@ -120,6 +122,8 @@ export default {
|
|
|
|
|
background: '#ffffff',
|
|
|
|
|
height: '36px'
|
|
|
|
|
},
|
|
|
|
|
cellDimension: 0,
|
|
|
|
|
tableLength: 0,
|
|
|
|
|
title_show: true,
|
|
|
|
|
borderRadius: '0px',
|
|
|
|
|
currentPage: {
|
|
|
|
|
@ -137,13 +141,9 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
chart: function() {
|
|
|
|
|
this.init()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
created() {
|
|
|
|
|
this.init()
|
|
|
|
|
console.log('init')
|
|
|
|
|
// 监听元素变动事件
|
|
|
|
|
eventBus.$on('resizing', (componentId) => {
|
|
|
|
|
this.chartResize()
|
|
|
|
|
@ -166,36 +166,191 @@ export default {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
deteleObject(obj) {
|
|
|
|
|
var uniques = []
|
|
|
|
|
var stringify = {}
|
|
|
|
|
for (var i = 0; i < obj.length; i++) {
|
|
|
|
|
var keys = Object.keys(obj[i])
|
|
|
|
|
keys.sort(function(a, b) {
|
|
|
|
|
return (Number(a) - Number(b))
|
|
|
|
|
})
|
|
|
|
|
var str = ''
|
|
|
|
|
for (var j = 0; j < keys.length; j++) {
|
|
|
|
|
str += JSON.stringify(keys[j])
|
|
|
|
|
str += JSON.stringify(obj[i][keys[j]])
|
|
|
|
|
}
|
|
|
|
|
if (!stringify.hasOwnProperty(str)) {
|
|
|
|
|
uniques.push(obj[i])
|
|
|
|
|
stringify[str] = true
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
return uniques
|
|
|
|
|
},
|
|
|
|
|
initData() {
|
|
|
|
|
const that = this
|
|
|
|
|
let datas = []
|
|
|
|
|
if (this.chart.data) {
|
|
|
|
|
this.fields = JSON.parse(JSON.stringify(this.chart.data.fields))
|
|
|
|
|
const yAxis = JSON.parse(this.chart.yaxis)
|
|
|
|
|
if (yAxis && yAxis.length > 0) {
|
|
|
|
|
yAxis.forEach((item) => {
|
|
|
|
|
if (item.summary == 'ratio') {
|
|
|
|
|
this.chart.data.tableRow.forEach((tableRow) => {
|
|
|
|
|
console.log(33, tableRow)
|
|
|
|
|
tableRow[item.dataeaseName] += '%'
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
datas = JSON.parse(JSON.stringify(this.chart.data.tableRow))
|
|
|
|
|
const findRowIndex = this.fields.findIndex(e => e.chartType === 'row')
|
|
|
|
|
const findValueIndex = this.fields.findIndex(e => e.chartType === 'bar')
|
|
|
|
|
if (this.chart.type === 'table-info') {
|
|
|
|
|
// 计算分页
|
|
|
|
|
this.currentPage.show = datas.length
|
|
|
|
|
const pageStart =
|
|
|
|
|
(this.currentPage.page - 1) * this.currentPage.pageSize
|
|
|
|
|
const pageStart = (this.currentPage.page - 1) * this.currentPage.pageSize
|
|
|
|
|
const pageEnd = pageStart + this.currentPage.pageSize
|
|
|
|
|
datas = datas.slice(pageStart, pageEnd)
|
|
|
|
|
} else if (this.chart.type === 'table-normal' && findRowIndex >= 0) {
|
|
|
|
|
// 交叉表数据处理
|
|
|
|
|
const xaxis = this.chart.xaxis ? JSON.parse(this.chart.xaxis) : []
|
|
|
|
|
const yaxisExt = this.chart.yaxisExt ? JSON.parse(this.chart.yaxisExt) : []
|
|
|
|
|
const xaxisFieldId = xaxis.map(e => e.dataeaseName)
|
|
|
|
|
const yaxisExtFieldId = yaxisExt.map(e => e.dataeaseName)
|
|
|
|
|
const fieldValueName = this.fields[findValueIndex].dataeaseName
|
|
|
|
|
this.cellDimension = xaxisFieldId.length
|
|
|
|
|
let fields = this.fields.filter(e => xaxisFieldId.includes(e.dataeaseName))
|
|
|
|
|
console.log(fields)
|
|
|
|
|
let rowSum = 0
|
|
|
|
|
let columnValue = []
|
|
|
|
|
let rowName = []
|
|
|
|
|
yaxisExtFieldId.forEach((e, index) => {
|
|
|
|
|
const arr = []
|
|
|
|
|
datas.forEach(ele => {
|
|
|
|
|
if (index > 0) {
|
|
|
|
|
arr.push({
|
|
|
|
|
dataeaseName: e + ele[e] + ',' + yaxisExtFieldId[0] + ele[yaxisExtFieldId[0]],
|
|
|
|
|
name: ele[e]
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
rowName.push({
|
|
|
|
|
dataeaseName: e + ele[e],
|
|
|
|
|
name: ele[e]
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
if (index > 0) {
|
|
|
|
|
const copyArr = this.deteleObject(arr)
|
|
|
|
|
rowName.forEach(item => {
|
|
|
|
|
const newArr = []
|
|
|
|
|
copyArr.forEach(sube => {
|
|
|
|
|
if (item.dataeaseName === sube.dataeaseName.split(',')[1]) {
|
|
|
|
|
newArr.push(sube)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
item.subFields = newArr
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
rowName = this.deteleObject(rowName)
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
if (xaxisFieldId.length > 1) {
|
|
|
|
|
let arr1 = []
|
|
|
|
|
let arr2 = []
|
|
|
|
|
datas.forEach(obj => {
|
|
|
|
|
for (const key in obj) {
|
|
|
|
|
if (Object.hasOwnProperty.call(obj, key)) {
|
|
|
|
|
const element = obj[key]
|
|
|
|
|
if (xaxisFieldId[0] === key) {
|
|
|
|
|
arr1.push({
|
|
|
|
|
[key]: element
|
|
|
|
|
})
|
|
|
|
|
} else if (xaxisFieldId[1] === key) {
|
|
|
|
|
arr2.push({
|
|
|
|
|
[key]: element
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
arr1 = this.deteleObject(arr1)
|
|
|
|
|
arr2 = this.deteleObject(arr2)
|
|
|
|
|
let rowIndex = 0
|
|
|
|
|
arr1.forEach(e => {
|
|
|
|
|
this.mergeCells.push({
|
|
|
|
|
col: 0,
|
|
|
|
|
row: rowIndex,
|
|
|
|
|
rowspan: arr2.length,
|
|
|
|
|
colspan: 1
|
|
|
|
|
})
|
|
|
|
|
arr2.forEach(item => {
|
|
|
|
|
const obj = {}
|
|
|
|
|
columnValue.push(Object.assign(obj, e, item))
|
|
|
|
|
rowIndex += 1
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
columnValue.forEach(ele => {
|
|
|
|
|
if (yaxisExtFieldId.length > 1) {
|
|
|
|
|
datas.forEach(subEle => {
|
|
|
|
|
if (ele[xaxisFieldId[0]] === subEle[xaxisFieldId[0]] && ele[xaxisFieldId[1]] === subEle[xaxisFieldId[1]]) {
|
|
|
|
|
const key = yaxisExtFieldId[1] + subEle[yaxisExtFieldId[1]] + ',' + yaxisExtFieldId[0] + subEle[yaxisExtFieldId[0]]
|
|
|
|
|
ele[key] = subEle[fieldValueName]
|
|
|
|
|
rowSum += subEle[fieldValueName]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
datas.forEach(subEle => {
|
|
|
|
|
if (ele[xaxisFieldId[0]] === subEle[xaxisFieldId[0]] && ele[xaxisFieldId[1]] === subEle[xaxisFieldId[1]]) {
|
|
|
|
|
const key = yaxisExtFieldId[0] + subEle[yaxisExtFieldId[0]]
|
|
|
|
|
ele[key] = subEle[fieldValueName]
|
|
|
|
|
rowSum += subEle[fieldValueName]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
ele.rowTotal = rowSum
|
|
|
|
|
rowSum = 0
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
datas.forEach(obj => {
|
|
|
|
|
for (const key in obj) {
|
|
|
|
|
if (Object.hasOwnProperty.call(obj, key)) {
|
|
|
|
|
const element = obj[key]
|
|
|
|
|
if (xaxisFieldId.includes(key)) {
|
|
|
|
|
columnValue.push({
|
|
|
|
|
[key]: element
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
columnValue = this.deteleObject(columnValue)
|
|
|
|
|
columnValue.forEach(ele => {
|
|
|
|
|
if (yaxisExtFieldId.length > 1) {
|
|
|
|
|
datas.forEach(subEle => {
|
|
|
|
|
if (ele[xaxisFieldId[0]] === subEle[xaxisFieldId[0]]) {
|
|
|
|
|
const key = yaxisExtFieldId[1] + subEle[yaxisExtFieldId[1]] + ',' + yaxisExtFieldId[0] + subEle[yaxisExtFieldId[0]]
|
|
|
|
|
ele[key] = subEle[fieldValueName]
|
|
|
|
|
rowSum += subEle[fieldValueName]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
} else {
|
|
|
|
|
datas.forEach(subEle => {
|
|
|
|
|
if (ele[xaxisFieldId[0]] === subEle[xaxisFieldId[0]]) {
|
|
|
|
|
const key = yaxisExtFieldId[0] + subEle[yaxisExtFieldId[0]]
|
|
|
|
|
ele[key] = subEle[fieldValueName]
|
|
|
|
|
rowSum += subEle[fieldValueName]
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
ele.rowTotal = rowSum
|
|
|
|
|
rowSum = 0
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
fields = fields.concat(rowName)
|
|
|
|
|
fields.push({
|
|
|
|
|
dataeaseName: 'rowTotal',
|
|
|
|
|
name: `合计(${this.fields[findValueIndex].name})`
|
|
|
|
|
})
|
|
|
|
|
datas = columnValue
|
|
|
|
|
this.fields = fields
|
|
|
|
|
console.log(columnValue)
|
|
|
|
|
console.log(fields)
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
this.fields = []
|
|
|
|
|
datas = []
|
|
|
|
|
this.resetPage()
|
|
|
|
|
}
|
|
|
|
|
this.tableLength = datas.length
|
|
|
|
|
this.$refs.plxTable.reloadData(datas)
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.initStyle()
|
|
|
|
|
@ -212,15 +367,13 @@ export default {
|
|
|
|
|
pageHeight = 36
|
|
|
|
|
}
|
|
|
|
|
const currentHeight = this.$refs.tableContainer.offsetHeight
|
|
|
|
|
const tableMaxHeight =
|
|
|
|
|
currentHeight - this.$refs.title.offsetHeight - 16 - pageHeight
|
|
|
|
|
const tableMaxHeight = currentHeight - this.$refs.title.offsetHeight - 16 - pageHeight
|
|
|
|
|
let tableHeight
|
|
|
|
|
if (this.chart.data) {
|
|
|
|
|
if (this.chart.type === 'table-info') {
|
|
|
|
|
tableHeight = (this.currentPage.pageSize + 2) * 36 - pageHeight
|
|
|
|
|
} else {
|
|
|
|
|
tableHeight =
|
|
|
|
|
(this.chart.data.tableRow.length + 2) * 36 - pageHeight
|
|
|
|
|
tableHeight = (this.tableLength + 2) * 36 - pageHeight
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
tableHeight = 0
|
|
|
|
|
@ -243,28 +396,17 @@ export default {
|
|
|
|
|
const customAttr = JSON.parse(this.chart.customAttr)
|
|
|
|
|
if (customAttr.color) {
|
|
|
|
|
this.table_header_class.color = customAttr.color.tableFontColor
|
|
|
|
|
this.table_header_class.background = hexColorToRGBA(
|
|
|
|
|
customAttr.color.tableHeaderBgColor,
|
|
|
|
|
customAttr.color.alpha
|
|
|
|
|
)
|
|
|
|
|
this.table_header_class.backgroundColor = hexColorToRGBA(customAttr.color.tableHeaderBgColor, customAttr.color.alpha)
|
|
|
|
|
this.table_item_class.color = customAttr.color.tableFontColor
|
|
|
|
|
this.table_item_class.background = hexColorToRGBA(
|
|
|
|
|
customAttr.color.tableItemBgColor,
|
|
|
|
|
customAttr.color.alpha
|
|
|
|
|
)
|
|
|
|
|
this.table_item_class.background = hexColorToRGBA(customAttr.color.tableItemBgColor, customAttr.color.alpha)
|
|
|
|
|
}
|
|
|
|
|
if (customAttr.size) {
|
|
|
|
|
this.table_header_class.fontSize =
|
|
|
|
|
customAttr.size.tableTitleFontSize + 'px'
|
|
|
|
|
this.table_item_class.fontSize =
|
|
|
|
|
customAttr.size.tableItemFontSize + 'px'
|
|
|
|
|
this.table_header_class.height =
|
|
|
|
|
customAttr.size.tableTitleHeight + 'px'
|
|
|
|
|
this.table_header_class.fontSize = customAttr.size.tableTitleFontSize + 'px'
|
|
|
|
|
this.table_item_class.fontSize = customAttr.size.tableItemFontSize + 'px'
|
|
|
|
|
this.table_header_class.height = customAttr.size.tableTitleHeight + 'px'
|
|
|
|
|
this.table_item_class.height = customAttr.size.tableItemHeight + 'px'
|
|
|
|
|
}
|
|
|
|
|
this.table_item_class_stripe = JSON.parse(
|
|
|
|
|
JSON.stringify(this.table_item_class)
|
|
|
|
|
)
|
|
|
|
|
this.table_item_class_stripe = JSON.parse(JSON.stringify(this.table_item_class))
|
|
|
|
|
// 暂不支持斑马纹
|
|
|
|
|
// if (customAttr.color.tableStripe) {
|
|
|
|
|
// // this.table_item_class_stripe.background = hexColorToRGBA(customAttr.color.tableItemBgColor, customAttr.color.alpha - 40)
|
|
|
|
|
@ -283,18 +425,11 @@ export default {
|
|
|
|
|
this.title_class.fontSize = customStyle.text.fontSize + 'px'
|
|
|
|
|
this.title_class.color = customStyle.text.color
|
|
|
|
|
this.title_class.textAlign = customStyle.text.hPosition
|
|
|
|
|
this.title_class.fontStyle = customStyle.text.isItalic
|
|
|
|
|
? 'italic'
|
|
|
|
|
: 'normal'
|
|
|
|
|
this.title_class.fontWeight = customStyle.text.isBolder
|
|
|
|
|
? 'bold'
|
|
|
|
|
: 'normal'
|
|
|
|
|
this.title_class.fontStyle = customStyle.text.isItalic ? 'italic' : 'normal'
|
|
|
|
|
this.title_class.fontWeight = customStyle.text.isBolder ? 'bold' : 'normal'
|
|
|
|
|
}
|
|
|
|
|
if (customStyle.background) {
|
|
|
|
|
this.bg_class.background = hexColorToRGBA(
|
|
|
|
|
customStyle.background.color,
|
|
|
|
|
customStyle.background.alpha
|
|
|
|
|
)
|
|
|
|
|
this.bg_class.background = hexColorToRGBA(customStyle.background.color, customStyle.background.alpha)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 修改footer合计样式
|
|
|
|
|
@ -304,11 +439,7 @@ export default {
|
|
|
|
|
// console.log(s_table)
|
|
|
|
|
let s = ''
|
|
|
|
|
for (const i in this.table_header_class) {
|
|
|
|
|
s +=
|
|
|
|
|
(i === 'fontSize' ? 'font-size' : i) +
|
|
|
|
|
':' +
|
|
|
|
|
this.table_header_class[i] +
|
|
|
|
|
';'
|
|
|
|
|
s += (i === 'fontSize' ? 'font-size' : i === 'backgroundColor' ? 'background-color' : i) + ':' + this.table_header_class[i] + ';'
|
|
|
|
|
}
|
|
|
|
|
// console.log(s_table)
|
|
|
|
|
for (let i = 0; i < s_table.length; i++) {
|
|
|
|
|
@ -323,29 +454,29 @@ export default {
|
|
|
|
|
return this.table_item_class
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
getColumStyle({ columnIndex }) {
|
|
|
|
|
if (this.chart.type === 'table-normal' && this.cellDimension > 0 && (columnIndex < this.cellDimension || columnIndex === this.fields.length - 1)) {
|
|
|
|
|
return this.table_header_class
|
|
|
|
|
} else {
|
|
|
|
|
return ''
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
summaryMethod({ columns, data }) {
|
|
|
|
|
const that = this
|
|
|
|
|
const means = [] // 合计
|
|
|
|
|
const findValueIndex = this.chart.data.fields.findIndex(e => e.chartType === 'bar')
|
|
|
|
|
columns.forEach((column, columnIndex) => {
|
|
|
|
|
if (columnIndex === 0) {
|
|
|
|
|
means.push('合计')
|
|
|
|
|
if (this.cellDimension > 0 && findValueIndex !== -1) {
|
|
|
|
|
means.push(`合计(${this.chart.data.fields[findValueIndex].name})`)
|
|
|
|
|
} else {
|
|
|
|
|
means.push('合计')
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
let isRatio = false
|
|
|
|
|
if (
|
|
|
|
|
columnIndex >=
|
|
|
|
|
that.chart.data.fields.length - that.chart.data.series.length
|
|
|
|
|
) {
|
|
|
|
|
const values = data.map((item) => {
|
|
|
|
|
let a = item[column.property]
|
|
|
|
|
if (a.indexOf && a.indexOf('%') >= 0) {
|
|
|
|
|
a = a.replace('%', '')
|
|
|
|
|
isRatio = true
|
|
|
|
|
}
|
|
|
|
|
return Number(a)
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
if (columnIndex >= that.chart.data.fields.length - that.chart.data.series.length || this.cellDimension > 0) {
|
|
|
|
|
const values = data.map(item => Number(item[column.property]))
|
|
|
|
|
// 合计
|
|
|
|
|
if (!values.every((value) => isNaN(value))) {
|
|
|
|
|
if (!values.every(value => isNaN(value))) {
|
|
|
|
|
means[columnIndex] = values.reduce((prev, curr) => {
|
|
|
|
|
const value = Number(curr)
|
|
|
|
|
if (!isNaN(value)) {
|
|
|
|
|
@ -354,14 +485,7 @@ export default {
|
|
|
|
|
return prev
|
|
|
|
|
}
|
|
|
|
|
}, 0)
|
|
|
|
|
means[columnIndex] = (means[columnIndex] + '').includes('.')
|
|
|
|
|
? means[columnIndex].toFixed(2)
|
|
|
|
|
: means[columnIndex]
|
|
|
|
|
if (isRatio) {
|
|
|
|
|
means[columnIndex] =
|
|
|
|
|
means[columnIndex] > 100 ? 100 : means[columnIndex]
|
|
|
|
|
means[columnIndex] += '%'
|
|
|
|
|
}
|
|
|
|
|
means[columnIndex] = (means[columnIndex] + '').includes('.') ? means[columnIndex].toFixed(2) : means[columnIndex]
|
|
|
|
|
} else {
|
|
|
|
|
means[columnIndex] = ''
|
|
|
|
|
}
|
|
|
|
|
@ -409,32 +533,38 @@ export default {
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
.table-class >>> .body--wrapper {
|
|
|
|
|
background: rgba(1, 1, 1, 0);
|
|
|
|
|
}
|
|
|
|
|
.table-class >>> .elx-cell {
|
|
|
|
|
max-height: none !important;
|
|
|
|
|
line-height: normal !important;
|
|
|
|
|
}
|
|
|
|
|
.table-page {
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 0;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
width: 100%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
.page-style {
|
|
|
|
|
margin-right: auto;
|
|
|
|
|
}
|
|
|
|
|
.total-style {
|
|
|
|
|
flex: 1;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
color: #606266;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
}
|
|
|
|
|
.page-style >>> .el-input__inner {
|
|
|
|
|
height: 24px;
|
|
|
|
|
}
|
|
|
|
|
.table-class>>>.body--wrapper{
|
|
|
|
|
background: rgba(1,1,1,0);
|
|
|
|
|
}
|
|
|
|
|
.table-class>>>.elx-cell{
|
|
|
|
|
max-height: none!important;
|
|
|
|
|
line-height: normal!important;
|
|
|
|
|
}
|
|
|
|
|
.table-page{
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 0;
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
width: 100%;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
}
|
|
|
|
|
.page-style{
|
|
|
|
|
margin-right: auto;
|
|
|
|
|
}
|
|
|
|
|
.total-style{
|
|
|
|
|
flex: 1;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
color: #606266;
|
|
|
|
|
white-space:nowrap;
|
|
|
|
|
}
|
|
|
|
|
.page-style >>> .el-input__inner{
|
|
|
|
|
height: 24px;
|
|
|
|
|
}
|
|
|
|
|
.colum-header {
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
color: #000;
|
|
|
|
|
background: rgb(78, 129, 187);
|
|
|
|
|
height: 36px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
|
