培训文档，文档资料代码优化

src/views/documentView/docmentList.vue

@@ -50,8 +50,8 @@
       </div>
     </van-pull-refresh>
  </div>
-  <div class="empty" style="display: flex;justify-content: center;align-items: center;height:calc(100% - 86px);background-color: #FAFAFA" v-show="showEmpty">
-    <img src="@/assets/empty.png"  style="width: 100%"/>
+  <div class="empty"  v-show="showEmpty">
+    <img src="@/assets/empty.png"  />
   </div>
 </div>
 </template>
@@ -80,21 +80,6 @@ export default {
     this.getList()
   },
   methods:{
-    goH5Detail(item){
-      let data = {
-        "action": "goTraining",
-        "params": {
-          "id": item.id,
-        }
-      };
-      let u = navigator.userAgent;
-      let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
-      if(isiOS){
-        window.webkit.messageHandlers.nativeObject.postMessage(data);
-      }else {
-        window.android.sendMessage("articleId=" + item.id);
-      }
-    },
     onRefresh() {
       this.getList()
       setTimeout(() => {
@@ -138,28 +123,13 @@ export default {
 <style scoped lang="scss">
 @import "@/styles/common.scss";
 @import "@/styles/mixin.scss";
-.wrap{
-  width: 100%;
-  height: 100%;
-  background-color: #F4F5F7;
-  overflow-y: auto;
-}
-.navBar{
-  margin-bottom: 46px;
-}
-.rightWrap {
-  @include flexCenter;
-  .img2 {
-    @include wh(17px, 17px)
-  }
-}
+@import "@/styles/docment.scss";
 .tab_wrap {
   @include fontWeightSize(bolder, 15px);
   display: flex;
   justify-content: space-around;
   padding: 5px 0 5px 0;
-  color: #737373;
-  opacity: .7;
+  @include colorOpa(#737373,0.7);
   div {
     padding-top: 8px;
   }
@@ -167,12 +137,10 @@ export default {
     color: #3678FF;
     position: relative;
   }
-
   .active:after {
     content: '';
     display: block;
-    width: 50px;
-    height: 3px;
+    @include wh(50px,3px);
     background: linear-gradient(270deg, #33A3FF 0%, #176AFE 100%);
     border-radius: 2px;
     position: absolute;
@@ -181,53 +149,4 @@ export default {
     transform: translateX(-50%);
   }
 }
-
-.contentWrap{
-  padding: 0 8px;
-  width: 100%;
-  box-sizing: border-box;
-
-  .itemWrap{
-    margin-top: 16px;
-    @include wh(100%, 300px);
-    background: #FFFFFF;
-    box-shadow: 0px 2px 10px 0px rgba(216, 216, 216, 0.5);
-    border-radius: 3px;
-    box-sizing: border-box;
-    @include flexColumn;
-    justify-content: space-around;
-    padding: 6px 0;
-    @include fontWeightSize(400, 12px);
-    .flexBetween{
-      @include flexColBet;
-    }
-    .common{
-      margin: 0 15px ;
-    }
-    .imgWrap{
-      width: 100%;
-      height: 200px;
-      position: relative;
-      //background-color: #6C81CD;
-      img{
-        width: 100%;
-        height: 200px;
-      }
-      .name{
-        position: absolute;
-        left: 30px;
-        bottom: 30px;
-        font-size: 14px;
-        font-weight: 500;
-        color: #FFFFFF;
-      }
-    }
-    .left{
-      color: red;
-      font-size: 15px;
-      font-weight: 500;
-    }
-  }
-
-}
 </style>