修改学院对比样式
This commit is contained in:
parent
7cb5a9e2bb
commit
78d271d832
|
|
@ -5,8 +5,8 @@
|
|||
<a-tab-pane key="1" tab="查询全校各学院通过率">
|
||||
<div>
|
||||
<div class="query">
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-weight: bold">年级:
|
||||
<span style="font-size: 15px; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-weight: bold"
|
||||
>年级:
|
||||
</span>
|
||||
<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>
|
||||
|
|
@ -35,17 +35,44 @@
|
|||
<a-tab-pane key="2" tab="对比多学院" force-render>
|
||||
<div>
|
||||
<div class="query">
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-weight: bold">学院:
|
||||
</span>
|
||||
<a-select v-model:value="collegetab2" style="width: 300px; margin-right: 20px" mode="multiple"
|
||||
:max-tag-count="5" :options="collegeOptions" @change="onCollegeChange"></a-select>
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-weight: bold">年级:
|
||||
</span>
|
||||
<a-select v-model:value="collegeentrydate" style="width: 200px" :options="entrydateOptions"
|
||||
mode="multiple" :max-tag-count="5" @change="onCollegeChange"></a-select>
|
||||
<a-button style="margin-left: 10px" type="primary" @click="collegeQuery">查询</a-button>
|
||||
<div>
|
||||
<div style="display: flex">
|
||||
<span style="font-size: 15px; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-weight: bold"
|
||||
>年级:
|
||||
</span>
|
||||
<a-checkbox-group :options="entrydateOptions" v-model:value="collegeentrydate" @change="onCollegeEntrydateChange" />
|
||||
</div>
|
||||
<div style="display: flex; margin-top: 10px">
|
||||
<span style="font-size: 15px; margin-right: 10px; display: flex; justify-content: center; align-items: center; font-weight: bold"
|
||||
>学院:
|
||||
</span>
|
||||
<a-checkbox-group :options="collegeOptions" v-model:value="collegetab2" @change="onCollegeChange" />
|
||||
</div>
|
||||
|
||||
<div style="margin-top: 20px; margin-right: 20px; display: flex; justify-content: flex-end; align-items: center">
|
||||
<a-button style="margin-left: 10px" type="primary" @click="clearCollege">清除</a-button>
|
||||
<a-button style="margin-left: 10px; " type="primary" @click="collegeQuery">查询</a-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <a-select
|
||||
v-model:value="collegetab2"
|
||||
style="width: 300px; margin-right: 20px"
|
||||
mode="multiple"
|
||||
:max-tag-count="5"
|
||||
:options="collegeOptions"
|
||||
@change="onCollegeChange"
|
||||
></a-select> -->
|
||||
|
||||
<!-- <a-select
|
||||
v-model:value="collegeentrydate"
|
||||
style="width: 200px"
|
||||
:options="entrydateOptions"
|
||||
mode="multiple"
|
||||
:max-tag-count="5"
|
||||
@change="onCollegeChange"
|
||||
></a-select> -->
|
||||
</div>
|
||||
|
||||
<a-card title="按学院分析" :loading="tab2loading" :bordered="false">
|
||||
|
|
@ -82,45 +109,35 @@
|
|||
:max-tag-count="5" @change="onCollegeMajorChange"></a-select>
|
||||
<a-button style="margin-left: 10px;" type="primary" @click="majorQuery">查询</a-button> -->
|
||||
<div style="display: flex">
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center">年级:
|
||||
<span style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center"
|
||||
>年级:
|
||||
</span>
|
||||
<a-checkbox-group v-model:value="majorentrydate" :options="entrydateOptions"
|
||||
@change="onMajorEntrydateChange" />
|
||||
<a-checkbox-group v-model:value="majorentrydate" :options="entrydateOptions" @change="onMajorEntrydateChange" />
|
||||
</div>
|
||||
<div style="display: flex; margin-top: 10px">
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center">学院:
|
||||
<span style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center"
|
||||
>学院:
|
||||
</span>
|
||||
<a-radio-group v-model:value="collegeMajor" :options="collegeMajorOptions"
|
||||
@change="onMajorCollegeChange" />
|
||||
<a-radio-group v-model:value="collegeMajor" :options="collegeMajorOptions" @change="onMajorCollegeChange" />
|
||||
</div>
|
||||
<div style="display: flex; margin-top: 10px">
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center">专业:
|
||||
<span style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center"
|
||||
>专业:
|
||||
</span>
|
||||
<a-checkbox-group v-model:value="majorCheckOn" :options="majorOptions" @change="onCollegeMajorChange" />
|
||||
</div>
|
||||
<div style="margin-top: 10px">
|
||||
<span
|
||||
style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; align-items: center">已选择:
|
||||
<a-tag v-for="(item, index) in lastCollegeMajor" :key="item[1]"
|
||||
style="margin-left: 10px; font-size: 13px;" color="blue">
|
||||
<span style="font-size: 15px; margin-right: 10px; font-weight: bold; display: flex; align-items: center"
|
||||
>已选择:
|
||||
<a-tag v-for="(item, index) in lastCollegeMajor" :key="item[1]" style="margin-left: 10px; font-size: 13px" color="blue">
|
||||
{{ item[1] }}
|
||||
<a-icon type="close" style="font-size: 15px;" @click="removeTag(index)" />
|
||||
<a-icon type="close" style="font-size: 15px" @click="removeTag(index)" />
|
||||
</a-tag>
|
||||
</span>
|
||||
</div>
|
||||
<div style="margin-top: 20px;margin-right: 20px;
|
||||
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
|
||||
">
|
||||
<a-button style="margin-left: 10px;" type="primary" @click="clear">清除</a-button>
|
||||
<a-button style="margin-left: 10px;" type="primary" @click="majorQuery">查询</a-button>
|
||||
|
||||
<div style="margin-top: 20px; margin-right: 20px; display: flex; justify-content: flex-end; align-items: center">
|
||||
<a-button style="margin-left: 10px" type="primary" @click="clearMajor">清除</a-button>
|
||||
<a-button style="margin-left: 10px" type="primary" @click="majorQuery">查询</a-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -254,9 +271,14 @@ export default {
|
|||
entrydateOptions: [],
|
||||
entrydate: [],
|
||||
majorCheckOn: [],
|
||||
//对不同的学院选择的专业进行记忆化
|
||||
lastCollegeMajor: [],
|
||||
majorLength: 0,
|
||||
majorOptions: [],
|
||||
//对学院对比学院进行记忆化上次选择结果
|
||||
lastCollege: [],
|
||||
//对学院对比学院进行记忆化上次选择结果
|
||||
lastCollegeEntrydate: [],
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -386,7 +408,7 @@ export default {
|
|||
|
||||
// });
|
||||
// this.college = ['全校'];
|
||||
this.collegetab2 = ['地理科学学院', '文学院'];
|
||||
// this.collegetab2 = ['地理科学学院', '文学院'];
|
||||
console.log(this.collegeOptions, 'collegeOptions');
|
||||
});
|
||||
},
|
||||
|
|
@ -405,15 +427,37 @@ export default {
|
|||
}
|
||||
this.lastMajorEntrydate = value;
|
||||
},
|
||||
//学院对比学院选项回调函数
|
||||
//学院对比 学院选项回调函数
|
||||
onCollegeChange(value) {
|
||||
console.log(value, 'value');
|
||||
if (value.length > 5) {
|
||||
message.error('最多选择五个');
|
||||
//删除value最后一个数据
|
||||
value.pop();
|
||||
//和lastCollege比较，如果value中的数据不在lastCollege中则删除
|
||||
for (let i = 0; i < value.length; i++) {
|
||||
if (!this.lastCollege.includes(value[i])) {
|
||||
value.splice(i, 1);
|
||||
return;
|
||||
}
|
||||
}
|
||||
return;
|
||||
}
|
||||
this.lastCollege = value;
|
||||
},
|
||||
//学院对比 年级选项回调函数
|
||||
onCollegeEntrydateChange(value) {
|
||||
console.log(value, 'value');
|
||||
if (value.length > 5) {
|
||||
message.error('最多选择五个');
|
||||
//和lastCollegeEntrydate比较，如果value中的数据不在lastCollegeEntrydate中则删除
|
||||
for (let i = 0; i < value.length; i++) {
|
||||
if (!this.lastCollegeEntrydate.includes(value[i])) {
|
||||
value.splice(i, 1);
|
||||
return;
|
||||
}
|
||||
}
|
||||
return;
|
||||
}
|
||||
this.lastCollegeEntrydate = value;
|
||||
},
|
||||
//专业选项回调函数
|
||||
onCollegeMajorChange(value) {
|
||||
|
|
@ -444,7 +488,7 @@ export default {
|
|||
},
|
||||
removeTag(index) {
|
||||
if (this.majorCheckOn.includes(this.lastCollegeMajor[index][1])) {
|
||||
let index1 = this.majorCheckOn.indexOf(this.lastCollegeMajor[index][1])
|
||||
let index1 = this.majorCheckOn.indexOf(this.lastCollegeMajor[index][1]);
|
||||
this.majorCheckOn.splice(index1, 1);
|
||||
}
|
||||
this.lastCollegeMajor.splice(index, 1);
|
||||
|
|
@ -474,11 +518,17 @@ export default {
|
|||
console.log(this.majorCheckOn, 'majorCheckOn');
|
||||
},
|
||||
|
||||
clear() {
|
||||
clearMajor() {
|
||||
this.majorCheckOn = [];
|
||||
this.lastCollegeMajor = [];
|
||||
this.majorLength = 0;
|
||||
},
|
||||
clearCollege() {
|
||||
this.collegetab2 = [];
|
||||
this.collegeentrydate = [];
|
||||
this.lastCollege = [];
|
||||
this.lastCollegeEntrydate = [];
|
||||
},
|
||||
//tab2\3图标
|
||||
drawChart(data, tab) {
|
||||
let seriesData = [];
|
||||
|
|
@ -936,7 +986,7 @@ export default {
|
|||
const getEntrydate = await defHttp.get({ url: this.Url.getEntrydate });
|
||||
this.entrydateOptions = getEntrydate.entrydates;
|
||||
this.oneentrydate = this.entrydateOptions[0].value;
|
||||
this.collegeentrydate = [this.entrydateOptions[0].value];
|
||||
// this.collegeentrydate = [this.entrydateOptions[0].value];
|
||||
this.majorentrydate = [this.entrydateOptions[0].value];
|
||||
// this.entrydate.push (this.entrydateOptions[0].value);
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue