bug

2022-11-02 17:23:17 +08:00
parent 5061c0d950
commit 33b9400e4a
5 changed files with 164 additions and 66 deletions
--- a/src/project/tianfuxing/AppHome/AppHome.vue
+++ b/src/project/tianfuxing/AppHome/AppHome.vue
@@ -1,13 +1,12 @@
 <template>
  <div class="home">
-    <image class="banner" src="https://jisheng-xiaochengxu.oss-cn-hangzhou.aliyuncs.com/admin/5bad9165-fa6e-4c81-894d-2beae426260b.png" />
+    <image class="banner" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/banner.png" />
    <div class="nav">
      <div class="nav-item" hover-class="text-hover" @click="$linkTo('./PhotoReport')">
-        <span>随手拍</span>
+        <image mode="aspectFill" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/ssp.png" />
      </div>
-      <div class="nav-item" @click="$linkTo('./Culture')">
-        <span>文明倡导</span>
-        <image src="https://jisheng-xiaochengxu.oss-cn-hangzhou.aliyuncs.com/admin/5bad9165-fa6e-4c81-894d-2beae426260b.png" />
+      <div class="nav-item" hover-class="text-hover" @click="$linkTo('./Culture')">
+        <image mode="aspectFill" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/wmcd.png" />
      </div>
    </div>
    <div class="activity-wrapper">
@@ -118,6 +117,7 @@
      width: 686px;
      height: 240px;
      margin: 0 auto 32rpx;
+      border-radius: 10px;
    }

    .nav {
@@ -127,36 +127,13 @@
      margin: 0 32rpx 58rpx;

      .nav-item {
-        position: relative;
        width: 328px;
-        height: 128px;
-        line-height: 128px;
-        text-align: center;
-        font-size: 30rpx;
-        overflow: hidden;
-        background: rgba($color: #fff, $alpha: 0.8);
-        border-radius: 16px;
-
-        span {
-          position: relative;
-          z-index: 1;
-          color: #333;
-          font-weight: 600;
-        }
-
-        &:last-child {
-          span {
-            color: #fff;
-            font-weight: 600;
-          }
-        }
+        height: 122px;

        image {
-          position: absolute;
-          top: 0;
-          left: 0;
          width: 100%;
          height: 100%;
+          border-radius: 10px;
        }
      }
    }
--- a/src/project/tianfuxing/AppHome/Culture.vue
+++ b/src/project/tianfuxing/AppHome/Culture.vue
@@ -11,9 +11,10 @@
      <image src="/static/img/left.png"/>
    </div>
    <div class="photo-header">
-      <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/wm-bg.png" />
+      <image class="bg-img" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/wm-bg.png" />
      <h2>文明倡导</h2>
      <p>将文明倡导公益海报分享在微信朋友圈、50人以上的微信群、微博群，即可获得积分奖励</p>
+      <image class="right-icon" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/right1.png" />
    </div>
    <div class="phone-wrapper">
      <h2>我上传的</h2>
@@ -283,7 +284,7 @@ export default {
    height: 448px;
    padding: 150px 48px 0;

-    image {
+    .bg-img {
      position: absolute;
      top: 0;
      left: 0;
@@ -292,6 +293,15 @@ export default {
      height: 448px;
    }

+    .right-icon {
+      position: absolute;
+      top: 105px;
+      right: 0;
+      z-index: 2;
+      width: 304px;
+      height: 240px;
+    }
+
    h2 {
      position: relative;
      z-index: 2;
@@ -341,7 +351,7 @@ export default {
          top: 16px;
          right: 16px;
          z-index: 2;
-          width: 110px;
+          padding: 0 16px;
          height: 48px;
          line-height: 48px;
          font-size: 26px;
--- a/src/project/tianfuxing/AppHome/PhotoReport.vue
+++ b/src/project/tianfuxing/AppHome/PhotoReport.vue
@@ -11,9 +11,10 @@
      <image src="/static/img/left.png"/>
    </div>
    <div class="photo-header">
-      <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/photo-bg.png" />
+      <image class="bg-img" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/photo-bg.png" />
      <h2>随手拍</h2>
      <p>将身边文明或不文明行为拍照上传即可获得积分奖励</p>
+      <image class="right-icon" src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/right2.png" />
    </div>
    <div class="phone-wrapper">
      <h2>我上传的</h2>
@@ -275,7 +276,7 @@
    height: 448px;
    padding: 150px 48px 0;

-    image {
+    .bg-img {
      position: absolute;
      top: 0;
      left: 0;
@@ -284,6 +285,15 @@
      height: 448px;
    }

+    .right-icon {
+      position: absolute;
+      top: 105px;
+      right: 0;
+      z-index: 2;
+      width: 304px;
+      height: 240px;
+    }
+
    h2 {
      position: relative;
      z-index: 2;
@@ -333,9 +343,9 @@
          top: 16px;
          right: 16px;
          z-index: 2;
-          width: 110px;
          height: 48px;
          line-height: 48px;
+          padding: 0 16px;
          font-size: 26px;
          text-align: center;
          color: #FF883C;
--- a/src/project/tianfuxing/AppMy/AppMy.vue
+++ b/src/project/tianfuxing/AppMy/AppMy.vue
@@ -1,10 +1,10 @@
 <template>
  <div class="my">
    <div class="user" @click="toSetting">
-      <image src="https://jisheng-xiaochengxu.oss-cn-hangzhou.aliyuncs.com/admin/5bad9165-fa6e-4c81-894d-2beae426260b.png" />
+      <image :src="user.avatarUrl || 'https://cdn.cunwuyun.cn/wxmp/tianfuxing/avatar.png'" />
      <div class="right" v-if="isLogin">
-        <h2>张三</h2>
-        <p>文明天府星市民 Lv.1</p>
+        <h2>{{ user.nickName }}</h2>
+        <p v-if="user.levelTitle">{{ user.levelTitle }}</p>
      </div>
      <div class="right" v-else @click="toLogin">
        <h2>登录</h2>
@@ -14,27 +14,30 @@
    <div class="info">
      <div class="info-item">
        <h3>积分总额</h3>
-        <span>32</span>
+        <span>{{ user.integral }}</span>
+        <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/nav2.png" />
      </div>
      <div class="info-item">
        <h3>积分排名</h3>
-        <span>32</span>
+        <span>{{ user.integralOrder }}</span>
+        <image src="https://cdn.cunwuyun.cn/wxmp/tianfuxing/nav1.png" />
      </div>
    </div>
    <div class="my-list">
      <h2>积分明细</h2>
      <div class="list">
-        <div class="item" v-for="(item, index) in 10" :key="index">
+        <div class="item" v-for="(item, index) in list" :key="index">
          <div class="left">
-            <h2>随手拍</h2>
-            <p>2022-07-21  10:10:13</p>
+            <h2>{{ item.detail }}</h2>
+            <p>{{ item.createTime }}</p>
          </div>
          <div class="right">
-            <i>+</i>
-            <span>5</span>
+            <i>{{ item.calcType === '0' ? '-' : '+' }}</i>
+            <span>{{ item.integral || 0 }}</span>
            <em>积分</em>
          </div>
        </div>
+        <AiEmpty v-if="!list.length"></AiEmpty>
      </div>
    </div>
  </div>
@@ -48,7 +51,9 @@

    data () {
      return {
-
+        list: [],
+        current: 1,
+        isMore: false
      }
    },

@@ -61,10 +66,9 @@
    },

    onLoad () {
-      console.log(this.user)
-      console.log(this.token)
      if (this.token) {
        this.getUserInfo()
+        this.getList()
      }
    },

@@ -85,8 +89,44 @@
        } else {
          this.getUserInfo()
        }
+      },
+
+      getList () {
+        if (this.isMore) return
+
+        this.$instance.post(`/appwechatintegraldetail/list`, null, {
+          params: {
+            current: this.current,
+            size: 10
+          }
+        }).then(res => {
+          if (res.code === 0) {
+            this.$hideLoading()
+            if (this.current > 1) {
+              this.list = [...this.list, ...res.data.records]
+            } else {
+              this.list = res.data.records
+            }
+
+            if (res.data.records.length < 10) {
+              this.isMore = true
+
+              return false
+            }
+
+            this.current = this.current + 1
+          } else {
+            this.isMore = true
+          }
+        }).catch(() => {
+          this.$hideLoading()
+        })
+      }
+    },
+
+      onReachBottom () {
+        this.getList()
      }
-    }
  }
 </script>

@@ -95,6 +135,10 @@
    padding-top: 32px;
    padding-bottom: 30px;

+    div {
+      box-sizing: border-box;
+    }
+
    .user, .info {
      display: flex;
      align-items: center;
@@ -194,16 +238,33 @@

      .info-item {
        display: flex;
+        position: relative;
        align-items: center;
        justify-content: space-between;
        font-size: 28px;
-        width: 192px;
+        width: 318px;
        height: 112px;
+        padding: 0 24px;
        color: #4D5596;
+        box-sizing: border-box;

-        div:last-child {
+        &:last-child {
          color: #316568;
        }
+
+        h3, span {
+          position: relative;
+          z-index: 2;
+        }
+
+        image {
+          position: absolute;
+          left: 0;
+          top: 0;
+          z-index: 1;
+          width: 318px;
+          height: 112px;
+        }
      }
    }
  }
--- a/src/project/tianfuxing/AppMy/UserInfo.vue
+++ b/src/project/tianfuxing/AppMy/UserInfo.vue
@@ -4,26 +4,28 @@
      <div class="form">
        <div class="form-item avatar">
          <h2>头像</h2>
-          <div class="form-item__right" @click="uploadImg">
-            <button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
-              <image class="avatar" :src="userInfo.avatar"></image>
+          <div class="form-item__right">
+            <button class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
+              <image class="avatar" :src="userInfo.avatarUrl || 'https://cdn.cunwuyun.cn/wxmp/tianfuxing/avatar.png'"></image>
            </button>
-            <image class="right" src="/static/images/next.png" />
          </div>
        </div>
        <div class="form-item">
          <h2>昵称</h2>
          <div class="form-item__right">
-            <input placeholder="请输入昵称" type="nickname" v-model="userInfo.nickname" />
+            <input placeholder="请输入昵称" type="nickname" v-model="userInfo.nickName" />
          </div>
        </div>
      </div>
    </div>
-    <div class="btn" @click="save">保存</div>
+    <div class="btn-wrapper">
+      <div class="btn" hover-class="text-hover">保存</div>
+    </div>
  </div>
 </template>

 <script>
+  import { mapState } from 'vuex'
  export default {
    appName: '设置',
    name: 'UserInfo',
@@ -33,15 +35,14 @@
      }
    },

-    onLoad () {
-      if (uni.getStorageSync('token')) {
-        this.userInfo = uni.getStorageSync('userInfo')
-        console.log(this.userInfo)
-      }
+    computed: {
+      ...mapState(['user'])
+    },

-      uni.$on('updateUserInfo', () => {
-        this.getUserInfo()
-      })
+    onLoad () {
+      this.userInfo = {
+        ...this.user
+      }
    },

    methods: {
@@ -56,6 +57,32 @@
        })
      },

+      onChooseAvatar (e) {
+        this.$loading()
+        uni.uploadFile({
+          url: this.$instance.defaults.baseURL + '/api/file/add',
+          filePath: e.detail.avatarUrl,
+          name: 'file',
+          header: {
+            'Content-Type': 'multipart/form-data',
+            Authorization: uni.getStorageSync('token'),
+          },
+          success: (res) => {
+            const data = JSON.parse(res.data)
+
+            if (data.code === 0) {
+              this.$set(this.userInfo, 'avatarUrl', data.data[0].split(';')[0])
+            } else {
+              this.$toast(data.msg)
+            }
+          },
+          complete: () => {
+            this.$nextTick(() => {
+              this.$hideLoading()
+            })
+          }
+        })
+      },

      uploadImg () {
        uni.chooseImage({
@@ -118,6 +145,19 @@
        }
      }

+      .avatar-wrapper {
+        padding: 0;
+        width: 120px!important;
+        height: 120px!important;
+        border-radius: 50%;
+        margin: 0;
+
+        image {
+          width: 120px;
+          height: 120px;
+        }
+      }
+
      .form {
        .form-item {
          display: flex;