fix:修改预览页面文字颜色未被加载的问题

This commit is contained in:
zhangyu
2020-12-04 17:42:07 +08:00
parent 053f1f123b
commit 1120bef05a

View File

@@ -123,7 +123,7 @@
<div class="line-area" ref="singleStatArea" id="singleStatArea" style="margin-top:0px; text-align:center; <div class="line-area" ref="singleStatArea" id="singleStatArea" style="margin-top:0px; text-align:center;
vertical-align: middle; vertical-align: middle;
display:table-cell; display:table-cell;
font-size:30px;"> font-size:30px;" :style="{color:mapping&&mapping.color?mapping.color.text:'#000',background:mapping&&mapping.color?mapping.color.bac:'#fff'}">
{{serieSingleStat}} {{serieSingleStat}}
<div class="chart-no-data" v-show="noData">No Data</div> <div class="chart-no-data" v-show="noData">No Data</div>
</div> </div>
@@ -143,7 +143,7 @@
</el-table-column> </el-table-column>
<el-table-column sortable prop="value" :label="$t('dashboard.panel.chartTableColumn.value')" width="90"> <el-table-column sortable prop="value" :label="$t('dashboard.panel.chartTableColumn.value')" width="90">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.value}} <div :style="{color:mapping&&mapping.color?mapping.color.text:'#000',background:mapping&&mapping.color?mapping.color.bac:'#fff',margin: '10px 0'}">{{ scope.row.value}}</div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@@ -252,6 +252,7 @@
pageHeight:40, pageHeight:40,
hasLegendOptions:false, hasLegendOptions:false,
screenLegendOptions:[], screenLegendOptions:[],
mapping:{},
}; };
}, },
computed: { computed: {
@@ -553,7 +554,7 @@
this.setData(_chartItem, series, legend); this.setData(_chartItem, series, legend);
}else if(chartItem.type ==='singleStat'){ }else if(chartItem.type ==='singleStat'){
if(Number(singleStatRlt)){ if(Number(singleStatRlt)){
let singleStatTmp =parseFloat(Number(singleStatRlt).toFixed(2)); let singleStatTmp =parseFloat(Number(singleStatRlt).toFixed(2));//parseFloat 如果没有小数点或者小数点后都是零parseFloat() 会返回整数
if(chartItem.param.valueMapping && chartItem.param.valueMapping.type){ if(chartItem.param.valueMapping && chartItem.param.valueMapping.type){
let type=chartItem.param.valueMapping.type; let type=chartItem.param.valueMapping.type;
let mappings=chartItem.param.valueMapping.mapping?chartItem.param.valueMapping.mapping:[]; let mappings=chartItem.param.valueMapping.mapping?chartItem.param.valueMapping.mapping:[];
@@ -563,7 +564,12 @@
}else{ }else{
mapping=mappings.find(item=>{return item.from <= singleStatTmp&& item.to >= singleStatTmp}); mapping=mappings.find(item=>{return item.from <= singleStatTmp&& item.to >= singleStatTmp});
} }
this.serieSingleStat = mapping?mapping.text:chartDataFormat.getUnit(chartItem.unit?chartItem.unit:2).compute(singleStatTmp,null,2); this.mapping=mapping;
if(this.mapping&&!this.mapping.color){
this.mapping.color={bac:'#fff',text:'#000'}
}
console.log(mapping)
this.serieSingleStat = mapping?mapping.text.replace('{{value}}', singleStatTmp):chartDataFormat.getUnit(chartItem.unit?chartItem.unit:2).compute(singleStatTmp,null,2);
}else{ }else{
this.serieSingleStat = chartDataFormat.getUnit(chartItem.unit?chartItem.unit:2).compute(singleStatTmp,null,2); this.serieSingleStat = chartDataFormat.getUnit(chartItem.unit?chartItem.unit:2).compute(singleStatTmp,null,2);
} }
@@ -1042,8 +1048,8 @@
}else{ }else{
mapping=mappings.find(t=>{return t.from <= value&& t.to >= value}); mapping=mappings.find(t=>{return t.from <= value&& t.to >= value});
} }
item.value = mapping?mapping.text:this.unit.compute(value,null,2); this.mapping=mapping;
console.log('value',value,'mapping',mapping) item.value = mapping?mapping.text.replace('{{value}}', item.value):this.unit.compute(value,null,2);
} }
return item; return item;
}) })