anniversaryCelebrate.html 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647
  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/anniversaryCelebrate.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="container">
  16. <div class="rule-wrap">
  17. <img class="rule" src="../static/img/anniversaryCelebrate/rule.png" />
  18. </div>
  19. <div class="activity-text-wrap">
  20. <img class="activity-text" src="../static/img/anniversaryCelebrate/activity-text.png" />
  21. </div>
  22. <div class="activity-tips-wrap">
  23. <img class="activity-tips" src="../static/img/anniversaryCelebrate/activity-tips.png" />
  24. </div>
  25. <div class="star-wrap">
  26. <img class="star" src="../static/img/anniversaryCelebrate/star.png" />
  27. <img class="light-show" src="../static/img/anniversaryCelebrate/light-show.gif" />
  28. <img class="award-success" src="../static/img/anniversaryCelebrate/award-success.png" />
  29. <div class="point-wrap"></div>
  30. </div>
  31. <div class="station-wrap">
  32. <img class="station" src="../static/img/anniversaryCelebrate/station.png" />
  33. <div class="station-text-wrap">
  34. <div class="once-text">购买/续费星曜月卡,获得 1次 点亮资格</div>
  35. <div class="ten-text">购买/续费星曜年卡,获得 10次 点亮资格</div>
  36. </div>
  37. <div class="btn-list">
  38. <img class="once-btn btn" src="../static/img/anniversaryCelebrate/once.png" />
  39. <img class="five-btn btn" src="../static/img/anniversaryCelebrate/fifce.png" />
  40. </div>
  41. </div>
  42. <div class="award-get-wrap">
  43. <div class="number-wrap">
  44. <div class="rest-times">剩余次数<span class="rest-number"></span>次</div>
  45. <div class="process-wrap">
  46. <div class="small-star-wrap">
  47. <img class="small-star" src="../static/img/anniversaryCelebrate/small-star.png" />
  48. </div>
  49. <div class="line-wrap">
  50. <img class="icon icon1" src="../static/img/anniversaryCelebrate/icon1.png" />
  51. <img class="icon icon2" src="../static/img/anniversaryCelebrate/icon3.png" />
  52. </div>
  53. </div>
  54. </div>
  55. <img class="get-times" src="../static/img/anniversaryCelebrate/get-times.png" />
  56. </div>
  57. <div class="no-join-activity">激活码、优惠券、星币购买的订单不参与本次活动</div>
  58. <div class="light-record-wrap">
  59. <div class="record-title-wrap">
  60. <img class="record-title" src="../static/img/anniversaryCelebrate/record-title.png" />
  61. </div>
  62. <div class="record-main-wrap">
  63. <div class="change-wrap">
  64. <div class="get-award-wrap">
  65. <img class="award-img" src="../static/img/anniversaryCelebrate/left-bg.png" />
  66. <img class="get-award-img" src="../static/img/anniversaryCelebrate/get-award-show.png" />
  67. <div class="get-award-text">领取</div>
  68. </div>
  69. <div class="get-award-wrap">
  70. <img class="award-img right-bg" src="../static/img/anniversaryCelebrate/right-bg.png" />
  71. <img class="get-award-img" src="../static/img/anniversaryCelebrate/get-award-success-hidden.png" />
  72. <div class="get-award-text used-text">已使用</div>
  73. </div>
  74. </div>
  75. <div class="light-title-wrap">
  76. <div class="light-title-text award-text">奖品</div>
  77. <div class="light-title-text light-title-time">时间</div>
  78. <div class="light-title-text active-text">操作</div>
  79. </div>
  80. <div class="light-content-container">
  81. <div class="light-content-list"></div>
  82. <div class="all-light">已全部点亮<text class="light-number"></text>次</div>
  83. </div>
  84. </div>
  85. <div class="activity-intrduction-wrap">
  86. <div>活动时间:2022年6月10日-2022年6月19日</div>
  87. <div>活动参与套餐:星曜套餐月卡年卡(自动续费除外)</div>
  88. </div>
  89. <div class="law-statement">请阅读相关《法律声明》文件</div>
  90. </div>
  91. <div class="award-result-mask">
  92. <div class="award-result-dialog-sure">
  93. <div class="have-times-wrap">
  94. <div class="award-result-tip"></div>
  95. <div class="line"></div>
  96. <div class="card-wrap award-result-wrap"></div>
  97. <div class="btn-row">
  98. <img class="award-btn continue-lighten" src="../static/img/anniversaryCelebrate/continue-lighten.png" />
  99. <img class="award-btn distribution-award" src="../static/img/anniversaryCelebrate/sure-btn.png" />
  100. </div>
  101. <div class="times-text">还剩次数:<span class="times-text-number"></span>次</div>
  102. </div>
  103. <img class="award-result-close" src="../static/img/anniversaryCelebrate/close.png" />
  104. </div>
  105. </div>
  106. <div class="rule-mask">
  107. <div class="rule-result-dialog">
  108. <div class="rule-content">
  109. <div class="rule-point">1、本次活动参与活动的套餐是星曜月卡、年卡套餐,其他套餐不参与活动,现金购买及续费皆可参与活动</div>
  110. <div class="rule-point">2、激活码、优惠券、星币购买的订单不参与本次活动</div>
  111. <div class="rule-point">3、本次活动购买限时折扣次数不限,获得赠送天数,可分配在购买套餐的云机账户上,单账号购买新增云机总数上限为200台</div>
  112. <div class="rule-point">4、本次活动赠送星曜机型,单次点亮赠送天数1~30天随机,外环全部点亮额外获得88天,内环全部点亮额外赠送188天,10次可全部点亮</div>
  113. <div class="rule-point">5、已点亮位置单次不会重复点亮,活动奖励即时领取,单次活动全部点亮后重置点亮进度,可再次进行点亮活动。</div>
  114. <div class="rule-point">6、运营平台有权对用户购买数据进行审核,如发现活动订单中存在异常情况(包括任何形式的用户作弊行为),有权取消优惠,退款处理。</div>
  115. </div>
  116. <img class="rule-close" src="../static/img/anniversaryCelebrate/close.png" />
  117. </div>
  118. </div>
  119. <div class="law-mask">
  120. <div class="law-result-dialog">
  121. <div class="rule-content law-content">
  122. <div class="rule-point">
  123. 法律声明:
  124. </div>
  125. <div class="rule-point">
  126. 1.同一用户是指使用同一帐号、同一手机号、同一设备或同一提现账户的用户。上述与用户身
  127. 份相关的信息,其中任意一项或数项相同,或通过特定标记形成关联,或活动平台有合理理由认
  128. 为存在关联的,都视为同一个用户。部分参与方式中,对用户帐号有限制,同一个设备最多可使
  129. 用一个帐号参与活动,同一帐号最多可以使用一台设备参与活动;用户使用多个帐号在同一个设
  130. 备上登录的,视为同一用户,仅有一个帐号可参与本活动。
  131. </div>
  132. <div class="rule-point">
  133. 2.用户不得采取任何不正当或作弊的违规手段参与本活动,一经发现,活动平台有权限制或取
  134. 消用户参与活动的资格,有权取消奖励、追讨用户已领取的奖励(或同等价值的现金)。活动平
  135. 台有权对违规用户采取限制登录、封禁帐号、限制提现的措施,并保留追究用户其他法律责任的
  136. 权利。违规手段包括但不仅限于:
  137. </div>
  138. <div class="rule-point">2.1通过不正当手段参与活动。例如使用模拟器、插件、软件外挂、物理外挂等违规工具参与活动,与其他用户串通采取不正当手段谋取活动奖励等;</div>
  139. <div class="rule-point">2.2扰乱本活动秩序。例如使用多个帐号参与活动,修改个人位置信息,篡改设备数据,买卖用户帐号,买卖活动权益,买卖领奖资格等;</div>
  140. <div class="rule-point">2.3干扰活动平台正常运营。例如批量注册用户帐号,违规使用用户帐号,采用技术手段对活动平台进行干扰、破坏、修改或施加其他影响;</div>
  141. <div class="rule-point">2.4利用本活动进行违法犯罪。例如利用本活动洗钱、套现、诈骗,或开展其他违反国家法律法规的活动;</div>
  142. <div class="rule-point">2.5其他违反法律法规,违背诚实信用原则,违反活动规则,或活动平台认为的不正当手段。</div>
  143. <div class="rule-point">
  144. 3.如因以下原因导致活动不能正常举办、用户无法参与或参与失败、活动奖励发放错误等,活
  145. 动平台/本活动有权暂停或取消活动,且不承担任何法律责任或不利后果:
  146. </div>
  147. <div class="rule-point">3.1不可抗力,包括但不仅限于自然灾害,有权机关的政策要求,政府机关指令,重大疫情影响等不能预见、不可避免、不能克服的情况;</div>
  148. <div class="rule-point">3.2活动平台发生技术故障,本活动受到不正当技术手段干扰、破坏、篡改或被施加其他影响,第三方平台限制活动平台或本活动,或其他导致本活动的正常秩序受到干扰的情况;</div>
  149. <div class="rule-point">3.3用户所在地区网络故障、支付平台故障、电信运营商故障等非活动平台所能控制的情况。</div>
  150. <div class="rule-point">
  151. 4.活动平台不支持用户通过众包或类似方式参与活动。如用户因此遭受经济损失的,活动平台
  152. 不承担任何赔偿或补偿责任。
  153. </div>
  154. <div class="rule-point">
  155. 5.商品展示的划线价格为参考价,该价格可能是品牌专柜标价、商品吊牌价或品牌供应商提供
  156. 的指导价、建议零售价或该商品在电商平台及/或其他渠道曾展示过的销售价,并非原价;由于
  157. 地区等差异性和市场行情波动,品牌专柜标价、商品吊牌价等可能会与电商平台展示的不一致,
  158. 该价格仅供用户参考。
  159. </div>
  160. <div class="rule-point">
  161. 6.若由于用户自身原因(包括但不限于参与方式不符合活动规则、未按活动规则要求提供收件
  162. 地址、操作不当造成产品功能故障等)导致无法实际享有奖励的,视为用户自愿放弃奖励,活动
  163. 平台将不会也无义务给予任何形式的补偿。
  164. </div>
  165. <div class="rule-point">
  166. 7.任何第三方以活动平台名义从事欺诈行为造成用户损失的,活动平台无需为此承担法律责任。
  167. </div>
  168. <div class="rule-point">
  169. 8.活动平台和电商平台的《用户协议》《隐私政策》(以手机客户端对应名称为准)及其他规
  170. 范同样适用于本活动,本活动规则与活动平台和电商平台《用户协议》《隐私政策》及其他规范
  171. 相冲突的,以本活动规则为准。本活动规则未约定的内容,以活动平台和电商平台的《用户协议》
  172. 《隐私政策》及其他平台规范为准。
  173. </div>
  174. <div class="rule-point">
  175. 9.在法律法规允许的范围内,活动平台有权对本活动规则进行变动或调整,相关变动或调整将
  176. 公布在活动规则页面上,并于公布时即时生效,用户继续参与活动则视为同意并接受变动或者调
  177. 整后的活动规则。如果用户拒绝活动规则的变更或者调整,请放弃参与变更后的活动。
  178. </div>
  179. </div>
  180. <img class="law-close" src="../static/img/anniversaryCelebrate/close.png" />
  181. </div>
  182. </div>
  183. <div class="no-start-mask">
  184. <div class="no-start-dialog"></div>
  185. </div>
  186. </div>
  187. <script>
  188. toastr.options.positionClass = 'toast-center-center';
  189. toastr.options.timeOut = '1500';
  190. </script>
  191. <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
  192. <script type="text/javascript">
  193. // var baseUrl = 'http://192.168.31.198'
  194. let timer,flag = true;
  195. var url = window.location.href;
  196. url = url.split('/')
  197. var loc = window.location.search,
  198. n1 = loc.length,//地址的总长度
  199. n2 = loc.indexOf("="),//取得=号的位置
  200. id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
  201. u = navigator.userAgent,
  202. ua = navigator.userAgent.toLowerCase(),
  203. isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
  204. isMiniprogram = false,
  205. anniversarySwitch = 0,
  206. animationFlag = true,
  207. residueDegree = 0,
  208. awardTimes = 0,
  209. pageNum = 1,
  210. pages = 1,
  211. receive = 0,
  212. lighten = [],
  213. notReceive = true,
  214. phoneRemainQuantity = 0,
  215. isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
  216. // 初始化数据
  217. window.onload = function(){
  218. if (isAndroid && window.native) {
  219. window.native.enableSharePage(
  220. '您的好友送你一台免费云机',
  221. '您的好友送你一台免费云机',
  222. `${baseUrl}/h5/microserviceUserH5/vcloud/anniversaryCelebrate.html`,
  223. 'https://test.androidscloud.com/file-center/fileOperate/getImage?id=215553'
  224. );
  225. }
  226. }
  227. init();
  228. function init() {
  229. $.ajax({
  230. url: baseUrl + '/api/activity/v1/anniversary/getAnniversary',
  231. type: 'get',
  232. headers: {
  233. 'Authorization': id //id
  234. },
  235. contentType: "application/json",
  236. dataType: 'json',
  237. cache: false,
  238. success: function (res) {
  239. if(res.status === 0){
  240. residueDegree = res.data.residueDegree;
  241. anniversarySwitch = res.data.anniversarySwitch;
  242. result = res.data.lighten;
  243. lighten = result.split(','), str = '';
  244. $('.rest-number').eq(0).text(residueDegree);
  245. $('.light-number').eq(0).text(res.data.allTotal);
  246. if(anniversarySwitch !== 0){
  247. let awardText = anniversarySwitch == 1 ? '<div>活动暂未开启</div>请稍安勿躁' : '<div>活动已结束</div>期待下次的见面'
  248. $('.no-start-dialog').eq(0).append(awardText);
  249. $('.no-start-dialog').animate({top: '50%'},"fast");
  250. $('.no-start-mask').show();
  251. document.documentElement.style.overflow='hidden';
  252. }
  253. if(result == ''){
  254. return
  255. }
  256. //更新点亮星星
  257. $('.point-wrap').eq(0).empty();
  258. for (let i = 0; i < lighten.length; i++) {
  259. if([1, 3, 5, 7, 12].includes(lighten[i])){
  260. str += `<img class="in-point point${lighten[i]}" src="../static/img/anniversaryCelebrate/out-point.png" />`
  261. } else {
  262. str += `<img class="out-point point${lighten[i]}" src="../static/img/anniversaryCelebrate/out-point.png" />`
  263. }
  264. }
  265. $('.point-wrap').eq(0).append(str);
  266. }else{
  267. stopManyClick(() =>{
  268. toastr.error(res.msg)
  269. })
  270. }
  271. },
  272. })
  273. };
  274. getAward();
  275. //点击抽奖
  276. $('.once-btn')[0].addEventListener('click',() => {
  277. if(!animationFlag) return;
  278. $('.continue-lighten')[0].src = '../static/img/anniversaryCelebrate/continue-lighten.png';
  279. if(lighten.length == 9){
  280. $('.point-wrap').eq(0).empty();
  281. $('.light-show').show();
  282. setTimeout(() => {
  283. $('.light-show').hide();
  284. $('.award-success').show();
  285. },800)
  286. }
  287. handleAward(1);
  288. operate('sf_2022_h5_抽奖1次');
  289. },false);
  290. $('.five-btn')[0].addEventListener('click',() => {
  291. if(!animationFlag) return;
  292. $('.continue-lighten')[0].src = '../static/img/anniversaryCelebrate/five-click.png';
  293. if(lighten.length + 5 >= 10){
  294. $('.point-wrap').eq(0).empty();
  295. $('.light-show').show();
  296. setTimeout(() => {
  297. $('.light-show').hide();
  298. $('.award-success').show();
  299. },800)
  300. }
  301. handleAward(5);
  302. operate('znq_2022_h5_抽奖5次');
  303. },false);
  304. //点击再抽
  305. $('.continue-lighten')[0].addEventListener('click',() => {
  306. if(!animationFlag) return;
  307. let pams = `sf_2022_h5_抽奖${awardTimes}次`;
  308. operate(pams);
  309. handleAward(awardTimes,'report')
  310. },false);
  311. function handleAward(times,type) {
  312. awardTimes = times;
  313. animationFlag = false;
  314. $.ajax({
  315. url: baseUrl + '/api/activity/v1/anniversary/luckDraw',
  316. type: 'post',
  317. headers: {
  318. 'Authorization': id //id
  319. },
  320. data:JSON.stringify({
  321. frequency: times
  322. }),
  323. contentType: "application/json",
  324. dataType: 'json',
  325. cache: false,
  326. success: function (res) {
  327. if(res.status === 0){
  328. let imgNumber = 0,
  329. str = '',
  330. otherData = [],
  331. list = res.data.anniversaryAwards;
  332. // 188 88放在最后
  333. list.map(item => {
  334. if(item.awardType != 0){
  335. otherData.push(item)
  336. }
  337. });
  338. if(otherData.length > 0) {
  339. $('.line').show();
  340. } else {
  341. $('.line').hide();
  342. }
  343. let currData = list.filter(item => item.awardType == 0);
  344. list = [...currData, ...otherData];
  345. if(type !== 'report'){
  346. $('.award-result-dialog-sure').animate({top: '1.86rem'},"fast");
  347. $('.award-result-mask').show();
  348. document.documentElement.style.overflow='hidden';
  349. }
  350. if(lighten.length != 10){
  351. $('.award-success').hide();
  352. }
  353. $('.award-result-wrap').eq(0).text('');
  354. if(times === 1){
  355. $('.award-result-dialog-sure')[0].className = 'award-result-dialog-sure award-result-one-dialog';
  356. $('.award-result-tip').eq(0).text('换个姿势,再抽一次');
  357. $('.award-result-wrap')[0].className = 'card-wrap award-result-wrap one-result';
  358. for (let i = 0; i < list.length; i++) {
  359. if(list[i].awardType == 0){
  360. str += `<div class="card-item one-card-item">
  361. <img class="one-card" src="../static/img/anniversaryCelebrate/day-card.png" />
  362. <div class="card-text">星曜${list[0].awardDurations}天卡</div>
  363. </div>`
  364. } else {
  365. if(list[i].awardDurations == 88){
  366. str += `<div class="card-item many-one-card">
  367. <img class="many-card" src="../static/img/anniversaryCelebrate/first.png" />
  368. <div class="card-text">星曜${list[1].awardDurations}天卡</div>
  369. </div>`
  370. } else {
  371. str += `<div class="card-item many-two-card">
  372. <img class="many-card" src="../static/img/anniversaryCelebrate/second.png" />
  373. <div class="card-text">星曜${list[2].awardDurations}天卡</div>
  374. </div>`
  375. }
  376. }
  377. }
  378. setTimeout(() => {
  379. animationFlag = true;
  380. },1000);
  381. } else {
  382. $('.award-result-dialog-sure')[0].className = 'award-result-dialog-sure award-result-dialog';
  383. $('.award-result-tip').eq(0).text('善良的人,好运气最终是会眷顾你');
  384. $('.award-result-wrap')[0].className = 'card-wrap award-result-wrap many-card-wrap'
  385. for (let i = 0; i < list.length; i++) {
  386. if(list[i].awardType == 0){
  387. str += `<div class="card-item many-card-item">
  388. <img class="many-card" src="../static/img/anniversaryCelebrate/day-card.png" />
  389. <div class="card-text">星曜${list[i].awardDurations}天卡</div>
  390. </div>`
  391. } else {
  392. if(list[i].awardDurations == 88){
  393. str += `<div class="card-item many-card-item">
  394. <img class="many-card" src="../static/img/anniversaryCelebrate/first.png" />
  395. <div class="card-text">星曜${list[i].awardDurations}天卡</div>
  396. </div>`
  397. } else {
  398. str += `<div class="card-item many-card-item">
  399. <img class="many-card" src="../static/img/anniversaryCelebrate/second.png" />
  400. <div class="card-text">星曜${list[i].awardDurations}天卡</div>
  401. </div>`
  402. }
  403. }
  404. }
  405. var imgTimer2 = setInterval(() => {
  406. $('.many-card-item').eq(imgNumber).css('display', 'block');
  407. if(imgNumber >= 6){
  408. clearInterval(imgTimer2);
  409. animationFlag = true;
  410. }
  411. imgNumber++;
  412. },400)
  413. }
  414. $('.times-text-number').eq(0).text(residueDegree - 1);
  415. $('.award-result-wrap').eq(0).append(str);
  416. init();
  417. }else{
  418. stopManyClick(() =>{
  419. toastr.error(res.msg)
  420. })
  421. }
  422. },
  423. })
  424. }
  425. //点击抽奖关闭按钮
  426. $('.award-result-close')[0].addEventListener('click',() => {
  427. animationFlag = true;
  428. $('.award-result-dialog').animate({top: '-10.96rem'},"fast");
  429. $('.award-result-mask').hide();
  430. document.documentElement.style.overflow='auto';
  431. },false);
  432. // 点击领取tab切换
  433. $('.get-award-wrap')[0].addEventListener('click',(e) => {
  434. $('.light-content-list').eq(0).empty();
  435. pageNum = 1;
  436. pages = 0;
  437. receive = 0;
  438. recordFlag = true;
  439. getAward();
  440. $('.get-award-img')[0].src = '../static/img/anniversaryCelebrate/get-award-show.png';
  441. $('.get-award-img')[1].src = '../static/img/anniversaryCelebrate/get-award-success-hidden.png';
  442. $('.award-img').eq(1).css('display', 'none');
  443. $('.award-img').eq(0).css('display', 'block');
  444. $('.record-main-wrap')[0].className = 'record-main-wrap';
  445. $('.get-award-text')[1].className = 'get-award-text used-text';
  446. $('.get-award-text')[0].className = 'get-award-text';
  447. },false);
  448. $('.get-award-wrap')[1].addEventListener('click',(e) => {
  449. $('.light-content-list').eq(0).empty();
  450. pageNum = 1;
  451. pages = 0;
  452. receive = 1;
  453. recordFlag = true;
  454. getAward();
  455. $('.get-award-img')[0].src = '../static/img/anniversaryCelebrate/get-award-hidden.png';
  456. $('.get-award-img')[1].src = '../static/img/anniversaryCelebrate/get-award-success-show.png';
  457. $('.award-img').eq(0).css('display', 'none');
  458. $('.award-img').eq(1).css('display', 'block');
  459. $('.record-main-wrap')[0].className = 'record-main-wrap record-main-active-wrap';
  460. $('.get-award-text')[0].className = 'get-award-text used-text';
  461. $('.get-award-text')[1].className = 'get-award-text';
  462. },false);
  463. //获取抽奖记录
  464. function getAward(type){
  465. $.ajax({
  466. url: baseUrl + `/api/activity/v1/anniversary/rewardList?pageNum=${pageNum}&pageSize=10&receive=${receive}`,
  467. type: 'get',
  468. headers: {
  469. 'Authorization': id //id
  470. },
  471. contentType: "application/json",
  472. dataType: 'json',
  473. cache: false,
  474. success: function (res) {
  475. if(res.status === 0){
  476. recordFlag = true;
  477. let str = '',
  478. records = res.data.records;
  479. pages = res.data.pages;
  480. if(type != 'down'){
  481. $('.light-content-list').eq(0).empty();
  482. }
  483. if(records.length === 0){
  484. $('.title-row').eq(0).css('display', 'none');
  485. if(receive == 1 && parseInt(notReceive) > 0){
  486. str = '<div class="no-award">暂无已分配云手机</div>'
  487. }else{
  488. str = `<div class="no-award">没有${receive === 1 ? '已使用' : '领取'}记录,我都替你着急</div>`
  489. }
  490. }else{
  491. $('.title-row').eq(0).css('display', 'flex');
  492. }
  493. for (var i = 0; i < records.length; i++) {
  494. str += `<div class="light-content-wrap">
  495. <div class="light-content-text">获得星曜${records[i].awardDurations}天时长</div>
  496. <div class="light-content-time" >${records[i].createTime.substr(6)}</div>
  497. <div class="get-btn ${records[i].receive === 1 ? 'btn-active' : ''}" data-awardid=${records[i].id} data-day=${records[i].day}>领取</div>
  498. </div>`
  499. }
  500. $('.light-content-list').eq(0).append(str)
  501. }else{
  502. stopManyClick(() =>{
  503. toastr.error(res.msg)
  504. })
  505. }
  506. },
  507. })
  508. }
  509. //点击领取按钮
  510. $('.light-content-list')[0].addEventListener('click',(e) => {
  511. if (e.target.className === 'get-btn ') {
  512. let awardId = parseInt(e.target.dataset.awardid);
  513. let day = parseInt(e.target.dataset.day);
  514. if (isMiniprogram) { // 小程序
  515. wx.miniProgram.navigateTo({
  516. url: `/packageA/activityCloudPhone/index?id=${awardId.toString()}&day=${day}`
  517. })
  518. } else if (isAndroid) { // 安卓
  519. window.native.activatePhone(3, awardId, day);
  520. } else if (isiOS) {
  521. window.webkit.messageHandlers.activatePhone.postMessage({ type: 3, awardId: awardId, day: day });
  522. }
  523. }
  524. },false);
  525. //点击规则
  526. $('.rule-wrap')[0].addEventListener('click',(e) => {
  527. $('.rule-result-dialog').animate({top: '1.86rem'},"fast");
  528. $('.rule-mask').show();
  529. document.documentElement.style.overflow='hidden';
  530. },false);
  531. //关闭规则
  532. $('.rule-close')[0].addEventListener('click',() => {
  533. $('.rule-result-dialog').animate({top: '-10.96rem'},"fast");
  534. $('.rule-mask').hide();
  535. document.documentElement.style.overflow='auto';
  536. },false);
  537. //点击法律声明
  538. $('.law-statement')[0].addEventListener('click',(e) => {
  539. $('.law-result-dialog').animate({top: '1.86rem'},"fast");
  540. $('.law-mask').show();
  541. document.documentElement.style.overflow='hidden';
  542. },false);
  543. //关闭法律声明
  544. $('.law-close')[0].addEventListener('click',() => {
  545. $('.law-result-dialog').animate({top: '-10.96rem'},"fast");
  546. $('.law-mask').hide();
  547. document.documentElement.style.overflow='auto';
  548. },false);
  549. //点击获取次数
  550. $('.get-times')[0].addEventListener('click',() => {
  551. operate('znq_2022_h5_获取次数按钮');
  552. stopManyClick(() =>{
  553. if (isMiniprogram) { // 小程序
  554. if(phoneRemainQuantity > 0){
  555. wx.miniProgram.navigateTo({
  556. url: '/packageA/order/buy/index?type=activity'
  557. })
  558. } else {
  559. wx.miniProgram.navigateTo({
  560. url: '/packageA/order/renew/index?type=activity'
  561. })
  562. }
  563. } else if (isAndroid) { // 安卓
  564. if(phoneRemainQuantity > 0){
  565. window.native.startPurchase('SVIP', 365);
  566. } else {
  567. window.native.startRenew();
  568. }
  569. } else if (isiOS) {
  570. if(phoneRemainQuantity > 0){
  571. window.webkit.messageHandlers.startPurchase.postMessage({ type: 1, day: 365 });
  572. } else {
  573. window.webkit.messageHandlers.startRenew.postMessage({ type: 1, day: 365 });
  574. }
  575. }
  576. })
  577. },false);
  578. //抽奖记录数据下拉加载
  579. $('.light-content-list')[0].addEventListener('scroll',function () {
  580. let scrollTop = $('.light-content-list')[0].scrollTop;
  581. let clientHeight = $('.light-content-list')[0].clientHeight;
  582. let scrollHeight = $('.light-content-list')[0].scrollHeight;
  583. if(scrollTop + clientHeight + 100 > scrollHeight){
  584. if(recordFlag && pageNum < pages && pages > 1){
  585. recordFlag = false;
  586. pageNum++;
  587. getAward('down');
  588. }
  589. }
  590. });
  591. //获取云机数量
  592. getPhoneNumber();
  593. function getPhoneNumber(){
  594. $.ajax({
  595. url: baseUrl + '/api/pay/v2/meal/info?phoneType=SVIP',
  596. type: 'get',
  597. headers: {
  598. 'Authorization': id //id
  599. },
  600. contentType: "application/json",
  601. dataType: 'json',
  602. cache: false,
  603. success: function (res) {
  604. if(res.status === 0){
  605. phoneRemainQuantity = res.data.list[0].phoneRemainQuantity;
  606. }else{
  607. stopManyClick(() =>{
  608. toastr.error(res.msg)
  609. })
  610. }
  611. },
  612. })
  613. }
  614. //埋点
  615. function operate(pointName){
  616. $.ajax({
  617. url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
  618. type: 'post',
  619. data:JSON.stringify({
  620. pointName: pointName
  621. }),
  622. contentType:"application/json",
  623. dataType: 'json',
  624. cache: false,
  625. success: function (res) {
  626. console.log(res)
  627. },
  628. })
  629. }
  630. //防止提示一秒内重复显示
  631. function stopManyClick(fn) {
  632. if (flag) {
  633. fn();
  634. }
  635. flag = false;
  636. if(timer){clearTimeout(timer);}
  637. timer = setTimeout(() => {flag = true}, 1500);
  638. }
  639. </script>
  640. </body>
  641. </html>