工单对账无数据显示空图片

src/views/workOrder/workOrderReconciliation.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="wrap">
+  <div class="wrap" :style="`backgroundColor: ${show ? '#FAFAFA' : '#F4F5F7'};`">
     <div class="navBar">
       <van-nav-bar
           title="工单对账"
@@ -34,7 +34,7 @@
       </div>
     </div>
 
-    <van-pull-refresh v-model="isLoading" @refresh="onRefresh">
+    <van-pull-refresh v-model="isLoading" @refresh="onRefresh" style="height: 100%" v-show="!show">
      <div >
         <div  class="content_wrap" v-for="(item,index) in orderList" :key="index">
           <div class="codeTxt common">
@@ -66,7 +66,9 @@
         </div>
       </div>
     </van-pull-refresh>
-
+    <div style="height: 85% ;background-color: #FAFAFA;display: flex;justify-content: center;align-items: center" v-show="show" >
+      <img style="width: 100%" src="@/assets/empty.png" />
+    </div>
   </div>
 </template>
 
@@ -91,6 +93,7 @@ export default {
       currentDate: new Date(),
       ymTime: '',
       isLoading:"",
+      // show:false
     }
   },
   mounted() {
@@ -100,6 +103,11 @@ export default {
     this.initSelectTime();
     this.getList();
   },
+  computed:{
+    show() {
+      return (this.orderList.length < 0 || this.orderList.length == 0); // 判断数组长度是否大于 0
+    },
+  },
   methods: {
     onRefresh() {
       this.getList()
@@ -185,7 +193,7 @@ export default {
 
 .wrap {
   @include wh(100%, 100%);
-  background: #F4F5F7;
+  //background: #F4F5F7;
   box-sizing: border-box;
   padding: 0 12px;
   overflow-y: auto;