springFestivalActivity.html 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808
  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/springFestivalActivity.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. </head>
  14. <body>
  15. <div class="code-container">
  16. <div class="award-tip">购买星曜月卡获得1次抽奖资格 星曜年卡获得10次抽奖资格</div>
  17. <div class="rule-wrap">
  18. <div class="rule">活动规则</div>
  19. <div class="award">奖励一览</div>
  20. </div>
  21. <div class="gift-box">
  22. <img class="gift-img" src="../static/img/springFestivalActivity/gift.png" />
  23. </div>
  24. </div>
  25. <div class="next-container">
  26. <div class="lottery-tip">抽奖10次必中年卡</div>
  27. <div class="lottery-wrap">
  28. <div class="once">抽奖1次</div>
  29. <div class="five-times">抽奖5次</div>
  30. </div>
  31. <div class="rest-times">
  32. <div class="rest-times-text">剩余次数 <span class="rest-times-number">0</span>次</div>
  33. <div class="get-times">获取次数 >></div>
  34. </div>
  35. <div class="no-join-activity">使用激活码、星币支付及PC端不参与活动</div>
  36. <div class="share-wrap">分享至朋友圈、QQ获得“幸运BUFF”</div>
  37. <div class="get-award">
  38. <div class="award-text">已获取奖励</div>
  39. <div class="award-number"></div>
  40. </div>
  41. <div class="activity-time">活动时间 :2021年1月25日-2月15日</div>
  42. <div class="activity-tip">仅购买星曜月卡、星曜年卡才可参与此活动哦</div>
  43. </div>
  44. <div class="award-record-mask">
  45. <div class="dialog">
  46. <div class="tab-wrap">
  47. <div class="award-change-btn active" data-index="0">领取</div>
  48. <div class="award-change-btn" data-index="1">已使用</div>
  49. </div>
  50. <div class="record-wrap">
  51. <div class="title-row">
  52. <div class="title-award">奖品</div>
  53. <div class="title-Title">时间</div>
  54. <div class="title-operat">操作</div>
  55. </div>
  56. <div class="line"></div>
  57. <div class="data-list"></div>
  58. </div>
  59. <div class="sure-btn">确定</div>
  60. <img class="close" src="../static/img/springFestivalActivity/close.png" />
  61. </div>
  62. </div>
  63. <div class="rule-mask">
  64. <div class="rule-dialog">
  65. <img class="rule-text" src="../static/img/springFestivalActivity/ruleText.png" />
  66. <div class="rule-list">
  67. <div class="rule-point">1、活动期间购买获得的抽取资格不限次 数,已获得的抽取资格和未分配的抽取奖 励将在活动结束三天后失效,请在失效前 尽快抽取和分配奖励。</div>
  68. <div class="rule-point">2、参与活动的套餐是星曜月卡与年卡套餐,其他套餐不参与活动。</div>
  69. <div class="rule-point">3、星币、激活码购买的订单不参与本次活动,使用优惠券订单均可参与活动。</div>
  70. <div class="rule-point">4、抽奖的奖励,系统默认优先新增云机,如账号上云机已超出上限数量,则可将抽奖的奖励时长自由分配到账号上任意一台星曜云机上。</div>
  71. <div class="rule-point">5、本次活动购买的云手机套餐不支持退款。</div>
  72. <div class="rule-point">6、双子星官方对活动具有最终解释权。</div>
  73. </div>
  74. <img class="rule-close" src="../static/img/springFestivalActivity/close.png" />
  75. </div>
  76. </div>
  77. <div class="award-mask">
  78. <div class="award-dialog">
  79. <div class="award-result-row">
  80. <img class="icon" src="../static/img/springFestivalActivity/left-icon.png" />
  81. <span class="award-result">参与抽奖有机率获得以下奖励</span>
  82. <img class="icon" src="../static/img/springFestivalActivity/right-icon.png" />
  83. </div>
  84. <div class="card-wrap"></div>
  85. <img class="award-close" src="../static/img/springFestivalActivity/close.png" />
  86. </div>
  87. </div>
  88. <div class="award-result-mask">
  89. <div class="award-result-dialog">
  90. <div class="have-times-wrap">
  91. <div class="result-tip-row">
  92. <div class="award-result-tip">善良的人,好运气最终是会眷顾你</div>
  93. <div class="join-result-tip">抽取奖励仅为新增云手机,请去云手机首页查看</div>
  94. </div>
  95. <div class="card-wrap award-result-wrap"></div>
  96. <div class="btn-row">
  97. <div class="left-btn">再抽<span class="report-times"></span>次</div>
  98. <div class="look-btn">查看</div>
  99. </div>
  100. <div class="times-text">还剩次数:<span class="times-text-number"></span>次</div>
  101. </div>
  102. <div class="no-times-wrap">
  103. <div class="no-times-tip">
  104. <div>意不意外,惊不惊喜!</div>
  105. <div>当前抽奖次数不足哦</div>
  106. </div>
  107. <div class="no-times-btn">购买星曜云手机获取次数</div>
  108. </div>
  109. <img class="award-result-close" src="../static/img/springFestivalActivity/close.png" />
  110. </div>
  111. </div>
  112. <div class="distribution-mask">
  113. <div class="distribution-dialog">
  114. <div class="distribution-wrap">
  115. <div class="limit-tip">
  116. <div>云手机数量已达上限</div>
  117. <div>请分配云机时长</div>
  118. </div>
  119. <div class="distribution-btn">分配奖励</div>
  120. </div>
  121. </div>
  122. </div>
  123. <div class="no-start-mask">
  124. <div class="no-start-dialog">
  125. <div>活动暂未开启</div>
  126. <div>请稍安勿躁</div>
  127. </div>
  128. </div>
  129. <script>
  130. toastr.options.positionClass = 'toast-center-center';
  131. toastr.options.timeOut = '1500';
  132. </script>
  133. <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  134. <script type="text/javascript">
  135. // var baseUrl = 'https://per.cs.se.androidscloud.com'
  136. let timer,flag = true;
  137. var url = window.location.href;
  138. url = url.split('/')
  139. var loc = window.location.search,
  140. n1 = loc.length,//地址的总长度
  141. n2 = loc.indexOf("="),//取得=号的位置
  142. id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
  143. u = navigator.userAgent,
  144. ua = navigator.userAgent.toLowerCase(),
  145. isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
  146. isMiniprogram = false,
  147. isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
  148. let activityState = 0,
  149. luckDraw = 0,
  150. surplus = 0, //剩余未抽奖次数
  151. receive = 1,
  152. pages = 0,
  153. phoneRemainQuantity = 0,
  154. pageNum = 0,
  155. animationFlag = true,
  156. notReceive = 0,
  157. recordFlag = false;
  158. operate('sf_2022_h5_活动首页');
  159. if (ua.match(/MicroMessenger/i) == "micromessenger") {
  160. //ios的ua中无miniProgram,但都有MicroMessenger(表示是微信浏览器)
  161. wx.miniProgram.getEnv((res) => {
  162. if (res.miniprogram) {
  163. isMiniprogram = true;
  164. } else {
  165. isMiniprogram = false;
  166. }
  167. })
  168. } else {
  169. isMiniprogram = false;
  170. }
  171. init();
  172. getPhoneNumber();
  173. setInterval(() => {
  174. init('report');
  175. },30000);
  176. var num=1;
  177. loadImage();
  178. function loadImage(){
  179. var imgArr = ['record-bg','noTimes','selectedBg','selected','sureBg2','ruleBg','awardBg','resultBg','lookBg','rule','nextBg','award','getTimer'];
  180. var img=new Image();
  181. img.addEventListener("load",() => {
  182. loadHandler(img,imgArr)
  183. });
  184. img.src="../static/img/springFestivalActivity/"+imgArr[num]+".png";
  185. }
  186. function loadHandler(img,imgArr){
  187. num++;
  188. if(imgArr[num]){
  189. loadImage();
  190. }
  191. }
  192. //初始化数据
  193. function init(type) {
  194. $.ajax({
  195. url: baseUrl + '/api/user/v1/activity/getSpringFestivalConfig',
  196. type: 'get',
  197. headers: {
  198. 'Authorization': id //id
  199. },
  200. contentType: "application/json",
  201. dataType: 'json',
  202. cache: false,
  203. success: function (res) {
  204. if(res.status === 0){
  205. $('.card-wrap').eq(0).text('');
  206. let time = `活动时间 :${res.data.startTime.substr(0,4)}年${res.data.startTime.substring(5,7)}月${res.data.startTime.substring(8,10)}日-${res.data.endTime.substring(5,7)}月${res.data.endTime.substring(8,10)}日`;
  207. $('.activity-time').eq(0).text(time);
  208. let str = '',
  209. cardData = [{name: '天',imgName: 'day'},{name: '周',imgName: 'week'},{name: '月',imgName: 'mouth'},
  210. {name: '季',imgName: 'season'},{name: '年',imgName: 'year'}],
  211. jackpot = res.data.jackpot;
  212. cardData = cardData.filter((item) => jackpot.includes(item.name));
  213. for (var i = 0; i < cardData.length; i++) {
  214. str += `<div class="card-item">
  215. <img class="card" src="../static/img/springFestivalActivity/${cardData[i].imgName}.png" />
  216. <div class="card-text">星曜${cardData[i].name}卡</div>
  217. </div>`
  218. }
  219. activityState = res.data.activityState;
  220. let now = Date.parse(res.data.now),
  221. startTime = Date.parse(res.data.startTime);
  222. if(activityState === 0 || now < startTime){
  223. $('.no-start-dialog').animate({top: '4.24rem'},"fast");
  224. $('.no-start-mask').show();
  225. document.documentElement.style.overflow='hidden';
  226. }
  227. if(activityState === 2){
  228. $('.share-wrap').eq(0).css('display', 'none');
  229. }
  230. luckDraw = res.data.luckDraw;
  231. surplus = res.data.surplus;
  232. notReceive = res.data.notReceive;
  233. $('.rest-times-number').eq(0).text(surplus);
  234. $('.times-text-number').eq(0).text(surplus);
  235. if(res.data.addition === 1){
  236. $('.gift-box')[0].className = 'gift-box have-buff'
  237. } else {
  238. $('.gift-box')[0].className = 'gift-box'
  239. }
  240. if(parseInt(notReceive) > 0){
  241. if(type != 'report'){
  242. receive = 0;
  243. }
  244. notReceive = parseInt(notReceive) > 99 ? '99+' : notReceive;
  245. $('.tab-wrap').eq(0).css('display', 'flex');
  246. $('.record-wrap').eq(0).css('marginTop', '0.2rem');
  247. $('.record-wrap').eq(0).css('height', '5.38rem');
  248. $('.data-list').eq(0).css('height', '4.38rem');
  249. $('.award-number').eq(0).css('display', 'block');
  250. $('.award-number').eq(0).text(notReceive);
  251. }else{
  252. $('.award-number').eq(0).css('display', 'none');
  253. $('.tab-wrap').eq(0).css('display', 'none');
  254. $('.record-wrap').eq(0).css('marginTop', '1.6rem');
  255. $('.record-wrap').eq(0).css('height', '5.86rem');
  256. }
  257. $('.card-wrap').eq(0).append(str)
  258. }else{
  259. stopManyClick(() =>{
  260. toastr.error(res.msg)
  261. })
  262. }
  263. },
  264. })
  265. }
  266. //点击获奖记录
  267. $('.get-award')[0].addEventListener('click',() => {
  268. if(activityState === 2 && luckDraw === 0){
  269. stopManyClick(() =>{
  270. toastr.error('活动已结束,期待下次的见面');
  271. })
  272. return
  273. }
  274. $('.dialog').animate({top: '2.24rem'},"fast");
  275. $('.award-record-mask').show();
  276. document.documentElement.style.overflow='hidden';
  277. $('.data-list').eq(0).text('');
  278. pageNum = 1;
  279. pages = 0;
  280. recordFlag = true;
  281. getAward();
  282. },false);
  283. //点击获奖记录关闭按钮
  284. $('.close')[0].addEventListener('click',handleClose,false);
  285. function handleClose() {
  286. $('.dialog').animate({top: '-10.96rem'},"fast");
  287. $('.award-record-mask').hide();
  288. document.documentElement.style.overflow='auto';
  289. }
  290. //点击确定
  291. $('.sure-btn')[0].addEventListener('click',handleClose,false);
  292. //点击规则
  293. $('.rule')[0].addEventListener('click',() => {
  294. operate('sf_2022_h5_活动规则');
  295. $('.rule-dialog').animate({top: '2.24rem'},"fast");
  296. $('.rule-mask').show();
  297. document.documentElement.style.overflow='hidden';
  298. },false);
  299. //点击规则关闭按钮
  300. $('.rule-close')[0].addEventListener('click',() => {
  301. $('.rule-dialog').animate({top: '-10.96rem'},"fast");
  302. $('.rule-mask').hide();
  303. document.documentElement.style.overflow='auto';
  304. },false);
  305. //点击奖励一览
  306. $('.award')[0].addEventListener('click',() => {
  307. operate('sf_2022_h5_奖励一览');
  308. if(activityState === 0){
  309. stopManyClick(() =>{
  310. toastr.error('该活动暂未开启,请稍安勿躁');
  311. })
  312. }else if(activityState === 2 && luckDraw === 0){
  313. stopManyClick(() =>{
  314. toastr.error('活动已结束,期待下次的见面');
  315. })
  316. }else{
  317. $('.award-dialog').animate({top: '2.24rem'},"fast");
  318. $('.award-mask').show();
  319. document.documentElement.style.overflow='hidden';
  320. }
  321. },false);
  322. //点击奖励一览关闭按钮
  323. $('.award-close')[0].addEventListener('click',() => {
  324. $('.award-dialog').animate({top: '-10.96rem'},"fast");
  325. $('.award-mask').hide();
  326. document.documentElement.style.overflow='auto';
  327. },false);
  328. //点击领取按钮
  329. $('.tab-wrap')[0].addEventListener('click',(e) => {
  330. if(e.target.className === 'tab-wrap'){
  331. return
  332. }
  333. receive = e.target.dataset.index;
  334. if(receive == 1){
  335. $('.award-change-btn')[0].className = 'award-change-btn'
  336. }else{
  337. $('.award-change-btn')[1].className = 'award-change-btn'
  338. }
  339. $('.data-list').eq(0).text('');
  340. pageNum = 1;
  341. pages = 0;
  342. recordFlag = true;
  343. getAward();
  344. $('.award-change-btn')[receive].className = 'award-change-btn active'
  345. },false);
  346. //点击抽奖
  347. $('.once')[0].addEventListener('click',() => {
  348. if(!animationFlag) return;
  349. operate('sf_2022_h5_抽奖1次');
  350. if(activityState === 0){
  351. stopManyClick(() =>{
  352. toastr.error('该活动暂未开启,请稍安勿躁');
  353. })
  354. }else if(activityState === 2 && luckDraw === 0){
  355. stopManyClick(() =>{
  356. toastr.error('活动已结束,期待下次的见面');
  357. })
  358. }else{
  359. handleAward(1)
  360. }
  361. },false);
  362. $('.five-times')[0].addEventListener('click',() => {
  363. if(!animationFlag) return;
  364. operate('sf_2022_h5_抽奖5次');
  365. if(activityState === 0){
  366. stopManyClick(() =>{
  367. toastr.error('该活动暂未开启,请稍安勿躁');
  368. })
  369. }else if(activityState === 2 && luckDraw === 0){
  370. stopManyClick(() =>{
  371. toastr.error('活动已结束,期待下次的见面');
  372. })
  373. }else{
  374. handleAward(5)
  375. }
  376. },false);
  377. //点击再抽
  378. $('.left-btn')[0].addEventListener('click',() => {
  379. if(!animationFlag) return;
  380. let val = $('.report-times').eq(0).text();
  381. let pams = `sf_2022_h5_抽奖${val}次`;
  382. operate(pams);
  383. handleAward(val,'report')
  384. },false);
  385. function handleAward(times,type) {
  386. animationFlag = false;
  387. if(surplus === 0 || (times == 5 && surplus < 5)){
  388. $('.have-times-wrap').eq(0).css('display', 'none');
  389. $('.no-times-wrap').eq(0).css('display', 'block');
  390. $('.award-result-dialog').animate({top: '1.86rem'},"fast");
  391. $('.award-result-mask').show();
  392. document.documentElement.style.overflow='hidden';
  393. return
  394. }
  395. $.ajax({
  396. url: baseUrl + '/api/user/v1/activity/obtainRewards',
  397. type: 'post',
  398. headers: {
  399. 'Authorization': id //id
  400. },
  401. data:JSON.stringify({
  402. frequency: times
  403. }),
  404. contentType: "application/json",
  405. dataType: 'json',
  406. cache: false,
  407. success: function (res) {
  408. if(res.status === 0){
  409. $('.have-times-wrap').eq(0).css('display', 'block');
  410. $('.no-times-wrap').eq(0).css('display', 'none');
  411. if(type !== 'report'){
  412. $('.award-result-dialog').animate({top: '1.86rem'},"fast");
  413. $('.award-result-mask').show();
  414. document.documentElement.style.overflow='hidden';
  415. }
  416. $('.award-result-wrap').eq(0).text('');
  417. let str = '',
  418. cardObj = {
  419. '天': 'day',
  420. '周': 'week',
  421. '月': 'mouth',
  422. '季': 'season',
  423. '年': 'year'
  424. },
  425. imgNumber = 0,
  426. list = res.data.list;
  427. if(list.length === 1){
  428. $('.award-result-wrap')[0].className = 'card-wrap award-result-wrap one-result';
  429. str = `<div class="card-item">
  430. <img class="one-card" src="../static/img/springFestivalActivity/${cardObj[list[0].duration]}.png" />
  431. <div class="card-text">星曜${list[0].duration}卡</div>
  432. </div> `
  433. setTimeout(() => {
  434. animationFlag = true;
  435. },1000);
  436. }else{
  437. $('.award-result-wrap')[0].className = 'card-wrap award-result-wrap many-card-wrap'
  438. for (let i = 0; i < list.length; i++) {
  439. str += `<div class="card-item many-card-item">
  440. <img class="card many-card" src="../static/img/springFestivalActivity/${cardObj[list[i].duration]}.png" />
  441. <div class="card-text">星曜${list[i].duration}卡</div>
  442. </div>`
  443. }
  444. var imgTimer2 = setInterval(() => {
  445. $('.many-card-item').eq(imgNumber).css('display', 'block');
  446. if(imgNumber >= 4){
  447. clearInterval(imgTimer2);
  448. animationFlag = true;
  449. }
  450. // <img class="light" src="../static/img/springFestivalActivity/light.gif?time=${new Date().getTime()}" />
  451. // <img class="many-light" src="../static/img/springFestivalActivity/light.gif?time=${new Date().getTime()}" />
  452. // $('.many-light')[imgNumber].src = `../static/img/springFestivalActivity/light.gif?time=${new Date().getTime()}`;
  453. imgNumber++;
  454. },400)
  455. }
  456. $('.report-times').eq(0).text(times);
  457. if(parseInt(notReceive) > 0){
  458. $('.join-result-tip').eq(0).css('opacity', '0');
  459. $('.many-card-wrap').eq(0).css('marginTop', '0');
  460. }
  461. let text = parseInt(notReceive) > 0?'确定':'查看';
  462. $('.look-btn').eq(0).text(text);
  463. $('.award-result-wrap').eq(0).append(str);
  464. init();
  465. getPhoneNumber();
  466. }else{
  467. stopManyClick(() =>{
  468. toastr.error(res.msg)
  469. })
  470. }
  471. },
  472. })
  473. }
  474. //点击抽奖关闭按钮
  475. $('.award-result-close')[0].addEventListener('click',() => {
  476. animationFlag = true;
  477. $('.award-result-dialog').animate({top: '-10.96rem'},"fast");
  478. $('.award-result-mask').hide();
  479. document.documentElement.style.overflow='auto';
  480. },false);
  481. //点击分享按钮
  482. $('.share-wrap')[0].addEventListener('click',() => {
  483. operate('sf_2022_h5_分享按钮');
  484. if(activityState === 0){
  485. stopManyClick(() =>{
  486. toastr.error('该活动暂未开启,请稍安勿躁');
  487. })
  488. return
  489. }
  490. $.ajax({
  491. url: baseUrl + '/api/public/v4/actFissionAward/getActDetail',
  492. type: 'get',
  493. headers: {
  494. 'Authorization': id //id
  495. },
  496. contentType: "application/json",
  497. dataType: 'json',
  498. cache: false,
  499. success: (res) => {
  500. if (res.status === 0) {
  501. init();
  502. var shareInfo = res.data;
  503. if (isMiniprogram) { // 小程序
  504. copyUrl(shareInfo.gotoUrl);
  505. } else if (isAndroid) {
  506. window.native.share(shareInfo.title, shareInfo.content, shareInfo.gotoUrl, shareInfo.shareImg);
  507. } else if (isiOS) {
  508. window.webkit.messageHandlers.share.postMessage({
  509. title: shareInfo.title,
  510. content: shareInfo.content,
  511. gotoUrl: shareInfo.gotoUrl,
  512. shareImg: shareInfo.shareImg
  513. });
  514. }
  515. } else {
  516. stopManyClick(() =>{
  517. toastr.error(res.msg)
  518. })
  519. }
  520. },
  521. })
  522. $.ajax({
  523. url: baseUrl + '/api/user/v1/activity/addBuff',
  524. type: 'get',
  525. headers: {
  526. 'Authorization': id //id
  527. },
  528. contentType: "application/json",
  529. dataType: 'json',
  530. cache: false,
  531. success: function (res) {
  532. console.log(res)
  533. },
  534. })
  535. },false);
  536. //点击购买星曜获取云机按钮
  537. $('.no-times-btn')[0].addEventListener('click',() => {
  538. if(activityState === 2){
  539. stopManyClick(() =>{
  540. toastr.error('活动已结束,期待下次的见面');
  541. })
  542. return
  543. }
  544. if (isMiniprogram) { // 小程序
  545. if(phoneRemainQuantity > 0){
  546. wx.miniProgram.navigateTo({
  547. url: '/packageA/order/buy/index?type=activity'
  548. })
  549. } else {
  550. wx.miniProgram.navigateTo({
  551. url: '/packageA/order/renew/index?type=activity'
  552. })
  553. }
  554. } else if (isAndroid) { // 安卓
  555. if(phoneRemainQuantity > 0){
  556. window.native.startPurchase(1, 365);
  557. } else {
  558. window.native.startRenew();
  559. }
  560. } else if (isiOS) {
  561. if(phoneRemainQuantity > 0){
  562. window.webkit.messageHandlers.startPurchase.postMessage({ type: 1, day: 365 });
  563. } else {
  564. window.webkit.messageHandlers.startRenew.postMessage({ type: 1, day: 365 });
  565. }
  566. }
  567. },false);
  568. //点击获取次数
  569. $('.get-times')[0].addEventListener('click',() => {
  570. operate('sf_2022_h5_获取次数按钮');
  571. if(activityState === 1){
  572. stopManyClick(() =>{
  573. if (isMiniprogram) { // 小程序
  574. if(phoneRemainQuantity > 0){
  575. wx.miniProgram.navigateTo({
  576. url: '/packageA/order/buy/index?type=activity'
  577. })
  578. } else {
  579. wx.miniProgram.navigateTo({
  580. url: '/packageA/order/renew/index?type=activity'
  581. })
  582. }
  583. } else if (isAndroid) { // 安卓
  584. if(phoneRemainQuantity > 0){
  585. window.native.startPurchase(1, 365);
  586. } else {
  587. window.native.startRenew();
  588. }
  589. } else if (isiOS) {
  590. if(phoneRemainQuantity > 0){
  591. window.webkit.messageHandlers.startPurchase.postMessage({ type: 1, day: 365 });
  592. } else {
  593. window.webkit.messageHandlers.startRenew.postMessage({ type: 1, day: 365 });
  594. }
  595. }
  596. })
  597. }else if(activityState === 0) {
  598. stopManyClick(() =>{
  599. toastr.error('该活动暂未开启,请稍安勿躁');
  600. })
  601. } else {
  602. stopManyClick(() =>{
  603. toastr.error('活动已结束,期待下次的见面');
  604. })
  605. }
  606. },false);
  607. // 点击查看
  608. $('.look-btn')[0].addEventListener('click',() => {
  609. if(parseInt(notReceive) > 0){
  610. $('.distribution-dialog').animate({top: '5.24rem'},"fast");
  611. $('.distribution-mask').show();
  612. document.documentElement.style.overflow='hidden';
  613. return
  614. }
  615. if (isMiniprogram) { // 小程序
  616. wx.miniProgram.switchTab({
  617. url: '/pages/home/home'
  618. })
  619. } else if (isAndroid) { // 安卓
  620. window.native.startMain();
  621. } else if (isiOS) {
  622. window.webkit.messageHandlers.startMain.postMessage({ type: 2});
  623. }
  624. },false);
  625. //点击分配奖励按钮
  626. $('.distribution-btn')[0].addEventListener('click',() => {
  627. $('.award-result-dialog').animate({top: '-10.96rem'},"fast");
  628. $('.award-result-mask').hide();
  629. $('.distribution-dialog').animate({top: '-10.96rem'},"fast");
  630. $('.distribution-mask').hide();
  631. $('.dialog').animate({top: '2.24rem'},"fast");
  632. $('.award-record-mask').show();
  633. document.documentElement.style.overflow='hidden';
  634. $('.award-change-btn')[1].className = 'award-change-btn'
  635. $('.award-change-btn')[0].className = 'award-change-btn active'
  636. receive = 0;
  637. pageNum = 1;
  638. pages = 0;
  639. recordFlag = true;
  640. $('.data-list').eq(0).text('');
  641. getAward()
  642. },false);
  643. //点击使用按钮
  644. $('.data-list')[0].addEventListener('click',(e) => {
  645. if (e.target.className === 'record-operate operate-btn') {
  646. let awardId = parseInt(e.target.dataset.awardid);
  647. let awardName = e.target.dataset.awardname;
  648. if (isMiniprogram) { // 小程序
  649. wx.miniProgram.navigateTo({
  650. url: `/packageA/activityCloudPhone/index?id=${awardId.toString()}&awardName=${awardName}`
  651. })
  652. } else if (isAndroid) { // 安卓
  653. window.native.activatePhone(2, awardId, awardName);
  654. } else if (isiOS) {
  655. window.webkit.messageHandlers.activatePhone.postMessage({ type: 2, awardId: awardId, awardName: awardName });
  656. }
  657. }
  658. },false);
  659. //获取抽奖记录
  660. function getAward(){
  661. operate('sf_2022_h5_已获取奖励按钮');
  662. $.ajax({
  663. url: baseUrl + '/api/user/v1/activity/platformGetRewardsH5',
  664. type: 'post',
  665. headers: {
  666. 'Authorization': id //id
  667. },
  668. data:JSON.stringify({
  669. pageNum: pageNum,
  670. pageSize: 10,
  671. receive: receive
  672. }),
  673. contentType: "application/json",
  674. dataType: 'json',
  675. cache: false,
  676. success: function (res) {
  677. if(res.status === 0){
  678. recordFlag = true;
  679. let str = '',
  680. records = res.data.records;
  681. pages = res.data.pages;
  682. if(records.length === 0){
  683. $('.title-row').eq(0).css('display', 'none');
  684. if(receive == 1 && parseInt(notReceive) > 0){
  685. str = '<div class="no-award">暂无已分配云手机</div>'
  686. }else{
  687. str = '<div class="no-award">没有抽奖记录,我都替你着急</div>'
  688. }
  689. }else{
  690. $('.title-row').eq(0).css('display', 'flex');
  691. }
  692. for (var i = 0; i < records.length; i++) {
  693. str += `<div class="data-row">
  694. <div class="award-card">星曜${records[i].effectiveTimeStr}卡</div>
  695. <div class="record-time">${records[i].createTime.substring(5,7)}月${records[i].createTime.substring(8,10)}日${records[i].createTime.substr(11)}</div>
  696. <div class="${records[i].receive === 1?'record-operate':'record-operate operate-btn'}"
  697. data-awardId="${records[i].id}" data-awardName="星曜${records[i].effectiveTimeStr}卡">
  698. ${records[i].receive === 1?'已使用':'领取'}</div>
  699. </div>`
  700. }
  701. $('.data-list').eq(0).append(str)
  702. }else{
  703. stopManyClick(() =>{
  704. toastr.error(res.msg)
  705. })
  706. }
  707. },
  708. })
  709. }
  710. function getPhoneNumber(){
  711. $.ajax({
  712. url: baseUrl + '/api/user/v2/meal/info?phoneType=SVIP',
  713. type: 'get',
  714. headers: {
  715. 'Authorization': id //id
  716. },
  717. contentType: "application/json",
  718. dataType: 'json',
  719. cache: false,
  720. success: function (res) {
  721. if(res.status === 0){
  722. phoneRemainQuantity = res.data.list[0].phoneRemainQuantity;
  723. }else{
  724. stopManyClick(() =>{
  725. toastr.error(res.msg)
  726. })
  727. }
  728. },
  729. })
  730. }
  731. //抽奖记录数据下拉加载
  732. $('.data-list')[0].addEventListener('scroll',function () {
  733. let scrollTop = $('.data-list')[0].scrollTop;
  734. let clientHeight = $('.data-list')[0].clientHeight;
  735. let scrollHeight = $('.data-list')[0].scrollHeight;
  736. if(scrollTop + clientHeight + 100 > scrollHeight){
  737. if(recordFlag && pageNum < pages && pages > 1){
  738. recordFlag = false;
  739. pageNum++;
  740. getAward();
  741. }
  742. }
  743. });
  744. //复制
  745. function copyUrl(url) {
  746. stopManyClick(() => {
  747. var oInput = document.createElement('input'); //创建一个input
  748. oInput.setAttribute("readonly", "readonly");//设置只读,否则移动端使用复制功能时可能会造成软件盘弹出
  749. oInput.value = url;
  750. document.body.appendChild(oInput);//将input插入到body
  751. // oInput.select(); // 选择对象 ios不支持
  752. selectText(oInput, 0, oInput.value.length);
  753. document.execCommand("Copy"); // 执行浏览器复制命令
  754. toastr.error('复制分享链接成功!');
  755. oInput.style.display = 'none'; // 将input隐藏
  756. oInput.blur();
  757. oInput.remove(); // 将input销毁
  758. })
  759. }
  760. // input自带的select()方法在苹果端无法进行选择,所以需要自己去写一个类似的方法
  761. // 选择文本。createTextRange(setSelectionRange)是input方法
  762. function selectText(textbox, startIndex, stopIndex) {
  763. if (textbox.createTextRange) {//ie
  764. const range = textbox.createTextRange();
  765. range.collapse(true);
  766. range.moveStart('character', startIndex);//起始光标
  767. range.moveEnd('character', stopIndex - startIndex);//结束光标
  768. range.select();//不兼容苹果
  769. } else {//firefox/chrome
  770. textbox.setSelectionRange(startIndex, stopIndex);
  771. textbox.focus();
  772. }
  773. }
  774. //埋点
  775. function operate(pointName){
  776. $.ajax({
  777. url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
  778. type: 'post',
  779. data:JSON.stringify({
  780. pointName: pointName
  781. }),
  782. contentType:"application/json",
  783. dataType: 'json',
  784. cache: false,
  785. success: function (res) {
  786. console.log(res)
  787. },
  788. })
  789. }
  790. //防止提示一秒内重复显示
  791. function stopManyClick(fn) {
  792. if (flag) {
  793. fn();
  794. }
  795. flag = false;
  796. if(timer){clearTimeout(timer);}
  797. timer = setTimeout(() => {flag = true}, 1500);
  798. }
  799. </script>
  800. </body>
  801. </html>