完善学院对比
This commit is contained in:
parent
29f5da8c52
commit
7fc0f45a6a
|
@ -10,8 +10,7 @@
|
|||
|
||||
<div>
|
||||
<div class="query">
|
||||
<a-select v-model:value="oneentrydate" style="width: 200px" :options="entrydateOptions"
|
||||
@change="onCollegeMajorChange"></a-select>
|
||||
<a-select v-model:value="oneentrydate" style="width: 200px" :options="entrydateOptions"></a-select>
|
||||
<a-button style="margin-left: 10px;" type="primary" @click="allQuery">查询</a-button>
|
||||
</div>
|
||||
|
||||
|
@ -79,7 +78,8 @@
|
|||
<div>
|
||||
<div class="query">
|
||||
<a-cascader v-model:value="collegeMajor" style="width: 300px;margin-right: 20px;"
|
||||
:options="collegeMajorOptions" :changeOnSelect="false" multiple :maxTagCount="2" />
|
||||
:options="collegeMajorOptions" :changeOnSelect="false" multiple :maxTagCount="2"
|
||||
@change="onMajorChange" />
|
||||
<a-select v-model:value="majorentrydate" style="width: 200px" :options="entrydateOptions" mode="multiple"
|
||||
:max-tag-count="2" @change="onCollegeMajorChange"></a-select>
|
||||
<a-button style="margin-left: 10px;" type="primary" @click="majorQuery">查询</a-button>
|
||||
|
@ -228,6 +228,25 @@ export default {
|
|||
};
|
||||
},
|
||||
methods: {
|
||||
onMajorChange(value) {
|
||||
console.log(value, "value")
|
||||
let length = value.length;
|
||||
//遍历value,与this.collegeMajorOptions比较,如果value中的数据在this.collegeMajorOptions中则获得他的children长度
|
||||
for (let i = 0; i < value.length; i++) {
|
||||
for (let j = 0; j < this.collegeMajorOptions.length; j++) {
|
||||
if (value[i] == this.collegeMajorOptions[j].value) {
|
||||
length += this.collegeMajorOptions[j].children.length;
|
||||
length -= 1;
|
||||
if (length > 5) {
|
||||
message.error("最多选择五个专业")
|
||||
//删除value最后一个数据
|
||||
value.pop();
|
||||
return
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
allQuery() {
|
||||
this.tab1loading = true;
|
||||
let college = ['全校'];
|
||||
|
@ -238,9 +257,18 @@ export default {
|
|||
this.query(query, college, [this.oneentrydate]);
|
||||
},
|
||||
async majorQuery() {
|
||||
if (this.collegeMajor.length == 0 || this.collegeMajor == null) {
|
||||
message.error("请选择专业")
|
||||
return
|
||||
}
|
||||
if (this.majorentrydate.length == 0) {
|
||||
message.error("请选择年级")
|
||||
return
|
||||
}
|
||||
this.tab3loading = true;
|
||||
let res = null;
|
||||
try {
|
||||
|
||||
let params = {
|
||||
college: this.collegeMajor,
|
||||
entrydate: this.majorentrydate,
|
||||
|
@ -257,6 +285,15 @@ export default {
|
|||
}
|
||||
},
|
||||
collegeQuery() {
|
||||
|
||||
if (this.collegetab2.length == 0) {
|
||||
message.error("请选择学院")
|
||||
return
|
||||
}
|
||||
if (this.collegeentrydate.length == 0) {
|
||||
message.error("请选择年级")
|
||||
return
|
||||
}
|
||||
this.tab2loading = true;
|
||||
let query = 'tab2'
|
||||
this.query(query, this.collegetab2, this.collegeentrydate);
|
||||
|
@ -326,41 +363,45 @@ export default {
|
|||
});
|
||||
},
|
||||
onCollegeMajorChange(value) {
|
||||
console.log(value, "value")
|
||||
if(value.length>3){
|
||||
message.error("最多选择三个")
|
||||
//删除value最后一个数据
|
||||
value.pop();
|
||||
console.log(value, "value")
|
||||
if (value.length > 3) {
|
||||
message.error("最多选择三个")
|
||||
//删除value最后一个数据
|
||||
value.pop();
|
||||
|
||||
return
|
||||
}
|
||||
return
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
//tab3图标
|
||||
drawChart(data,tab){
|
||||
//tab2\3图标
|
||||
drawChart(data, tab) {
|
||||
let seriesData = [];
|
||||
|
||||
let xData = this.majorentrydate.sort((a, b) => a - b);
|
||||
if (tab == 'tab2') {
|
||||
xData = this.collegeentrydate.sort((a, b) => a - b);
|
||||
}
|
||||
let k = 0;
|
||||
let legendData = [];
|
||||
let colors = ['#5370c5', '#91CC75', '#fac858', '#ee6666', '#73c0de', '#FF6A6A', '#FFA500', '#EE2C2C', '#90EE90', '#008B8B', '#FFC0CB', '#FFDAB9', '#FFDEAD', '#FFE4B5', '#FFE4C4', '#FFE4E1', '#FFEBCD', '#FFEFD5', '#FFFAF0', '#FFFAFA', '#FFFFE0', '#FFFFF0', '#FFFFFF', '#F0F8FF', '#FAEBD7', '#FAF0E6', '#FAFAD2', '#F5FFFA', '#F8F8FF', '#F0FFF0', '#F0FFFF', '#F0E68C', '#F0F8FF', '#F0FFF0', '#F0FFFF', '#F4A460', '#F5DEB3', '#F5F5DC', '#F5F5F5', '#F5FFFA', '#F8F8FF', '#F9EBEA', '#FAD7A0', '#FAF0E6', '#FAFAD2', '#FAF0E6 ']
|
||||
let isJK = false;
|
||||
for(let i in data){
|
||||
|
||||
console.log(i,"i")
|
||||
for (let i in data) {
|
||||
|
||||
console.log(i, "i")
|
||||
legendData.push(i);
|
||||
let yData = [];
|
||||
// legendData=[];
|
||||
console.log(data[i],"data[i]")
|
||||
|
||||
for(let j in data[i]){
|
||||
|
||||
console.log(data[i][j].college,"data[i][j].college111")
|
||||
console.log(data[i], "data[i]")
|
||||
|
||||
for (let j in data[i]) {
|
||||
|
||||
console.log(data[i][j].college, "data[i][j].college111")
|
||||
// if(data[i][j].college == ''){
|
||||
yData.push(data[i][j].passRate);
|
||||
// legendData.push(data[i][j].college);
|
||||
yData.push(data[i][j].passRate);
|
||||
// legendData.push(data[i][j].college);
|
||||
}
|
||||
console.log(yData,"yData")
|
||||
console.log(yData, "yData")
|
||||
seriesData.push({
|
||||
name: i + '级累计总通过率',
|
||||
type: 'bar',
|
||||
|
@ -387,26 +428,26 @@ export default {
|
|||
}
|
||||
});
|
||||
}
|
||||
console.log(legendData,"legendData")
|
||||
console.log(seriesData,'dasaaseriresdata')
|
||||
console.log(legendData, "legendData")
|
||||
console.log(seriesData, 'dasaaseriresdata')
|
||||
// debugger
|
||||
let myChart = null;
|
||||
console.log(tab,"tab")
|
||||
console.log(tab, "tab")
|
||||
if (tab == 'tab2') {
|
||||
myChart=document.getElementById("map2");
|
||||
if(myChart){
|
||||
myChart=echarts.getInstanceByDom(myChart)
|
||||
if(myChart){
|
||||
myChart = document.getElementById("map2");
|
||||
if (myChart) {
|
||||
myChart = echarts.getInstanceByDom(myChart)
|
||||
if (myChart) {
|
||||
myChart.dispose();
|
||||
}
|
||||
}
|
||||
myChart = echarts.init(document.getElementById("map2"));
|
||||
|
||||
} else if (tab == 'tab3') {
|
||||
myChart=document.getElementById("map3");
|
||||
if(myChart){
|
||||
myChart=echarts.getInstanceByDom(myChart)
|
||||
if(myChart){
|
||||
myChart = document.getElementById("map3");
|
||||
if (myChart) {
|
||||
myChart = echarts.getInstanceByDom(myChart)
|
||||
if (myChart) {
|
||||
myChart.dispose();
|
||||
}
|
||||
}
|
||||
|
@ -428,7 +469,7 @@ export default {
|
|||
//生成tooltip,加上小圆球
|
||||
let result = params[0].name + '级通过率<br>';
|
||||
for (let i = 0; i < params.length; i++) {
|
||||
result += params[i].marker + legendData[i]+ ' : ' + params[i].value + '%' + '<br>';
|
||||
result += params[i].marker + legendData[i] + ' : ' + params[i].value + '%' + '<br>';
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
@ -476,7 +517,7 @@ export default {
|
|||
myChart.setOption(option);
|
||||
}, 1)
|
||||
},
|
||||
|
||||
|
||||
|
||||
dataChart(data, tab) {
|
||||
let seriesData = [];
|
||||
|
@ -493,7 +534,7 @@ export default {
|
|||
// 将数据转换为百分比(加上%)
|
||||
yData.push(data[i][key].passRate);
|
||||
}
|
||||
|
||||
|
||||
xData = xData.map(label => label.split("").join("\n"));//将x轴竖着展示
|
||||
seriesData.push({
|
||||
name: i + '级累计总通过率',
|
||||
|
@ -520,6 +561,9 @@ export default {
|
|||
|
||||
}
|
||||
});
|
||||
if (j == colors.length) {
|
||||
j = 0;
|
||||
}
|
||||
let rankData = yData.slice().sort((a, b) => b - a).map((value) => yData.indexOf(value) + 1);
|
||||
//如果选择全校,增加排名
|
||||
if (tab == 'tab1') {
|
||||
|
@ -548,6 +592,9 @@ export default {
|
|||
}
|
||||
}
|
||||
});
|
||||
if (j == colors.length) {
|
||||
j = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
let myChart = null;
|
||||
|
@ -691,19 +738,19 @@ export default {
|
|||
|
||||
this.visible = false;
|
||||
let result = null;
|
||||
console.log(this.college, this.entrydate);
|
||||
//如果this.college和this.batch为null则先赋静态值
|
||||
if (this.college === null || this.college.length === 0) {
|
||||
this.college = ['全校'];
|
||||
}
|
||||
// console.log(this.college, this.entrydate);
|
||||
// //如果this.college和this.batch为null则先赋静态值
|
||||
// if (this.college === null || this.college.length === 0) {
|
||||
// this.college = ['全校'];
|
||||
// }
|
||||
|
||||
|
||||
if (!this.entrydate || this.entrydate.length === 0) {
|
||||
this.entrydate = ['2017'];
|
||||
}
|
||||
// if (!this.entrydate || this.entrydate.length === 0) {
|
||||
// this.entrydate = ['2017'];
|
||||
// }
|
||||
|
||||
try {
|
||||
console.log(this.college, this.entrydate)
|
||||
// console.log(this.college, this.entrydate)
|
||||
let params = {
|
||||
college: college,
|
||||
entrydate: entrydate,
|
||||
|
@ -723,7 +770,7 @@ export default {
|
|||
if (query == 'tab1') {
|
||||
this.dataChart(result.data, query);
|
||||
} else if (query == 'tab2') {
|
||||
this.drawChart(result.data,query);
|
||||
this.drawChart(result.data, query);
|
||||
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue