From afeaa739a92f1d4a9f9aeebe4b889ed70dc2bd63 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Tue, 13 Jan 2026 14:44:49 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'
---
uniapps/work-wx/src/subPackages/userDetail/password/index.vue | 221 +++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 174 insertions(+), 47 deletions(-)
diff --git a/uniapps/work-wx/src/subPackages/userDetail/password/index.vue b/uniapps/work-wx/src/subPackages/userDetail/password/index.vue
index 222e282..7a7212b 100644
--- a/uniapps/work-wx/src/subPackages/userDetail/password/index.vue
+++ b/uniapps/work-wx/src/subPackages/userDetail/password/index.vue
@@ -1,26 +1,34 @@
<!-- 修改密码 -->
<template>
<view class="container">
+ <view class="pageBg"></view>
<view class="detailBox">
<div class="detailCon">
<div class="orderRow">
- <div class="rowTitle">原始密码</div>
- <input type="password" v-model="passwordForm.oldPassword" placeholder="请输入" class="input-item" />
+ <div class="rowTitle">账号</div>
+ <input type="text" v-model="passwordForm.username" placeholder="请输入账号" class="input-item" />
</div>
<div class="orderRow">
- <div class="rowTitle">新密码</div>
- <input type="password" v-model="passwordForm.newPassword" placeholder="请输入" class="input-item" />
+ <div class="rowTitle">密码</div>
+ <input type="password" v-model="passwordForm.password" placeholder="请输入" class="input-item" />
</div>
<div class="orderRow">
<div class="rowTitle">确认密码</div>
- <input type="password" v-model="passwordForm.newPassword1" placeholder="请输入" class="input-item" />
+ <input type="password" v-model="passwordForm.password2" placeholder="请输入" class="input-item" />
+ </div>
+ <div class="orderRow">
+ <div class="rowTitle">验证码</div>
+ <input type="text" v-model="passwordForm.code" placeholder="请输入验证码" class="input-item" />
+ <u-button :disabled="countDown > 0" @click="sendVerificationCode" type="primary" color="#007AFF">
+ {{ countDown > 0 ? `${countDown}s后重发` : '获取验证码' }}
+ </u-button>
</div>
</div>
</view>
<view class="btngroup">
- <u-button color="#AEAEAE" class="custom-style" shape="circle" @click="reset">重置</u-button>
- <u-button color="#1D6FE9" class="custom-style" shape="circle" @click="submit">提交</u-button>
+ <u-button color="#AEAEAE" class="custom-style" @click="reset">重置</u-button>
+ <u-button color="#1D6FE9" class="custom-style" @click="submit">提交</u-button>
</view>
</view>
</template>
@@ -30,21 +38,25 @@
useUserStore
} from "@/store/index.js";
import md5 from "js-md5";
- import {
- getUserInfo,
- updateInfo,
- updatePassword
- } from '@/api/user/index.js';
+ import { getUserInfo,
+ updateInfo,
+ updatePassword,
+ sendResetCode,
+ resetPassword
+} from '@/api/user/index.js';
const passwordIcon = {
show: 'fas fa-eye', // 显示密码时的图标
hide: 'fas fa-eye-slash' // 隐藏密码时的图标
}
const userStore = useUserStore();
- const passwordForm = ref({
- oldPassword: '',
- newPassword: '',
- newPassword1: '',
- });
+const passwordForm = ref({
+ username: '',
+ password: '',
+ password2: '',
+ code: ''
+});
+const countDown = ref(0);
+let timer = null;
// 校验密码不能包含中文
const validatePasswordNoChinese = (password) => {
const chineseRegex = /[\u4e00-\u9fa5]/;
@@ -80,30 +92,82 @@
};
const clearForm = () => {
passwordForm.value = {
- oldPassword: '',
- newPassword: '',
- newPassword1: '',
+ username: '',
+ password: '',
+ password2: '',
+ code: ''
};
+ countDown.value = 0;
+ if (timer) {
+ clearInterval(timer);
+ timer = null;
+ }
};
- const reset = () => {
- clearForm();
- };
- const submit = () => {
- // 原始密码校验
- if (!passwordForm.value.oldPassword) {
+ // 发送验证码
+ const sendVerificationCode = () => {
+ const { username } = passwordForm.value;
+ if (!username) {
uni.showToast({
- title: '请输入原始密码',
+ title: '请先输入账号',
icon: 'none',
duration: 2000
});
return;
}
- // 中文校验
- if (!validatePasswordNoChinese(passwordForm.value.newPassword)) return;
- // 新密码校验
- if (!passwordForm.value.newPassword) {
+ // 这里假设账号就是手机号，实际项目中可能需要验证格式
+ sendResetCode(username).then(res => {
+ if (res.data.code === 200) {
+ uni.showToast({
+ title: '验证码发送成功',
+ icon: 'success',
+ duration: 2000
+ });
+
+ // 开始倒计时
+ countDown.value = 60;
+ timer = setInterval(() => {
+ countDown.value--;
+ if (countDown.value <= 0) {
+ clearInterval(timer);
+ timer = null;
+ }
+ }, 1000);
+ } else {
+ uni.showToast({
+ title: res.data.msg || '验证码发送失败',
+ icon: 'none',
+ duration: 2000
+ });
+ }
+ }).catch(err => {
+ uni.showToast({
+ title: '网络错误，请稍后重试',
+ icon: 'none',
+ duration: 2000
+ });
+ });
+ };
+ const reset = () => {
+ clearForm();
+ };
+
+ const submit = () => {
+ const { username, password, password2, code } = passwordForm.value;
+
+ // 账号校验
+ if (!username) {
+ uni.showToast({
+ title: '请输入账号',
+ icon: 'none',
+ duration: 2000
+ });
+ return;
+ }
+
+ // 新密码校验
+ if (!password) {
uni.showToast({
title: '请输入新密码',
icon: 'none',
@@ -111,9 +175,12 @@
});
return;
}
- // 确认密码校验
- if (passwordForm.value.newPassword !== passwordForm.value.newPassword1) {
+ // 中文校验
+ if (!validatePasswordNoChinese(password)) return;
+
+ // 确认密码校验
+ if (password !== password2) {
uni.showToast({
title: '两次输入的新密码不一致',
icon: 'none',
@@ -122,34 +189,56 @@
return;
}
+ // 验证码校验
+ if (!code) {
+ uni.showToast({
+ title: '请输入验证码',
+ icon: 'none',
+ duration: 2000
+ });
+ return;
+ }
+
// 复杂度校验
- if (!validatePasswordStrength(passwordForm.value.newPassword)) return;
- updatePassword(md5(passwordForm.value.oldPassword),
- md5(passwordForm.value.newPassword),
- md5(passwordForm.value.newPassword1)).then(res => {
+ if (!validatePasswordStrength(password)) return;
+
+ // 调用重置密码接口
+ const resetData = {
+ username,
+ // password: md5(password),
+ // confirmPassword: md5(password2),
+ password: password,
+ password2: password2,
+ code
+ };
+ console.log('canshu',resetData)
+ resetPassword(resetData).then(res => {
if (res.data.code === 200) {
uni.showToast({
- title: '修改信息成功',
+ title: '密码修改成功',
icon: 'none',
duration: 2000
});
clearForm();
- userStore.setUserInfo(null)
+ userStore.setUserInfo(null);
uni.removeStorageSync('rememberedUser');
uni.reLaunch({
url: '/pages/login/index'
- })
-
+ });
} else {
uni.showToast({
- title: res.msg,
+ title: res.data.msg || '密码修改失败',
icon: 'none',
duration: 2000
});
}
-
+ }).catch(err => {
+ uni.showToast({
+ title: '网络错误，请稍后重试',
+ icon: 'none',
+ duration: 2000
+ });
});
-
};
onShow(async () => {
clearForm();
@@ -163,10 +252,22 @@
display: flex;
flex-direction: column;
align-items: center;
+ position: relative;
+ }
+
+ .pageBg {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: url("@/static/images/user/userbg.svg") no-repeat ;
}
.detailBox {
- margin-top: 40rpx;
+ position: absolute;
+ top: 180rpx;
+ // margin-top: 40rpx;
width: 702rpx;
min-height: 326rpx;
@@ -215,6 +316,29 @@
input.input-item::placeholder {
font-size: 30rpx;
}
+
+ // .code-container {
+ // display: flex;
+ // align-items: center;
+ // justify-content: flex-end;
+ // width: 100%;
+ // }
+
+ .send-code-btn {
+ margin-left: 20rpx;
+ width: 200rpx;
+ height: 70rpx;
+ line-height: 70rpx;
+ font-size: 26rpx;
+ background: #f5f5f5;
+ color: #666;
+ border-radius: 8rpx;
+ }
+
+ .send-code-btn:disabled {
+ background: #e0e0e0;
+ color: #999;
+ }
}
}
@@ -230,10 +354,13 @@
.custom-style {
width: 276rpx;
- height: 76rpx;
+ height: 100rpx;
+ font-family: "Source Han Sans CN";
+ font-weight: 400;
+ font-size: 36rpx;
}
:deep(.u-button.data-v-461e713c){
width: 276rpx !important;
- height: 76rpx !important;
+ height: 100rpx !important;
}
</style>
--
Gitblit v1.9.3