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

View File

@ -28,7 +28,13 @@
</div> </div>
<div class="line" v-if="isReceive == 1"></div> <div class="line" v-if="isReceive == 1"></div>
<ul class="student-information"> <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 <span
><img src="../../../assets/images/user/icon-phone.png" alt="" ><img src="../../../assets/images/user/icon-phone.png" alt=""
/></span> /></span>
@ -105,6 +111,10 @@
}, },
data() { data() {
return { return {
centerUserData:{
mobile:""
},
isScrollTop: false, isScrollTop: false,
isReceive: 1, // isReceive: 1, //
isUse: 0, //使 isUse: 0, //使