<template>
|
<div class="changePassword">
|
<assets-head :title="$t('修改登录密码')" />
|
<div class="line"></div>
|
<div class="content">
|
<ExInput :label="$t('旧密码')" :placeholderText="$t('请输入密码')" v-model="oldPassword" typeText="password" />
|
<ExInput :label="$t('新密码')" :placeholderText="$t('请输入密码')" :tips="$t('请输入6-12个字符，包括数字或字母')"
|
v-model="newPassword" typeText="password" />
|
<ExInput :label="$t('确认新密码')" :placeholderText="$t('请输入密码')" :tips="$t('请输入6-12个字符，包括数字或字母')"
|
v-model="rePassword" typeText="password" />
|
<button class="btn btnMain" @click="submit">{{
|
$t('确定') }}</button>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import assetsHead from "@/components/assets-head";
|
import ExInput from "@/components/ex-input";
|
import Axios from "@/API/userCenter.js";
|
export default {
|
props: {
|
|
},
|
components: {
|
assetsHead,
|
ExInput,
|
},
|
data() {
|
return {
|
oldPassword: '',
|
newPassword: '',
|
rePassword: '',
|
}
|
},
|
// computed:{
|
// hightLight(){
|
// if (this.oldPassword.length >= 6 && this.newPassword.length >= 6 && this.rePassword.length >= 6) {
|
// return true
|
// } else {
|
// return false
|
// }
|
// }
|
// },
|
methods: {
|
submit() {
|
Axios.changePassword({
|
old_password: this.oldPassword,
|
password: this.newPassword,
|
re_password: this.rePassword,
|
}).then((res) => {
|
this.$toast(this.$t('修改成功'))
|
setTimeout(() => {
|
this.$router.push('/home')
|
}, 1000);
|
}).catch((error) => {
|
if (error.code === 'ECONNABORTED') { this.$toast(this.$t('网络超时！')); }
|
else if (error.msg !== undefined) { this.$toast(this.$t(error.msg)); }
|
});
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.changePassword {
|
width: 100%;
|
box-sizing: border-box;
|
}
|
|
|
|
|
|
|
|
.line {
|
width: 100%;
|
height: 2px;
|
|
@include themify() {
|
background: themed("tab_background");
|
}
|
}
|
|
.content {
|
padding: 32px;
|
font-size: 26px;
|
}
|
|
.btn {
|
height: 88px;
|
line-height: 88px;
|
text-align: center;
|
font-size: 32px;
|
margin-top: 44px;
|
border-radius: 10px;
|
width: 100%;
|
border: none;
|
}
|
|
.hightLight {
|
@include themify() {
|
background: themed("btn_main");
|
}
|
|
color: #fff;
|
}
|
</style>
|
