重在处理接口返回的数据
1. 数据：
dataDetails: {
test_result: {
test_bugs: {
"test_bugs_trend": {
"-06-30": {
"已修复": 7,
"已创建": 10
},
"-07-01": {
"已修复": 1,
"已创建": 1
},
"-07-02": {
"已修复": 2,
"已创建": 2
},
},
}
}
}
// 数据处理缺陷发展趋势堆叠柱状图
computed: {
// 获取日期
bugsTrendData() {
const obj = this.detailsData.test_result.test_bugs.test_bugs_trend;
return Object.keys(obj);
},
// 获取已修复数组
bugsTrendFixedArr() {
const obj = this.detailsData.test_result.test_bugs.test_bugs_trend;
return this.bugsTrendData.map((item) => obj[item]['已修复']);
},
// 获取已创建数组
bugsTrendCreatedArr() {
const obj = this.detailsData.test_result.test_bugs.test_bugs_trend;
return this.bugsTrendData.map((item) => obj[item]['已创建']);
},
},
methods: {
// 缺陷发展趋势
let bugsTrendData = echarts.init(
document.getElementById('bugsTrendData')
);
bugsTrendData.setOption({
title: {
text: '',
},
tooltip: {},
legend: {
data: ['已修复', '已创建'],
},
xAxis: {
data: this.bugsTrendData,
},
yAxis: {},
series: [
{
name: '已修复',
data: this.bugsTrendFixedArr,
type: 'line',
stack: 'x',
emphasis: {
focus: 'series',
},
itemStyle: {
normal: {
color: '#8dc1a9',
},
},
},
{
name: '已创建',
data: this.bugsTrendCreatedArr,
type: 'line',
stack: 'x',
emphasis: {
focus: 'series',
},
itemStyle: {
normal: {
color: '#dd6b66',
},
},
},
],
});
}
