认证

src/project/fengdu/AppNewFarmerBank/integralTask.vue

@@ -1,9 +1,11 @@
 <template>
   <div class="integralTask">
-    <div class="img-bg">
-      <img src="https://cdn.cunwuyun.cn/fengdu/img-jifenlist.png" alt="">
+    <div class="fix-top">
+      <div class="img-bg">
+        <img src="https://cdn.cunwuyun.cn/fengdu/img-jifenlist.png" alt="">
+      </div>
+      <div class="title">任务大厅</div>
     </div>
-    <div class="title">任务大厅</div>
     <div class="card-list" v-if="list.length">
       <div class="card" v-for="(item,index) in list" :key="index" @click="$linkTo('./taskDetail?id='+item.id)">
         <h4>{{ item.title }}</h4>
@@ -53,7 +55,7 @@ export default {
         }
       }).then(res=> {
         if(res?.data) {
-          this.list = res.data.records
+          this.list = this.current > 1 ? [...this.list, ...res.data.records] : res.data.records
         }
       })
     }
@@ -67,7 +69,7 @@ export default {
     })
   },
   onReachBottom() {
-    this.current++;
+    this.current++
     this.getList()
   },
 }
@@ -75,21 +77,32 @@ export default {
 
 <style lang="scss" scoped>
 .integralTask {
-  .img-bg {
+  padding-top: 292px;
+  .fix-top {
     width: 100%;
-    height: 216px;
-    img {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 999;
+    .img-bg {
       width: 100%;
-      height: 100%;
+      height: 216px;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .title {
+      font-size: 34px;
+      font-weight: 500;
+      color: #222222;
+      padding: 32px 32px 0;
+      background: #f3f5f7;
+      z-index: 999;
+      opacity: 1;
     }
   }
-  .title {
-    font-size: 34px;
-    font-weight: 500;
-    color: #222222;
-    padding: 0 32px;
-    margin-top: 32px;
-  }
+  
   .card-list {
     padding: 24px 32px;
     box-sizing: border-box;