手机端页面

src/pages/phone/databaseSearch.vue

@@ -17,24 +17,26 @@
       </template>
     </van-search>
   </div>
-  <div v-if="loading">
-    <van-loading size="24px" color="#3170A8">加载中...</van-loading>
-  </div>
-  <div v-else-if="!loading && standList.length" class="card-content" v-for="item in standList" :key="item.id">
-    <div class="standTitle">
-      <div class="title">{{item.title}}</div>
+  <div class="card-box">
+    <div v-if="loading">
+      <van-loading size="24px" color="#3170A8">加载中...</van-loading>
     </div>
-    <div class="standContent">
-      <div class="standState">标准类别:
-        <span v-if="item.indexType === 'stand'">国内标准</span>
-        <span v-if="item.indexType === 'FOREIGN'">海外标准</span>
-        <span v-if="item.indexType === 'bussstand'">企业标准</span>
+    <div v-else-if="!loading && standList.length" class="card-content" v-for="item in standList" :key="item.id">
+      <div class="standTitle">
+        <div class="title">{{item.title}}</div>
+      </div>
+      <div class="standContent">
+        <div class="standState">标准类别:
+          <span v-if="item.indexType === 'stand'">国内标准</span>
+          <span v-if="item.indexType === 'FOREIGN'">海外标准</span>
+          <span v-if="item.indexType === 'bussstand'">企业标准</span>
+        </div>
+        <div class="standSubTime">发布日期: {{item.issue_time}} </div>
       </div>
-      <div class="standSubTime">发布日期: {{item.issue_time}} </div>
     </div>
-  </div>
-  <div v-else-if="!loading  && !standList.length">
-    <van-empty description="暂无数据" />
+    <div v-else-if="!loading  && !standList.length">
+      <van-empty description="暂无数据" />
+    </div>
   </div>
  </div>
 </template>
@@ -83,12 +85,16 @@ export default {
 #database-search{
   width: 100%;
   height: 100%;
+  overflow: auto;
   margin: 0;
   padding: 0;
   background: #F6F6F6;
   .search-head{
     width: 100%;
     height: 100px;
+    position: absolute;
+    top: 0;
+    z-index: 9999;
     background: #3170A8;
   }
   .head-title{
@@ -123,6 +129,11 @@ export default {
       }
     }
   }
+  .card-box{
+    height: 100%;
+    position: relative;
+    top: 100px;
+  }
   .card-content{
     width: 95%;
     height: auto;
@@ -159,7 +170,7 @@ export default {
   }
   .van-loading {
     position: absolute;
-    top: 52%;
+    top: 40%;
     left: 37%;
   }
 }