bug

src/project/tianfuxing/AppMy/UserInfo.vue

@@ -0,0 +1,174 @@
+<template>
+  <div class="userinfo">
+    <div class="section">
+      <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>
+            </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" />
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="btn" @click="save">保存</div>
+  </div>
+</template>
+
+<script>
+  export default {
+    appName: '设置',
+    name: 'UserInfo',
+    data () {
+      return {
+        userInfo: {}
+      }
+    },
+
+    onLoad () {
+      if (uni.getStorageSync('token')) {
+        this.userInfo = uni.getStorageSync('userInfo')
+        console.log(this.userInfo)
+      }
+
+      uni.$on('updateUserInfo', () => {
+        this.getUserInfo()
+      })
+    },
+
+    methods: {
+      getUserInfo () {
+        this.$http.post(`/app/getUserInfo`).then(res => {
+          if (res.code === 200) {
+            this.isLogin = true
+            this.userInfo = res.data
+            uni.setStorageSync('userInfo', res.data)
+            uni.setStorageSync('token', res.data.id)
+          }
+        })
+      },
+
+
+      uploadImg () {
+        uni.chooseImage({
+          count: 1,
+          sizeType: ['original', 'compressed'],
+          sourceType: ['album', 'camera'],
+          success: res => {
+          }
+        })
+      },
+
+      save () {
+        this.$loading()
+        this.$http.post('/app/editUserInfo', null, {
+          params: {
+            ...this.userInfo
+          }
+        }).then(res => {
+          if (res.code === 0) {
+            this.$toast('保存成功')
+          }
+        })
+      }
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .userinfo {
+    .btn {
+      margin-top: 180rpx;
+    }
+
+    .section {
+      background: #fff;
+
+      &:first-child {
+        margin-bottom: 20rpx;
+      }
+
+      & > h2 {
+        position: relative;
+        height: 98rpx;
+        line-height: 98rpx;
+        padding: 0 50rpx;
+        color: #363636;
+        border-bottom: 1rpx solid #e9e9e9;
+        font-size: 34rpx;
+
+        &:after {
+          position: absolute;
+          left: 30rpx;
+          top: 50%;
+          z-index: 1;
+          width: 5rpx;
+          height: 50rpx;
+          background: #fd2c21;
+          content: ' ';
+          transform: translateY(-50%);
+        }
+      }
+
+      .form {
+        .form-item {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          height: 88rpx;
+          padding: 0 30rpx;
+          border-bottom: 1rpx solid #e9e9e9;
+
+          &:last-child {
+            border: none;
+          }
+
+          h2 {
+            color: #4e4e4e;
+            font-size: 30rpx;
+          }
+
+          &.avatar {
+            height: 160rpx;
+
+            .avatar-img {
+              width: 120rpx;
+              height: 120rpx;
+              border-radius: 50%;
+            }
+          }
+
+          .form-item__right {
+            display: flex;
+            align-items: center;
+
+            input {
+              width: 500rpx;
+              text-align: right;
+              font-size: 30rpx;
+            }
+
+            span {
+              color: #4e4e4e;
+              font-size: 30rpx;
+            }
+
+            .right {
+              width: 13rpx;
+              height: 21rpx;
+              margin-left: 10rpx;
+            }
+          }
+        }
+      }
+    }
+  }
+</style>