改图片

src/pages/contractRepayment/contract-repayment.vue

@@ -8,7 +8,7 @@
     </h-header>
     <scroll
       v-if="data!==null"
-      ref="scroll" :updateData="[lists]" :pullUp="true" class="pay-content has-header"
+      ref="scroll" :updateData="[lists]" :pullUp="true" class="pay-content"
       @pullingUp="getList">
       <div v-for="(item,index) in lists" :key="index" class="contract-item">
         <div class="header">
@@ -28,11 +28,9 @@
         </div>
       </div>
     </scroll>
-    <h-content v-if="data===null" class="null">
-      <div class="display">
-        <img src="@/assets/contractRepayment/null.png" alt="">
-        <p>暂时没有还款记录</p>
-        <div @click="$routeGo()">返回</div>
+    <h-content v-if="data===null" class="null has-header">
+      <div class="noData">
+        <img src="@/assets/messageCenter/noMsg.png" alt="">
       </div>
     </h-content>
   </h-view>
@@ -119,6 +117,17 @@ export default {
 </script>
 <style lang='less' >
 #contract-repayment {
+  .null{
+    margin-top:46px;
+  }
+  .noData{
+     width:100%;
+     height:100%;
+    img{
+     height:100%;
+      width:100%;
+    }
+  }
   .h-header {
     background-color: @headerColor;
     .h-header-btn {
@@ -282,46 +291,6 @@ export default {
       }
     }
   }
-
-  .null {
-    position: relative;
-
-    .display {
-      width:150px;
-      position: absolute;
-      left: 50%;
-      transform: translateX(-50%);
-      top: 100px;
-
-      img {
-        width:150px;
-      }
-
-      p {
-        text-align: center;
-        opacity: 0.7;
-        font-family: PingFangSC-Semibold;
-        font-size: 17px;
-        color: #21254C;
-        letter-spacing: 0;
-        font-weight: 700;
-        margin-top: 10px;
-      }
-
-      div {
-        width: 140px;
-        height: 32px;
-        background: @headerColor;
-        border-radius: 4px;
-        color: white;
-        line-height: 32px;
-        text-align: center;
-        margin-left: 5px;
-        margin-top: 20px;
-      }
-    }
-
-  }
   .content {
     position: absolute;
     top: 0;
@@ -337,6 +306,9 @@ export default {
     .scrollContent {
       padding-top: 1.2rem;
     }
+    .null{
+    margin-top:1.32em;
+  }
   }
 }
 
@@ -345,6 +317,9 @@ export default {
     #contract-repayment {
       .scrollContent {
         padding-top: 1.6rem;
+      }
+      .null{
+    margin-top:1.72em;
   }
     }
   }
@@ -355,6 +330,9 @@ export default {
     #contract-repayment {
       .scrollContent {
         padding-top: 1.6rem;
+      }
+      .null{
+    margin-top:1.72em;
   }
     }
   }