195 lines
4.3 KiB
Vue
195 lines
4.3 KiB
Vue
<template>
|
||
<view class="my-data">
|
||
<uni-nav-bar class="nav-bar" height="110rpx" leftWidth="200rpx" leftText="修改密码"
|
||
leftIcon="left" border backgroundColor="#2cade8" color="#fff" fixed statusBar shadow></uni-nav-bar>
|
||
<view class="wrap-view" style="box-shadow: 0 0 15px 5px #eeeeee;padding-bottom: 20upx;">
|
||
<view class="item">
|
||
<view class="title">密码修改：</view>
|
||
<view class="content"></view>
|
||
</view>
|
||
<view class="item item_bottom_border">
|
||
<view class="title"><text class="star">*</text>旧密码</view>
|
||
<view class="content">
|
||
<input class="passwordInput" v-model="formData.old_password" placeholder-style="color: #999999;"
|
||
name="oldPassword" password placeholder="请输入旧密码" />
|
||
</view>
|
||
</view>
|
||
<view class="item item_bottom_border">
|
||
<view class="title"><text class="star">*</text>新密码</view>
|
||
<view class="content">
|
||
<input class="passwordInput" v-model="formData.new_password1" placeholder-style="color: #999999;"
|
||
name="new_password1" password placeholder="请输入新密码" />
|
||
</view>
|
||
</view>
|
||
<view class="item item_bottom_border">
|
||
<view class="title"><text class="star">*</text>确认新密码</view>
|
||
<view class="content">
|
||
<input class="passwordInput" v-model="formData.new_password2" placeholder-style="color: #999999;"
|
||
name="new_password2" password placeholder="请再次输入新密码" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="btn">
|
||
<button type="default" class="save-btn" @click="saveInfo">保存</button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import nonNullCheck from '../../utils/nonNullCheck.js';
|
||
export default {
|
||
data() {
|
||
return {
|
||
formData: {
|
||
old_password: '',
|
||
new_password1: '',
|
||
new_password2: '',
|
||
},
|
||
hasPhoto:false,
|
||
}
|
||
},
|
||
onShow() {
|
||
},
|
||
methods: {
|
||
/* 参数验证 */
|
||
paramsCheck() {
|
||
if (!nonNullCheck(this.formData.old_password)) {
|
||
uni.showToast({
|
||
title: '请填旧密码',
|
||
icon: "none"
|
||
})
|
||
return false;
|
||
}
|
||
if (!nonNullCheck(this.formData.new_password1)) {
|
||
uni.showToast({
|
||
title: '请填新密码',
|
||
icon: "none"
|
||
})
|
||
return false;
|
||
}
|
||
if (!nonNullCheck(this.formData.new_password2)) {
|
||
uni.showToast({
|
||
title: '请再次填新密码',
|
||
icon: "none"
|
||
})
|
||
return false;
|
||
}
|
||
return true;
|
||
},
|
||
|
||
saveInfo(){
|
||
let that = this;
|
||
if (!that.paramsCheck()) {
|
||
return;
|
||
} else {
|
||
if(that.formData.new_password1===that.formData.new_password2){
|
||
uni.showLoading({
|
||
title: '保存中...',
|
||
mask: true
|
||
})
|
||
this.$u.api.passChange(this.formData).then(res=>{
|
||
uni.hideLoading()
|
||
uni.showToast({
|
||
title: '保存成功',
|
||
icon: 'none'
|
||
})
|
||
uni.reLaunch({
|
||
url: '/pages/login/login_'
|
||
})
|
||
}).catch(e=>{
|
||
uni.hideLoading()
|
||
})
|
||
}else{
|
||
uni.showToast({
|
||
title: '两次填写的新密码不一致，请确认后再提交',
|
||
icon: "none"
|
||
})
|
||
}
|
||
|
||
}
|
||
},
|
||
backLogin(){
|
||
uni.navigateBack({
|
||
delta: 1
|
||
})
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
>>>.uni-navbar__header,
|
||
>>>.uni-status-bar {
|
||
background-image: linear-gradient(254deg,
|
||
#0ca7ee 0%,
|
||
#005aff 100%,
|
||
#2a8cff 100%,
|
||
#54bdff 100%),
|
||
linear-gradient(#e60012,
|
||
#e60012);
|
||
}
|
||
>>>uni-image{
|
||
height: 200upx;
|
||
width: 200upx;
|
||
}
|
||
.my-data {
|
||
background-color: #f3fbff;
|
||
padding-bottom: 227rpx;
|
||
}
|
||
|
||
.nav-bar>>>.uni-navbar-btn-text text {
|
||
font-size: 32rpx !important;
|
||
}
|
||
|
||
.wrap-view {
|
||
width: 720rpx;
|
||
margin: 0 auto;
|
||
background-color: #ffffff;
|
||
border-radius: 10rpx;
|
||
line-height: 94rpx;
|
||
font-family: PingFang-SC-Medium;
|
||
font-size: 30rpx;
|
||
}
|
||
.wrap-top{
|
||
padding: 20upx 0;
|
||
line-height: 60upx;
|
||
}
|
||
.item {
|
||
margin: 0rpx 32rpx;
|
||
display: flex;
|
||
margin-top: 20rpx;
|
||
}
|
||
|
||
.item_bottom_border{
|
||
border-bottom: 1rpx solid #eeeeee;
|
||
}
|
||
|
||
.title {
|
||
color: #212121;
|
||
width: 180upx;
|
||
}
|
||
|
||
.content {
|
||
flex: 1;
|
||
color: #414141;
|
||
|
||
}
|
||
|
||
.content input {
|
||
height: 100%;
|
||
}
|
||
.passwordInput{
|
||
color: #2c6fd9;
|
||
}
|
||
.save-btn {
|
||
width: 400rpx;
|
||
height: 80rpx;
|
||
background-color: #2c6fd9;
|
||
border-radius: 40rpx;
|
||
font-size: 30rpx;
|
||
line-height: 80rpx;
|
||
color: #f3fbff;
|
||
margin-top: 21rpx;
|
||
}
|
||
</style>
|