首页优化
This commit is contained in:
parent
59d3f54666
commit
b85755ed33
|
|
@ -64,7 +64,7 @@
|
|||
<a-row :gutter="24">
|
||||
<a-col :xl="24" :style="{ marginBottom: '24px' }">
|
||||
<div class="container">
|
||||
<div id="map1" style="width: 100%; height: 400px;"></div>
|
||||
<div id="map1" style="width: 100%; height: 600px;"></div>
|
||||
</div>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
|
@ -196,10 +196,12 @@ export default {
|
|||
seriesData.push({
|
||||
name: i + '级累计总通过率',
|
||||
type: 'bar',
|
||||
// barWidth: '30%',
|
||||
//设置柱状图大小
|
||||
barWidth: "10%",
|
||||
data: yData,
|
||||
//柱子间距
|
||||
barGap: '30%',
|
||||
//颜色
|
||||
|
||||
itemStyle: {
|
||||
normal: {
|
||||
label: {
|
||||
|
|
@ -208,7 +210,7 @@ export default {
|
|||
formatter: '{c}%',
|
||||
textStyle: { //数值样式
|
||||
color: 'black',
|
||||
fontSize: 13
|
||||
fontSize: 10
|
||||
},
|
||||
},
|
||||
color: colors[j++]
|
||||
|
|
@ -253,9 +255,6 @@ export default {
|
|||
title: {
|
||||
text: "本批次学院通过率排名",
|
||||
},
|
||||
|
||||
|
||||
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
axisPointer: {
|
||||
|
|
@ -290,7 +289,7 @@ export default {
|
|||
left: '3%',
|
||||
right: '4%',
|
||||
bottom: '3%',
|
||||
containLabel: true
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
|
|
@ -323,7 +322,9 @@ export default {
|
|||
name: '累计总通过率',
|
||||
type: 'bar',
|
||||
data: seriesData[0].data,
|
||||
barWidth: '60%',
|
||||
//设置柱状图大小
|
||||
barWidth: 20,
|
||||
// barWidth: '60%',
|
||||
itemStyle: {
|
||||
normal: {
|
||||
label: {
|
||||
|
|
|
|||
|
|
@ -14,14 +14,14 @@
|
|||
<a-table :dataSource="dataSourceCet4" :columns="columns" :pagination='false' bordered>
|
||||
<template v-slot:passRateSlot>
|
||||
累计总通过率
|
||||
<a-tooltip title="累计通过人数 / (学院 / 专业总人数)" placement="top">
|
||||
<a-tooltip :title="'累计通过人数 / ' + this.totalName + '总人数'" placement="top">
|
||||
<a-icon type="question-circle" />
|
||||
</a-tooltip>
|
||||
</template>
|
||||
</a-table>
|
||||
<div style="display: flex; justify-content: space-between; font-size: 15px; margin-top: 10px;"
|
||||
v-if="total && total > 0">
|
||||
<span>学院 / 专业总人数: {{ total }}</span>
|
||||
<span>{{ this.totalName }}总人数：{{ total }}</span>
|
||||
<span>累计通过人数: {{ passNumberBottom }}</span>
|
||||
<span>累计总通过率: {{ passRateBottom }}</span>
|
||||
</div>
|
||||
|
|
@ -52,7 +52,7 @@ export default {
|
|||
dataSourceCet4: [],
|
||||
columns: [
|
||||
{
|
||||
title: '年级',
|
||||
title: '学年',
|
||||
dataIndex: 'grade',
|
||||
key: 'grade',
|
||||
align: 'center',
|
||||
|
|
@ -73,7 +73,7 @@ export default {
|
|||
align: 'center',
|
||||
},
|
||||
{
|
||||
title: '新通过人数',
|
||||
title: '通过人数',
|
||||
dataIndex: 'passNumber',
|
||||
key: 'passNumber',
|
||||
align: 'center',
|
||||
|
|
@ -101,6 +101,7 @@ export default {
|
|||
getCollegeMajor: '/cet/getCollegeMajor'
|
||||
},
|
||||
total: 0,
|
||||
totalName: '',
|
||||
passNumberBottom: 0,
|
||||
passRateBottom: 0,
|
||||
passRatePie: [],
|
||||
|
|
@ -187,10 +188,11 @@ export default {
|
|||
console.log("tableData", tableData);
|
||||
this.dataSourceCet4 = tableData;//表格数据
|
||||
this.total = result.total;//总人数
|
||||
this.totalName = result.totalName;//总人数名称
|
||||
this.passNumberBottom = result.passNumber;//通过人数
|
||||
this.passRateBottom = (result.passRate * 100).toFixed(1) + '%';//通过率
|
||||
//内置饼图
|
||||
this.passRatePie =[]//清空数据
|
||||
this.passRatePie = []//清空数据
|
||||
this.passRatePie.push({ value: result.passRate, name: '已通过' });
|
||||
this.passRatePie.push({ value: 1 - result.passRate, name: '未通过' })
|
||||
piedata.push({ value: (1 - passrate).toFixed(3), name: '未通过' });//外置饼图
|
||||
|
|
@ -215,11 +217,11 @@ export default {
|
|||
trigger: 'item',
|
||||
confine: false,
|
||||
//字体大小
|
||||
itemStyle:{
|
||||
fontSize:100
|
||||
itemStyle: {
|
||||
fontSize: 100
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
title: {
|
||||
text: '四级通过率分析',
|
||||
left: 'left',
|
||||
|
|
@ -232,70 +234,60 @@ export default {
|
|||
top: '5%',
|
||||
left: 'center'
|
||||
},
|
||||
color: ['#ff2d51', '#ff4777', '#f47983', '#ffb3a7', '#91cc75'],
|
||||
|
||||
series: [
|
||||
//内圈饼图
|
||||
{
|
||||
name: '四级通过率',
|
||||
type: 'pie',
|
||||
radius: ['0', '30%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
borderRadius: 3,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2,
|
||||
normal: {
|
||||
color: function (colors) {
|
||||
var colorList = ['#00CD66', '#FF6A6A'];
|
||||
return colorList[colors.dataIndex];
|
||||
}
|
||||
},
|
||||
},
|
||||
label: {
|
||||
position: 'inner',
|
||||
fontSize: 14
|
||||
},
|
||||
emphasis: {
|
||||
label: {
|
||||
show: true,
|
||||
fontSize: 20,
|
||||
fontWeight: 'bold'
|
||||
}
|
||||
},
|
||||
data: this.passRatePie
|
||||
},
|
||||
// {
|
||||
// name: '四级通过率',
|
||||
// type: 'pie',
|
||||
// radius: ['0', '30%'],
|
||||
// avoidLabelOverlap: false,
|
||||
// itemStyle: {
|
||||
// borderRadius: 3,
|
||||
// borderColor: '#fff',
|
||||
// borderWidth: 2,
|
||||
// },
|
||||
// label: {
|
||||
// position: 'inner',
|
||||
// fontSize: 14
|
||||
// },
|
||||
// emphasis: {
|
||||
// label: {
|
||||
// show: true,
|
||||
// fontSize: 20,
|
||||
// fontWeight: 'bold'
|
||||
// }
|
||||
// },
|
||||
// data: this.passRatePie
|
||||
// },
|
||||
//外圈饼图
|
||||
{
|
||||
name: '四级通过率',
|
||||
type: 'pie',
|
||||
radius: ['40%', '60%'],
|
||||
avoidLabelOverlap: false,
|
||||
radius: ['35%', '60%'],
|
||||
itemStyle: {
|
||||
borderRadius: 10,
|
||||
borderColor: '#fff',
|
||||
borderWidth: 2,
|
||||
normal: {
|
||||
color: function (colors) {
|
||||
var colorList = ['#008B45', '#00CD66', '#00EE76', '#baf5bf', '#FF6A6A'];
|
||||
return colorList[colors.dataIndex];
|
||||
}
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
fontSize:14,
|
||||
fontSize: 14,
|
||||
overflow: 'truncate'
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
fontSize: 20,
|
||||
fontSize: 15,
|
||||
fontWeight: 'bold'
|
||||
}
|
||||
},
|
||||
// labelLine: {
|
||||
// show: false
|
||||
// },
|
||||
data: piedata
|
||||
}
|
||||
]
|
||||
|
|
|
|||
Loading…
Reference in New Issue