项目成果展示页面获取数据

src/views/resultShow/resultsShow.vue

@@ -11,41 +11,44 @@
       <div class="manageSelects">
       <div class="selectsBlock">
         <span class="selectLabel">项目筛选</span>
-        <el-select v-model="pavalues.value" placeholder="我的项目">
+        <el-select v-model="pavalues.value" @change="getData" placeholder="我的项目">
+          <el-option label="所有项目" :value="0"/>
           <el-option
             v-for="item in options"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
+            :key="item.courseId"
+            :label="item.title"
+            :value="item.courseId">
           </el-option>
         </el-select>
       </div>
 
       <div class="selectsBlock">
         <span class="selectLabel">部门</span>
-        <el-select v-model="pavalues.value1" placeholder="请选择">
+        <el-select v-model="pavalues.value1" @change="getData" placeholder="请选择">
+          <el-option label="所有部门" :value="0"/>
           <el-option
             v-for="item in options1"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
+            :key="item.classid"
+            :label="item.name"
+            :value="item.classid">
           </el-option>
         </el-select>
       </div>
 
       <div class="selectsBlock">
         <span class="selectLabel">分类</span>
-        <el-select v-model="pavalues.value2" placeholder="请选择">
+        <el-select v-model="pavalues.value2" @change="getData" placeholder="请选择">
+          <el-option label="所有分类" :value="0"/>
           <el-option
             v-for="item in options2"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
+            :key="item.typeid"
+            :label="item.name"
+            :value="item.typeid">
           </el-option>
         </el-select>
       </div>
 
-      <div class="selectsBlock">
+      <!-- <div class="selectsBlock">
         <span class="selectLabel">结题状态</span>
         <el-select v-model="pavalues.value4" placeholder="请选择">
           <el-option
@@ -55,23 +58,24 @@
             :value="item.value">
           </el-option>
         </el-select>
-      </div>
+      </div> -->
 
       <div class="selectsBlock">
         <span class="selectLabel">负责人</span>
-        <el-select v-model="pavalues.value3" placeholder="请选择">
+        <el-select v-model="pavalues.value3" @change="getData" placeholder="请选择">
+          <el-option label="所有负责人" value=""/>
           <el-option
             v-for="item in options3"
-            :key="item.value"
-            :label="item.label"
-            :value="item.value">
+            :key="item.pro_leader"
+            :label="item.pro_leader"
+            :value="item.pro_leader">
           </el-option>
         </el-select>
       </div>
       </div>
       <div class="ProjectManagementQuery">
-        <el-input v-model="input" style="340px" placeholder="请输入内容"></el-input>
-        <el-button type="primary" class="btn" size="mini">查询</el-button>
+        <el-input v-model="input" @change="getData" style="width:240px" placeholder="请输入内容"></el-input>
+        <el-button type="primary" class="btn" @click="getData" size="mini">查询</el-button>
       </div>
     </div>
     <!-- 搜索栏结束 -->
@@ -81,22 +85,22 @@
     <div class="classBlocks core_dialogue">
       <div class="classBlock" v-for="(item,index) in items" :key="index">
         <div class="projectBlockPosition">
-          {{ item.finish }}
+          已结题
         </div>
-        <img :src='item.pic' alt="">
+        <img :src='item.image' alt="">
         <div class="classBlock1">
-            <div class="classBlock2">{{ item.projectName }}</div>
+            <div class="classBlock2">{{ item.title }}</div>
             <div class="classBlock3">
-              <div>{{ item.person }}</div>
-              <div>{{ item.school }}</div>
+              <div>{{ item.pro_leader }}</div>
+              <div>{{ item.name }}</div>
             </div>
             <div class="classBlock3 classBlock4">
-              <div style="color:#9e9e9e">{{ item.blogs }}</div>
-              <div>项目编号{{ item.num }}</div>
+              <div style="color:#9e9e9e">{{ item.typeName }}</div>
+              <div>项目编号{{ index }}</div>
             </div>
         </div>
         <div style="">
-              <el-button type="primary" class="bt1" size="mini" @click="rsBtn">项目成果展示</el-button>
+              <el-button type="primary" class="bt1" size="mini" @click="rsBtn(item.courseId)">项目成果展示</el-button>
         </div>
       </div>
     </div>
@@ -110,12 +114,12 @@
       <!-- 分页 -->
       <el-pagination
           @current-change="handleCurrentChange"
-          :current-page="table.currentPage"
-          :page-size="table.packageSize"
+          :current-page="Page.currentPage"
+          :page-size="Page.lim"
           layout=" prev, pager, next"
           background
           class="paginations"
-          :total="table.total">
+          :total="Page.total">
         </el-pagination>
       <!-- 分页结束 -->
     
@@ -128,109 +132,65 @@
       data() {
         return {
           input:'',
-          table:{         // 分页数据
-            total:0,
-            packageSize:8,
-            currentPage:1
-          },  
-          items:[
-              {
-                finish:'已结题',
-                pic:require('@/assets/img/cocoClass.png'),
-                projectName:'濠江可可派社团课',
-                person:'刘丹璐',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                finish:'未结题',
-                projectName:'流浪猫救助屋',
-                person:'刘丹璐',
-                pic:require('@/assets/img/catHome.png'),
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                projectName:'人工智能领航班培训',
-                finish:'已结题',
-                pic:require('@/assets/img/AlCClass.jpg'),
-                person:'赖甲坎',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                projectName:'1216演奏小星星的',
-                finish:'已结题',
-                pic:require('@/assets/img/color.png'),
-                person:'郎朗',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                projectName:'1216演奏小星星的',
-                finish:'已结题',
-                pic:require('@/assets/img/color.png'),
-                person:'郎朗',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                projectName:'1216演奏小星星的',
-                finish:'已结题',
-                pic:require('@/assets/img/color.png'),
-                person:'郎朗',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                projectName:'1216演奏小星星的',
-                finish:'已结题',
-                pic:require('@/assets/img/color.png'),
-                person:'郎朗',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-              {
-                projectName:'1216演奏小星星的',
-                finish:'已结题',
-                pic:require('@/assets/img/color.png'),
-                person:'郎朗',
-                school:'深圳技师学院',
-                blogs:'个人博客',
-                num:'JK123245679'
-              },
-          ], //项目展示小方块
+          items:[], //项目展示小方块
           options:[],
           options1:[],
           options2:[],
           options3:[],
           options4:[],
           pavalues:{
-            value:'',
-            value1:'',
-            value2:'',
+            value:0,
+            value1:0,
+            value2:0,
             value3:'',
-            value4:'',
+          },
+          Page:{
+            currentPage:1,
+            total:0,
+            lim:8
           }
         }
       },
       methods:{
         handleCurrentChange(val) {   //当页数发生改变的时候调用获取列表数据请求
           // console.log(`当前页: ${val}`);
-          this.table.currentPage=val
+          this.Page.currentPage=val
           this.getData()
         },
-        rsBtn(){
-          this.$router.push('/resultShowDetail')
+        rsBtn(Id){
+          this.$router.push(`/resultShowDetail?Id=${Id}`)
+        },
+        getData(){        //获取渲染数据
+          let param={
+            uid:this.$store.state.userInfo.userid,  //当前账号id
+            pid:this.pavalues.value,  //筛选
+            did:this.pavalues.value1,  //部门
+            tid:this.pavalues.value2,    //分类
+            leader:this.pavalues.value3,  //负责人
+            st:2,  //审核状态
+            textInp:this.input,
+            page:this.Page.currentPage,  //当前页
+            lim:this.Page.lim,  //限制获取几条数据
+          }
+          this.ajax    
+            .get(this.$store.state.api+'/GetProjectIsConclusion',param)
+              .then(res=>{
+                console.log(res)
+                let data = res.data;
+                this.items = data[0];
+                this.options = data[1];
+                this.options1 = data[2];
+                this.options2 = data[3];
+                this.options3 = data[4];
+                this.Page.total = data[5][0]['total']
+              },err=>{
+                console.log(err);
+              })  
         }
      
+      },
+      mounted(){
+        this.getData();
       }
     }
 </script>