绿满眶商城微信小程序-uniapp
peng
2025-09-08 700e7d3bc6cec38610b2ee85139c4d6506102ff6
pages/passport/wechatMPLogin.vue
@@ -5,12 +5,24 @@
         :show-confirm-button="false">
         
         <div class="tips">
            为了更好地用户体验,需要您授权手机号
            为了更好地用户体验,需要您授权手机号和昵称
         </div>
         <button class="register" type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
            去授权
         <view class="auth-row">
            <text class="label">昵称:</text>
            <input
                class="register"
               type="nickname"
               v-model="nickName"
               placeholder="请输入昵称"
            >
            </input>
         </view>
         <button :class="isDisabled ? 'noRegister' : 'register'"  type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" :disabled="isDisabled">
            下一步
         </button>
      </u-modal>
      <view class="wx-auth-container">
         <div class="box">
            <view class="logo-info">
@@ -37,6 +49,7 @@
            </u-checkbox>
        </div>
         </div>
      </view>
   </view>
</template>
@@ -51,13 +64,14 @@
      whetherNavigate
   } from "@/utils/Foundation"; //登录跳转
   import {
      getUserInfo
      getUserInfo,updateMemberNickName
   } from "@/api/members";
   import storage from "@/utils/storage.js";
   import config from '@/config/config'
   export default {
      data() {
         return {
            isDisabled:true,
            lightColor:this.$lightColor,
            checked:false,
        configs:config,
@@ -97,6 +111,15 @@
      });
         
      },
      watch:{
         nickName(newVal){
            if(this.nickName.trim().length === 0){
               this.isDisabled = true;
            }else{
               this.isDisabled = false
            }
         }
      },
      methods: {
         /**
          * TODO 此方法不一定是最优解,如果有更好的办法请在  https://gitee.com/beijing_hongye_huicheng/lilishop/issues 中提出
@@ -132,14 +155,15 @@
          uni.getUserProfile({
            desc: "用于完善会员资料", // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
            success: (res) => {
              console.log("success", res)
              // console.log("success", res)
           //重置按钮显示
           // this.$refs.nicknameInput.focus();
              this.nickName = res.userInfo.nickName;
              this.image = res.userInfo.avatarUrl;
              // this.nickName = res.userInfo.nickName;
              // this.image = res.userInfo.avatarUrl;
           // 打印微信名称
           console.log("微信昵称:", this.nickName);
           // console.log("微信昵称:", this.nickName);
              /**
               * 根据公有的配置设置登录方式
               */
@@ -189,11 +213,12 @@
          this.logingFlag = false;
        }
         },
         //获取手机号授权
         getPhoneNumber(e) {
          getPhoneNumber(e) {
           let iv = e.detail.iv;
           let encryptedData = e.detail.encryptedData;
           if (!e.detail.encryptedData) {
             uni.showToast({
               title: "请授予手机号码权限,手机号码会和会员系统用户绑定!",
@@ -205,6 +230,14 @@
           let code = this.code;
           let image = this.image;
           let nickName = this.nickName;
           console.log('getPhoneNumber:' + code)
           console.log('getPhoneNumber:' + image)
           console.log('getPhoneNumber:' + nickName)
           mpAutoLogin({
             encryptedData,
             iv,
@@ -212,7 +245,7 @@
             image,
             nickName,
           }).then((res) => {
              console.log(res)
            //登录成功修改用户的昵称
             storage.setAccessToken(res.data.result.accessToken);
             storage.setRefreshToken(res.data.result.refreshToken);
             // 登录成功
@@ -221,15 +254,29 @@
               icon: "none",
             });
             //获取用户信息
             getUserInfo().then((user) => {
               getUserInfo().then(async (user) => {
               console.log(user)
               storage.setUserInfo(user.data.result);
               storage.setHasLogin(true);
               const form ={
                  memberId:user.data.result.id,
                  nickName:this.nickName
               }
               let name = '';
               await updateMemberNickName(form).then(res =>{
                  if(res.statusCode === 200){
                     name = res.data.data;
                  }
               })
               user.data.result.nickName = name
               storage.setUserInfo(user.data.result);
               storage.setHasLogin(true);
             
               uni.navigateBack({
                 delta: 1,
               });
             });
           });
         },
@@ -240,6 +287,19 @@
   };
</script>
<style lang="scss" scoped>
   .auth-row {
      text-align: left;
      margin: 6% 10%;
     display: flex;
     align-items: center;
     margin-bottom: 30rpx;
   }
   .label {
     width: 150rpx;
     font-size: 32rpx;
     color: #333;
   }
   /*微信授权*/
   page {
      background-color: #ffffff;
@@ -320,7 +380,11 @@
      margin-top: 48rpx;
      line-height: 1.75;
   }
   .noRegister{
      color: #b8b8b8 !important;
      border: none !important;
      background: #fff !important;
   }
   .register {
      color: $weChat-color !important;
      border: none !important;