订单页面新增空状态

v1_5_0_C/myOrder.css

@@ -23,13 +23,13 @@ html {
 }
 
 html,
-body {
+body,
+#app {
     height: 100%;
 }
 
 
 #app {
-    min-height: 100%;
     background: #F4F6F9;
     font-size: 0.16rem;
     padding: 0.1rem;
@@ -39,6 +39,7 @@ body {
 .content {
     padding-bottom: 0.5rem;
     box-sizing: border-box;
+    height: 100%;
 }
 
 .content-item {
@@ -137,4 +138,23 @@ body {
     width: 0.31rem;
     height: 0.31rem;
     z-index: 877;
+}
+
+
+.empty {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+}
+
+.empty img {
+    width: 1.61rem;
+    height: 0.82rem;
+}
+
+.empty p {
+    font-size: 0.13rem;
+    color: #A6A5B2;
 }

v1_5_0_C/myOrder.html

@@ -46,6 +46,11 @@
                     <p class="button" @click="goExchange(item)" v-show="item.status===0">去兑换</p>
                 </div>
             </div>
+            <!-- 空状态 -->
+            <div class="empty" v-if="!orderList.length">
+                <img src="./img/coupon-empty.png" alt="">
+                <p>暂无订单</p>
+            </div>
         </div>
         <tab-component :current="2"></tab-component>