250 lines
8.0 KiB
Vue
250 lines
8.0 KiB
Vue
<template>
|
||
<div>
|
||
<div class="select">
|
||
<div style="width: 100%">
|
||
院校省份:
|
||
<a-radio-group v-model:value="shengfen">
|
||
<a-radio-button
|
||
:value="index"
|
||
v-for="item,index in shengfenlist"
|
||
:key="item.area_id"
|
||
>{{ item.area_name }}</a-radio-button>
|
||
</a-radio-group>
|
||
<br />城市:
|
||
<a-radio-group v-model:value="chengshi">
|
||
<a-radio-button
|
||
:value="index"
|
||
v-for="item,index in chengshilist"
|
||
:key="item.area_id"
|
||
>{{ item.area_name }}</a-radio-button>
|
||
</a-radio-group>
|
||
<br />已选择:
|
||
<a-button
|
||
v-for="item,index in xaunzelist"
|
||
:key="index"
|
||
@click="removexuanzhong(index)"
|
||
>{{ item }}</a-button>
|
||
<br />
|
||
</div>
|
||
<div style="width: 100%">
|
||
学历层次:
|
||
<a-button
|
||
@click="shaixuan.benke == 1 ? shaixuan.benke = 0 : shaixuan.benke = 1"
|
||
:type="shaixuan.benke == 1 ? 'primary' : 'link'"
|
||
>本科</a-button>
|
||
<a-button
|
||
@click="shaixuan.zhuanke == 1 ? shaixuan.zhuanke = 0 : shaixuan.zhuanke = 1"
|
||
:type="shaixuan.zhuanke == 1 ? 'primary' : 'link'"
|
||
>专科</a-button>
|
||
<br />学院层次:
|
||
<a-button
|
||
@click="shaixuan.is985 == 1 ? shaixuan.is985 = 0 : shaixuan.is985 = 1"
|
||
:type="shaixuan.is985 == 1 ? 'primary' : 'link'"
|
||
>985</a-button>
|
||
<a-button
|
||
@click="shaixuan.is211 == 1 ? shaixuan.is211 = 0 : shaixuan.is211 = 1"
|
||
:type="shaixuan.is211 == 1 ? 'primary' : 'link'"
|
||
>211</a-button>
|
||
<a-button
|
||
@click="shaixuan.yiliuxveke == 1 ? shaixuan.yiliuxveke = 0 : shaixuan.yiliuxveke = 1"
|
||
:type="shaixuan.yiliuxveke == 1 ? 'primary' : 'link'"
|
||
>一流学科建设</a-button>
|
||
<a-button
|
||
@click="shaixuan.yiliudaxve == 1 ? shaixuan.yiliudaxve = 0 : shaixuan.yiliudaxve = 1"
|
||
:type="shaixuan.yiliudaxve == 1 ? 'primary' : 'link'"
|
||
>一流大学建设</a-button>
|
||
<a-button
|
||
@click="shaixuan.gongban == 1 ? shaixuan.gongban = 0 : shaixuan.gongban = 1"
|
||
:type="shaixuan.gongban == 1 ? 'primary' : 'link'"
|
||
>公办</a-button>
|
||
<a-button
|
||
@click="shaixuan.minban == 1 ? shaixuan.minban = 0 : shaixuan.minban = 1"
|
||
:type="shaixuan.minban == 1 ? 'primary' : 'link'"
|
||
>民办</a-button>
|
||
<br />已选择:
|
||
<a-button
|
||
v-if="shaixuan.benke == 1"
|
||
@click="shaixuan.benke == 1 ? shaixuan.benke = 0 : shaixuan.benke = 1"
|
||
:type="shaixuan.benke == 1 ? 'primary' : 'link'"
|
||
>本科</a-button>
|
||
<a-button
|
||
v-if="shaixuan.zhuanke == 1"
|
||
@click="shaixuan.zhuanke == 1 ? shaixuan.zhuanke = 0 : shaixuan.zhuanke = 1"
|
||
:type="shaixuan.zhuanke == 1 ? 'primary' : 'link'"
|
||
>专科</a-button>
|
||
<a-button
|
||
v-if="shaixuan.is985 == 1"
|
||
@click="shaixuan.is985 == 1 ? shaixuan.is985 = 0 : shaixuan.is985 = 1"
|
||
:type="shaixuan.is985 == 1 ? 'primary' : 'link'"
|
||
>985</a-button>
|
||
<a-button
|
||
v-if="shaixuan.is211 == 1"
|
||
@click="shaixuan.is211 == 1 ? shaixuan.is211 = 0 : shaixuan.is211 = 1"
|
||
:type="shaixuan.is211 == 1 ? 'primary' : 'link'"
|
||
>211</a-button>
|
||
<a-button
|
||
v-if="shaixuan.yiliuxveke == 1"
|
||
@click="shaixuan.yiliuxveke == 1 ? shaixuan.yiliuxveke = 0 : shaixuan.yiliuxveke = 1"
|
||
:type="shaixuan.yiliuxveke == 1 ? 'primary' : 'link'"
|
||
>一流学科建设</a-button>
|
||
<a-button
|
||
v-if="shaixuan.yiliudaxve == 1"
|
||
@click="shaixuan.yiliudaxve == 1 ? shaixuan.yiliudaxve = 0 : shaixuan.yiliudaxve = 1"
|
||
:type="shaixuan.yiliudaxve == 1 ? 'primary' : 'link'"
|
||
>一流大学建设</a-button>
|
||
<a-button
|
||
v-if="shaixuan.gongban == 1"
|
||
@click="shaixuan.gongban == 1 ? shaixuan.gongban = 0 : shaixuan.gongban = 1"
|
||
:type="shaixuan.gongban == 1 ? 'primary' : 'link'"
|
||
>公办</a-button>
|
||
<a-button
|
||
v-if="shaixuan.minban == 1"
|
||
@click="shaixuan.minban == 1 ? shaixuan.minban = 0 : shaixuan.minban = 1"
|
||
:type="shaixuan.minban == 1 ? 'primary' : 'link'"
|
||
>民办</a-button>
|
||
<br />
|
||
</div>
|
||
</div>
|
||
<div class="table">
|
||
<a-table :columns="columns" :data-source="data">
|
||
<template v-slot:name="text">{{ text.record.university_name }}</template>
|
||
<template v-slot:province="text">{{ text.record.area.area_name }}</template>
|
||
<template v-slot:university_level="text">{{ text.record.university_level == 0 ? "专科": "本科" }}</template>
|
||
<template v-slot:is985="text">{{ text.record.is985 == 0 ? "X": "√" }}</template>
|
||
<template v-slot:is211="text">{{ text.record.is211 == 0 ? "X": "√" }}</template>
|
||
<template v-slot:is_first_class_university="text">{{ text.record.is_first_class_university == 0 ? "X": "√" }}</template>
|
||
<template v-slot:is_first_class_subject="text">{{ text.record.is_first_class_subject == 0 ? "X": "√" }}</template>
|
||
<template v-slot:university_attribute="text">{{ text.record.university_attribute == 0 ? "民办": "公办" }}</template>
|
||
</a-table>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import { ref, watch } from "vue"
|
||
import { allProvince, getAllCityVByArea_parent, getAllProvince, getUniversityByCondition, getUniversityByConditionres } from "../api/schoolquery"
|
||
|
||
|
||
|
||
const columns = [
|
||
{
|
||
dataIndex: 'area_names',
|
||
title: "院校名称",
|
||
key: 'area_names',
|
||
slots: { customRender: 'name' },
|
||
},
|
||
{
|
||
title: '院校所在地',
|
||
dataIndex: 'province',
|
||
key: 'province',
|
||
slots: { customRender: 'province' },
|
||
},
|
||
{
|
||
title: '学历层次',
|
||
dataIndex: 'university_level',
|
||
key: 'university_level',
|
||
slots: { customRender: 'university_level' },
|
||
},
|
||
{
|
||
title: '985',
|
||
key: 'is985',
|
||
dataIndex: 'is985',
|
||
slots: { customRender: 'is985' },
|
||
},
|
||
{
|
||
title: '211',
|
||
key: 'is211',
|
||
slots: { customRender: 'is211' },
|
||
},
|
||
{
|
||
title: '一流大学',
|
||
key: 'is_first_class_university',
|
||
slots: { customRender: 'is_first_class_university' },
|
||
},
|
||
{
|
||
title: '一流学科',
|
||
key: 'is_first_class_subject',
|
||
slots: { customRender: 'is_first_class_subject' }
|
||
},
|
||
{
|
||
title: '办学类型',
|
||
key: 'university_attribute',
|
||
slots: { customRender: 'university_attribute' },
|
||
},
|
||
];
|
||
|
||
const data = ref<getUniversityByConditionres>()
|
||
const shengfen = ref(0)
|
||
const chengshi = ref<number>(-1)
|
||
|
||
|
||
function getlist() {
|
||
getUniversityByCondition({
|
||
area_names: xaunzelist.value,
|
||
...shaixuan.value
|
||
}).then((res) => {
|
||
data.value = res.data
|
||
})
|
||
}
|
||
const shaixuan = ref({
|
||
gongban: 0,
|
||
minban: 0,
|
||
benke: 0,
|
||
zhuanke: 0,
|
||
is985: 0,
|
||
is211: 0,
|
||
yiliuxveke: 0,
|
||
yiliudaxve: 0
|
||
})
|
||
watch(shaixuan.value, getlist)
|
||
|
||
|
||
const xaunzelist = ref<string[]>([])
|
||
watch(xaunzelist.value,getlist)
|
||
getlist()
|
||
|
||
function removexuanzhong(index: number) {
|
||
xaunzelist.value.splice(index, 1)
|
||
}
|
||
function addxuanze() {
|
||
if (chengshi.value == -1 || xaunzelist.value.includes(`${shengfenlist.value[shengfen.value].area_name}/${chengshilist.value[chengshi.value].area_name}`)) {
|
||
return
|
||
}
|
||
|
||
xaunzelist.value.push(`${shengfenlist.value[shengfen.value].area_name}/${chengshilist.value[chengshi.value].area_name}`)
|
||
}
|
||
|
||
watch(shengfen, getchengshi)
|
||
|
||
const shengfenlist = ref<allProvince[]>([])
|
||
getAllProvince().then((res) => {
|
||
shengfenlist.value = res.data
|
||
shengfen.value = 0
|
||
getchengshi()
|
||
})
|
||
watch(chengshi, addxuanze)
|
||
|
||
|
||
|
||
const chengshilist = ref<allProvince[]>([])
|
||
function getchengshi() {
|
||
|
||
getAllCityVByArea_parent({ area_parent: shengfenlist.value[shengfen.value].area_id }).then((res) => {
|
||
chengshilist.value = res.data
|
||
chengshi.value = -1
|
||
})
|
||
|
||
}
|
||
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.select {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-around;
|
||
}
|
||
.table {
|
||
margin-top: 60px;
|
||
}
|
||
</style> |