积分任务

2023-03-29 10:16:36 +08:00
parent 214faad467
commit 8a687ede4a
3 changed files with 127 additions and 29 deletions
--- a/src/project/fengdu/AppNewFarmerBank/AppNewFarmerBank.vue
+++ b/src/project/fengdu/AppNewFarmerBank/AppNewFarmerBank.vue
@@ -5,12 +5,12 @@
    </div>
    <div class="welcome">
      <div class="welcome-user">
-        <span class="name">汪周文</span>，欢迎进入新华街社区！
+        <span class="name">{{ user.realName || user.nickName }}</span>，欢迎进入新华街社区！
      </div>
      <div class="signin">签到</div>
    </div>
    <div class="card-list">
-      <div class="jfsq">
+      <div class="jfsq" @click="$u.toast('内容建设中...')">
        <p>积分申请</p>
        <h4>好事自荐得积分</h4>
      </div>
@@ -18,11 +18,11 @@
        <p>积分任务</p>
        <h4>完成任务得积分</h4>
      </div>
-      <div class="jfph">
+      <div class="jfph" @click="$u.toast('内容建设中...')">
        <p>积分排行</p>
        <h4>社区荣誉榜</h4>
      </div>
-      <div class="jfsc">
+      <div class="jfsc" @click="$u.toast('内容建设中...')">
        <p>积分商城</p>
        <h4>兑换得好物</h4>
      </div>
@@ -47,6 +47,7 @@
 </template>

 <script>
+import { mapState } from 'vuex'
 export default {
  name: "AppNewFarmerBank",
  appName: "功德银行",
@@ -55,6 +56,9 @@ export default {

    }
  },
+  computed: {
+    ...mapState(['user'])
+  },
  methods: {
    getList() {
    },
--- a/src/project/fengdu/AppNewFarmerBank/integralTask.vue
+++ b/src/project/fengdu/AppNewFarmerBank/integralTask.vue
@@ -5,29 +5,27 @@
    </div>
    <div class="title">任务大厅</div>
    <div class="card-list">
-      <div class="card" @click="$linkTo('./taskDetail')">
-        <h4>10月31日线下公益宣传</h4>
-        <p>
-          百年征和波澜壮阔，百年初心历争议弥坚。7月1日上午，庆祝中国共产党成立100周年在国务院举办…
-        </p>
-        <div class="imgs">
-
+      <div class="card" v-for="(item,index) in list" :key="index" @click="$linkTo('./taskDetail?id='+item.id)">
+        <h4>{{ item.title }}</h4>
+        <p>{{ item.detail }}</p>
+        <div class="imgs" v-if="item.files">
+          <image mode="aspectFill" v-for="(e, i) in item.files" :key="i" :src="e.url"/>
        </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 class="label">进场时间：</div>
+            <div class="value">{{ item.intoBegintime.substring(0, 16)}} 至 {{ item.intoEndtime.substring(0, 16) }}</div>
          </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 class="label">离场时间：</div>
+            <div class="value">{{ item.exitBegintime.substring(0, 16) }} 至 {{ item.exitEndtime.substring(0, 16) }}</div>
          </div>
          <div class="type">
            <img src="https://cdn.cunwuyun.cn/fengdu/ic-renwuleixing.png" alt="">
-            <span class="label">任务类型：</span>
-            <span class="value">报名得积分</span>
+            <div class="label">任务类型：</div>
+            <div class="value">{{ item.type==0? '打卡得积分':'报名得积分' }}</div>
          </div>
        </div>
      </div>
@@ -41,16 +39,23 @@ export default {
  appName: '功德银行',
  data() {
    return {
-
+      list: []
    }
  },
  methods: {
-
+    getList() {
+      this.$instance.post('/app/appintegraltask/list').then(res=> {
+        if(res?.data) {
+          this.list = res.data.records
+        }
+      })
+    }
  },
  onShow() {
    uni.setNavigationBarTitle({
      title: '功德银行'
    });
+    this.getList()
  },
 }
 </script>
@@ -79,6 +84,7 @@ export default {
      background: #FFF;
      color: #333333;
      border-radius: 16px;
+      margin-bottom: 24px;
      h4 {
        padding: 24px 24px 0;
        box-sizing: border-box;
@@ -95,7 +101,23 @@ export default {
        font-weight: 400;
      }
      .imgs {
+        display: flex;
+        align-items: center;
+        flex-wrap: wrap;
+        padding: 16px 24px;
+        box-sizing: border-box;

+        image {
+          height: 208px;
+          width: 33.33%;
+          padding-right: 12px;
+          margin-bottom: 12px;
+          box-sizing: border-box;
+
+          &:nth-of-type(3n) {
+            padding-right: 0;
+          }
+        }
      }

      .time {
@@ -108,20 +130,24 @@ export default {
        .goin,
        .exit,
        .type {
+          display: flex;
          img {
            width: 30px;
            height: 30px;
-            vertical-align: bottom;
+            align-self: center;
          }
          .label {
-            font-size: 24rpx;
+            font-size: 24px;
            font-weight: 400;
            color: #666666;
+            align-self: center;
+            width: 130px;
          }
          .value {
            color: #333333;
            font-size: 24px;
            font-weight: 400;
+            width: calc(100% - 160px);
          }
        }
      }
--- a/src/project/fengdu/AppNewFarmerBank/taskDetail.vue
+++ b/src/project/fengdu/AppNewFarmerBank/taskDetail.vue
@@ -17,7 +17,7 @@
          <label>活动地点：</label>
          <div class="value">丰都县金牛区XXXX大厦XXX楼2101</div>
        </div>
-        <div class="address">
+        <div class="address" @click="toAddress">
          <img src="https://cdn.cunwuyun.cn/fengdu/ic-daohang.png" alt="">
          <i>导航</i>
        </div>
@@ -44,11 +44,16 @@
        </div>
      </div>
    </div>
-
-    <!-- <div class="right" @click="toAddress">
-      <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/dh.png" />
-      <i>导航</i>
+    <!-- <div class="btn-wrapper">
+      <div class="btn" @click="toReport" hover-class="text-hover">报名得积分/积分+5,已报名</div>
    </div> -->
+    <div class="btn-clock">
+      <div class="btn-circle" @click="toReport" hover-class="text-hover">
+        <div class="daka">打卡签到</div>
+        <div class="text">积分+5</div>
+      </div>
+      <div class="tips">符合打卡条件,未到打卡时间,无法重复打卡</div>
+    </div>
  </div>
 </template>

@@ -58,7 +63,8 @@ export default {
  appName: "任务详情",
  data() {
    return {
-
+      info: {},
+      id: ''
    }
  },
  methods: {
@@ -75,18 +81,28 @@ export default {
    //     current: url
    //   })
    // },
-
+    getDetail() {
+      this.$instance.post(`/app/appintegraltask/queryDetailById?id=${this.id}`).then(res=> {
+        if(res?.data) {
+          console.log(res);
+        }
+      })
+    }
  },
-  onShow() {
+  onLoad(o) {
+    this.id = o.id
    uni.setNavigationBarTitle({
      title: '任务详情'
    });
+    this.getDetail()
  },
 }
 </script>

 <style lang="scss" scoped>
 .taskDetail {
+  padding-bottom: 400px;
+  box-sizing: border-box;
  .task,
  .info {
    margin-top: 24px;
@@ -161,5 +177,57 @@ export default {
      }
    }
  }
+  ::v-deep .btn-wrapper {
+    background: #FFF;
+  }
+
+  ::v-deep .btn-wrapper .btn {
+    height: 80px;
+    line-height: 80px;
+    border-radius: 40px;
+  }
+
+  .opacity {
+    opacity: 0.6000000238418579;
+  }
+
+  .gray {
+    background: #b5b5bcff;
+  }
+
+  .btn-clock {
+    height: 372px;
+    width: 100%;
+    background: #FFF;
+    position: fixed;
+    left: 0;
+    bottom: 0;
+    .btn-circle {
+      width: 226px;
+      height: 226px;
+      background: #2D7DFF;
+      border-radius: 50%;
+      margin: 40px auto 24px;
+      text-align: center;
+      .text,
+      .daka {
+        color: #FFF;
+        font-size: 34px;
+        font-weight: 500;
+      }
+      .daka {
+        padding-top: 62px;
+        box-sizing: border-box;
+        font-size: 40px;
+        font-weight: 500;
+      }
+    }
+    .tips {
+      text-align: center;
+      color: #666666;
+      font-size: 28px;
+      font-weight: 400;
+    }
+  }
 }
 </style>