186 lines
4.2 KiB
Vue
186 lines
4.2 KiB
Vue
<template>
|
|
<view class="resetPassword">
|
|
<u-navbar
|
|
leftIconColor="#eee"
|
|
:title="$lang.reset + $lang.password"
|
|
bgColor="#0c0c0d"
|
|
:placeholder="true"
|
|
:fixed="true"
|
|
height="60"
|
|
@leftClick="back"
|
|
>
|
|
</u-navbar>
|
|
|
|
<view class="content">
|
|
<view class="logo">
|
|
<u--image
|
|
:showLoading="false"
|
|
:src="require('static/images/ez-logo-login.png')"
|
|
width="125px"
|
|
height="119px"
|
|
mode="scaleToFill"
|
|
></u--image>
|
|
</view>
|
|
<u-input
|
|
class="input"
|
|
v-model="password_now"
|
|
:password="true"
|
|
:placeholder="$lang.enterNowPassword"
|
|
>
|
|
<text class="text" slot="prefix">{{ $lang.nowPassword }}</text>
|
|
</u-input>
|
|
<u-input
|
|
class="input"
|
|
v-model="password_new"
|
|
:password="true"
|
|
:placeholder="$lang.enterNewPassword"
|
|
>
|
|
<text class="text" slot="prefix">{{ $lang.nwwPassword }}</text>
|
|
</u-input>
|
|
<u-input
|
|
class="input"
|
|
v-model="password_reply"
|
|
:password="true"
|
|
:placeholder="$lang.enterPasswordAgain"
|
|
>
|
|
<text class="text" slot="prefix">{{ $lang.confirmPassword }}</text>
|
|
</u-input>
|
|
<view class="btn-box">
|
|
<view class="btn" @tap="reset()">{{ $lang.reset }}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState } from "vuex";
|
|
export default {
|
|
data() {
|
|
return {
|
|
password_now: "",
|
|
password_new: "",
|
|
password_reply: "",
|
|
};
|
|
},
|
|
computed: {
|
|
...mapState({
|
|
userInfo: (state) => state.app.userInfo,
|
|
$lang: (state) => state.app.lang[state.app.language],
|
|
}),
|
|
},
|
|
onLoad() {},
|
|
methods: {
|
|
back() {
|
|
uni.navigateBack();
|
|
},
|
|
reset() {
|
|
const params = {
|
|
password_now: this.password_now,
|
|
password_new: this.password_new,
|
|
password_reply: this.password_reply,
|
|
user_id: this.userInfo.id,
|
|
api_token: this.userInfo.api_token,
|
|
};
|
|
if (!params.password_now) {
|
|
this.$toast({
|
|
message: this.$lang.enterNowPassword,
|
|
duration: 2000,
|
|
});
|
|
} else if (!params.password_new) {
|
|
this.$toast({
|
|
message: this.$lang.enterNewPassword,
|
|
duration: 2000,
|
|
});
|
|
} else if (!params.password_reply) {
|
|
this.$toast({
|
|
message: this.$lang.enterPasswordAgain,
|
|
duration: 2000,
|
|
});
|
|
} else {
|
|
this.$toast({
|
|
type: "loading",
|
|
message: `${this.$lang.submit}...`,
|
|
duration: 200000,
|
|
});
|
|
this.$api
|
|
.updatePassword(params)
|
|
.then((res) => {
|
|
if (res.Success == 1) {
|
|
this.$toast({
|
|
type: "success",
|
|
title: res.Msg,
|
|
duration: 2000,
|
|
});
|
|
} else {
|
|
this.$toast({
|
|
title: res.Msg,
|
|
duration: 2000,
|
|
});
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
})
|
|
.finally(() => {
|
|
this.$toastHide();
|
|
});
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.resetPassword {
|
|
/deep/.u-navbar__content__title {
|
|
color: #eee;
|
|
font-weight: 600;
|
|
}
|
|
.content {
|
|
width: 280px;
|
|
padding-bottom: 50px;
|
|
margin: 0 auto;
|
|
.logo {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 20px;
|
|
margin-top: 20%;
|
|
}
|
|
.input {
|
|
height: 30px;
|
|
line-height: 30px;
|
|
margin-bottom: 15px;
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
}
|
|
.phone-code {
|
|
min-width: 50px;
|
|
text-align: center;
|
|
border-right: 1px solid #ddd;
|
|
}
|
|
.text {
|
|
padding-right: 5px;
|
|
}
|
|
.btn-box {
|
|
margin-top: 20px;
|
|
.btn {
|
|
width: 100%;
|
|
height: 48px;
|
|
line-height: 48px;
|
|
text-align: center;
|
|
font-size: 16px;
|
|
background: url("~@/static/images/btn_bg.png") no-repeat;
|
|
background-size: 100% 100%;
|
|
font-weight: 600;
|
|
margin-top: 15px;
|
|
&:active {
|
|
opacity: 0.8;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|