<template>
|
<div>
|
<div class="iconBox" v-if="state == 'loading'">
|
<i class="el-icon-loading" style="color: #666"></i>
|
<p>正在绑定微信...</p>
|
</div>
|
<div class="iconBox" v-if="state == 'success'">
|
<i class="el-icon-success" style="color: #67c23a"></i>
|
<p>绑定成功！</p>
|
<p class="backBox">
|
即将返回（{{ time }}s）<el-button
|
type="primary"
|
size="mini"
|
@click="goBack"
|
>立即返回</el-button
|
>
|
</p>
|
</div>
|
<div class="iconBox" v-if="state == 'error'">
|
<i class="el-icon-error" style="color: #f56c6c"></i>
|
<p>绑定失败，该微信已被绑定！</p>
|
<p class="backBox">
|
即将返回（{{ time }}s）<el-button
|
type="primary"
|
size="mini"
|
@click="goBack"
|
>立即返回</el-button
|
>
|
</p>
|
</div>
|
</div>
|
</template>
|
<script>
|
export default {
|
data() {
|
return {
|
state: "loading",
|
time: 5
|
};
|
},
|
created() {
|
var url = window.location.href;
|
if (url.indexOf("WeChatScanningCodeBind") > -1) {
|
var querys = url.substring(url.indexOf("?") + 1).split("&");
|
var result = {};
|
for (var i = 0; i < querys.length; i++) {
|
var temp = querys[i].split("=");
|
if (temp.length < 2) {
|
result[temp[0]] = "";
|
} else {
|
result[temp[0]] = temp[1];
|
}
|
}
|
if (result && result.code) {
|
this.MG.identity
|
.bindingWeChat({
|
code: result.code
|
})
|
.then((res) => {
|
if (res) {
|
this.state = "success";
|
} else {
|
this.state = "error";
|
}
|
this.setTime();
|
});
|
}
|
}
|
this.setTime();
|
},
|
methods: {
|
setTime() {
|
if (this.timer) clearInterval(this.timer);
|
this.time = 5;
|
this.timer = setInterval(() => {
|
this.time--;
|
if (this.time == 0) {
|
this.goBack();
|
}
|
}, 1000);
|
},
|
goBack() {
|
if (this.state == "success") {
|
this.$router.push({
|
path: "/personalCenter"
|
});
|
}
|
if (this.state == "error") {
|
this.$router.push({
|
path: "/bindWeChat"
|
});
|
}
|
}
|
},
|
beforeRouteLeave(to, form, next) {
|
if (this.timer) clearInterval(this.timer);
|
next();
|
}
|
};
|
</script>
|
<style lang="less" scoped>
|
.iconBox {
|
padding-top: 100px;
|
text-align: center;
|
i {
|
font-size: 60px;
|
margin-bottom: 30px;
|
}
|
p {
|
font-size: 24px;
|
margin-bottom: 50px;
|
}
|
.backBox {
|
font-size: 14px;
|
}
|
}
|
</style>
|
