专业投档线

src/views/career/components/CollegesLine.vue

@@ -122,19 +122,21 @@
         this.$router.push({ name: 'UniversityDetail', params: { id: id } })
       },
       getMarjorList(){
-        this.loading=true
+
         const params={
           batch:this.formParams.marjorBatchsRes,
           pageNum:this.tableParams.pageNum,
           pageSize:this.tableParams.pageSize,
           type:this.formParams.typeRes,
           universityId:this.formParams.universityRes.id,
+          code:this.formParams.universityRes.code,
           year:this.formParams.year
         }
         if(!params.universityId){
           this.msgInfo('院校不能为空')
           return
         }
+        this.loading=true
         selectMarjorList(params).then(res=>{
           this.tableData=res.rows
           this.examRecordTotal=res.total

src/views/career/components/SelectUniversity.vue

@@ -1,179 +1,159 @@
 <template>
   <div class="selectUniversity" id="selectUniversity" ref="selectUniversity">
-    <!--上-->
     <div>
-      <el-row type="flex" align="middle">
-        <el-col :span="12">
-          <h1 class="title">选择院校</h1>
-        </el-col>
-        <el-col :span="12">
-          <div style="text-align: right;margin-bottom: 10px;" class="search">
-            <el-input style="width:80%;" suffix-icon=" " placeholder="请输入院校名称" v-model="tableParams.name" @keyup.enter.native="clickSuffix">
-           <span slot="suffix" @click="clickSuffix" style="cursor: pointer">
-            <i class="el-icon-search" style="margin-right: 10px;"></i>
-          </span>
-            </el-input>
-          </div>
-        </el-col>
-      </el-row>
-    </div>
-    <!--下-->
-    <div>
-        <el-row class="radioInput">
-          <el-radio-group v-model="tableParams.location" @change="getUniversityList()">
-            <el-radio-button label="">所有</el-radio-button>
-            <el-radio-button v-for="item in locations" :key="item" :label="item"
-                             style="margin-bottom:10px"></el-radio-button>
-          </el-radio-group>
-        </el-row>
+      <mx-search-group class="mb10" justify="space-between" :span="10" v-model="collegeName" placeholder="请输入院校名称"
+                       @search="clickSuffix"
+      >
+        <h1 class="title">选择院校</h1>
+      </mx-search-group>
+      <filter-form :filter="filter_form"></filter-form>
     </div>
+
     <div style="margin-top: 20px;">
-   <div>
-     <el-row :gutter="20">
-       <el-col  :span="6" v-for="item in tableData" :key="item.id">
-         <div @click="changeUniversity(item)" class="universityList">{{item.name}}</div>
-       </el-col>
-     </el-row>
-   </div>
-      <el-pagination
-        style="margin-top:10px;"
-        :page-sizes="[10,20,30,40,50,60,70,80,90,100]"
-        :page-size=tableParams.pageSize
-        layout="prev,pager,next,jumper,total,sizes"
-        :total="examRecordTotal"
-        @current-change="currentChange"
-        @size-change="sizeChange"
-      >
-      </el-pagination>
+      <div>
+        <el-row :gutter="20">
+          <el-col :span="6" v-for="item in tableData" :key="item.id">
+            <div @click="changeUniversity(item)" class="universityList">{{ item.name }}</div>
+          </el-col>
+        </el-row>
+      </div>
+      <pagination class="mt10" :total="total" :autoScroll="false" @pagination="getUniversityList"
+                  :page.sync="pageForm.pageNum"
+                  :limit.sync="pageForm.pageSize"
+      ></pagination>
     </div>
   </div>
 </template>
 
 <script>
-  import {mapState} from "vuex";
-  import {selectUniversityLocations,marjorSelectUniversityList} from '@/api/webApi/shiftLine'
-  export default {
-    name: "SelectUniversity",
-    data(){
-      return {
-        locations:[],
-        examRecordTotal:0,
-        tableParams:{
-          pageSize:20,
-          pageNum:1,
-          location:'',
-          name:'',
-        },
-        tableData:[]
-      }
-    },
-    computed: {
-      ...mapState({theme: (state) => state.settings.theme}),
-    },
-    watch: {
-      theme: {
-        immediate: true,
-        handler(val) {
-          this.$nextTick(() => {
-            this.$refs.selectUniversity.style.setProperty("--themeColor", val);
-          });
-        },
-      }
-    },
-    created() {
-      this.getUniversityLocations()
-      this.getUniversityList()
-    },
-    methods:{
-      changeUniversity(data){
-        this.$emit('changeUniversity',data)
-      },
-      getUniversityList(){
-        marjorSelectUniversityList(this.tableParams).then(res=>{
-          this.tableData=res.rows
-          this.examRecordTotal=res.total
-        })
+import { mapState } from 'vuex'
+import MxSearchGroup from '@/components/MxSearch/mx-search-group'
+import FilterForm from '@/views/career/components/FilterForm'
+import { selectUniversityList } from '@/api/webApi/career-course'
+
+export default {
+  name: 'SelectUniversity',
+  components: { MxSearchGroup,FilterForm },
+  data() {
+    return {
+      pageForm: {
+        pageSize: 20,
+        pageNum: 1,
       },
-      clickSuffix(){
-        this.getUniversityList()
+      collegeName:'',
+      total: 0,
+      filter_form:{
+        location:'',
+        natureTypeCN:'',
+        type:'',
+        level:'',
+        features:'',
+        name:''
       },
-      getUniversityLocations() {
-        selectUniversityLocations().then(res => {
-          this.locations = res.rows
+      tableData: []
+    }
+  },
+  computed: {
+    ...mapState({ theme: (state) => state.settings.theme })
+  },
+  watch: {
+    theme: {
+      immediate: true,
+      handler(val) {
+        this.$nextTick(() => {
+          this.$refs.selectUniversity.style.setProperty('--themeColor', val)
         })
-      },
-      sizeChange(e){
-        this.tableParams.pageSize=e
-        this.getUniversityList()
-      },
-      currentChange(e){
-        //页数
-        this.tableParams.pageNum=e
+      }
+    },
+    filter_form:{
+      immediate: true,
+      deep:true,
+      handler(val) {
         this.getUniversityList()
-      },
+      }
     }
+  },
+  methods: {
+    changeUniversity(data) {
+      this.$emit('changeUniversity', data)
+    },
+    getUniversityList() {
+      selectUniversityList({ ...this.pageForm,...this.filter_form }).then(res => {
+        this.tableData = res.rows
+        this.total = res.total
+      })
+    },
+    clickSuffix() {
+      this.filter_form.name = this.collegeName
+    },
   }
+}
 </script>
 
 <style scoped lang="scss">
-  #selectUniversity {
-    font-family: PingFangSC-Regular, PingFang SC;
+#selectUniversity {
+  font-family: PingFangSC-Regular, PingFang SC;
+  font-weight: 400;
+  padding: 0 30px;
+
+  .title {
     font-weight: 400;
-    padding:0 30px;
-    .title{
-      font-weight: 400;
-      border-left: 6px solid var(--themeColor);
-      padding:5px 20px;
-      color:var(--themeColor);
-    }
-    .search{
-      .el-input {
-        .el-input__inner {
-          border-radius: 50px;
-        }
+    border-left: 6px solid var(--themeColor);
+    padding: 5px 20px;
+    color: var(--themeColor);
+  }
+
+  .search {
+    .el-input {
+      .el-input__inner {
+        border-radius: 50px;
       }
     }
-    .universityList{
-      background-color: var(--themeColor);
-      line-height: 60px;
-      margin-bottom: 10px;
-      text-align: center;
-    }
   }
 
+  .universityList {
+    background-color: var(--themeColor);
+    line-height: 60px;
+    margin-bottom: 10px;
+    text-align: center;
+  }
+}
+
 </style>
 
 <style lang="scss">
-  .selectUniversity {
-    .search{
-      .el-input {
-        .el-input__inner {
-          border-radius: 50px;
-        }
+.selectUniversity {
+  .search {
+    .el-input {
+      .el-input__inner {
+        border-radius: 50px;
       }
     }
-    .radioInput {
-      .el-radio {
-        .el-radio__input {
-          display: none;
-        }
+  }
+
+  .radioInput {
+    .el-radio {
+      .el-radio__input {
+        display: none;
       }
     }
+  }
 
-    .radioInput {
-      display: flex;
-      margin-top: 5px;
-      .el-radio-button .el-radio-button__inner {
-        border-radius: 4px !important;
-        border: none;
-        padding: 5px 10px !important;
-        font-weight: 400;
-        font-family: PingFangSC-Regular, PingFang SC;
-      }
+  .radioInput {
+    display: flex;
+    margin-top: 5px;
 
-      .el-radio-button__orig-radio:checked + .el-radio-button__inner {
-        box-shadow: none;
-      }
+    .el-radio-button .el-radio-button__inner {
+      border-radius: 4px !important;
+      border: none;
+      padding: 5px 10px !important;
+      font-weight: 400;
+      font-family: PingFangSC-Regular, PingFang SC;
+    }
+
+    .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+      box-shadow: none;
     }
   }
+}
 </style>