czg_team/Hfive
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

wx

Browse Source
This commit is contained in:
魏啾
2024-11-23 13:55:01 +08:00
parent 2147f86b93
commit bfd37cddf5
18 changed files with 1237 additions and 350 deletions
Download Patch File Download Diff File Expand all files Collapse all files

440
pages/login/password.vue
View File

@@ -1,210 +1,253 @@
<template>
<view class="container">
<u-navbar class="top" title="忘记密码" @rightClick="leftClick" :autoBack="true" leftIconColor="#fff" :titleStyle="{color:'#FFF',}" bgColor="transparent"></u-navbar>
<view class="top_box_xx">
<view class="top_box">
<view class="top_box_one">
<text class="top_box_one_text">手机号码</text>
<input type="text" v-model="form.phone" placeholder="请输入手机号码" data-key="mobile" />
</view>
<view class="top_box_one">
<text class="top_box_one_text">密码</text>
<input type="mobile" v-model="form.password" placeholder="8-16位密码" maxlength="16" :password="!showPassword" />
<view class="repeat" @click="display">
<u-icon name="eye" v-if="showPassword"></u-icon>
<u-icon v-else name="eye-off"></u-icon>
</view>
</view>
<view class="top_box_one">
<text class="top_box_one_text">确认密码</text>
<input type="mobile" v-model="form.confirmpassword" placeholder="请再次输入密码" maxlength="16" :password="!showPassword" />
<view class="repeat" @click="display">
<u-icon name="eye" v-if="showPassword"></u-icon>
<u-icon v-else name="eye-off"></u-icon>
</view>
</view>
<view class="top_box_one">
<text class="top_box_one_text">验证码</text>
<input type="mobile" v-model="form.checkCode" placeholder="请输入短信验证码" maxlength="6" />
<view class="repeats">
<view v-if="showText == true" style="padding: 8rpx 16rpx 6rpx 16rpx;background: #288EFB; border-radius: 15rpx;" @click="CodeRegister">{{ Recapture }}</view>
<view v-else style="color: #ccc; background-color: #f9f9f9; padding: 8rpx 16rpx 6rpx 16rpx; border-radius: 15rpx;">{{ second }}s重新发送</view>
</view>
</view>
<view class="forgetPassword" @click="forgetPassword">重置密码</view>
<navseat :opacity='false' title="忘记密码" :titleshow='true' :namecolor='"#fff"' iconcolor='#fff'></navseat>
<view class="top_box">
<view class="top_box_one">
<text class="top_box_one_text">手机号码</text>
<input type="number" v-model="form.account" placeholder="请输入手机号码" />
</view>
<view class="top_box_one">
<text class="top_box_one_text">密码</text>
<input type="text" v-model="form.password" placeholder="请输入密码" :password="!showPassword" />
<view class="repeat" @click="display">
<u-icon name="eye" v-if="showPassword"></u-icon>
<u-icon v-else name="eye-off"></u-icon>
</view>
</view>
<view class="top_box_one">
<text class="top_box_one_text">确认密码</text>
<input type="text" v-model="form.payPassword" placeholder="请再次输入密码" :password="!showPassword" />
<view class="repeat" @click="display">
<u-icon name="eye" v-if="showPassword"></u-icon>
<u-icon v-else name="eye-off"></u-icon>
</view>
</view>
<view class="top_box_one">
<text class="top_box_one_text">验证码</text>
<input type="number" v-model="form.captcha" placeholder="请输入短信验证码" maxlength="6" />
<view class="repeats">
<view v-if="showText == true"
style="padding: 8rpx 16rpx 6rpx 16rpx;background: #288EFB; border-radius: 15rpx;"
@click="CodeRegister">{{ Recapture }}</view>
<view v-else
style="color: #ccc; background-color: #f9f9f9; padding: 8rpx 16rpx 6rpx 16rpx; border-radius: 15rpx;">
{{ second }}s重新发送
</view>
</view>
</view>
<view class="forgetPassword" @click="forgetPassword">重置密码</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
radioChangeItem: false, //单选框
h: null,
showPassword: false,
// 注册定时器 初始值
second: 60,
showText: true,
Recapture: '发送验证码',
form: {
phone: '',
password: '',
confirmpassword: '',
checkCode: '',
source: 'promoter'
}
};
},
mounted() {},
onLoad() {},
methods: {
leftClick() {
uni.navigateBack();
import navseat from '@/components/navseat.vue'
export default {
components: {
navseat
},
async CodeRegister() {
//发起验证码
if (this.form.phone == null || this.form.phone == '') {
uni.showToast({
title: '请输入电话号码',
icon: 'none'
data() {
return {
radioChangeItem: false, //单选框
h: null,
showPassword: false,
// 注册定时器 初始值
second: 60,
showText: true,
Recapture: '发送验证码',
form: {
account: '',
password: '',
payPassword: '',
captcha: '',
source: 'promoter'
}
};
},
mounted() {},
onLoad() {},
methods: {
async CodeRegister() {
if (this.form.password == null || this.form.password == '') {
uni.showToast({
title: '请输入密码',
icon: 'none'
});
return false;
}
if (this.form.payPassword == null || this.form.payPassword == '') {
uni.showToast({
title: '请输入确认密码',
icon: 'none'
});
return false;
}
if (!uni.$u.test.rangeLength(this.form.password, [6, 24])) {
uni.showToast({
title: "请输入密码长度为6-24",
icon: "none"
})
return false;
}
if (this.form.payPassword != this.form.password) {
uni.showToast({
title: '密码和确认密码不一致',
icon: 'none'
});
return false;
}
//发起验证码
const res = await this.api.smssend({
mobile: this.form.account,
event: 'forgetpwd'
});
return false;
}
const res = await this.api.verifyPhoneIsExist({// post 手机验证码
phone: this.form.phone,
});
if (res) {
uni.showToast({
title: '验证码获取成功',
icon: 'none'
});
// 定时器
this.showText = false;
this.Recapture = '重新获取';
var interval = setInterval(() => {
let times = --this.second;
this.second = times < 10 ? '0' + times : times; //小于10秒补 0
}, 1000);
setTimeout(() => {
clearInterval(interval);
this.second = 60;
this.showText = true;
}, 60000);
}
},
radioChange(n) {
//是否同意
console.log(n);
this.radioChangeItem = n;
},
display() {
// 切换图片显示隐藏
this.showPassword = !this.showPassword;
},
Privacy(e) {
if (e == 1) {
//用户协议
uni.navigateTo({
url: '../login/Privacy'
});
} else {
uni.navigateTo({
//隐私政策
url: '../login/Privacy'
});
}
},
if (res.code == 1) {
uni.showToast({
title: '验证码获取成功',
icon: 'none'
});
// 定时器
this.showText = false;
this.Recapture = '重新获取';
var interval = setInterval(() => {
let times = --this.second;
this.second = times < 10 ? '0' + times : times; //小于10秒补 0
}, 1000);
setTimeout(() => {
clearInterval(interval);
this.second = 60;
this.showText = true;
}, 60000);
}
},
radioChange(n) {
//是否同意
console.log(n);
this.radioChangeItem = n;
},
display() {
// 切换图片显示隐藏
this.showPassword = !this.showPassword;
},
Privacy(e) {
if (e == 1) {
//用户协议
uni.navigateTo({
url: '../login/Privacy'
});
} else {
uni.navigateTo({
//隐私政策
url: '../login/Privacy'
});
}
},
async forgetPassword() {
//注册
if (this.form.phone == null || this.form.phone == '') {
uni.showToast({
title: '请输入电话号码',
icon: 'none'
});
return false;
}
if (this.form.password == null || this.form.password == "" || uni.$u.trim(this.form.password,'all') == ''){
uni.showToast({
title: "请输入密码或密码不能输入空格",
icon: "none"
})
return false;
}
if (this.form.confirmpassword == null || this.form.confirmpassword == '' || uni.$u.trim(this.form.confirmpassword,'all') == '') {
uni.showToast({
title: '请输入确认密码或确认密码不能输入空格',
icon: 'none'
});
return false;
}
if (this.form.checkCode == null || this.form.checkCode == '') {
uni.showToast({
title: '请输入验证码',
icon: 'none'
});
return false;
}
if (this.form.confirmpassword != this.form.password) {
uni.showToast({
title: '两次密码不一致',
icon: 'none'
});
return false;
}
let res = await this.api.forgetPassword({
phone: this.form.phone,
password: this.form.password,
checkCode: this.form.checkCode,
source: 'promoter'
});
if (res) {
uni.showToast({
title: '修改成功',
icon: 'none',
success: () => {
uni.navigateTo({
url: '../login/login'
});
}
async forgetPassword() {
if (this.form.account.length != 11) {
uni.showToast({
title: '手机号必须是11位',
icon: 'none'
});
return false;
}
if (this.form.password == null || this.form.password == '') {
uni.showToast({
title: '请输入密码',
icon: 'none'
});
return false;
}
if (this.form.payPassword == null || this.form.payPassword == '') {
uni.showToast({
title: '请输入确认密码',
icon: 'none'
});
return false;
}
if (!uni.$u.test.rangeLength(this.form.password, [6, 24])) {
uni.showToast({
title: "请输入密码长度为6-24",
icon: "none"
})
return false;
}
if (this.form.payPassword != this.form.password) {
uni.showToast({
title: '密码和确认密码不一致',
icon: 'none'
});
return false;
}
if (!uni.$u.test.rangeLength(this.form.password, [6, 24])) {
uni.showToast({
title: "请输入密码长度为6-24",
icon: "none"
})
return false;
}
if (this.form.captcha == null || this.form.captcha == '') {
uni.showToast({
title: '请输入验证码',
icon: 'none'
});
return false;
}
let res = await this.api.userforgetpwd({
account: this.form.account,
password: this.form.password,
captcha: this.form.captcha
});
if (res.code == 1) {
uni.showToast({
title: '修改成功',
icon: 'none',
success: () => {
setTimeout(() => {
uni.navigateBack()
}, 1500);
}
});
}
}
}
}
};
};
</script>
<style lang="scss">
page {
width: 100%;
height: 100%;
background: linear-gradient(104deg, #4679ff 0%, #2868e8 47%, #2a94fc 100%);
}
.container {
padding: 0 34rpx;
position: relative;
.top{
position: absolute;
left: 64rpx;
.u-navbar--fixed{
top: 88rpx;
}
page {
width: 100%;
height: 100%;
background: linear-gradient(104deg, #4679ff 0%, #2868e8 47%, #2a94fc 100%);
}
.box {
padding-left: 64rpx;
padding-bottom: 144rpx;
box-sizing: border-box;
text {
font-size: 40rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #ffffff;
.container {
padding: 0 34rpx;
position: relative;
.top {
position: absolute;
left: 64rpx;
.u-navbar--fixed {
top: 88rpx;
}
}
}
.top_box_xx {
.box {
padding-left: 64rpx;
padding-bottom: 144rpx;
box-sizing: border-box;
text {
font-size: 40rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #ffffff;
}
}
.top_box::after {
content: '';
position: absolute;
@@ -216,6 +259,7 @@ page {
background: #9ec9fb;
border-radius: 0 0 40rpx 40rpx;
}
.top_box::before {
content: '';
position: absolute;
@@ -225,12 +269,13 @@ page {
bottom: 0rpx;
z-index: 2;
background: #fff;
border-radius: 0 0 40rpx 40rpx;
border-radius: 0 0 40rpx 40rpx;
}
.top_box {
position: relative;
z-index: 99;
top: 200rpx;
top: 120rpx;
box-sizing: border-box;
padding: 0 64rpx;
width: 100%;
@@ -240,28 +285,35 @@ page {
background: #ffffff;
border-radius: 40rpx;
padding-bottom: 108rpx;
.top_box_one {
position: relative;
width: 100%;
margin-top: 64rpx;
border-bottom: 6rpx solid #e5e5e5;
.top_box_one_text {
font-size: 36rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
input {
padding: 18rpx 0 20rpx 0;
}
.repeat {
position: absolute;
z-index: 99;
bottom: 26rpx;
right: 0;
width: 25rpx;
height: 17rpx;
}
.repeats {
z-index: 99;
position: absolute;
bottom: 26rpx;
right: 0;
@@ -271,8 +323,10 @@ page {
border-radius: 12rpx;
}
}
.top_box_tow {
width: 100%;
text {
margin-top: 34rpx;
font-size: 24rpx;
@@ -280,6 +334,7 @@ page {
color: #666666;
}
}
.forgetPassword {
width: 75%;
margin-top: 120rpx;
@@ -291,17 +346,18 @@ page {
font-weight: 400;
color: #ffffff;
}
.agreement {
margin-top: 14rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #7c8e97;
.agreement-Item {
color: #4ca1fc;
}
}
}
}
}
</style>
</style>