二期联调

src/views/waitToDo/index.vue

@@ -1,6 +1,20 @@
 <template>
   <!-- 出差列表 -->
   <div>
+    <div class="header_tabs">
+      <van-tabs v-model="type" @click="tabsChange">
+        <van-tab name="wait" title="代办" />
+        <van-tab name="message" title="消息" />
+      </van-tabs>
+      <van-tabs v-model="wait" type="card" @click="tabsChange" v-if="type == 'wait'">
+        <van-tab name="0" title="未办理" />
+        <van-tab name="1" title="已办理" />
+      </van-tabs>
+      <van-tabs v-model="message" type="card" @click="tabsChange" v-if="type == 'message'">
+        <van-tab name="0" title="未读" />
+        <van-tab name="1" title="已读" />
+      </van-tabs>
+    </div>
     <HeaderFilter @onListQuery="handleListQuery" :paramProp="listQuery" />
     <RMList :moreLoading.sync="moreLoading" :refreshing.sync="refreshing" :finished.sync="finished" @onLoad="handleLoad" @onRefresh="handleRefresh" isMore :tableList="tableList">
       <div>
@@ -61,6 +75,9 @@ export default {
         deptName: null,
         remark: null,
       },
+      type:'wait',
+      wait:'0',
+      message:'0'
     }
   },
   computed: {
@@ -163,9 +180,20 @@ export default {
     },
 
     getTableList(val) {
+      let data = {
+        dealStatus:'',
+        readStatus:''
+      }
+      if(this.type == 'wait'){
+        data.dealStatus = this.wait
+        data.readStatus = ''
+      }else {
+        data.dealStatus = ''
+        data.readStatus = this.message
+      }
       // const { shellIdsLocal, collegeInfoIdLocal, startDate, endDate, keyword, type, method, targets, usePersonId, teacherIds, chargePersonIds } = this.listQuery
       const query = {
-        ...this.listQuery
+        ...this.listQuery,...data
       }
       this.moreLoading = true
       this.$loading(true, 'tableLoading')
@@ -190,9 +218,22 @@ export default {
         // this.$loading(false, `cTableLoading_${this.listType}`)
       })
     },
+    tabsChange(){
+      this.listQuery.pageNo = 1
+      this.finished = false
+      this.getTableList('refresh')
+    }
   }
 }
 </script>
 <style scoped lang="scss">
 // @import '~@/assets/style/common/list.scss';
+.header_tabs{
+  position: sticky;
+  top: 0;
+  background-color: white;
+  z-index: 999;
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  padding-bottom: 1rem
+}
 </style>