<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <meta name="format-detection" content="telephone=no,email=no,date=no,address=no"> <!--<link rel="stylesheet" href="assets/css/mui.min.css">--> <link rel="stylesheet" href="assets/css/weui.min.css"> <script src="http://kindapp.w.bronet.cn/A6079080424317/assets/js/fontsize.js"></script> <link rel="stylesheet" href="http://kindapp.w.bronet.cn/A6079080424317/assets/css/api.css"/> <link rel="stylesheet" href="http://kindapp.w.bronet.cn/A6079080424317/assets/icon/iconfont.css"> <title>邀友有赚</title> <style> .friend_top { background: url("http://kindapp.w.bronet.cn/A6079080424317/assets/image/friend.png") no-repeat; background-size: cover; height: 4.55rem; } .friend_box { width: 86%; margin: -3.26rem auto 0 auto; background-color: #fff; overflow: hidden; } .friend_box_img { background: url("http://kindapp.w.bronet.cn/A6079080424317/assets/image/firend1.jpg"); width: 63%; height: 2.28rem; line-height: 2.28rem; text-align: center; margin: 0.53rem auto 0.24rem auto; background-size: cover; font-size: 15px; color: #fff; } .friend_price { font-size: 36px; } .friend_tips { font-size: 12px; color: #424242; text-align: center; } .friend_input_box { margin: 0.56rem auto; width: 63%; } .friend_input { border-bottom: 1px solid #ededed; font-size: 12px; color: #424242; margin-bottom: 0.4rem; display: flex; align-items: center; justify-content: space-between; } .friend_input input { padding: 0.2rem 0; width: 50%; flex: 1; } .friend_input::-webkit-input-placeholder { color: #C2C1C3; font-size: 12px; } .friend_code { border: 1px solid #858485; padding: 0.08rem 0.13rem; border-radius: 0.16rem; color: #858485; font-size: 10px; text-align: center; } .friend_btn { width: 63%; margin: 0 auto; background-color: #dbb25f; color: #fff; font-size: 15px; text-align: center; padding: 0.17rem 0; border-radius: 0.16rem; } .joinstep{ display:flex; justify-content: space-between; align-items: center; margin-top:0.6rem; } .step{ color:#CCA756; font-size: 0.24rem; } .line{ width:2.5rem; color:#C3C3C3; border: 0.01rem solid #ededed; } .stepnum{ display:flex; justify-content: space-between; align-items: center; margin-top: 0.6rem; padding: 0 0.4rem; } .num{ color:#0d0d0d; font-size: 0.16rem; width:0.35rem; height:0.35rem; background:rgba(216,178,95,1); opacity:0.18; border-radius:50%; text-align: center; line-height: 0.35rem; } .stepline{ width:1rem; height:0.01rem; /*color:#C3C3C3;*/ border: 0.01rem solid #ededed; } .text{ display:flex; justify-content: space-between; align-items: center; margin-top: 0.1rem; } .steptext{ width:3rem; color:#CCA756; font-size: 0.22rem; display:inline-block; text-align: center; } .mui-toast-container { text-align: center; width: 3rem; height: 1.6rem; position: fixed; top: 30%; transform: translateY(-1rem); left: 40%; right: 0; margin: 0 auto; font-size: 0.3rem; -webkit-transition:opacity .3s; transition:opacity .3s; -webkit-transform:translate(-50%,0); /*transform:translate(-50%,0);*/; z-index: 888; } .mui-toast-message { width: 3rem; height: 1.6rem; color:#fff; border-radius:6px; font-size: 0.3rem; text-align: center; line-height: 1.6rem; background-color:#323232; opacity:0.7; z-index: 888; } /*.textline{*/ /*width:0.05rem;*/ /*!*height:0.01rem;*!*/ /*!*border: 0.01rem solid #ededed;*!*/ /*}*/ </style> </head> <body> <div id="app" v-cloak> <div class="friend_top"></div> <div class="friend_box"> <div class="friend_box_img"> <div v-if="type==1"><span>送</span><span class="friend_price">1000</span><span>元消费金</span></div> <div v-else><span>送</span><span class="friend_price">20</span><span>元首单奖励</span></div> </div> <div class="friend_tips">健康提升新选择,为健康为投资</div> <div class="friend_input_box"> <div class="friend_input"><input type="text" placeholder="请输入手机号" v-model="tel"></div> <div class="friend_input"><input type="text" placeholder="请输入验证码" v-model="code"> <span v-if="show" @click="getCode" class="friend_code">获取验证码</span> <span v-else class="friend_code">{{count}}S</span> </div> </div> <div class="friend_btn" @click="reg_fir">立即领取</div> <div class="join" v-if="kind"> <div class="joinstep"> <p class="line"></p> <p class="step">加入步骤</p> <p class="line"></p> </div> <div class="stepnum"> <div> <p class="num">1</p> </div> <p class="stepline"></p> <p class="num">2</p> <p class="stepline"></p> <p class="num">3</p> <p class="stepline"></p> <p class="num">4</p> <p class="stepline"></p> <p class="num">5</p> </div> <div class="text"> <p class="steptext">登录APP</p> <p class="steptext">我的</p> <p class="steptext">设置</p> <p class="steptext">服务商入口</p> <p class="steptext">资质认证</p> </div> </div> </div> </div> </body> </html> <script type="text/javascript" src="assets/js/jquery-2.1.4.js"></script> <script type="text/javascript" src="assets/js/jquery-weui.js"></script> <script type="text/javascript" src="assets/js/mui.min.js"></script> <script type="text/javascript" src="assets/js/cookie.js"></script> <script type="text/javascript" src="http://kindapp.w.bronet.cn/A6079080424317/assets/js/api.js"></script> <script type="text/javascript" src="http://kindapp.w.bronet.cn/A6079080424317/assets/js/public.js"></script> <script type="text/javascript" src="http://kindapp.w.bronet.cn/A6079080424317/assets/js/fastclick.js"></script> <script> new FastClick(document.body); </script> <script type="text/javascript" src="http://kindapp.w.bronet.cn/A6079080424317/assets/js/vue.min.js"></script> <script type="text/javascript" src="http://kindapp.w.bronet.cn/A6079080424317/assets/js/axios.min.js"></script> <script type="text/javascript" src="http://kindapp.w.bronet.cn/A6079080424317/assets/icon/iconfont.js"></script> <script> var app = new Vue({ el: '#app', data: { show: true, count: '', timer: null, type: 1, invite_id: '', tel: '', code: '', invite_type: '', kind:true }, created: function () { this.type = getUrlParam('type'); this.invite_id = getUrlParam('form'); this.invite_type = getUrlParam('invite_type'); if(this.type==1){ app.kind=false }else if(this.type==2){ app.kind=true } }, methods: { getCode: function () { var myreg=/^[1][3,4,5,7,8][0-9]{9}$/; if(! myreg.test(app.tel)){ //alert("请输入正确的手机号") mui.toast("请输入正确的手机号"); //openView('download', 'download', '下载页', 'download', false, false, false); unstock(); }else{ const TIME_COUNT = 60; app.show = false; app.count = TIME_COUNT; var header = { "XX-Device-Type": getDevice(), }; var post = { tel: app.tel }; getRequest('post', 'home/index/loginBySMS', post, header).then(function (res) { mui.toast(res.data.msg); unstock() if (!app.timer) { app.timer = setInterval(function () { if (app.count > 0 && app.count <= TIME_COUNT) { app.count--; } else { app.show = true; clearInterval(this.timer); app.timer = null; } }, 1000) } // alert(JSON.stringify(res)) // alert(res.data.msg) }) } }, // 好友注册 reg_fir: function () { var header = { "XX-Device-Type": getDevice(), // 'XX-Token': getToken() }; var post = { tel: app.tel, code:app.code, invite_id:app.invite_id, type:app.type }; getRequest('post', '/home/index/checkSMS', post, header).then(function (res) { // alert(JSON.stringify(res)) console.log(res) if(res.data.code==0){ // alert(res.data.msg) mui.toast(res.data.msg); unstock(); }else{ // alert("领取成功") mui.toast("领取成功"); unstock(); window.location.href='download.html' } }) } } }) </script>