php
/
ZhiHuiJiaoWu_UniApp
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

feat(market): 修改密码功能升级 

- 添加验证旧密码功能- 新增上一步按钮，优化用户体验
- 完善新密码设置流程，增加密码长度和一致性校验
- 实现密码修改后的成功提示和自动跳转到个人中心
- 优化页面样式，调整按钮布局
master
liutong 10 months ago
parent
4768c65f11
commit
c1f59759f7
2 changed files with 159 additions and 22 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 16
      api/apiRoute.js
  2. 157
      pages/market/my/update_pass.vue

16
api/apiRoute.js
View File

@ -52,6 +52,22 @@ export default {
return res;
})
},
//公共端-教师/销售端验证旧密码是否正确
common_personnelCheckOldPwd(data = {}) {
let url = '/personnel/checkOldPwd'
return http.post(url, data).then(res => {
return res;
})
},
//公共端-教师/销售端验证旧密码是否正确
common_personnelEdidPassword(data = {}) {
let url = '/personnel/edidPassword'
return http.post(url, data).then(res => {
return res;
})
},

157
pages/market/my/update_pass.vue
View File

@ -2,7 +2,7 @@
<template>
<view>
<view class="title">
<view :class="{'green-text': tset_style === 1}">1.验证手机号码</view>
<view :class="{'green-text': tset_style === 1}">1.验证旧密码</view>
<view :class="{'green-text': tset_style === 2}">2.设置新密码</view>
</view>
<view :style="{'background-color':'#fff','width':'100%','height':'100vh' }">
@ -12,24 +12,36 @@
为保障您的账号安全，修改密码前请填写原密码
</view>
<view style="width: 95%;margin:30rpx auto;">
<fui-input borderTop placeholder="请输入原登录密码" v-model="user" @input="input"
<fui-input borderTop placeholder="请输入原登录密码" v-model="old_password"
backgroundColor="#f2f2f2"></fui-input>
</view>
</view>
<view v-if="tset_style == 2">
<view style="width: 95%;margin:30rpx auto;">
<fui-input borderTop placeholder="请设置6-20位新的登录密码" v-model="user" @input="input"
<fui-input borderTop placeholder="请设置6-20位新的登录密码" v-model="formData.new_password" @input="input"
backgroundColor="#f2f2f2"></fui-input>
</view>
<view style="width: 95%;margin: auto;">
<fui-input borderTop :padding="['20rpx','32rpx']" v-model="code" placeholder="请再次输入新的登录密码" @input="input"
<fui-input borderTop :padding="['20rpx','32rpx']" v-model="formData.new_password_2" placeholder="请再次输入新的登录密码" @input="input"
backgroundColor="#f2f2f2">
</fui-input>
</view>
</view>
<view style="width: 95%;margin:60rpx auto;">
<fui-button background="#00be8c" radius="5rpx" @click="nextStep" v-if="tset_style == 1">下一步</fui-button>
<view class="btn_box">
<fui-button
background="#465cff"
radius="5rpx"
@click="nextStep(1)"
v-if="tset_style != 1">上一步
</fui-button>
<fui-button background="#00be8c" radius="5rpx" @click="nextStep(2)" v-if="tset_style == 1">下一步</fui-button>
<fui-button background="#00be8c" radius="5rpx" @click="submit" v-if="tset_style == 2">提交</fui-button>
</view>
<view style="width: 95%;margin:60rpx auto;">
<fui-button background="#fff" radius="5rpx" @click="forgot" color="#999999" v-if="tset_style == 1">忘记原密码</fui-button>
</view>
@ -39,35 +51,138 @@
</template>
<script>
import apiRoute from '@/api/apiRoute.js';
export default {
data() {
return {
code: '',
user: '',
tset_style: 1,
tset_style: 1,//tab栏目|1=验证旧密码页,2=设置新密码页
old_password:'',//旧密码
formData:{
phone:'',//当前登录用户的手机号
new_password:'',//新密码
new_password_2:'',//二次新密码
key_value:'',//修改密码的key_value
},
}
},
onLoad() {
onLoad() {},
onShow() {
this.init()//初始化
},
methods: {
sendCode() {
//延时为了效果展示
setTimeout(() => {
//发送短信
//...
//success方法：短信发送成功后将组件改为倒计时状态
this.$refs.fui_cdv && this.$refs.fui_cdv.success()
}, 800)
//初始化
async init(){
await this.getUserInfo()
},
//获取用户信息
async getUserInfo() {
let res = await apiRoute.getPersonnelInfo({})
if (res.code != 1) {
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
this.formData.phone = res.data.phone//用户手机号
},
nextStep(){
this.tset_style = 2
//上/下一步切换
async nextStep(tset_style){
//tset_style|1=第一页,2=第二页
if(tset_style == 2){
if(!this.old_password){
uni.showToast({
title: '请输入原登录密码',
icon: 'none'
})
return
}
//验证旧密码
let params = {
old_password: this.old_password
}
//验证旧密码是否正确
let res = await apiRoute.common_personnelCheckOldPwd(params)
if(!res.code){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
this.formData.key_value = res.data.key_value
}
this.tset_style = Number(tset_style)
},
//忘记密码
forgot() {
uni.navigateTo({
url: '/pages/student/login/forgot'
})
},
//提交
async submit() {
//验证数据
if (!this.formData.new_password) {
uni.showToast({
title: '请输入新密码',
icon: 'none'
})
return
}
if (this.formData.new_password.length < 6 || this.formData.new_password.length > 20) {
uni.showToast({
title: '新密码长度为6-20位',
icon: 'none'
})
return
}
if (!this.formData.new_password) {
uni.showToast({
title: '请输入新密码',
icon: 'none'
})
return
}
//验证两次密码是否一致
if (this.formData.new_password != this.formData.new_password_2) {
uni.showToast({
title: '两次密码不一致',
icon: 'none'
})
return
}
let res = await apiRoute.common_personnelEdidPassword(this.formData)
if(!res.code){
uni.showToast({
title: res.msg,
icon: 'none'
})
return
}
uni.showToast({
title: res.msg,
icon: 'success'
})
//延迟1s执行
setTimeout(() => {
//跳转页面-个人中心
uni.navigateTo({
url: `/pages/market/my/index`
})
}, 1000)
},
}
}
</script>
@ -104,4 +219,10 @@
color: #999999;
padding-left: 30rpx;
}
.btn_box{
display: flex;
flex-direction: column;
gap: 40rpx;
}
</style>
Write Preview
Loading…
Cancel
Save