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

2. 完成更换账号绑定手机号功能
This commit is contained in:
范鹏 2024-08-27 10:12:56 +08:00
parent 673598e564
commit 2fc7ad7ed7
6 changed files with 195 additions and 83 deletions

View File

@ -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
})
}

View File

@ -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) {
this.getUserInfo()
this.getLockList(this.search)
} else {
if(!result) {
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
},

View File

@ -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) {
this.getUserInfo()
this.getLockList({
pageNo: 1,
pageSize: 50
})
} else {
if(!result) {
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'

View File

@ -1,11 +1,12 @@
<template>
<view>
<input class="input" :password="true" style="margin-top: 48rpx;" :value="oldPassword" maxlength="20"
placeholder="请输入原密码" placeholder-class="input-placeholder" :focus="true" @input="updateOldPassword"></input>
<input class="input" :password="true" :value="newPassword" maxlength="20" placeholder="请输入新密码"
<input class="input" :password="true" :value="password" maxlength="20" placeholder="请输入新密码"
placeholder-class="input-placeholder" @input="updateNewPassword"></input>
<input class="input" :password="true" :value="confirmPassword" maxlength="20" placeholder="请确认密码"
placeholder-class="input-placeholder" @input="updateConfirmPassword"></input>
<view class="view-top">
<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: '',
newPassword: '',
confirmPassword: '',
pending: false
text: '获取验证码',
password: '',
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) {
this.confirmPassword = data.detail.value
updateInputCode (data) {
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 ||
this.confirmPassword.length > 20 || this.oldPassword.length < 8 || this.oldPassword.length > 20) {
if (this.password.length < 8 || this.password.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({
oldPassword: this.oldPassword,
newPassword: this.newPassword,
date: new Date().getTime()
const { code, message } = await changePasswordRequest({
verificationCode: this.verificationCode,
password: this.password,
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>

View File

@ -19,14 +19,16 @@
</view>
</view>
<view class="view-line"></view>
<view class="view-button">
<view>手机号</view>
<view class="view-button" style="padding: 0">
<view v-if="userInfo.mobile !== ''" class="info">{{userInfo.mobile}}</view>
<view v-else class="red-dot"></view>
<image class="icon-arrow" src="/static/images/icon_arrow.png" mode="aspectFill"></image>
<label for="phone">
<view class="view-button">
<view>手机号</view>
<view class="view-button" style="padding: 0">
<view v-if="userInfo.mobile !== ''" class="info">{{userInfo.mobile}}</view>
<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
}

View File

@ -21,20 +21,36 @@ export const useUserStore = defineStore('user', {
updateLoginStatus(status) {
this.isLogin = status
},
async getPhone(data) {
const { iv, encryptedData } = data
const that = this
// 获取用户信息
async getUserInfo() {
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(){
const openid = uni.getStorageSync('openid')
const { code, data, message } = await phoneLoginRequest({ iv, encryptedData, openid })
if(code === 0) {
uni.setStorageSync('token', data.accessToken)
resolve(true)
} else {
resolve(false)
}
success() {
resolve(true)
},
fail() {
uni.login({