161 lines
4.2 KiB
Vue
161 lines
4.2 KiB
Vue
<template>
|
||
<view class="page-content">
|
||
<cu-custom :isBack="true" class="main-topbar bg-main-oil" bgColor="bg-main-oil">
|
||
<block slot="content">绑定星油云站</block>
|
||
<block slot="backText">返回</block>
|
||
</cu-custom>
|
||
<view class=" margin radius cu-card shadow no-card padding-top padding-bottom ">
|
||
<view class="radius ">
|
||
<!-- <view class="cu-form-group">
|
||
<view class="title text-black">工号</view>
|
||
<input v-model="oilSiteNo" placeholder="请输入云站编号" name="input"></input>
|
||
</view> -->
|
||
<view class="cu-form-group">
|
||
<view class="title text-black mini-label">手机号</view>
|
||
<view class="text-right">
|
||
{{loginUser.userPhone}}
|
||
</view>
|
||
</view>
|
||
<view class="cu-form-group">
|
||
<input type="number" class="padding-left-xs" :maxlength="6" v-model="auth.authCode" placeholder="请输入六位数字验证码" name="input"></input>
|
||
<text :class="frozen?'text-gray':'oil-main-color'" @tap="sendMsg">{{tips}}</text>
|
||
</view>
|
||
<view class="cu-form-group">
|
||
<view class="title text-black mini-label">新密码</view>
|
||
<input type="password" v-model="pwd" class="text-right" placeholder="请输入新密码" name="input"></input>
|
||
</view>
|
||
<view class="cu-form-group solid-bottom">
|
||
<view class="title text-black mini-label">确认密码</view>
|
||
<input type="password" v-model="authpwd" class="text-right" placeholder="请确认密码" name="input"></input>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="margin-left">
|
||
<text class="cuIcon-infofill padding-right-xs text-sm oil-main-color"></text>
|
||
<text class="text-sm">密码必须至少8个字符，而且同时包含字母和数字</text>
|
||
</view>
|
||
<view class="margin padding-top-lg margin-top-xl">
|
||
<button class="bg-main-oil" @tap="comfirmPwd">
|
||
确定
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import cloudSiteApi from '@/api/cloud-site.js'
|
||
import oliUserApi from '@/api/oli-user.js'
|
||
import md5 from 'js-md5'
|
||
export default {
|
||
data() {
|
||
return {
|
||
tips: '发送验证码',
|
||
frozen: false, // 验证码冷却时间
|
||
auth: {},
|
||
verifyCodeToken:'',
|
||
loginUser: uni.getStorageSync('loginUser')
|
||
}
|
||
},
|
||
methods: {
|
||
// 确认修改
|
||
comfirmPwd() {
|
||
if (!this.auth.authCode) {
|
||
uni.showToast({
|
||
title: '请输入验证码',
|
||
icon: "none"
|
||
});
|
||
return false
|
||
}
|
||
if (!this.pwd) {
|
||
uni.showToast({
|
||
title: '请输入新密码',
|
||
icon: "none"
|
||
});
|
||
return false
|
||
}
|
||
|
||
if (!this.authpwd) {
|
||
uni.showToast({
|
||
title: '请确认新密码',
|
||
icon: "none"
|
||
});
|
||
return false
|
||
}
|
||
if (this.authpwd.length < 8) {
|
||
uni.showToast({
|
||
title: '密码至少8个字符',
|
||
icon: "none"
|
||
});
|
||
return false
|
||
}
|
||
if (this.pwd === this.authpwd) {
|
||
const data3 = {
|
||
phone: this.loginUser.userPhone,
|
||
code: this.auth.authCode,
|
||
oldPassword: md5(this.pwd),
|
||
verifyCodeToken:this.verifyCodeToken,
|
||
password: md5(this.authpwd),
|
||
id:this.loginUser.id
|
||
}
|
||
oliUserApi.changePwd(data3).then(res => {
|
||
if (res.code == 20000) {
|
||
uni.showToast({
|
||
title: res.msg
|
||
})
|
||
setTimeout(() => {
|
||
uni.navigateBack()
|
||
}, 1500);
|
||
}
|
||
})
|
||
} else {
|
||
uni.showToast({
|
||
icon: 'none',
|
||
title: '两次输入密码不一致'
|
||
})
|
||
}
|
||
},
|
||
sendMsg() {
|
||
if (!this.frozen) {
|
||
const data2 = {
|
||
phone: this.loginUser.userPhone
|
||
}
|
||
oliUserApi.changePwdSms(data2).then(res => {
|
||
console.log('res', res)
|
||
this.verifyCodeToken = res.data.verifyCodeToken
|
||
uni.showToast({
|
||
title: res.msg,
|
||
icon: 'none'
|
||
})
|
||
if (res.code == 20000) {
|
||
this.frozen = true
|
||
let second = 60
|
||
this.tips = `${second}秒后重发`
|
||
setTimeout(() => {
|
||
this.frozen = false
|
||
clearInterval(timer)
|
||
this.tips = `发送验证码`
|
||
}, 1000 * 60);
|
||
|
||
const timer = setInterval(() => {
|
||
second--
|
||
if (second) {
|
||
this.tips = `${second}秒后重发`
|
||
} else {
|
||
this.tips = `发送验证码`
|
||
}
|
||
}, 1000)
|
||
}
|
||
|
||
})
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped>
|
||
.shadow {
|
||
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||
}
|
||
</style>
|