diff --git a/pages/ucenter/ucenter.vue b/pages/ucenter/ucenter.vue index 5f25ec4..3eccc06 100644 --- a/pages/ucenter/ucenter.vue +++ b/pages/ucenter/ucenter.vue @@ -50,6 +50,31 @@ + + + + + 修改密码 + + 原始密码 + + + + 新密码 + + + + 确认密码 + + + + + + + + @@ -61,10 +86,14 @@ const uniShare = new UniShare() // #endif const db = uniCloud.database(); + const uniIdCo = uniCloud.importObject("uni-id-co", { + customUI: true + }) import { store, mutations } from '@/uni_modules/uni-id-pages/common/store.js' + import { put } from '@/common/request.js' export default { // #ifdef APP onBackPress({from}) { @@ -93,10 +122,16 @@ "icon": "contact" }, { - "text": this.$t('mine.showText'), - "icon": "download" + "text": '修改密码', + "icon": "locked" } ], + changePwdForm: { + oldPassword: '', + newPassword: '', + confirmPassword: '' + }, + changePwdSubmitting: false, ucenterList: [ [ // #ifdef APP-PLUS @@ -269,11 +304,21 @@ }) }, tapGrid(index) { - uni.showToast({ - // title: '你点击了,第' + (index + 1) + '个', - title: this.$t('mine.clicked') + " " + (index + 1) , - icon: 'none' - }); + // 前三个仍然是示例功能,点击后提示;第四个是“修改密码” + if (index === 3) { + if (!this.hasLogin) { + return uni.showToast({ + title: '请先登录后再修改密码', + icon: 'none' + }) + } + this.openChangePasswordDialog() + } else { + uni.showToast({ + title: this.$t('mine.clicked') + " " + (index + 1), + icon: 'none' + }); + } }, /** * 去应用市场评分 @@ -401,6 +446,124 @@ console.log(e); }) // #endif + }, + /** + * 打开修改密码弹窗 + */ + openChangePasswordDialog() { + this.changePwdForm = { + oldPassword: '', + newPassword: '', + confirmPassword: '' + } + if (this.$refs.changePwdPopup) { + this.$refs.changePwdPopup.open() + } + }, + /** + * 关闭修改密码弹窗 + */ + closeChangePasswordDialog() { + if (this.$refs.changePwdPopup) { + this.$refs.changePwdPopup.close() + } + }, + /** + * 提交修改密码 + */ + async submitChangePassword() { + if (this.changePwdSubmitting) return + const { oldPassword, newPassword, confirmPassword } = this.changePwdForm + + if (!oldPassword) { + return uni.showToast({ + title: '请输入原始密码', + icon: 'none' + }) + } + if (!newPassword) { + return uni.showToast({ + title: '请输入新密码', + icon: 'none' + }) + } + if (newPassword.length < 6 || newPassword.length > 20) { + return uni.showToast({ + title: '新密码长度需为 6-20 位', + icon: 'none' + }) + } + if (newPassword !== confirmPassword) { + return uni.showToast({ + title: '两次输入的新密码不一致', + icon: 'none' + }) + } + + this.changePwdSubmitting = true + try { + // 检查必需字段 + if (!this.loginUserInfo.userId) { + return uni.showToast({ + title: '用户信息不完整,请重新登录', + icon: 'none' + }) + } + + // 构建请求参数 + const requestData = { + password: newPassword, + originalPassword: oldPassword, + userId: this.loginUserInfo.userId, + tenantId: this.tenantId + } + + // 如果有手机号,添加到请求参数中 + if (this.loginUserInfo.phone) { + requestData.phone = this.loginUserInfo.phone + } + + // 调用后端接口 + const res = await put('/api/sys/user/update', requestData) + + // 检查响应状态(后端返回格式:{success: true/false, message: "...", data: {...}}) + if (res.statusCode === 200 && res.data && res.data.success) { + this.closeChangePasswordDialog() + uni.showModal({ + content: res.data.message || '密码修改成功,请重新登录', + showCancel: false, + success: () => { + // 清除登录信息 + uni.removeStorageSync('backend-token') + uni.removeStorageSync('backend-login-response') + uni.removeStorageSync('backend-user-id') + uni.removeStorageSync('backend-tenant-id') + uni.removeStorageSync('uni_id_token') + uni.setStorageSync('uni_id_token_expired', 0) + // 跳转到登录页 + uni.redirectTo({ + url: '/uni_modules/uni-id-pages/pages/login/login-withpwd' + }) + } + }) + } else { + // 处理失败情况(可能 statusCode 不是 200,或者 success 为 false) + const errorMessage = res.data?.message || '密码修改失败,请稍后重试' + uni.showModal({ + content: errorMessage, + showCancel: false + }) + } + } catch (e) { + console.error('密码修改失败:', e) + const errorMessage = e?.data?.message || e?.message || '密码修改失败,请稍后重试' + uni.showModal({ + content: errorMessage, + showCancel: false + }) + } finally { + this.changePwdSubmitting = false + } } } } @@ -552,4 +715,60 @@ /* #endif */ background-color: #DD524D; } + + .change-pwd-dialog { + padding: 40rpx 30rpx 30rpx; + background-color: #FFFFFF; + border-radius: 16rpx; + width: 600rpx; + } + + .change-pwd-title { + font-size: 34rpx; + font-weight: bold; + text-align: center; + margin-bottom: 30rpx; + } + + .change-pwd-field { + margin-bottom: 20rpx; + } + + .change-pwd-label { + display: block; + font-size: 26rpx; + color: #666666; + margin-bottom: 10rpx; + } + + .change-pwd-actions { + margin-top: 20rpx; + display: flex; + flex-direction: row; + justify-content: flex-end; + } + + .dialog-btn { + min-width: 140rpx; + height: 70rpx; + line-height: 70rpx; + font-size: 28rpx; + border-radius: 8rpx; + padding: 0 24rpx; + } + + .dialog-btn.cancel { + background-color: #f5f5f5; + color: #333333; + margin-right: 20rpx; + } + + .dialog-btn.confirm { + background-color: #007AFF; + color: #FFFFFF; + } + + .dialog-btn:after { + border: none; + }