柒零 vor 1 Jahr
Ursprung
Commit
a21256bec3

+ 1 - 0
app.json

@@ -85,6 +85,7 @@
     ]
   },
   "usingComponents": {
+    "van-loading": "@vant/weapp/loading/index",
     "van-tab": "@vant/weapp/tab/index",
     "van-tabs": "@vant/weapp/tabs/index",
     "van-collapse": "@vant/weapp/collapse/index",

+ 31 - 7
componets/authorized-login-dialog/authorizedLoginDialog.js

@@ -43,10 +43,11 @@ Component({
     canIUseGetUserProfile: wx.canIUse('getUserProfile'),
     canIUseNicknameComp: wx.canIUse('input.type.nickname'),
     avatarUrl: defaultAvatarUrl,
+    showLoading: false,
     encryptphone: "",
     phoneNumber: "",
     nickName: "",
-    disableCommitBtn: false,
+    disableCommitBtn: true,
     hasUserInfo: false,
     wxCode: "",
     unionid: "",
@@ -58,29 +59,37 @@ Component({
    * 组件的方法列表
    */
   methods: {
+    // 关闭
     onCloseDialog() {
       this.setData({ showDialog: false });
     },
+    // 选择头像 后期需要上传
     onChooseAvatar(e) {
       const { avatarUrl } = e.detail
       this.setData({
         avatarUrl: avatarUrl,
       })
+      this.checkHasUserInfo();
     },
+    // 输入昵称
     onInputNameChange(e) {
       console.log('e.detail==' + JSON.stringify(e.detail));
       const nickName = e.detail.value
       this.setData({
         nickName: nickName,
       })
+      this.checkHasUserInfo();
     },
+    // 输入手机号
     onInputPhoneChange(e) {
       console.log('e.detail==' + JSON.stringify(e.detail));
       const phoneNumber = e.detail.value
       this.setData({
         phoneNumber: phoneNumber,
       })
+      this.checkHasUserInfo();
     },
+    // 获取手机号
     onGetPhoneNumber: function (e) {
       console.log('onGetPhoneNumber=' + JSON.stringify(e));
       var that = this;
@@ -113,12 +122,21 @@ Component({
               encryptphone: res.data.encryptphone,
               phoneNumber: res.data.shieldphone,
             })
+            that.checkHasUserInfo();
             wx.setStorageSync('phoneNumber', res.data.shieldphone);
           }
         })
       }
     },
+    checkHasUserInfo() { 
+      var disableCommitBtn = this.data.avatarUrl == defaultAvatarUrl || !this.data.phoneNumber || !this.data.nickName;
 
+      this.setData({
+        hasUserInfo: this.data.avatarUrl != defaultAvatarUrl && this.data.phoneNumber && this.data.nickName,
+        disableCommitBtn: disableCommitBtn
+      })
+    },
+// 提交
     handleUserInfo: function (e) {
       if (!this.data.hasUserInfo) {
         wx.showToast({
@@ -131,16 +149,16 @@ Component({
       if (e.detail.userInfo) {
         // 用户点击允许,获取到用户信息  
         this.setData({
+          showLoading:true,
           disableCommitBtn: true,
         });
-        wx.showLoading()
 
         wx.request({
           url: `${homeApi_empower}/wxlogin`,
           data: {
             code: that.data.wxCode,
             token: token_empower,
-            nickname: that.data.userInfo.nickName,
+            nickname: that.data.nickName,
             encryptphone: that.data.encryptphone
           },
           method: 'POST',
@@ -161,10 +179,16 @@ Component({
                 openid: loginRes.data.back.openid,
                 session_key: loginRes.data.back.session_key,
               });
+            } else {
+              that.setData({ showLoading: false });
+              wx.showToast({
+                title: '后台授权失败',
+                icon: 'none'
+              });
             }
           },
           fail: function () {
-            wx.hideLoading()
+            that.setData({ showLoading: false });
             wx.showToast({
               title: '后台授权失败',
               icon: 'none'
@@ -182,7 +206,7 @@ Component({
         // 可以选择在这里处理用户拒绝授权后的逻辑,如跳转到其他页面或显示提示信息  
       }
     },
-
+// 轮询后台信息
     startInterval: function () {
       var that = this;
       this.data.intervalId = setInterval(() => {
@@ -200,7 +224,7 @@ Component({
           },
           method: 'POST',
           success: function (intervalRes) {
-            wx.hideLoading()
+            that.setData({ showLoading: false });
             console.log('intervalRes=' + JSON.stringify(intervalRes));
             console.log('intervalRes.data=' + JSON.stringify(intervalRes.data));
             //empower.js? [sm]:152 intervalRes.data={"st":"success","status":"0"}
@@ -226,7 +250,7 @@ Component({
             }
           },
           fail: function (error) {
-            wx.hideLoading()
+            that.setData({ showLoading: false });
             that.clearInterval();
             wx.showToast({
               title: '后台授权失败',

+ 3 - 0
componets/authorized-login-dialog/authorizedLoginDialog.wxml

@@ -24,5 +24,8 @@
             disabled="{{disableCommitBtn}}">
             确认授权
         </button>
+        <view wx:if="{{showLoading}}" class="mask-content">
+            <van-loading type="spinner" custom-class="custom-loading" color="#0ABCA4" size="80rpx" />
+        </view>
     </view>
 </van-popup>

+ 23 - 0
componets/authorized-login-dialog/authorizedLoginDialog.wxss

@@ -53,7 +53,10 @@
 .avatar-wrapper {
     width: 128rpx;
     padding: 0;
+    display: block;
+    border-radius: 100%;
     border: 0;
+    overflow: hidden;
     height: 128rpx;
     margin: 20rpx auto 0;
 }
@@ -107,4 +110,24 @@ button[disabled] {
     color: #FFFFFF;
     background: linear-gradient(315deg, #0ABCA4 0%, rgba(11, 195, 170, 0.8) 100%);
     opacity: 0.6;
+}
+
+.mask-content {
+    background: rgba(0, 0, 0, 0.3);
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    border-radius: 32rpx 32rpx 0 0;
+}
+
+.custom-loading {
+    display: block;
+    margin-top: 350rpx;
 }