<template>
|
<div class="changePassword">
|
<assets-head :title="$t('修改资金密码')" />
|
<div class="line"></div>
|
<div class="content">
|
<!-- <ExInput :label="$t('新密码')" :placeholderText="$t('请输入密码')" :tips="$t('请输入6位数字')" v-model="password"
|
typeText="password" />
|
<ExInput :label="$t('确认新密码')" :placeholderText="$t('请输入密码')" :tips="$t('请输入6位数字')" v-model="rePassword"
|
typeText="password" />
|
<ExChecked class="mb-42" :list="list" @checked="onChecked"></ExChecked>
|
<p class="label mt-14 textColor">{{ $t('验证码') }}</p>
|
<div class="iptbox inputBackground">
|
<input class="inputBackground textColor" type="text" :placeholder="$t('请输入验证码')" v-model="verifyCode">
|
<span v-if="type != 3" @click="senCode">{{ $t('发送验证码') }}<template v-if="time"> ({{ time
|
}})s</template></span>
|
</div> -->
|
<van-form validate-first @submit="submit">
|
<van-field
|
v-model="password"
|
type="password"
|
:placeholder="$t('请输入原密码')"
|
/>
|
<van-field
|
v-model="rePassword"
|
type="password"
|
:placeholder="$t('请输入新密码')"
|
/>
|
<van-field
|
v-model="newPassword"
|
type="password"
|
:placeholder="$t('请确认新密码')"
|
/>
|
<div class="btn" @click="submit">{{ $t("确定") }}</div>
|
</van-form>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import assetsHead from "@/components/assets-head";
|
// import ExInput from "@/components/ex-input";
|
// import ExChecked from "@/components/ex-checked";
|
import Axios from "@/API/userCenter.js";
|
import ApiLogin from "@/API/login.js";
|
import Vue from "vue";
|
import { Field } from "vant";
|
|
Vue.use(Field);
|
export default {
|
props: {},
|
components: {
|
assetsHead,
|
// ExInput,
|
// ExChecked,
|
},
|
data() {
|
return {
|
password: "", //密码
|
newPassword: "", //新密码
|
rePassword: "", //确认密码
|
verifcode_type: "", // 验证类型：1/手机；2/邮箱；3/谷歌验证器；
|
verifyCode: "", //验证码
|
type: 2, //默认选中邮箱
|
list: [
|
// {
|
// name: this.$t('手机验证'),
|
// type: 1
|
// },
|
{
|
name: this.$t("邮箱验证"),
|
type: 2,
|
},
|
{
|
name: this.$t("谷歌验证"),
|
type: 3,
|
},
|
],
|
email_authority: false, //是否绑定邮箱
|
google_auth_bind: false, //是否绑定谷歌
|
phone_authority: false, //是否绑定手机
|
email: "",
|
phone: "",
|
google_auth_secret: "",
|
account: "",
|
timer: "",
|
time: 0,
|
};
|
},
|
mounted() {
|
this.getVerifTarget();
|
clearInterval(this.timer);
|
},
|
methods: {
|
onChecked(type) {
|
this.type = type;
|
if (this.type == 3 && !this.google_auth_bind) {
|
this.$toast(this.$t("请绑定谷歌验证器"));
|
}
|
if (this.type == 1) {
|
this.account = this.phone;
|
} else if (this.type == 2) {
|
this.account = this.email;
|
} else if (this.type == 3) {
|
this.account = this.google_auth_secret;
|
}
|
},
|
submit() {
|
if (this.password.length < 6) {
|
this.$toast(this.$t("资金密码(6位数字)"));
|
return false;
|
}
|
Axios.setSafeword({
|
safeword: this.password,
|
verifcode_type: this.type,
|
// verifcode: this.verifyCode,
|
})
|
.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));
|
}
|
});
|
},
|
async getVerifTarget() {
|
Axios.getVerifTarget({})
|
.then((res) => {
|
this.email_authority = res.data.email_authority;
|
this.google_auth_bind = res.data.google_auth_bind;
|
this.phone_authority = res.data.phone_authority;
|
this.email = res.data.email;
|
this.phone = res.data.phone;
|
this.google_auth_secret = res.data.google_auth_secret;
|
})
|
.catch((error) => {
|
if (error.code === "ECONNABORTED") {
|
this.$toast(this.$t("网络超时！"));
|
} else if (error.msg !== undefined) {
|
this.$toast(this.$t(error.msg));
|
}
|
});
|
},
|
senCode() {
|
if (this.type == 1 && !this.phone_authority) {
|
this.$toast(this.$t("请绑定手机"));
|
return false;
|
}
|
if (this.type == 2 && !this.email_authority) {
|
this.$toast(this.$t("请绑定邮箱"));
|
return false;
|
}
|
this.onChecked(this.type);
|
if (this.time > 0) {
|
return false;
|
}
|
ApiLogin.sendVerifyCode({
|
target: this.account,
|
})
|
.then((res) => {
|
this.$toast(this.$t("发送成功"));
|
this.time = 30;
|
this.timer = setInterval(() => {
|
if (this.time > 0) {
|
this.time = this.time - 1;
|
} else {
|
this.time = 0;
|
clearInterval(this.timer);
|
}
|
}, 1000);
|
})
|
.catch((error) => {
|
if (error.code === "ECONNABORTED") {
|
this.$toast(this.$t("网络超时！"));
|
} else if (error.msg !== undefined) {
|
this.$toast(this.$t(error.msg));
|
}
|
});
|
},
|
},
|
beforeDestroy() {
|
clearInterval(this.timer);
|
},
|
};
|
</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 {
|
// @include themify() {
|
// background: themed("btn_main");
|
// }
|
|
// color: #fff;
|
// height: 88px;
|
// line-height: 88px;
|
// text-align: center;
|
// font-size: 32px;
|
// margin-top: 44px;
|
// border-radius: 10px;
|
// width: 100%;
|
// border: none;
|
}
|
|
.iptbox {
|
height: 88px;
|
margin-top: 16px;
|
padding: 0 20px;
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
border-radius: 6px;
|
|
input {
|
flex: 1;
|
height: 100%;
|
border: none;
|
}
|
|
span {
|
color: #1d91ff;
|
}
|
}
|
|
.content {
|
// padding: 32px;
|
// font-size: 26px;
|
// width: 100%;
|
background: #212121;
|
border-radius: 1rem;
|
padding: 2rem;
|
margin: 1.8rem 2rem;
|
box-sizing: border-box;
|
font-weight: 700;
|
color: #fff;
|
font-size: 2rem;
|
:deep(.van-cell.van-field) {
|
margin-top: 4.4rem;
|
display: flex;
|
flex-direction: column;
|
font-size: 1.8rem;
|
color: #303133;
|
}
|
:deep(.van-field__control) {
|
// @include themify() {
|
// background: themed("tab_background");
|
// }
|
// border-radius: 1rem;
|
width: 100%;
|
height: 6.4rem;
|
padding: 0 2.4rem !important;
|
background: #333;
|
box-sizing: border-box;
|
color: #fff;
|
border: 1px solid transparent !important;
|
}
|
|
:deep(.van-cell__value) {
|
height: 6.4rem;
|
line-height: 6.4rem;
|
font-weight: 700;
|
color: rgb(255, 255, 255);
|
font-size: 1.8rem;
|
text-align: left;
|
}
|
|
:deep(.van-field__body) {
|
display: flex;
|
position: relative;
|
width: 100%;
|
height: 100%;
|
background: #212121;
|
-webkit-box-orient: vertical;
|
-webkit-box-direction: normal;
|
-webkit-flex-direction: column;
|
flex-direction: column;
|
-webkit-box-pack: center;
|
-webkit-justify-content: center;
|
justify-content: center;
|
}
|
}
|
|
.btn {
|
// width: 100%;
|
background: #f7b328;
|
padding: 1.8rem;
|
border-radius: 1rem;
|
color: #fff;
|
text-align: center;
|
font-size: 2rem;
|
margin: 4.1rem 0 2.4rem;
|
}
|
</style>
|
