1. 完成手机验证码修改账号密码功能

2. 完成更换账号绑定手机号功能

api/user.js

@@ -68,8 +68,27 @@ export function loginRequest(data) {
 // 注册
 export function phoneLoginRequest(data) {
   return request({
-    url: '/wechat/mini/phone/login ',
+    url: '/wechat/mini/phone/login',
     method: 'POST',
     data
   })
 }
+
+// 更换绑定手机号
+export function rebindPhoneRequest(data) {
+  return request({
+    url: '/wechat/mini/rebindPhone',
+    method: 'POST',
+    data
+  })
+}
+
+// 验证码更换密码
+export function changePasswordRequest(data) {
+  return request({
+    url: '/wechat/mini/changePassword',
+    method: 'POST',
+    data
+  })
+}
+

pages/home/home.vue

@@ -105,7 +105,7 @@
     },
 		methods: {
       timeFormat,
-      ...mapActions(useUserStore, ['updateUserInfo', 'updateLoginStatus', 'getPhone']),
+      ...mapActions(useUserStore, ['updateUserInfo', 'updateLoginStatus', 'phoneLogin', 'getUserInfo']),
       ...mapActions(useLockStore, ['getLockList', 'getRole', 'getTimeLimit']),
       ...mapActions(useBluetoothStore, ['getBluetoothStatus', 'initAndListenBluetooth', 'updateCurrentLockInfo',
         'checkSetting', 'updateKeyId']),
@@ -153,14 +153,11 @@
         if(data.detail.errMsg === 'getPhoneNumber:fail user deny') {
           return
         }
-        const result = await this.getPhone({
+        const result = await this.phoneLogin({
           encryptedData: data.detail.encryptedData,
           iv: data.detail.iv
         })
-        if(result) {
+        if(!result) {
-          this.getUserInfo()
-          this.getLockList(this.search)
-        } else {
           uni.showToast({
             title: '登录失败，请重试',
             icon: 'none'
@@ -190,14 +187,6 @@
         this.search.searchStr = data
         await this.getLockList(this.search)
       },
-      async getUserInfo() {
-        const { code, data } = await getUserInfoRequest()
-        if(code === 0) {
-          this.updateUserInfo(data)
-          this.updateLoginStatus(true)
-        }
-        return code
-      },
       getFocus() {
         this.focus = true
       },

pages/mine/mine.vue

@@ -69,11 +69,19 @@
 		methods: {
       ...mapActions(useBasicStore, ['getButtonInfo', 'routeJump']),
       ...mapActions(useLockStore, ['getLockList']),
-      ...mapActions(useUserStore, ['updateLoginStatus', 'getPhone', 'updateUserInfo']),
+      ...mapActions(useUserStore, ['updateLoginStatus', 'phoneLogin', 'updateUserInfo', 'getUserInfo', 'checkSession']),
       async changePhone(res) {
         if(res.detail.errMsg === 'getPhoneNumber:fail user deny') {
           return
         }
+        const result = await this.checkSession()
+        if(!result) {
+          uni.showToast({
+            title: '登录失败，请重试',
+            icon: 'none'
+          })
+          return
+        }
         const openid = uni.getStorageSync('openid')
         const { code, data, message } = await phoneLoginRequest({
           encryptedData: res.detail.encryptedData,
@@ -83,8 +91,6 @@
         })
         if(code === 0) {
           uni.setStorageSync('token', data.accessToken)
-          console.log('token', data.accessToken,uni.getStorageSync('token'))
-          this.getUserInfo()
           this.getLockList({
             pageNo: 1,
             pageSize: 50
@@ -104,31 +110,17 @@
         if(data.detail.errMsg === 'getPhoneNumber:fail user deny') {
           return
         }
-        const result = await this.getPhone({
+        const result = await this.phoneLogin({
           encryptedData: data.detail.encryptedData,
           iv: data.detail.iv
         })
-        if(result) {
+        if(!result) {
-          this.getUserInfo()
-          this.getLockList({
-            pageNo: 1,
-            pageSize: 50
-          })
-        } else {
           uni.showToast({
             title: '登录失败，请重试',
             icon: 'none'
           })
         }
       },
-      async getUserInfo() {
-        const { code, data } = await getUserInfoRequest()
-        if(code === 0) {
-          this.updateUserInfo(data)
-          this.updateLoginStatus(true)
-        }
-        return code
-      },
       toUsereInfo() {
         this.routeJump({
           name: 'userInfo'

pages/updatePassword/updatePassword.vue

@@ -1,11 +1,12 @@
 <template>
   <view>
-    <input class="input" :password="true" style="margin-top: 48rpx;" :value="oldPassword" maxlength="20"
+    <input class="input" :password="true" :value="password" maxlength="20" placeholder="请输入新密码"
-           placeholder="请输入原密码" placeholder-class="input-placeholder" :focus="true" @input="updateOldPassword"></input>
-    <input class="input" :password="true" :value="newPassword" maxlength="20" placeholder="请输入新密码"
            placeholder-class="input-placeholder" @input="updateNewPassword"></input>
-    <input class="input" :password="true" :value="confirmPassword" maxlength="20" placeholder="请确认密码"
+    <view class="view-top">
-           placeholder-class="input-placeholder" @input="updateConfirmPassword"></input>
+      <input type="number" class="input-verify" :value="verificationCode" maxlength="6" placeholder="请输入验证码"
+             placeholder-class="input-placeholder" @input="updateInputCode"></input>
+      <view class="button-verify" @click="getPhoneCode">{{text}}</view>
+    </view>
     <view class="text-tips">密码必须是8-20位，至少包括数字/字母/符号中的2种</view>
     <view class="button" @click="updatePassword">保存</view>
   </view>
@@ -14,15 +15,16 @@
 <script>
 import { mapActions, mapState } from 'pinia'
 import { useUserStore } from '@/stores/user'
-import { updatePasswordRequest } from '@/api/user'
+import { changePasswordRequest, getEmailCodeRequest, updatePasswordRequest } from '@/api/user'
+import { test } from 'uview-plus'
 
 export default {
   data () {
     return {
-      oldPassword: '',
+      text: '获取验证码',
-      newPassword: '',
+      password: '',
-      confirmPassword: '',
+      pending: false,
-      pending: false
+      verificationCode: ''
     }
   },
   computed: {
@@ -30,34 +32,60 @@ export default {
   },
   methods: {
     ...mapActions(useUserStore, ['updateUserInfo']),
-    updateOldPassword (data) {
-      this.oldPassword = data.detail.value
-    },
     updateNewPassword (data) {
-      this.newPassword = data.detail.value
+      this.password = data.detail.value
     },
-    updateConfirmPassword (data) {
+    updateInputCode (data) {
-      this.confirmPassword = data.detail.value
+      this.verificationCode = data.detail.value
+    },
+    async getPhoneCode () {
+      if (this.text !== '获取验证码') {
+        return
+      }
+      const { code, message } = await getEmailCodeRequest({
+        channel: '1',
+        codeType: 9
+      })
+      if (code === 0) {
+        this.updateTime()
+      } else {
+        uni.showToast({
+          title: message,
+          icon: 'none'
+        })
+      }
+    },
+    updateTime () {
+      let time = 120
+      this.text = `${time} s`
+      const now = new Date().getTime()
+      const timer = setInterval(() => {
+        const second = parseInt((new Date().getTime() - now) / 1000)
+        this.text = `${time - second} s`
+        if (time <= second) {
+          clearInterval(timer)
+          this.text = '获取验证码'
+        }
+      }, 1000)
     },
     async updatePassword () {
-      if (this.oldPassword === '' || this.newPassword === '' || this.confirmPassword === '') {
+      if (this.password === '') {
         uni.showToast({
           title: '密码不能为空',
           icon: 'none'
         })
         return
       }
-      if (this.newPassword.length < 8 || this.newPassword.length > 20 || this.confirmPassword.length < 8 ||
+      if (this.password.length < 8 || this.password.length > 20) {
-          this.confirmPassword.length > 20 || this.oldPassword.length < 8 || this.oldPassword.length > 20) {
         uni.showToast({
           title: '密码长度必须是8-20位',
           icon: 'none'
         })
         return
       }
-      if (this.newPassword !== this.confirmPassword) {
+      if (!(this.verificationCode.length === 6 && test.digits(this.verificationCode))) {
         uni.showToast({
-          title: '两次密码输入不一致',
+          title: '验证码为6位纯数字',
           icon: 'none'
         })
         return
@@ -66,10 +94,10 @@ export default {
         return
       }
       this.pending = true
-      const { code, message } = await updatePasswordRequest({
+      const { code, message } = await changePasswordRequest({
-        oldPassword: this.oldPassword,
+        verificationCode: this.verificationCode,
-        newPassword: this.newPassword,
+        password: this.password,
-        date: new Date().getTime()
+        channel: '1'
       })
       if (code === 0) {
         this.updateUserInfo({
@@ -107,7 +135,7 @@ page {
   border-radius: 16rpx;
   background: #FFFFFF;
   margin-left: 35rpx;
-  margin-top: 24rpx;
+  margin-top: 48rpx;
   height: 108rpx;
   width: 616rpx;
   padding-left: 32rpx;
@@ -140,4 +168,34 @@ page {
   font-size: 28rpx;
   color: #9B9B9B;
 }
+
+.view-top {
+  display: flex;
+  align-items: center;
+}
+
+.input-verify {
+  border-radius: 16rpx;
+  background: #FFFFFF;
+  margin-left: 35rpx;
+  margin-top: 48rpx;
+  height: 108rpx;
+  width: 316rpx;
+  padding-left: 32rpx;
+  padding-right: 32rpx;
+}
+
+.button-verify {
+  margin-top: 48rpx;
+  height: 108rpx;
+  width: 265rpx;
+  line-height: 108rpx;
+  border-radius: 16rpx;
+  text-align: center;
+  font-size: 32rpx;
+  margin-left: 35rpx;
+
+  background: #63b8af;
+  color: #FFFFFF;
+}
 </style>

pages/userInfo/userInfo.vue

@@ -19,14 +19,16 @@
         </view>
       </view>
       <view class="view-line"></view>
-      <view class="view-button">
+      <label for="phone">
-        <view>手机号</view>
+        <view class="view-button">
-        <view class="view-button" style="padding: 0">
+          <view>手机号</view>
-          <view v-if="userInfo.mobile !== ''" class="info">{{userInfo.mobile}}</view>
+          <view class="view-button" style="padding: 0">
-          <view v-else class="red-dot"></view>
+            <view v-if="userInfo.mobile !== ''" class="info">{{userInfo.mobile}}</view>
-          <image class="icon-arrow" src="/static/images/icon_arrow.png" mode="aspectFill"></image>
+            <view v-else class="red-dot"></view>
+            <image class="icon-arrow" src="/static/images/icon_arrow.png" mode="aspectFill"></image>
+          </view>
         </view>
-      </view>
+      </label>
       <view class="view-line"></view>
       <view class="view-button" @click="toUpdateEmail">
         <view>邮箱</view>
@@ -58,6 +60,7 @@
       </view>
     </view>
     <button open-type="chooseAvatar" style="display:none" id="avatar" @chooseavatar="chooseAvatar"></button>
+    <button open-type="getPhoneNumber" style="display:none" id="phone" @getphonenumber="rebindPhone"></button>
   </view>
 </template>
 
@@ -66,7 +69,7 @@ import { mapActions, mapState } from 'pinia'
 import { useUserStore } from '@/stores/user'
 import { useBasicStore } from '@/stores/basic'
 import { getUploadParamsRequest } from '@/api/file'
-import { updateUserInfoRequest } from '@/api/user'
+import { rebindPhoneRequest, updateUserInfoRequest } from '@/api/user'
 
 export default {
   data() {
@@ -79,11 +82,46 @@ export default {
   },
   methods: {
     ...mapActions(useBasicStore, ['routeJump']),
-    ...mapActions(useUserStore, ['updateUserInfo']),
+    ...mapActions(useUserStore, ['updateUserInfo', 'checkSession']),
+    async rebindPhone(detail) {
+      if(data.detail.errMsg === 'getPhoneNumber:fail user deny') {
+        return
+      }
+      if(this.pending) {
+        return
+      }
+      this.pending = true
+      const result = await this.checkSession()
+      if(result) {
+        const { code, data, message } = await rebindPhoneRequest({
+          encryptedData: detail.detail.encryptedData,
+          iv: detail.detail.iv
+        })
+        if(code === 0) {
+          this.updateUserInfo({
+            ...this.userInfo,
+            mobile: data.mobile
+          })
+          uni.showToast({
+            title: '手机号换绑成功',
+            icon: 'none'
+          })
+        } else {
+          uni.showToast({
+            title: message,
+            icon: 'none'
+          })
+        }
+      } else {
+        uni.showToast({
+          title: '手机号换绑失败，请重试',
+          icon: 'none'
+        })
+      }
+      this.pending = false
+    },
     chooseAvatar(e) {
-      console.log(e)
       const that = this
-
       if(that.pending) {
         return
       }

stores/user.js

@@ -21,20 +21,36 @@ export const useUserStore = defineStore('user', {
     updateLoginStatus(status) {
       this.isLogin = status
     },
-    async getPhone(data) {
+    // 获取用户信息
-      const { iv, encryptedData } = data
+    async getUserInfo() {
-      const that = this
+      const { code, data } = await getUserInfoRequest()
+      if(code === 0) {
+        this.updateUserInfo(data)
+        this.updateLoginStatus(true)
+      }
+      return code
+    },
+    async phoneLogin(params) {
+      const { iv, encryptedData } = params
+      const openid = uni.getStorageSync('openid')
+      const { code, data, message } = await phoneLoginRequest({ iv, encryptedData, openid })
+      if(code === 0) {
+        uni.setStorageSync('token', data.accessToken)
+        this.getUserInfo()
+        useLockStore().getLockList({
+          pageNo: 1,
+          pageSize: 50
+        })
+        return true
+      } else {
+        return false
+      }
+    },
+    async checkSession() {
       return new Promise((resolve) => {
         uni.checkSession({
-          async success(){
+          success() {
-            const openid = uni.getStorageSync('openid')
+            resolve(true)
-            const { code, data, message } = await phoneLoginRequest({ iv, encryptedData, openid })
-            if(code === 0) {
-              uni.setStorageSync('token', data.accessToken)
-              resolve(true)
-            } else {
-              resolve(false)
-            }
           },
           fail() {
             uni.login({