院校库列表

src/api/webApi/career-course.js

@@ -37,6 +37,15 @@ export function selectUniversity(){
   })
 }
 
+/**
+ * 查询院校列表数据筛选项
+ */
+export function universityFilters(){
+  return request({
+    url:`/front/university/filters`,
+    method:'get'
+  })
+}
 /**
  * 院校列表
  */

src/components/MxDialog/index.js

@@ -11,6 +11,7 @@ let instance;
 
 function initInstance(type) {
   switch (type) {
+
     case 'DispatchMaster':
       instance = new DispatchMasterController({
         el: document.createElement('div'),

src/views/career/components/UniversitiesTable.vue

@@ -50,7 +50,7 @@
     export default {
       name: "UniversitiesTable",
       props:{
-        universityParams:{type:Object,default(){return {}}}
+        filterForm:{type:Object,default(){return {}}}
       },
       data(){
         return {
@@ -62,17 +62,8 @@
           tableData:[]
         }
       },
-      // mounted() {
-      //   Object.keys(this.universityParams)
-      //     .filter((_) => !["name"].includes(_)) // 排除对name属性的监听
-      //     .forEach((_) => {
-      //       this.$watch((vm) => vm.params[_], handler, {
-      //         deep: true,
-      //       });
-      //     });
-      // },
       watch:{
-        universityParams:{
+        filterForm:{
           immediate:true,
           deep:true,
           handler(val){
@@ -95,22 +86,11 @@
           this.getUniversityList()
         },
         getUniversityList(){
-          const params={
-            pageNum:this.tableParams.pageSize,  //页数
-            pageSize:this.tableParams.limit,  //每页的数量
-            level:this.universityParams.levelsRes,  //学历层次
-            location:this.universityParams.locationsRes,  //所在地
-            managerType:this.universityParams.managerTypesRes,  //主管部门类型
-            type:this.universityParams.typesRes,//院校类型
-            name:this.universityParams.name,//名称
-            yjsy:this.getUniverCharact('3'),//是否为研究生院
-            dlxy:this.getUniverCharact('4'),  //是否独立学院
-            mbgx:this.getUniverCharact('5') ,//是否民办高校
-            ylxk:this.getUniverCharact('2'),//是否一流学科建设高校
-            ylxx:this.getUniverCharact('1')//是否一流大学建设高校
-          }
           // console.log(params)
-          selectUniversityList(params).then(res=>{
+          selectUniversityList({ ...this.filterForm,
+            pageNum:this.tableParams.pageSize,
+            pageSize:this.tableParams.limit,
+          }).then(res=>{
             this.tableData=res.rows
             this.tableParams.examRecordTotal=res.total
           })

src/views/career/plan/UniversitiesColleges.vue

@@ -1,5 +1,5 @@
 <template>
-  <div ref="UniversitiesColleges" class="app-container">
+  <div ref="UniversitiesColleges" class="app-container" v-loading="loading">
     <el-card :style="{'background-image':backimg}" style="padding:30px;margin:10px 0;background-color:white;background-repeat: no-repeat;background-position: bottom right;">
       <p style="color:#A6A6A6;font-size:24px;font-weight:bold;">UNIVERSITIES AND COLLECGES</p>
       <p style="color:#414141;font-size:24px;font-weight:bold;">院校库</p>
@@ -8,57 +8,85 @@
     <el-card style="background-color: #ffffff;font-size: 14px;padding:5px;">
       <el-row class="radioInput">
         <div>
-          <span class="radiaTitle">地 域：</span>
+          <span class="radiaTitle">院校省份:</span>
         </div>
-        <el-radio-group v-model="universityParams.locationsRes">
+        <el-radio-group v-model="filter_form.location">
           <el-radio-button label="">所有</el-radio-button>
-          <el-radio-button v-for="item in universityList.locations" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
+          <el-radio-button v-for="item in filter_list.locations" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
         </el-radio-group>
       </el-row>
       <el-row class="radioInput" style="background-color: #ffffff;font-size: 14px;padding:5px;">
         <div>
-          <span class="radiaTitle">主 管 部 门 类 别：</span>
+          <span class="radiaTitle">院校类型:</span>
         </div>
-        <el-radio-group v-model="universityParams.managerTypesRes">
+        <el-radio-group v-model="filter_form.type">
           <el-radio-button label="">所有</el-radio-button>
-          <el-radio-button v-for="item in universityList.managerTypes" :key="item.name" :label="item.name" style="margin-bottom:10px"></el-radio-button>
+          <el-radio-button v-for="item in filter_list.types" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
         </el-radio-group>
       </el-row>
       <el-row class="radioInput" style="background-color: #ffffff;font-size: 14px;padding:5px;">
         <div>
-          <span class="radiaTitle">校 院 类 型：</span>
+          <span class="radiaTitle">院校层次:</span>
         </div>
-        <el-radio-group v-model="universityParams.typesRes">
+        <el-radio-group v-model="filter_form.features">
           <el-radio-button label="">所有</el-radio-button>
-          <el-radio-button v-for="item in universityList.types" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
+          <el-radio-button v-for="item in filter_list.features" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
         </el-radio-group>
       </el-row>
       <el-row class="radioInput" style="background-color: #ffffff;font-size: 14px;padding:5px;">
         <div>
-          <span class="radiaTitle">学 历 层 次：</span>
+          <span class="radiaTitle">学历层次:</span>
         </div>
-        <el-radio-group v-model="universityParams.levelsRes">
+        <el-radio-group v-model="filter_form.level">
           <el-radio-button label="">所有</el-radio-button>
-          <el-radio-button v-for="item in universityList.levels" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
+          <el-radio-button v-for="item in filter_list.levels" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
         </el-radio-group>
       </el-row>
-      <mx-search-group justify="space-between"  v-model="univerName" @search="clickSuffix">
-        <el-row class="radioInput"  style="background-color: #ffffff;font-size: 14px;padding:5px;">
-          <div style="margin-top:-5px">
-            <span class="radiaTitle">院 校 特 性：</span>
+      <el-row class="radioInput"  style="background-color: #ffffff;font-size: 14px;padding:5px;">
+        <div>
+          <span class="radiaTitle">办学类型:</span>
+        </div>
+        <el-radio-group v-model="filter_form.natureTypeCN">
+          <el-radio-button label="">所有</el-radio-button>
+          <el-radio-button v-for="item in filter_list.natureTypes" :key="item" :label="item" style="margin-bottom:10px"></el-radio-button>
+        </el-radio-group>
+      </el-row>
+      <mx-search-group justify="end"  v-model="collegeName" @search="clickSuffix">
+        <p>共 <span class="f-primary">{{pageForm.total}}</span> 条</p>
+      </mx-search-group>
+      <el-row class="mt10 ">
+        <div v-if="pageForm.total > 0">
+          <div class="list-wrap pl30">
+            <div class="list-item fx-row mb30" v-for="item in collegeList">
+              <div class="img" >
+                <img style="width: 100%;height: 100%" :src="item.logo" alt="">
+              </div>
+              <div class="info ml20">
+                <div class="college_name pointer f-333 f20 mb5">{{item.name}}</div>
+                <div class="tags">
+                  <span class="mr5 el-tag el-tag--info el-tag--plain" v-for="feature in item.features.split(',')">{{ feature }}</span>
+                </div>
+                <div class="college-desc mt5 f14 f-666">
+                  <p>{{`${item.location} ${item.cityName} ${item.type} / ${item.natureTypeCN} / ${item.managerType} `}}</p>
+                </div>
+              </div>
+              <div class="heat f12 f-666">
+                <p>排名</p>
+                <p class="mt3">{{ `第${item.ranking}名 / 综合指数${item.comScore}` }}</p>
+              </div>
+              <div class="heat f12  f-666">
+                <p>热度</p>
+                <p class="mt3">{{ (item.hits/10000).toFixed(1) }}万</p>
+              </div>
+            </div>
           </div>
+          <pagination class="mt10" :total="pageForm.total" :autoScroll="false" @pagination="onChangePage"
+                      :page.sync="pageForm.pageNum"
+                      :limit.sync="pageForm.pageSize"
+          ></pagination>
+        </div>
 
-          <el-checkbox-group v-model="universityParams.checkList">
-            <el-checkbox label="1">一流大学建设高校</el-checkbox>
-            <el-checkbox label="2">一流学科建设高校</el-checkbox>
-            <el-checkbox label="3">研究生院</el-checkbox>
-            <el-checkbox label="4">独立学院</el-checkbox>
-            <el-checkbox label="5">民办高校</el-checkbox>
-          </el-checkbox-group>
-        </el-row>
-      </mx-search-group>
-      <el-row style="margin-top:10px;">
-        <universities-table :universityParams="universityParams"></universities-table>
+        <evaluation-empty v-else shadow title="暂无数据"></evaluation-empty>
       </el-row>
     </el-card>
   </div>
@@ -67,7 +95,7 @@
 <script>
 import { mapState } from 'vuex';
 import UniversitiesTable from '@/views/career/components/UniversitiesTable';
-import { selectUniversity } from '@/api/webApi/career-course'
+import { selectUniversityList, universityFilters } from '@/api/webApi/career-course'
 import MxSearchGroup from '@/components/MxSearch/mx-search-group'
 export default {
   name: "UniversitiesColleges",
@@ -75,16 +103,24 @@ export default {
   data() {
     return {
       backimg: 'url(' + require('@/assets/images/career/icon_colleges.png') + ')',
-      universityList: {},
-      univerName: '',//查询名称
-      universityParams: {  //保存数据项选择结果
-        locationsRes: '',
-        managerTypesRes: '',
-        typesRes: '',
-        levelsRes: '',
-        checkList: [],
-        name: ''
-      }
+      filter_form:{
+        location:'',
+        natureTypeCN:'',
+        type:'',
+        level:'',
+        features:'',
+        name:''
+      },
+      loading:false,
+      collegeName:'',
+      pageForm:{
+        pageSize:10,
+        pageNum:1,
+        total:0
+      },
+      filter_list:{},
+      collegeList:[],
+      headerFixed: true
     }
   },
   computed: {
@@ -99,6 +135,13 @@ export default {
         })
       }
     },
+    filter_form:{
+      immediate: true,
+      deep:true,
+      handler(val) {
+          this.getUniversityList()
+      }
+    },
     'universityParams.locationsRes': {
       handler(val) {
         this.universityParams.name = ''
@@ -107,17 +150,35 @@ export default {
     }
   },
   created() {
-    this.getUniversity()
+    this.getFilter()
   },
   methods: {
+    onChangePage(page) {
+      this.pageForm.pageSize = page.limit
+      this.pageForm.pageNum = page.page
+      this.getUniversityList()
+    },
     clickSuffix() {
-      this.universityParams.name = this.univerName
+      this.filter_form.name = this.univerName
     },
-    getUniversity() {
-      selectUniversity().then(res => {
-        this.universityList = res.data
+    getFilter() {
+      universityFilters().then(res => {
+        this.filter_list = res.data
       })
-    }
+    },
+    getUniversityList(){
+      this.loading = true
+      // console.log(params)
+      selectUniversityList({ ...this.filter_form,
+        pageNum:this.pageForm.pageNum,
+        pageSize:this.pageForm.pageSize,
+      }).then(res=>{
+        this.pageForm.total =res.total
+        this.collegeList =res.rows
+      }).finally(() => {
+        this.loading = false
+      })
+    },
   }
 }
 </script>
@@ -127,16 +188,35 @@ export default {
   background-color: var(--themeColor);
   margin-left: 0;
 }
-</style>
-<style lang="scss">
-.radioInput {
+.heat{
+  width: 200px;
+  height: 72px;
+  padding-top: 22px;
+  color: #666;
+}
+.info{
+  width: 400px;
+}
+.img{
+  width: 72px;
+  height: 72px;
+}
+.tags {
+  .el-tag{
+    height: 16px;
+    line-height: 16px;
+    font-size: 12px;
+    color: #909399;
+  }
+}
+.radioInput ::v-deep {
   .el-radio {
     .el-radio__input {
       display: none;
     }
   }
 }
-.radioInput {
+.radioInput ::v-deep {
   display: flex;
   .el-radio-button .el-radio-button__inner {
     border-radius: 4px !important;
@@ -150,24 +230,21 @@ export default {
   }
   .radiaTitle {
     display: inline-block;
-    width: 130px;
+    width: 80px;
     font-size: 14px;
     text-align: right;
     margin-top: 2px;
+    margin-right:10px;
   }
 }
-.radioInput02 {
-  display: flex;
-  align-items: center;
-  .radiaTitle {
-    display: inline-block;
-    width: 130px;
-    font-size: 14px;
-    text-align: right;
-    margin-top: 2px;
-  }
-  .el-input--medium .el-input__inner {
-    border-radius: 50px;
-  }
+// 吸顶
+.issFixed{
+  position: absolute;
+  top: 0px;
+  background: #fff;
+  left: 0px;
+  right: 0px;
+  z-index: 4;
+
 }
 </style>

src/views/career/plan/UniversitiesDetail.vue

@@ -1,5 +1,5 @@
 <template>
-  <div ref="universityDetail" id="universityDetail" style="padding:0 5%">
+  <div ref="universityDetail" id="universityDetail" class="app-container">
     <el-row :gutter="10" class="mt20 mb30">
       <el-col :span="12" class="fx-row ai-center">
         <div class="mr30">
@@ -16,7 +16,7 @@
         </div>
       </el-col>
       <el-col :span="12" class="text-right">
-        <el-button plain="">返回</el-button>
+        <el-button plain round>返回</el-button>
       </el-col>
     </el-row>
     <div>
@@ -26,9 +26,9 @@
           <span class="tabs-item" @click="tabActive = 2" :class="{'bg-primary':tabActive == 2}">院校风采</span>
         </div>
         <div v-if="tabActive == 0">
-          <el-row :gutter="10" class="fx-row">
-            <el-col :span="8"> <img src="https://i6.youzy.cn/basiclib/college/images/10003-647784f7.jpg" width="400px" alt=""></el-col>
-            <el-col :span="24">
+          <el-row  class="fx-row">
+            <el-col :span="8"> <img src="https://i6.youzy.cn/basiclib/college/images/10003-647784f7.jpg" width="100%" alt=""></el-col>
+            <el-col :span="16">
               <div class="f14 f-666 text-center fx-row">
                 <el-col :span="24"  v-for="item  in 8" >
                   <img width="50px" src="https://pv4y-pc.youzy.cn/static/img/icon_shijian@2x.8463f33f.png" alt="">

src/views/elective/master/index.vue

@@ -1,38 +0,0 @@
-<template>
-  <!-- 班主任查看学生报名 -->
-  <div class="app-container">
-    <el-card class="box-card mb10">
-      <mx-condition ref="condition" :query-params="queryParams" :require-fields="requireFields" @query="handleQuery"
-                    @invalid="handleInvalidQuery"
-      ></mx-condition>
-    </el-card>
-  </div>
-</template>
-<script>
-
-import MxCondition from '@/components/MxCondition/mx-condition'
-
-export default {
-  components: { MxCondition },
-  data() {
-    return {
-      requireFields: ['year', 'roundId'],
-      queryParams: {
-        year: '',
-        roundId: ''
-      },
-    }
-  },
-  methods: {
-    handleQuery() {
-    },
-    handleInvalidQuery() {
-      console.log('query取消')
-      this.round = {}
-    }
-  }
-}
-</script>
-<style>
-
-</style>