replacementActivities.html 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350
  1. <!DOCTYPE html>
  2. <html lang="zh-CN">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
  6. <title>免费换机</title>
  7. <link rel="icon" href="../static/img/favicon2.ico" type="img/x-ico">
  8. <link rel="stylesheet" href="../static/js/vender/toastr/toastr.min.css">
  9. <link rel="stylesheet" href="../static/css/replacementActivities.css">
  10. <script src="../static/js/vender/jquery-3.4.1.min.js"></script>
  11. <script src="../static/js/vender/toastr/toastr.min.js"></script>
  12. <script src="../static/js/vender/config.js"></script>
  13. <script src="../static/js/vender/crypto-js.js"></script>
  14. <script src="../static/js/vender/ase.js"></script>
  15. <script src="../static/js/vender/verify.js"></script>
  16. </head>
  17. <body>
  18. <div class="container">
  19. <div class="share-node">
  20. <img class="qq" src="../static/img/replacementActivities/qq.png" alt="">
  21. <div class="line"></div>
  22. <img class="cs" src="../static/img/replacementActivities/cs.png" alt="">
  23. </div>
  24. <div class="date">2022.1.4-2022.2.8</div>
  25. <div class="header">
  26. <div class="login-container">
  27. <div class="login-bar">仅限2000份</div>
  28. <div class="ipt"></div>
  29. <div class="input-container">
  30. <div class="login-row-select">
  31. <div class="login-row-title">选择</div>
  32. <input class="login-row-ipt" id="select" placeholder="请选择平台" disabled="true" />
  33. <img class="icon-down-img" src="../static/img/replacementActivities/arrow.png" />
  34. </div>
  35. <div class="options">
  36. <div class="icon-down-second">红手指</div>
  37. <div class="icon-down-first">多多云</div>
  38. <div class="icon-down-third">爱云兔</div>
  39. </div>
  40. <div class="login-row-account">
  41. <div class="login-row-title">账户</div>
  42. <input class="login-row-ipt" id="account" placeholder="请输入11位手机号码" />
  43. </div>
  44. <div class="tip-text1"></div>
  45. <div class="login-row-password">
  46. <div class="login-row-title">密码</div>
  47. <input class="login-row-ipt" type="password" id="password" placeholder="请输入密码" />
  48. </div>
  49. <div class="tip-text2"></div>
  50. <div class="form-btn"></div>
  51. <div id="mpanel2"></div>
  52. </div>
  53. </div>
  54. </div>
  55. <div class="mt55">
  56. <img class="w666h874" src="../static/img/replacementActivities/activityReward.png" alt="">
  57. </div>
  58. <div class="mt50">
  59. <img class="w670h476" src="../static/img/replacementActivities/inviteeReward.png" alt="">
  60. </div>
  61. <div class="mt50">
  62. <img class="w666h864" src="../static/img/replacementActivities/mattersNeedAttention.png" alt="">
  63. </div>
  64. </div>
  65. <script>
  66. toastr.options.positionClass = 'toast-center-center';
  67. toastr.options.timeOut = '1500';
  68. </script>
  69. <script type="text/javascript">
  70. Date.prototype.Format = function (fmt) { // author: meizz
  71. var o = {
  72. "M+": this.getMonth() + 1, // 月份
  73. "d+": this.getDate(), // 日
  74. "h+": this.getHours(), // 小时
  75. "m+": this.getMinutes(), // 分
  76. "s+": this.getSeconds(), // 秒
  77. "q+": Math.floor((this.getMonth() + 3) / 3), // 季度
  78. "S": this.getMilliseconds() // 毫秒
  79. };
  80. if (/(y+)/.test(fmt))
  81. fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
  82. for (var k in o)
  83. if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  84. return fmt;
  85. }
  86. let timer, flag = true;
  87. let isShow = true;
  88. let entryPageTime = new Date().Format("yyyy-MM-dd hh:mm:ss");
  89. let fromType = 0,
  90. account = '',
  91. password = '';
  92. var url = window.location.href;
  93. url = url.split('/')
  94. var loc = window.location.search,
  95. n1 = loc.length,//地址的总长度
  96. n2 = loc.indexOf("="),//取得=号的位置
  97. id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
  98. u = navigator.userAgent,
  99. ua = navigator.userAgent.toLowerCase(),
  100. isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
  101. isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android终端
  102. imgs = [[1, '../static/img/changePhoneActivity/rule1.png'], [6, '../static/img/changePhoneActivity/rule6.png'], [2, '../static/img/changePhoneActivity/rule2.png'], [3, '../static/img/changePhoneActivity/rule3.png']];
  103. //埋点
  104. // operate('dt_yhs_活动页面浏览');
  105. function operate(pointName, type) {
  106. $.ajax({
  107. url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
  108. type: 'post',
  109. data: JSON.stringify({
  110. pointName: pointName
  111. }),
  112. contentType: "application/json",
  113. dataType: 'json',
  114. cache: false,
  115. success: function (res) {
  116. if (type === 'click') {
  117. changePhone();
  118. }
  119. },
  120. })
  121. }
  122. //异步加载图片
  123. async function loadAsync() {
  124. let promise = function (index, url) {
  125. return new Promise((resolve, reject) => {
  126. const image = new Image();
  127. image.src = url;
  128. image.className = 'rule' + index;
  129. image.onload = function () {
  130. $('.middle')[0].appendChild(image);
  131. resolve('ok');
  132. }
  133. })
  134. }
  135. for (let [index, url] of imgs) {
  136. await promise(index, url);
  137. }
  138. }
  139. // loadAsync();
  140. //点击分享
  141. $('.share-node')[0].addEventListener('click', () => {
  142. if (!id) {
  143. copyUrl();
  144. } else if (isiOS) {
  145. $.ajax({
  146. url: baseUrl + '/api/user/v1/promote',
  147. type: 'get',
  148. headers: {
  149. 'Authorization': id //id
  150. },
  151. contentType: "application/json",
  152. dataType: 'json',
  153. cache: false,
  154. success: function (res) {
  155. var jsonStr = JSON.stringify(res.data)
  156. var jsonObj = JSON.parse(jsonStr)
  157. // WKWebView使用
  158. // 使用下方方法,会报错,为使界面执行逻辑通畅,因此使用try-catch
  159. try {
  160. getMessage(jsonObj);
  161. } catch (error) {
  162. console.log(error)
  163. }
  164. try {
  165. window.webkit.messageHandlers.getMessage.postMessage(jsonObj)
  166. } catch (error) {
  167. copyUrl();
  168. }
  169. }
  170. })
  171. } else if (isAndroid) {
  172. if (window.native) {
  173. window.native.onClikWebView()
  174. } else {
  175. copyUrl();
  176. }
  177. } else {
  178. copyUrl();
  179. }
  180. }, false);
  181. //复制
  182. function copyUrl() {
  183. stopManyClick(() => {
  184. var oInput = document.createElement('input'); //创建一个input
  185. oInput.setAttribute("readonly", "readonly");//设置只读,否则移动端使用复制功能时可能会造成软件盘弹出
  186. oInput.value = window.location.href || 'https://client.androidscloud.com/h5/microserviceUserH5/vcloud/invite.html';
  187. $('.ipt')[0].appendChild(oInput);//将input插入到body
  188. // oInput.select(); // 选择对象 ios不支持
  189. selectText(oInput, 0, oInput.value.length);
  190. document.execCommand("Copy"); // 执行浏览器复制命令
  191. toastr.error('复制当前网址成功!');
  192. oInput.style.display = 'none'; // 将input隐藏
  193. oInput.blur();
  194. oInput.remove(); // 将input销毁
  195. })
  196. }
  197. // input自带的select()方法在苹果端无法进行选择,所以需要自己去写一个类似的方法
  198. // 选择文本。createTextRange(setSelectionRange)是input方法
  199. function selectText(textbox, startIndex, stopIndex) {
  200. if (textbox.createTextRange) {//ie
  201. const range = textbox.createTextRange();
  202. range.collapse(true);
  203. range.moveStart('character', startIndex);//起始光标
  204. range.moveEnd('character', stopIndex - startIndex);//结束光标
  205. range.select();//不兼容苹果
  206. } else {//firefox/chrome
  207. textbox.setSelectionRange(startIndex, stopIndex);
  208. textbox.focus();
  209. }
  210. }
  211. // 默认选中红手指
  212. function handleClick() {
  213. $('.options')[0].className = 'options';
  214. $('#select').val('红手指');
  215. fromType = 2;
  216. };
  217. handleClick();
  218. //点击选择框
  219. $('.login-row-select')[0].addEventListener('click', () => {
  220. $('.options')[0].className = 'options show';
  221. }, false);
  222. //点击多多云
  223. $('.icon-down-first')[0].addEventListener('click', () => {
  224. $('.options')[0].className = 'options';
  225. $('#select').val('多多云');
  226. fromType = 1;
  227. }, false);
  228. //点击红手指
  229. $('.icon-down-second')[0].addEventListener('click', () => {
  230. $('.options')[0].className = 'options';
  231. $('#select').val('红手指');
  232. fromType = 2;
  233. }, false);
  234. //点击爱云兔
  235. $('.icon-down-third')[0].addEventListener('click', () => {
  236. $('.options')[0].className = 'options';
  237. $('#select').val('爱云兔');
  238. fromType = 3;
  239. }, false);
  240. //点击提示弹窗确定
  241. // $('.sure-btn')[0].addEventListener('click', handleClose, false);
  242. function handleClose() {
  243. $('.tip').animate({ top: '-6.96rem' }, "fast");
  244. $('.mask').hide();
  245. document.documentElement.style.overflow = 'auto';
  246. }
  247. //点击立即注册
  248. // $('.register-text')[0].addEventListener('click', registerHandle, false);
  249. // $('.register-btn')[0].addEventListener('click', registerHandle, false);
  250. function registerHandle() {
  251. $('.dialog').animate({ top: '-6.96rem' }, "fast");
  252. $('.mask').hide();
  253. document.documentElement.style.overflow = 'auto';
  254. $('#select').val('');
  255. $('#account').val('');
  256. $('#password').val('');
  257. window.location.href = 'https://www.androidscloud.com';
  258. }
  259. //点击免费换机按钮
  260. $('.form-btn')[0].addEventListener('click', changePhoneHandle, false);
  261. function changePhoneHandle() {
  262. stopManyClick(() => {
  263. account = $('#account').val();
  264. account = account.replace(/\s+/g, "");
  265. password = $('#password').val();
  266. password = password.replace(/\s+/g, "");
  267. if (!account) {
  268. $('.tip-text1').text('账号格式不正确,请重新输入!');
  269. $('#account').addClass('br');
  270. return
  271. } else {
  272. $('.tip-text1').text('');
  273. $('#account').removeClass('br')
  274. }
  275. if (!/^1[3|4|5|6|7|8|9][0-9]\d{8}$/.test(account)) {
  276. $('.tip-text1').text('账号格式不正确,请重新输入!');
  277. $('#account').addClass('br');
  278. return
  279. } else {
  280. $('.tip-text1').text('');
  281. $('#account').removeClass('br')
  282. }
  283. if (!password) {
  284. $('.tip-text2').text('密码为空,请重新输入!');
  285. $('#password').addClass('br');
  286. return
  287. } else {
  288. $('.tip-text2').text('');
  289. $('#password').removeClass('br')
  290. }
  291. operate('dt_yhs_点击免费换机按钮', 'click');
  292. })
  293. }
  294. //调用免费换机接口
  295. function changePhone() {
  296. let data = {
  297. inviteTime: entryPageTime,
  298. type: fromType,
  299. account: account,
  300. password: password
  301. }
  302. if (!id) {
  303. delete data.inviteTime
  304. }
  305. let ajaxObj = {
  306. url: baseUrl + '/api/public/v1/activity/change/phone',
  307. type: 'post',
  308. headers: {
  309. 'Authorization': id //id
  310. },
  311. data: JSON.stringify(data),
  312. contentType: "application/json",
  313. dataType: 'json',
  314. cache: false,
  315. success: function (res) {
  316. if (res.status === 0) {
  317. $('.dialog').animate({ top: '46vh' }, "fast");
  318. $('.mask').show();
  319. $('.tip').animate({ top: '-6.96rem' }, "fast");
  320. document.documentElement.style.overflow = 'hidden';
  321. } else {
  322. $('#tip-text').text(res.msg);
  323. $('.tip').animate({ top: '48vh' }, "fast");
  324. $('.mask').show();
  325. $('.dialog').animate({ top: '-6.96rem' }, "fast");
  326. document.documentElement.style.overflow = 'hidden';
  327. }
  328. }
  329. }
  330. if (!id) {
  331. delete ajaxObj.headers
  332. }
  333. $.ajax(ajaxObj)
  334. }
  335. //防止提示一秒内重复显示
  336. function stopManyClick(fn) {
  337. if (flag) {
  338. fn();
  339. }
  340. flag = false;
  341. if (timer) { clearTimeout(timer); }
  342. timer = setTimeout(() => { flag = true }, 1500);
  343. }
  344. </script>
  345. </body>
  346. </html>