积分任务

src/project/fengdu/AppNewFarmerBank/AppNewFarmerBank.vue

@@ -14,7 +14,7 @@
         <p>积分申请</p>
         <h4>好事自荐得积分</h4>
       </div>
-      <div class="jsrw">
+      <div class="jsrw" @click="$linkTo('/mods/AppNewFarmerBank/concentrationTask')">
         <p>积分任务</p>
         <h4>完成任务得积分</h4>
       </div>
@@ -55,8 +55,7 @@ export default {
     }
   },
   methods: {
-    getList(e) {
+    getList() {
-      // console.log(e);
     },
     handleBannerClick() {
 
@@ -192,10 +191,16 @@ export default {
         }
         .right {
           width: 52px;
+          text-align: center;
           img {
             width: 40px;
             height: 40px;
           }
+          span {
+            font-size: 28px;
+            font-weight: 400;
+            color: #687DA6;
+          }
         }
       }
       .bottom {

src/project/fengdu/AppNewFarmerBank/integralTask.vue

@@ -0,0 +1,131 @@
+<template>
+  <div class="integralTask">
+    <div class="img-bg">
+      <img src="https://cdn.cunwuyun.cn/fengdu/img-jifenlist.png" alt="">
+    </div>
+    <div class="title">任务大厅</div>
+    <div class="card-list">
+      <div class="card">
+        <h4>10月31日线下公益宣传</h4>
+        <p>
+          百年征和波澜壮阔，百年初心历争议弥坚。7月1日上午，庆祝中国共产党成立100周年在国务院举办…
+        </p>
+        <div class="imgs">
+
+        </div>
+        <div class="time">
+          <div class="goin">
+            <img src="https://cdn.cunwuyun.cn/fengdu/ic-jinchangshijian.png" alt="">
+            <span class="label">进场时间：</span>
+            <span class="value">2020-12-11 10:10 至 2020-12-11 10:10</span>
+          </div>
+          <div class="exit">
+            <img src="https://cdn.cunwuyun.cn/fengdu/ic-lichangshijian.png" alt="">
+            <span class="label">离场时间：</span>
+            <span class="value">2020-12-11 10:10 至 2020-12-11 10:10</span>
+          </div>
+          <div class="type">
+            <img src="https://cdn.cunwuyun.cn/fengdu/ic-renwuleixing.png" alt="">
+            <span class="label">任务类型：</span>
+            <span class="value">报名得积分</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'integralTask',
+  appName: '功德银行',
+  data() {
+    return {
+
+    }
+  },
+  methods: {
+
+  },
+  onShow() {
+    uni.setNavigationBarTitle({
+      title: '功德银行'
+    });
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+.integralTask {
+  .img-bg {
+    width: 100%;
+    height: 216px;
+    img {
+      width: 100%;
+      height: 100%;
+    }
+  }
+  .title {
+    font-size: 34px;
+    font-weight: 500;
+    color: #222222;
+    padding: 0 32px;
+    margin-top: 32px;
+  }
+  .card-list {
+    padding: 24px 32px;
+    box-sizing: border-box;
+    .card {
+      background: #FFF;
+      color: #333333;
+      border-radius: 16px;
+      h4 {
+        padding: 24px 24px 0;
+        box-sizing: border-box;
+        font-size: 34px;
+        font-weight: 500;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+      }
+      p {
+        padding: 16px 24px;
+        box-sizing: border-box;
+        font-size: 28px;
+        font-weight: 400;
+      }
+      .imgs {
+        
+      }
+
+      .time {
+        padding: 0 24px 24px;
+        box-sizing: border-box;
+        border-top: 2px solid #EEEEEE;
+        & > div {
+          margin-top: 16px;
+        }
+        .goin,
+        .exit,
+        .type {
+          img {
+            width: 30px;
+            height: 30px;
+            vertical-align: bottom;
+          }
+          .label {
+            font-size: 24rpx;
+            font-weight: 400;
+            color: #666666;
+          }
+          .value {
+            color: #333333;
+            font-size: 24px;
+            font-weight: 400;
+          }
+        }
+      }
+    }
+  }
+}
+</style>