<!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"> <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; } </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">立即领取</div> </div> </div> </body> </html> <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:'' }, created: function () { this.type = getUrlParam('type'); this.invite_id = getUrlParam('form'); alert(this.invite_id); }, methods: { getCode: function () { const TIME_COUNT = 60; if (!app.timer) { app.count = TIME_COUNT; app.show = false; 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) } }, } }) </script>