优化代码
This commit is contained in:
pengxiaolong
@@ -17,25 +17,308 @@
|
||||
<view class="title">修改密码</view>
|
||||
<view class="contentbox">
|
||||
<view class="content">
|
||||
<!-- -->
|
||||
<!-- 旧密码输入框 -->
|
||||
<view class="uni-input-wrapper" v-if="havaPassword">
|
||||
<input
|
||||
class="uni-input"
|
||||
v-model="oldPassword"
|
||||
placeholder="请输入旧密码"
|
||||
:password="showoldPassword"
|
||||
/>
|
||||
<view>
|
||||
<img
|
||||
class="passwordImg"
|
||||
@click="changeoldPassword"
|
||||
:src="
|
||||
showoldPassword
|
||||
? 'https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Displaypassword.png'
|
||||
: 'https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/notdisplaypassword.png'
|
||||
"
|
||||
alt=""
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<text v-if="havaPassword" class="error">您的密码必须包含大小字母和数字，长度在6-16位之间</text>
|
||||
<text v-if="oldPasswordError == true && havaPassword == true" class="error-text">请输入正确的旧密码</text>
|
||||
<!-- 新密码输入框 -->
|
||||
<view class="uni-input-wrapper">
|
||||
<input
|
||||
class="uni-input"
|
||||
v-model="newPassword"
|
||||
placeholder="请输入新密码"
|
||||
:password="shownewPassword"
|
||||
/>
|
||||
<view>
|
||||
<img
|
||||
class="passwordImg"
|
||||
@click="changenewPassword"
|
||||
:src="
|
||||
shownewPassword
|
||||
? 'https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Displaypassword.png'
|
||||
: 'https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/notdisplaypassword.png'
|
||||
"
|
||||
alt=""
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<text class="error">您的密码必须包含大小字母和数字，长度在6-16位之间</text>
|
||||
<text v-if="newPasswordErrorone" class="error-text">请输入合法的密码</text>
|
||||
<text v-if="newPasswordErrortwo" class="error-text">新密码和旧密码不能相同</text>
|
||||
<!-- 新密码输入框 -->
|
||||
<view class="uni-input-wrapper">
|
||||
<input
|
||||
class="uni-input"
|
||||
v-model="confirmPassword"
|
||||
placeholder="请重复输入新密码"
|
||||
:password="showconfirmPassword"
|
||||
/>
|
||||
<view>
|
||||
<img
|
||||
class="passwordImg"
|
||||
@click="changeconfirmPassword"
|
||||
:src="
|
||||
showconfirmPassword
|
||||
? 'https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/Displaypassword.png'
|
||||
: 'https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/notdisplaypassword.png'
|
||||
"
|
||||
alt=""
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
<text v-if="confirmPasswordError" class="error-text"
|
||||
>请确认两次输入的密码是否一致</text
|
||||
>
|
||||
<!-- 确认按钮 -->
|
||||
<view class="confirmBtn" @click="onConfirm"> 确认修改 </view>
|
||||
|
||||
<!-- -->
|
||||
<!-- 忘记密码 -->
|
||||
<view class="forgetPassword">
|
||||
<text class="forgetPasswordText" @click="onforgetPassword">忘记密码？</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { goEasylogin, goEasylogout } from "../../../components/goEasyTool/tool.js";
|
||||
import request from "../../../components/request.js";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: "Hello",
|
||||
oldPassword: "", //旧密码
|
||||
newPassword: "", //新密码
|
||||
confirmPassword: "", //确认密码
|
||||
showoldPassword: true, //旧密码是否显示
|
||||
shownewPassword: true, //新密码是否显示
|
||||
showconfirmPassword: true, //确认密码是否显示
|
||||
oldPasswordError: false, //旧密码错误
|
||||
newPasswordErrorone: false, //新密码错误
|
||||
newPasswordErrortwo: false, //新密码错误
|
||||
confirmPasswordError: false, //确认密码错误
|
||||
id: "", //用户id
|
||||
havaPassword: null, //是否有密码/false无密码/true有密码
|
||||
email: "", //邮箱
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
// 页面加载时执行
|
||||
uni.getStorage({
|
||||
key: "userinfo",
|
||||
success: (res) => {
|
||||
this.id = res.data.id;
|
||||
this.havaPassword = res.data.havaPassword;
|
||||
console.log(this.id, this.havaPassword);
|
||||
this.email = res.data.email;
|
||||
},
|
||||
});
|
||||
},
|
||||
onShow() {
|
||||
uni.getStorage({
|
||||
key: "userinfo",
|
||||
success: (res) => {
|
||||
this.id = res.data.id;
|
||||
this.havaPassword = res.data.havaPassword;
|
||||
console.log(this.id, this.havaPassword);
|
||||
this.email = res.data.email;
|
||||
},
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
// 忘记密码
|
||||
onforgetPassword() {
|
||||
if (this.email === ""||this.email === null) {
|
||||
uni.showToast({
|
||||
title: "请先绑定邮箱再进行操作",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
});
|
||||
return;
|
||||
}
|
||||
request({
|
||||
url: "user/forgetMail",
|
||||
method: "POST",
|
||||
data: {
|
||||
mailAddress: this.email,
|
||||
},
|
||||
userInfo: true,
|
||||
}).then((ress) => {
|
||||
if (ress.code === 200) {
|
||||
uni.showToast({
|
||||
title: "已向您的"+this.email+"邮箱发送密码重置邮件，请在邮箱中进行密码重置",
|
||||
icon: "success",
|
||||
duration: 5000,
|
||||
});
|
||||
}else{
|
||||
uni.showToast({
|
||||
title: ress.data,
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
});
|
||||
}
|
||||
}).catch(() => {
|
||||
uni.showToast({
|
||||
title: '网络错误',
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
});
|
||||
});
|
||||
},
|
||||
// 验证密码合法性
|
||||
validatePassword(password) {
|
||||
const regex = /^(?=.*[A-Z])(?=.*[a-z])(?=.*\d)[A-Za-z\d]{6,16}$/;
|
||||
return regex.test(password);
|
||||
},
|
||||
// 确认修改
|
||||
onConfirm() {
|
||||
this.oldPasswordError = false;
|
||||
this.newPasswordErrorone = false;
|
||||
this.newPasswordErrortwo = false;
|
||||
this.confirmPasswordError = false;
|
||||
if (this.email === ""||this.email === null) {
|
||||
uni.showToast({
|
||||
title: "请先绑定邮箱再进行操作",
|
||||
icon: "none",
|
||||
duration: 2000,
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.oldPassword === "" && this.havaPassword == true) {
|
||||
this.oldPasswordError = true;
|
||||
return;
|
||||
}
|
||||
if (this.validatePassword(this.oldPassword) === false && this.havaPassword == true) {
|
||||
this.oldPasswordError = true;
|
||||
return;
|
||||
}
|
||||
if (this.validatePassword(this.newPassword) === false) {
|
||||
this.newPasswordErrorone = true;
|
||||
return;
|
||||
}
|
||||
if (this.newPassword === "") {
|
||||
this.newPasswordErrorone = true;
|
||||
return;
|
||||
}
|
||||
if (this.newPassword === this.oldPassword) {
|
||||
this.newPasswordErrortwo = true;
|
||||
return;
|
||||
}
|
||||
if (this.confirmPassword !== this.newPassword) {
|
||||
this.confirmPasswordError = true;
|
||||
return;
|
||||
}
|
||||
if (this.havaPassword) {
|
||||
uni.showLoading({
|
||||
title: "修改中...",
|
||||
mask: true,
|
||||
});
|
||||
goEasylogout(this.$goeasy);
|
||||
request({
|
||||
url: "user/updateUserInfo",
|
||||
method: "POST",
|
||||
data: {
|
||||
id: this.id,
|
||||
newPassword: this.newPassword,
|
||||
confirmPassword: this.confirmPassword,
|
||||
oldPassword: this.oldPassword,
|
||||
},
|
||||
userInfo: true,
|
||||
}).then((ress) => {
|
||||
console.log("修改调用返回", ress);
|
||||
if (ress.code === 200) {
|
||||
uni.showToast({
|
||||
title: "修改成功",
|
||||
icon: "success",
|
||||
});
|
||||
uni.setStorageSync("userinfo", ress.data);
|
||||
goEasylogin(
|
||||
this.$goeasy,
|
||||
String(ress.data.id),
|
||||
ress.data.headerIcon,
|
||||
ress.data.nickName
|
||||
);
|
||||
uni.hideLoading();
|
||||
//```````````````````````````````````````````````````````````````````````登录成功后跳转回原页面 或 首页
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
//````````````````````````````````````````````````````````````````````
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: ress.data,
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.showLoading({
|
||||
title: "修改中...",
|
||||
mask: true,
|
||||
});
|
||||
request({
|
||||
url: "user/setPassword",
|
||||
method: "POST",
|
||||
data: {
|
||||
id: this.id,
|
||||
password: this.newPassword,
|
||||
confirmPassword: this.confirmPassword,
|
||||
},
|
||||
userInfo: true,
|
||||
}).then((ress) => {
|
||||
console.log("修改调用返回", ress);
|
||||
if (ress.code === 200) {
|
||||
uni.showToast({
|
||||
title: "修改成功",
|
||||
icon: "success",
|
||||
});
|
||||
uni.hideLoading();
|
||||
//```````````````````````````````````````````````````````````````````````登录成功后跳转回原页面 或 首页
|
||||
uni.navigateBack({
|
||||
delta: 1,
|
||||
});
|
||||
//````````````````````````````````````````````````````````````````````
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: ress.data,
|
||||
icon: "none",
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
//新密码显示/隐藏
|
||||
changenewPassword() {
|
||||
this.shownewPassword = !this.shownewPassword;
|
||||
},
|
||||
// 确认密码显示/隐藏
|
||||
changeconfirmPassword() {
|
||||
this.showconfirmPassword = !this.showconfirmPassword;
|
||||
},
|
||||
// 旧密码显示/隐藏
|
||||
changeoldPassword() {
|
||||
this.showoldPassword = !this.showoldPassword;
|
||||
},
|
||||
// 返回上一页
|
||||
onBack() {
|
||||
console.log(1);
|
||||
@@ -97,4 +380,53 @@ export default {
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
.uni-input-wrapper {
|
||||
width: 70%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 8rpx 13rpx;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
.uni-input {
|
||||
height: 50rpx;
|
||||
padding: 15rpx 25rpx;
|
||||
line-height: 50rpx;
|
||||
font-size: 28rpx;
|
||||
flex: 1;
|
||||
}
|
||||
.passwordImg {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
.error-text {
|
||||
color: red;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
.error {
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.confirmBtn {
|
||||
width: 90%;
|
||||
height: 90rpx;
|
||||
background: linear-gradient(135deg, #00afb2, #4fcacd);
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 90rpx;
|
||||
font-size: 36rpx;
|
||||
border-radius: 50rpx;
|
||||
margin-top: 70rpx;
|
||||
}
|
||||
.forgetPassword {
|
||||
width: 90%;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.forgetPasswordText {
|
||||
color: #00afb2;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user