doubleChristmasActivity.html 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684
  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/doubleChristmasActivity.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. <style>
  14. </style>
  15. </head>
  16. <body>
  17. <div class="container">
  18. <div class="header-container">
  19. <img class="top-banner" src="../static/img/doubleChristmasActivity/top-banner.png" />
  20. <div class="activity-meal">活动参与套餐:星耀套餐</div>
  21. <div class="meal-price">云机低至<span class="meal-price-num"></span>元/天</div>
  22. <div class="rest-time"></div>
  23. <div class="limit">PC端用户不参与本次活动</div>
  24. </div>
  25. <div class="middle-container">
  26. <img class="footer-cloud" src="../static/img/doubleChristmasActivity/footer-cloud.png" />
  27. <div class="step-container">
  28. <img class="tips" src="../static/img/doubleChristmasActivity/tip.png" />
  29. <div class="main-step-content">
  30. <div class="top-step">
  31. <div class="step-item">
  32. <img class="buyphone" src="../static/img/doubleElevenActivity/buyphone.png" />
  33. <span class="step-text">购买续费云机</span>
  34. </div>
  35. <img class="step" src="../static/img/doubleElevenActivity/step.png" />
  36. <div class="step-item">
  37. <img class="hongbao" src="../static/img/doubleChristmasActivity/hongbao.png" />
  38. <span class="step-text">累计云机时长</span>
  39. </div>
  40. <img class="step" src="../static/img/doubleElevenActivity/step.png" />
  41. <div class="step-item">
  42. <img class="buyphone" src="../static/img/doubleElevenActivity/buyphone.png" />
  43. <span class="step-text">获取额外奖励</span>
  44. </div>
  45. </div>
  46. </div>
  47. <div class="join-activity-btn">
  48. <img class="join-activity" src="../static/img/doubleElevenActivity/button-join-activity.png" />
  49. <div class="activity-btn-content">
  50. <span class="activity-btn-text">立即参与</span>
  51. <img class="icon-left" src="../static/img/doubleElevenActivity/icon-left.png" />
  52. </div>
  53. </div>
  54. <img class="middle-cloud" src="../static/img/doubleChristmasActivity/middle-cloud.png" />
  55. </div>
  56. <div class="rest-tip">使用激活码,优惠券和星币支付不参与活动</div>
  57. <div class="tab-row">
  58. <div class="tab-item tab-active" data-index="0">充值奖励</div>
  59. <div class="tab-item" data-index="1">分配奖励(<span class="time-number"></span>)</div>
  60. <img class="tab-bg" src="../static/img/doubleChristmasActivity/tab-bg.png" />
  61. </div>
  62. <div class="reward-container">
  63. <div class="activity-finish">
  64. <div class="finish-text">活动已结束</div>
  65. </div>
  66. <div class="reward-time">
  67. <span class="reward-text">购买套餐累计时长</span>
  68. <span class="total-time-num"></span>
  69. <span class="reward-text">天</span>
  70. <span class="time-line">|</span>
  71. <span class="reward-text">距离下一个奖励还差</span>
  72. <span class="next-time-num"></span>
  73. <span class="reward-text">天</span>
  74. </div>
  75. <div class="reward-tip-row">
  76. <img class="reward-tip-img" src="../static/img/doubleChristmasActivity/reward-tip-img.png" />
  77. <div class="reward-tip">精彩不停的充值福利专场已经来临充值越多折扣越大</div>
  78. </div>
  79. <div class="reward-list"></div>
  80. </div>
  81. <div class="distribution-container">
  82. <div class="distribution-time">
  83. <div>
  84. <span class="distribution-text">奖励总时长</span>
  85. <span class="distribution-total-num"></span>
  86. <span class="distribution-text">天</span>
  87. </div>
  88. <span class="distribution-line">|</span>
  89. <div>
  90. <span class="distribution-text">未分配时长</span>
  91. <span class="no-distribution-num"></span>
  92. <span class="distribution-text">天</span>
  93. </div>
  94. </div>
  95. <div class="reward-list">
  96. <img class="left-ear" src="../static/img/doubleChristmasActivity/left-ear.png" />
  97. <img class="right-ear" src="../static/img/doubleChristmasActivity/right-ear.png" />
  98. <div class="slider" id="slider">
  99. <div class="slider-list flex" id="slider-list"></div>
  100. </div>
  101. <div class="page-row">
  102. <div class="schedule-line">
  103. <div class="schedule-child-line"></div>
  104. </div>
  105. <div class="page">1/4页</div>
  106. </div>
  107. <div class="distribution-reward-btn">
  108. <img class="reward-btn-img" src="../static/img/doubleChristmasActivity/distribution-reward-btn.png" />
  109. </div>
  110. </div>
  111. </div>
  112. <div class="distribution-container time-container">
  113. <div class="time-title-row">
  114. <img class="time-title-bg" src="../static/img/doubleChristmasActivity/time-title-bg.png" />
  115. <div class="time-title">分配时长记录(已分配时长999天)</div>
  116. </div>
  117. <div class="time-list">
  118. <div class="title-row">
  119. <div>云机名称</div>
  120. <div>时间</div>
  121. <div>时长</div>
  122. </div>
  123. <div class="no-time-data">暂无分配时长</div>
  124. </div>
  125. </div>
  126. <div class="rule-container">
  127. <img class="rule-tips" src="../static/img/doubleChristmasActivity/rule.png" />
  128. <div class="rule-content">
  129. <div class="rule-point">一、活动时间:2021年12月18日-2022年1月3日。</div>
  130. <div class="rule-point">二、任务奖励与获取说明</div>
  131. <div class="rule-point">1.活动期间购买星曜云机达累计天数,可获得相应奖励,同一个账号同一进度的奖励只能领取一次。</div>
  132. <div class="rule-point">任务奖励一览:</div>
  133. <div class="rule-point">1.1.累积购买天数小于等于2022天时 ,获得对应任务奖励。</div>
  134. <div class="rule-point">1.2.累积购买天数大于2022天时,超过2022天的部分按买一送二发放奖励。</div>
  135. <div class="rule-point">2.使用星币支付、激活码兑换、优惠劵购买和购买非星耀套餐不计入任务进度。</div>
  136. <div class="rule-point">3.奖励获取的云机时长仅可用于续费账号中现有的星曜云机设备。</div>
  137. <div class="rule-point blue">4.奖励领取日期为:2021年12月18日-2022年1月6日,超过领取时间未领取奖励则视为放弃任务奖励。</div>
  138. <div class="rule-point">5.从他人获取授权的云手机不能分配累计奖励时长。</div>
  139. <div class="rule-point">三、其他说明</div>
  140. <div class="rule-point">1.本次活动不与其他活动优惠叠加。</div>
  141. <div class="rule-point">2.本次活动期间购买的云手机套餐不支持退款。</div>
  142. <div class="rule-point">3.双子星官方对活动具有最终解释权。</div>
  143. </div>
  144. </div>
  145. </div>
  146. <div class="sure-distribution-wrap">
  147. <div class="sure-distribution-box">
  148. <div class="sure-distribution-title">确定分配奖励时长</div>
  149. <div class="sure-distribution-btn-list">
  150. <div class="sure-distribution-btn sure-distribution-cannel">取消</div>
  151. <div class="sure-distribution-btn sure-distribution-sure">确定</div>
  152. </div>
  153. </div>
  154. </div>
  155. </div>
  156. <script>
  157. toastr.options.positionClass = 'toast-center-center';
  158. toastr.options.timeOut = '1500';
  159. </script>
  160. <script type="text/javascript">
  161. let timer,flag = true;
  162. var url = window.location.href;
  163. url = url.split('/');
  164. var topVal = -0.5;
  165. let obj = {};
  166. // 上线分享环境改为0,图片路径改为正式站路径
  167. // var baseUrl = 'https://test.androidscloud.com'
  168. var loc = window.location.search,
  169. n1 = loc.length,//地址的总长度
  170. n2 = loc.indexOf("="),//取得=号的位置
  171. id = loc.substr(n2 + 1, n1 - n2),//从=号后面的内容
  172. u = navigator.userAgent,
  173. ua = navigator.userAgent.toLowerCase(),
  174. isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/),
  175. isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
  176. let s = loc.substr(1,loc.length-1);//取得=号的位置
  177. let userName = '';
  178. let totalTime = 0;
  179. let christmasDoubleReward = 0;
  180. let currTotalTime = 0;
  181. let distributionList = [];
  182. var pageNum = 0;
  183. var sliderNumber = 0;//滑块是数量,控制溢出不能滑动
  184. // let parms = s.split('&');
  185. // parms.map((item) =>{
  186. // let arr = item.split('=');
  187. // let key = arr[0];
  188. // obj[key] = arr[1];
  189. // })
  190. getBaseData();
  191. //点击立即参与按钮
  192. $('.join-activity-btn')[0].addEventListener('click',() => {
  193. operate('dt_双旦_h5_立即参与');
  194. if(isAndroid){ // 安卓
  195. window.native.startPurchase(1,365);
  196. }else if(isiOS){
  197. window.webkit.messageHandlers.startPurchase.postMessage({type:2,day:365});
  198. }else {
  199. }
  200. })
  201. //点击去完成
  202. $('.reward-list')[0].addEventListener('click',(e) => {
  203. if(e.target.className === 'reward-btn'){
  204. let receive = e.target.dataset.receive;
  205. if(receive !== 'null'){
  206. return
  207. }
  208. if(isAndroid){ // 安卓
  209. window.native.startPurchase(1,365);
  210. }else if(isiOS){
  211. window.webkit.messageHandlers.startPurchase.postMessage({type:2,day:365});
  212. }else{
  213. }
  214. }
  215. });
  216. //点击tab选项卡
  217. $('.tab-row')[0].addEventListener('click',(e) => {
  218. const index = e.target.dataset.index;
  219. if(!index){
  220. return
  221. }
  222. if(index == 0){
  223. operate('dt_双旦_h5_tab_充值奖励');
  224. $('.tab-item')[1].className = 'tab-item';
  225. $('.tab-bg')[0].className = 'tab-bg tab-left';
  226. $('.reward-container').eq(0).css('display','block');
  227. $('.distribution-container').eq(0).css('display','none');
  228. $('.distribution-container').eq(1).css('display','none');
  229. }else{
  230. operate('dt_双旦_h5_tab_分配奖励');
  231. getLists();
  232. distributionRecord();
  233. $('.tab-item')[0].className = 'tab-item';
  234. $('.tab-bg')[0].className = 'tab-bg tab-right';
  235. $('.reward-container').eq(0).css('display','none');
  236. $('.distribution-container').eq(0).css('display','block');
  237. $('.distribution-container').eq(1).css('display','block');
  238. }
  239. $('.tab-item')[index].className = 'tab-item tab-active';
  240. })
  241. //获取倒计时
  242. function getBaseData(){
  243. $.ajax({
  244. url: baseUrl + '/api/user/v1/activity/getChristmasActivityConf',
  245. type: 'get',
  246. headers: {
  247. 'Authorization': id //id
  248. },
  249. contentType:"application/json",
  250. dataType: 'json',
  251. cache: false,
  252. success: function (res) {
  253. getList();
  254. const objData = res.data;
  255. userName = objData.userName;
  256. christmasDoubleReward = objData.christmasDoubleReward;
  257. $('.meal-price-num').eq(0).text(objData.price);
  258. let currTime = parseInt(Date.parse(objData.now)),
  259. closeTime = parseInt(Date.parse(objData.endTime)),
  260. result = closeTime - currTime,
  261. day = parseInt(result / 1000 / 60 / 60 / 24),
  262. hour = parseInt(result / 1000 / 60 / 60 % 24),
  263. minute = parseInt(result / 1000 / 60 % 60),
  264. seconds = parseInt(result / 1000 % 60),
  265. time = day + "天" + hour + "时" + minute + "分" + seconds + "秒";
  266. const timeInterval = setInterval(() =>{
  267. if(seconds > 0){
  268. seconds--;
  269. } else if(minute > 0) {
  270. seconds = 59;
  271. minute--;
  272. } else if(hour > 0) {
  273. minute = 59;
  274. hour--;
  275. } else if(day > 0) {
  276. hour = 59;
  277. day--;
  278. } else {
  279. clearInterval(timeInterval);
  280. }
  281. time = day + "天" + hour + "时" + minute + "分" + seconds + "秒";
  282. let str =`距离活动结束:${time}`
  283. $('.rest-time').eq(0).text(str);
  284. },1000)
  285. let str =`距离活动结束:${time}`
  286. if(day == 0 && hour == 0 && minute == 0 && seconds == 0 || objData.activityEnd){
  287. str = '已结束'
  288. getList()
  289. }
  290. $('.rest-time').eq(0).text(str);
  291. },
  292. })
  293. }
  294. //调用获取数据列表接口
  295. function getList(){
  296. $.ajax({
  297. url: baseUrl + '/api/user/v1/activity/getReceivingList',
  298. type: 'get',
  299. headers: {
  300. 'Authorization': id //id
  301. },
  302. contentType: "application/json",
  303. dataType: 'json',
  304. cache: false,
  305. success: function (res) {
  306. if(res.status === 0){
  307. if(res.data.open == 2){
  308. $('.activity-finish').eq(0).css('display','block');
  309. }
  310. if(res.data && res.data.operateActivityGoodsInfos.length > 0){
  311. var str = '',
  312. flag = true,
  313. nextDuration = 0,
  314. usedDuration = res.data.usedDuration,
  315. rewardDuration = res.data.rewardDuration,
  316. totalDuration = res.data.totalDuration,
  317. len = res.data.operateActivityGoodsInfos.length;
  318. for (var i = 0; i < len; i++) {
  319. let rewardDuration = res.data.operateActivityGoodsInfos[i].rewardDuration,
  320. receiveDuration = res.data.operateActivityGoodsInfos[i].receiveDuration,
  321. cumulativeDuration = res.data.operateActivityGoodsInfos[i].cumulativeDuration;
  322. str += `<div class="reward-row">
  323. <img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
  324. <div class="reward-row-content">
  325. <img class="reward-img" src="../static/img/doubleChristmasActivity/reward.png" />
  326. <div class="reward-day-text">
  327. <div class="reward-day">奖励天数${rewardDuration}天</div>
  328. <div class="total-day">购买套餐累计时长达${cumulativeDuration}天</div>
  329. </div>
  330. <img class="reward-btn" data-receive=${receiveDuration} src="../static/img/doubleChristmasActivity/${receiveDuration ? 'get-btn' : 'finish-btn'}.png" />
  331. </div>
  332. </div>`
  333. if(totalDuration - cumulativeDuration < 0 && flag){
  334. flag = false;
  335. nextDuration = cumulativeDuration - totalDuration;
  336. }
  337. }
  338. str += `<div class="reward-row">
  339. <img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
  340. <div class="reward-row-content">
  341. <img class="reward-img" src="../static/img/doubleChristmasActivity/reward.png" />
  342. <div class="reward-day-text">
  343. <div class="reward-day">星曜套餐买一送二</div>
  344. <div class="total-day">购买套餐累计时长达高于${christmasDoubleReward}天</div>
  345. </div>
  346. <img class="reward-btn" data-receive=33 src="../static/img/doubleChristmasActivity/finish-btn.png" />
  347. </div>
  348. </div>`
  349. str +=`<div class="reward-last-tip">已获得奖励请在分配奖励栏中进行时长分配</div>`
  350. $('.reward-list').eq(0).append(str);
  351. $('.time-number').eq(0).text(rewardDuration);
  352. $('.total-time-num').eq(0).text(totalDuration);
  353. $('.next-time-num').eq(0).text(nextDuration);
  354. $('.distribution-total-num').eq(0).text(rewardDuration);
  355. const noDistributionDuration = rewardDuration - usedDuration;
  356. totalTime = noDistributionDuration;
  357. $('.no-distribution-num').eq(0).text(noDistributionDuration);
  358. }
  359. }else{
  360. stopManyClick(() => {
  361. toastr.error(res.msg);
  362. })
  363. }
  364. }
  365. })
  366. }
  367. // 获取分配列表数据
  368. function distributionRecord(){
  369. $.ajax({
  370. url: baseUrl + '/api/user/v1/activity/queryUserDistribution',
  371. type: 'get',
  372. data:{
  373. pageNum: pageNum + 1,
  374. pageSize: 10,
  375. userName: userName
  376. },
  377. headers: {
  378. 'Authorization': id //id
  379. },
  380. contentType: "application/json",
  381. dataType: 'json',
  382. cache: false,
  383. success: function (res) {
  384. console.log(res)
  385. if(res.status === 0){
  386. let records = res.data.records;
  387. if(res.data && records.length > 0){
  388. var str = '',
  389. len = records.length;
  390. for (var i = 0; i < len; i++) {
  391. var diskName = records[i].diskName,
  392. createTime = records[i].createTime,
  393. increaseDuration = records[i].increaseDuration,
  394. id = records[i].id;
  395. str += `<div class="time-content-row">
  396. <div>${diskName}</div>
  397. <div>${createTime.substring(0,4)}年${createTime.substring(5,7)}月${createTime.substring(8,10)}日 ${createTime.substring(11,19)}</div>
  398. <div>${increaseDuration}天</div>
  399. </div>`
  400. }
  401. $('.time-list').eq(0).append(str);
  402. if(len !== 0){
  403. $('.no-time-data').eq(0).css('display','none');
  404. }
  405. }
  406. }else{
  407. stopManyClick(() => {
  408. toastr.error(res.msg);
  409. })
  410. }
  411. },
  412. })
  413. }
  414. // 活动获取用户云机列表,分页
  415. function getLists(){
  416. console.log(id)
  417. const sliderLen = Array.from($('.slider-item')).length;
  418. if(sliderLen > sliderNumber){
  419. return
  420. }
  421. $.ajax({
  422. url: baseUrl + '/api/user/v1/activity/getUserCardPage',
  423. type: 'get',
  424. data:{
  425. pageNum: pageNum + 1,
  426. pageSize: 4,
  427. phoneType : 'SVIP'
  428. },
  429. headers: {
  430. 'Authorization': id //id
  431. },
  432. contentType: "application/json",
  433. dataType: 'json',
  434. cache: false,
  435. success: function (res) {
  436. if(res.status === 0){
  437. let records = res.data.userCardPage.records;
  438. if(res.data && records.length > 0){
  439. sliderNumber = res.data.userCardPage.pages;
  440. var str = '',
  441. len = records.length;
  442. for (var i = 0; i < len; i++) {
  443. var diskName = records[i].diskName,
  444. exceptTime = records[i].exceptTime,
  445. now = res.data.now,
  446. currTime = parseInt(Date.parse(now)),
  447. closeTime = parseInt(Date.parse(exceptTime)),
  448. resultTime = closeTime - currTime,
  449. day = parseInt(resultTime / 1000 / 60 / 60 / 24),
  450. hour = parseInt(resultTime / 1000 / 60 / 60 % 24),
  451. time = day + "天" + hour + "时";
  452. recordsId = records[i].id;
  453. str += `<div class="reward-row">
  454. <img class="reward-row-bg" src="../static/img/doubleChristmasActivity/reward-row-bg.png" />
  455. <div class="reward-row-content">
  456. <img class="icon_xingyao" src="../static/img/doubleChristmasActivity/home_list_icon_xingyao.png" />
  457. <div class="reward-day-text">
  458. <div class="reward-day">${diskName}</div>
  459. <div class="total-day time-row">
  460. <img class="time-icon" src="../static/img/doubleChristmasActivity/time-icon.png" />
  461. <span>${time}</span>
  462. </div>
  463. </div>
  464. <div class="compute-block">
  465. <img class="compute-icon cut" src="../static/img/doubleChristmasActivity/cut.png" />
  466. <input class="ipt" data-id=${recordsId} data-index=${i} type="number" onkeyup="this.value=this.value.replace(/[^0-9]/g,'')" value="0" />
  467. <img class="compute-icon add" data-id=${recordsId} data-index=${i} src="../static/img/doubleChristmasActivity/add.png" />
  468. </div>
  469. </div>
  470. </div>`
  471. }
  472. let sliderItemDom = res.data.length === 0 ? `<div class="slider-item no-slider">暂无可分配的云手机</div>` : `<div class="slider-item">${str}</div>`;
  473. $('#slider-list').append(sliderItemDom);
  474. if(records.length === 0){
  475. $('.left-ear').eq(0).css('display','none');
  476. $('.right-ear').eq(0).css('display','none');
  477. $('.page-row').eq(0).css('display','none');
  478. $('.distribution-reward-btn').eq(0).css('display','none');
  479. }
  480. $('.page').eq(0).text(`${pageNum + 1}/${sliderNumber}页`);
  481. if(sliderNumber === 1){
  482. $('.page-row').eq(0).css('display','none');
  483. $('.distribution-reward-btn').eq(0).css('margin-top','20px');
  484. }
  485. for(var i = 0; i < len; i++){
  486. iptIndex = (pageNum)*4 + parseInt(i);
  487. $('.ipt')[iptIndex].oninput = function(e){
  488. const id = e.target.dataset.id;
  489. let oldDuration = 0;
  490. let preTotalTime = 0;
  491. let index = e.target.dataset.index;
  492. let value = $('.ipt').eq(index).val();
  493. distributionList.map(item => { // 上一次的总数据
  494. preTotalTime += parseInt(item.duration);
  495. })
  496. //这一次操作
  497. if(value == 0){
  498. distributionList.push({
  499. cardId: id,
  500. duration: +value
  501. });
  502. }else{
  503. distributionList.map(item => {
  504. if(item.cardId == id){
  505. oldDuration = item.duration;
  506. item.duration = +value;
  507. }
  508. })
  509. }
  510. currTotalTime = 0;
  511. distributionList.map(item => { // 这一次的总数据
  512. currTotalTime += parseInt(item.duration);
  513. })
  514. console.log(currTotalTime);
  515. if(currTotalTime < totalTime){ // 当前已分配小于总分配时长
  516. }else{// 当前已分配大于总分配时长
  517. let val = totalTime - preTotalTime;
  518. distributionList.map(item => {
  519. if(item.cardId == id){
  520. item.duration = val;
  521. }
  522. })
  523. $('.ipt').eq(index).val(val);
  524. stopManyClick(() => {
  525. toastr.error('分配时常不能大于未分配时常');
  526. })
  527. return
  528. };
  529. if(value.length > 5) value=value.slice(0, 5);
  530. $('.ipt').eq(index).val(value);
  531. }
  532. }
  533. }
  534. }else{
  535. stopManyClick(() => {
  536. toastr.error(res.msg);
  537. })
  538. }
  539. }
  540. })
  541. }
  542. //点击分配时常按钮
  543. $('.distribution-reward-btn')[0].addEventListener('click',(e) => {
  544. if(distributionList.length === 0){
  545. stopManyClick(() => {
  546. toastr.error('未选中任何云手机');
  547. })
  548. }else{
  549. $('.sure-distribution-wrap').eq(0).css('display','block');
  550. }
  551. });
  552. //点击分配时常取消按钮
  553. $('.sure-distribution-cannel')[0].addEventListener('click',(e) => {
  554. operate('dt_双旦_h5_分配奖励_取消');
  555. $('.sure-distribution-wrap').eq(0).css('display','none');
  556. });
  557. //点击分配时常确定按钮
  558. $('.sure-distribution-sure')[0].addEventListener('click',(e) => {
  559. $.ajax({
  560. url: baseUrl + '/api/user/v1/activity/distributeRewardDuration',
  561. type: 'post',
  562. data:JSON.stringify(distributionList),
  563. headers: {
  564. 'Authorization': id //id
  565. },
  566. contentType: "application/json",
  567. dataType: 'json',
  568. cache: false,
  569. success: function (res) {
  570. console.log(res)
  571. if(res.status === 0){
  572. operate('dt_双旦_h5_分配奖励_确定');
  573. $('.sure-distribution-wrap').eq(0).css('display','none');
  574. $('.reward-list').eq(0).text('');
  575. getList();
  576. getLists();
  577. stopManyClick(() => {
  578. toastr.error('分配时长成功,请前往云机列表查看');
  579. })
  580. }else{
  581. stopManyClick(() => {
  582. toastr.error(res.msg);
  583. })
  584. }
  585. },
  586. })
  587. });
  588. //点击加号
  589. $('.slider-list')[0].addEventListener('click',(e) => {
  590. console.log(sliderNumber)
  591. if(e.target.className === 'compute-icon add'){
  592. const id = e.target.dataset.id;
  593. let index = e.target.dataset.index;
  594. index = (pageNum)*4 + parseInt(index);
  595. let number = $('.ipt').eq(index).val();
  596. if(number < totalTime - 1){
  597. if(number == 0){
  598. distributionList.push({
  599. cardId: id,
  600. duration: +number + 1
  601. });
  602. }else{
  603. distributionList.map(item => {
  604. if(item.cardId == id){
  605. item.duration++;
  606. }
  607. })
  608. }
  609. number++;
  610. currTotalTime++;
  611. $('.ipt').eq(index).val(number);
  612. }else{
  613. stopManyClick(() => {
  614. toastr.error('分配时常不能大于未分配时常');
  615. })
  616. }
  617. }
  618. });
  619. //点击减号
  620. $('.slider-list')[0].addEventListener('click',(e) => {
  621. if(e.target.className === 'compute-icon cut'){
  622. let number = $('.ipt').eq(0).val();
  623. if(number > 0){
  624. if(number == 0){
  625. distributionList.push({
  626. cardId: id,
  627. duration: +number - 1
  628. });
  629. }else{
  630. distributionList.map(item => {
  631. if(item.cardId == id){
  632. item.duration--;
  633. }
  634. })
  635. }
  636. number--;
  637. currTotalTime--;
  638. $('.ipt').eq(0).val(number);
  639. }else{
  640. stopManyClick(() => {
  641. toastr.error('分配的时常不能小于0');
  642. })
  643. }
  644. }
  645. });
  646. //埋点
  647. operate('dt_双旦_h5_活动首页');
  648. function operate(pointName,type){
  649. $.ajax({
  650. url: baseUrl + '/api/public/v1/systemBuriedPoint/stat',
  651. type: 'post',
  652. data:JSON.stringify({
  653. pointName: pointName
  654. }),
  655. contentType:"application/json",
  656. dataType: 'json',
  657. cache: false,
  658. success: function (res) {
  659. },
  660. })
  661. }
  662. //防止提示一秒内重复显示
  663. function stopManyClick(fn) {
  664. if (flag) {
  665. fn();
  666. }
  667. flag = false;
  668. if(timer){clearTimeout(timer);}
  669. timer = setTimeout(() => {flag = true}, 1500);
  670. }
  671. </script>
  672. <script src="../static/js/vender/move.js"></script>
  673. </body>
  674. </html>