task#15348,培训文档和文档资料布局更改

src/views/documentView/trainDocment.vue

@@ -21,25 +21,26 @@
       </template>
     </van-nav-bar>
   </div>
-
+  <div class="tab_wrap">
+    <div v-for="(item, index) in tabArr" :key="index" :class="{'active' : activeIndex == index}"
+         @click="changeTab(index)">
+      {{ item.name }}
+    </div>
+  </div>
   <div class="contentWrap" v-show="!showEmpty">
     <van-pull-refresh v-model="isLoading" @refresh="onRefresh"  style="min-height:85vh">
       <div class="itemWrap" v-for="(item,index) in  pageList" :key="index" @click="goH5Detail(item)">
         <div class="info flexBetween common">
-          <div class="title">{{ item.pushUser }}</div>
-          <div class="time">{{ item.pushTime }}</div>
+<!--          item.mustRead===1-->
+          <div class="title">{{ item.name }}<span class="read">必读</span></div>
+          <div class="time">{{ item.updateTime	 }}</div>
         </div>
         <div class="imgWrap">
           <img :src="item.themePicture">
-          <div class="name">{{item.name}}</div>
         </div>
         <div class="num common">{{ item.synopsis }}</div>
-        <div class="doc flexBetween common">
-          <div class="left">{{ item.docType?.label }}</div>
-          <div class="right">
-            <span style="color: red;font-size: 14px;margin-right: 8px">{{ item.listShowButton==null ? '已处理' :  '未处理' }}</span>
-            <span style="opacity: .9;color: #ccc">阅读  {{item.readCount}}</span>
-          </div>
+        <div style="text-align: right" v-if="item.docType?.label !== '普通材料'">
+          <span style="color: red;font-size: 14px;margin-right: 8px">{{ item.listShowButton==null ? '已处理' :  '未处理' }}</span>
         </div>
       </div>
     </van-pull-refresh>
@@ -60,6 +61,8 @@ export default {
   mixins:[myMixins],
   data(){
     return{
+      tabArr: [{name: '车型技术参数', status: 1}, {name: '中道服务规范', status: 2},{name: '中道小课堂', status: 3}],
+      activeIndex: 0,
       pageNum:1,
       pageSize:10,
       pageList:[],
@@ -80,6 +83,17 @@ export default {
         this.isLoading = false;
       }, 1000);
     },
+    async changeTab(index) {
+      this.activeIndex = index
+      this.pageNum = 1
+      this.pageList = [];
+      if(this.activeIndex === 0){
+        this.trainingType =1
+      }else{
+        this.trainingType=2
+      }
+      await this.getList()
+    },
     async getList(){
       let res= await pageList({
         pageNum:this.pageNum,
@@ -105,4 +119,10 @@ export default {
 @import "@/styles/common.scss";
 @import "@/styles/mixin.scss";
 @import "@/styles/docment.scss";
+.read{
+  padding: 2px 8px;
+  border-radius: 5px;
+  border: 1px solid red;
+  color: red;
+}
 </style>