|
@@ -161,12 +161,6 @@ export default {
|
|
|
const legendData = [];
|
|
const legendData = [];
|
|
|
// 判断个人得分率数据是否有效(非空且包含有效值)
|
|
// 判断个人得分率数据是否有效(非空且包含有效值)
|
|
|
const hasPersonalData = personalList && personalList.length > 0 && personalList.some(data => data !== null && data !== undefined && data !== '');
|
|
const hasPersonalData = personalList && personalList.length > 0 && personalList.some(data => data !== null && data !== undefined && data !== '');
|
|
|
- // 判断班级数据是否有效(非空且包含有效值)
|
|
|
|
|
- const hasClassData = classList && classList.length > 0 && classList.some(score => score !== null && score !== undefined && score !== '');
|
|
|
|
|
- // 判断年级数据是否有效(非空且包含有效值)
|
|
|
|
|
- const hasGradeData = gradeList && gradeList.length > 0 && gradeList.some(data => data !== null && data !== undefined && data !== '');
|
|
|
|
|
-
|
|
|
|
|
-
|
|
|
|
|
// 如果有个人得分率数据,添加个人得分率系列(使用柱状图)
|
|
// 如果有个人得分率数据,添加个人得分率系列(使用柱状图)
|
|
|
if (hasPersonalData) {
|
|
if (hasPersonalData) {
|
|
|
// 将personalList转换为数字数组,确保echarts能正确显示
|
|
// 将personalList转换为数字数组,确保echarts能正确显示
|
|
@@ -174,7 +168,7 @@ export default {
|
|
|
const num = parseFloat(val);
|
|
const num = parseFloat(val);
|
|
|
return isNaN(num) ? null : num;
|
|
return isNaN(num) ? null : num;
|
|
|
});
|
|
});
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
series.push({
|
|
series.push({
|
|
|
name: '个人',
|
|
name: '个人',
|
|
|
type: 'bar',
|
|
type: 'bar',
|
|
@@ -194,84 +188,13 @@ export default {
|
|
|
legendData.push('个人');
|
|
legendData.push('个人');
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
- // 如果有班级数据,添加班级系列(折线图)
|
|
|
|
|
- // if (hasClassData) {
|
|
|
|
|
- // // 将classList转换为数字数组,确保echarts能正确显示
|
|
|
|
|
- // const numericClassList = classList.map(val => {
|
|
|
|
|
- // const num = parseFloat(val);
|
|
|
|
|
- // return isNaN(num) ? null : num;
|
|
|
|
|
- // });
|
|
|
|
|
-
|
|
|
|
|
- // series.push({
|
|
|
|
|
- // name: '班级',
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // data: numericClassList,
|
|
|
|
|
- // itemStyle: {
|
|
|
|
|
- // color: '#ffffff',
|
|
|
|
|
- // borderColor: '#3BA272',
|
|
|
|
|
- // borderWidth: 2 // 边框宽度
|
|
|
|
|
- // },
|
|
|
|
|
- // lineStyle: {
|
|
|
|
|
- // color: '#3BA272',
|
|
|
|
|
- // width: 2
|
|
|
|
|
- // },
|
|
|
|
|
- // // 默认显示圆点
|
|
|
|
|
- // showSymbol: true,
|
|
|
|
|
- // symbol: 'circle',
|
|
|
|
|
- // symbolSize: 10,
|
|
|
|
|
- // // 鼠标经过时显示圆点
|
|
|
|
|
- // emphasis: {
|
|
|
|
|
- // showSymbol: true,
|
|
|
|
|
- // itemStyle: {
|
|
|
|
|
- // color: '#ffffff',
|
|
|
|
|
- // borderColor: '#3BA272',
|
|
|
|
|
- // borderWidth: 3
|
|
|
|
|
- // },
|
|
|
|
|
- // symbolSize: 10
|
|
|
|
|
- // }
|
|
|
|
|
- // });
|
|
|
|
|
- // legendData.push('班级');
|
|
|
|
|
- // }
|
|
|
|
|
-
|
|
|
|
|
- // // 如果有年级数据,添加年级系列
|
|
|
|
|
- // if (hasGradeData) {
|
|
|
|
|
- // // 将gradeList转换为数字数组,确保echarts能正确显示
|
|
|
|
|
- // const numericGradeList = gradeList.map(val => {
|
|
|
|
|
- // const num = parseFloat(val);
|
|
|
|
|
- // return isNaN(num) ? null : num;
|
|
|
|
|
- // });
|
|
|
|
|
-
|
|
|
|
|
- // series.push({
|
|
|
|
|
- // name: '年级',
|
|
|
|
|
- // type: 'line',
|
|
|
|
|
- // data: numericGradeList,
|
|
|
|
|
- // // smooth: true,
|
|
|
|
|
- // itemStyle: {
|
|
|
|
|
- // color: '#ffffff',
|
|
|
|
|
- // borderColor: '#FAC858',
|
|
|
|
|
- // borderWidth: 2 // 边框宽度
|
|
|
|
|
- // },
|
|
|
|
|
- // lineStyle: {
|
|
|
|
|
- // color: '#FAC858',
|
|
|
|
|
- // width: 2
|
|
|
|
|
- // },
|
|
|
|
|
- // // 默认显示圆点
|
|
|
|
|
- // showSymbol: true,
|
|
|
|
|
- // symbol: 'circle',
|
|
|
|
|
- // symbolSize: 10,
|
|
|
|
|
- // // 鼠标经过时显示圆点
|
|
|
|
|
- // emphasis: {
|
|
|
|
|
- // showSymbol: true,
|
|
|
|
|
- // itemStyle: {
|
|
|
|
|
- // color: '#ffffff',
|
|
|
|
|
- // borderColor: '#FAC858',
|
|
|
|
|
- // borderWidth: 3,
|
|
|
|
|
- // },
|
|
|
|
|
- // symbolSize: 10
|
|
|
|
|
- // }
|
|
|
|
|
- // });
|
|
|
|
|
- // legendData.push('年级');
|
|
|
|
|
- // }
|
|
|
|
|
|
|
+ // 计算动态的最大值,基于所有数据的最大值
|
|
|
|
|
+ const allValues = [
|
|
|
|
|
+ ...(personalList || []).filter(v => v !== null && v !== undefined)
|
|
|
|
|
+ ];
|
|
|
|
|
+ const maxValue = allValues.length > 0 ? Math.max(...allValues) : 0;
|
|
|
|
|
+ // 动态计算y轴最大值,满格显示
|
|
|
|
|
+ const dynamicMax = maxValue > 0 ? Math.ceil(maxValue / 10) * 10 : 100;
|
|
|
|
|
|
|
|
// 配置项
|
|
// 配置项
|
|
|
const option = {
|
|
const option = {
|
|
@@ -284,34 +207,10 @@ export default {
|
|
|
if (params.length === 0) return '';
|
|
if (params.length === 0) return '';
|
|
|
let result = `<span style="font-size:14px; font-weight:bold;">${params[0].name}</span>` + ':<br/>';
|
|
let result = `<span style="font-size:14px; font-weight:bold;">${params[0].name}</span>` + ':<br/>';
|
|
|
params.forEach(item => {
|
|
params.forEach(item => {
|
|
|
- let span = '';
|
|
|
|
|
- if (item.seriesName === '年级') {
|
|
|
|
|
- span = `<span
|
|
|
|
|
- style="
|
|
|
|
|
- background-color:#FAC858;
|
|
|
|
|
- width:15px;
|
|
|
|
|
- height:2px;
|
|
|
|
|
- display:block;
|
|
|
|
|
- float:left;
|
|
|
|
|
- border-radius:10px;
|
|
|
|
|
- position:absolute;
|
|
|
|
|
- top:10px;
|
|
|
|
|
- left:0;
|
|
|
|
|
- "></span>`;
|
|
|
|
|
- } else if (item.seriesName === '班级') {
|
|
|
|
|
- span = `<span
|
|
|
|
|
- style="background-color:#3BA272;
|
|
|
|
|
- width:15px;
|
|
|
|
|
- height:2px;
|
|
|
|
|
- display:block;
|
|
|
|
|
- float:left;
|
|
|
|
|
- border-radius:10px;
|
|
|
|
|
- position:absolute;
|
|
|
|
|
- top:10px;
|
|
|
|
|
- left:0;
|
|
|
|
|
- "></span>`;
|
|
|
|
|
- } else {
|
|
|
|
|
- span = `<span
|
|
|
|
|
|
|
+ // 只处理个人数据
|
|
|
|
|
+ if (item.seriesName !== '个人') return;
|
|
|
|
|
+
|
|
|
|
|
+ let span = `<span
|
|
|
style="
|
|
style="
|
|
|
background-color:#5470C6;
|
|
background-color:#5470C6;
|
|
|
width:10px;
|
|
width:10px;
|
|
@@ -322,14 +221,13 @@ export default {
|
|
|
top:7px;
|
|
top:7px;
|
|
|
left:2px;
|
|
left:2px;
|
|
|
"></span>`;
|
|
"></span>`;
|
|
|
- }
|
|
|
|
|
|
|
+
|
|
|
if (item.value !== null && item.value !== undefined && item.value !== '') {
|
|
if (item.value !== null && item.value !== undefined && item.value !== '') {
|
|
|
- result += `<div style="width:100%; margin:0; padding:0; position:relative; padding-left:20px;">${span} <span style="font-size:12px;">${item.seriesName}得分率: ${item.value}%</span></div>`;
|
|
|
|
|
|
|
+ result += `<div style="width:100%; margin:0; padding:0; position:relative; padding-left:20px;">${span} <span style="font-size:12px;">个人得分率: ${item.value}%</span></div>`;
|
|
|
} else {
|
|
} else {
|
|
|
result += `<div style="width:100%; margin:0; padding:0; position:relative; padding-left:20px;">
|
|
result += `<div style="width:100%; margin:0; padding:0; position:relative; padding-left:20px;">
|
|
|
- ${span} <span style="font-size:12px;">${item.seriesName}得分率:暂无数据</span>
|
|
|
|
|
|
|
+ ${span} <span style="font-size:12px;">个人得分率:暂无数据</span>
|
|
|
</div>`;
|
|
</div>`;
|
|
|
-
|
|
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
|
return result;
|
|
return result;
|
|
@@ -350,9 +248,7 @@ export default {
|
|
|
selectedMode: 'multiple',
|
|
selectedMode: 'multiple',
|
|
|
selected: {
|
|
selected: {
|
|
|
// 默认选中所有有数据的系列
|
|
// 默认选中所有有数据的系列
|
|
|
- ...(hasClassData ? { '班级': true } : {}),
|
|
|
|
|
...(hasPersonalData ? { '个人': true } : {}),
|
|
...(hasPersonalData ? { '个人': true } : {}),
|
|
|
- ...(hasGradeData ? { '年级': true } : {})
|
|
|
|
|
}
|
|
}
|
|
|
},
|
|
},
|
|
|
grid: {
|
|
grid: {
|
|
@@ -388,7 +284,7 @@ export default {
|
|
|
fontSize: 14,
|
|
fontSize: 14,
|
|
|
color: '#666',
|
|
color: '#666',
|
|
|
},
|
|
},
|
|
|
- max: 100
|
|
|
|
|
|
|
+ max: dynamicMax
|
|
|
},
|
|
},
|
|
|
series: series
|
|
series: series
|
|
|
};
|
|
};
|
|
@@ -422,14 +318,8 @@ export default {
|
|
|
|
|
|
|
|
// 判断个人数据是否有效
|
|
// 判断个人数据是否有效
|
|
|
const hasPersonalData = this.personalList && this.personalList.length > 0 && this.personalList.some(data => data !== null && data !== undefined);
|
|
const hasPersonalData = this.personalList && this.personalList.length > 0 && this.personalList.some(data => data !== null && data !== undefined);
|
|
|
- // 判断班级数据是否有效
|
|
|
|
|
- //const hasClassData = this.classList && this.classList.length > 0 && this.classList.some(score => score !== null && score !== undefined && score !== '');
|
|
|
|
|
- // 判断年级数据是否有效
|
|
|
|
|
- //const hasGradeData = this.gradeList && this.gradeList.length > 0 && this.gradeList.some(data => data !== null && data !== undefined);
|
|
|
|
|
|
|
|
|
|
if (hasPersonalData) selected['个人'] = showAll;
|
|
if (hasPersonalData) selected['个人'] = showAll;
|
|
|
- //if (hasClassData) selected['班级'] = showAll;
|
|
|
|
|
- //if (hasGradeData) selected['年级'] = showAll;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.chart.setOption({
|
|
this.chart.setOption({
|