Lee-1203 2022-03-03 19:36:41 +08:00
commit 605627780c
2 changed files with 131 additions and 70 deletions

View File

@ -1,79 +1,130 @@
<template>
<div class="content bind-content">
<!-- 头部 -->
<div :class="{'header':true,'scroll white':isScrollTop,'white':true}">
<div class="back" @click="$router.go(-1)"><img src="../../../assets/images/home/expert/back.png" alt=""></div>
<div v-if="centerUserData.mobile" class="header-title"></div>
<div v-else class="header-title">手机绑定</div>
</div>
<div class="feedback-bg pull-content">
<ul class="phone-bind">
<li><span>手机号</span>18683958573</li>
<li><span>验证码</span><input type="text" value="" placeholder="请输入验证码"/><em>获取验证码</em></li>
</ul>
</div>
<div class="bind-btn">确定</div>
</div>
<div class="content bind-content">
<!-- 头部 -->
<div :class="{ header: true, 'scroll white': isScrollTop, white: true }">
<div class="back" @click="$router.go(-1)">
<img src="../../../assets/images/home/expert/back.png" alt="" />
</div>
<div v-if="centerUserData.mobile" class="header-title"></div>
<div v-else class="header-title">手机绑定</div>
</div>
<div class="feedback-bg pull-content">
<ul class="phone-bind">
<li>
<span>手机号</span
><input
type="text"
v-model="phoneNumber"
value=""
placeholder="请输入手机号"
/>
</li>
<li>
<span>验证码</span
><input type="text" value="" v-model="sms_code" placeholder="请输入验证码" /><em
@click="captcha()" >获取验证码</em
>
</li>
</ul>
</div>
<div class="bind-btn" @click="bindPhone()"></div>
</div>
</template>
<script>
export default {
name: "bind",
data() {
return {
isScrollTop: false,
centerUserData:{
mobile:""
}
}
},
created() {
this.isScroll = true;
window.addEventListener("scroll", this.eventScrollTop);
export default {
name: "bind",
data() {
return {
isScrollTop: false,
phoneNumber: "13608235524",
sms_code:"",
centerUserData: {
mobile: "",
},
};
},
created() {
this.isScroll = true;
window.addEventListener("scroll", this.eventScrollTop);
this.centerUserData=JSON.parse(location.centerUserData)
console.log(this.centerUserData)
},
mounted() {
},
computed: {
},
methods: {
//
eventScrollTop() {
let scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
if (scrollTop >= 5) {
if (this.isScroll) {
this.isScroll = false;
this.isScrollTop = true;
}
} else {
if (!this.isScroll) {
this.isScroll = true;
this.isScrollTop = false;
}
}
}
},
destroyed() {
window.removeEventListener("scroll", this.eventScrollTop);
},
//keep-alive
activated() {
this.isScroll = true;
window.addEventListener("scroll", this.eventScrollTop)
},
//keep-alive
deactivated() {
window.removeEventListener("scroll", this.eventScrollTop);
}
}
this.centerUserData = JSON.parse(location.centerUserData);
console.log(this.centerUserData);
},
mounted() {},
computed: {},
methods: {
bindPhone(){
this.axios
.post(this.HOME + "/api/user/bind-phone", {
phone: this.phoneNumber,
sms_code:this.sms_code
})
.then(function () {
})
.catch(function (error) {
console.log(error);
});
},
captcha() {
console.log(123)
var reg_tel =
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
if (this.phoneNumber == "") {
alert("请填写您的手机号码!");
return false;
} else if (!reg_tel.test(this.phoneNumber)) {
alert("请正确填写您的手机号码!");
return false;
}
this.axios
.post(this.HOME + "/api/common/send-sms-captcha", {
phone: this.phoneNumber,
type: "bind",
})
.then(function () {
})
.catch(function (error) {
console.log(error);
});
},
//
eventScrollTop() {
let scrollTop =
document.body.scrollTop || document.documentElement.scrollTop;
if (scrollTop >= 5) {
if (this.isScroll) {
this.isScroll = false;
this.isScrollTop = true;
}
} else {
if (!this.isScroll) {
this.isScroll = true;
this.isScrollTop = false;
}
}
},
},
destroyed() {
window.removeEventListener("scroll", this.eventScrollTop);
},
//keep-alive
activated() {
this.isScroll = true;
window.addEventListener("scroll", this.eventScrollTop);
},
//keep-alive
deactivated() {
window.removeEventListener("scroll", this.eventScrollTop);
},
};
</script>
<style scoped>
</style>

View File

@ -28,7 +28,13 @@
</div>
<div class="line" v-if="isReceive == 1"></div>
<ul class="student-information">
<li @click="goPage('/bind')" >
<li v-if="userData.mobile" >
<span
><img src="../../../assets/images/user/icon-phone.png" alt=""
/></span>
<p>手机号<em>{{userData.mobile}}</em></p>
</li>
<li @click="goPage('/bind')" v-else >
<span
><img src="../../../assets/images/user/icon-phone.png" alt=""
/></span>
@ -105,6 +111,10 @@
},
data() {
return {
centerUserData:{
mobile:""
},
isScrollTop: false,
isReceive: 1, //
isUse: 0, //使