Não pode escolher mais do que 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.
 
 
 

384 linhas
16 KiB

  1. $(function () {
  2. var WIDTH = Math.floor(document.documentElement.clientWidth * 0.45),//屏幕宽度*0.45来设置li的宽度
  3. $behindList = $(".behind ul li"),//福袋父级
  4. $frontList = $(".front ul li"),
  5. $behindBag = $(".moveing-left"),//后方运动盒子
  6. $frontBag = $(".moveing-right"),//前方运动盒子
  7. $topBag = $(".behind img"),//后方每个福袋
  8. $bottomBag = $(".front img"),//前方每个福袋
  9. $btn = $("#btn"),//游戏按钮
  10. $hook = $("#hook"),//钩子
  11. data = {count: 0},//次数
  12. bool = true,//点击开关,ture为可点击
  13. rem = 75,
  14. left, right, index,//福袋运动值,福袋下标
  15. times, timer,
  16. dataList = [],
  17. couponId=null,
  18. errorMessge='',
  19. playAble=true,
  20. timer,//轮流提示定时器
  21. radomData=[];
  22. $(".behind li,.front li").css("width", WIDTH + "px");//设置li的宽度
  23. init();
  24. getCount()
  25. let baseUrl='https://ciformall.youlane.cn/C';
  26. if(window.location.origin=='https://gametest.malls.iformall.com'){
  27. baseUrl='https://ctest.malls.iformall.com/C'
  28. }else if(window.location.origin=='https://game.malls.iformall.com'){
  29. baseUrl='https://c.malls.iformall.com/C'
  30. }else if(window.location.origin=='https://game.youlane.cn'){
  31. baseUrl='https://ciformall.youlane.cn/C'
  32. }
  33. $.ajax({
  34. url: baseUrl+"/api/game/getOneGame",//json文件位置
  35. type: "GET",//请求方式为get
  36. dataType: "json", //返回数据格式为json
  37. headers: {
  38. 'content-type':'application/json',
  39. // "token":"6ded7930-5293-4e59-a207-73e1e78ce7cc",
  40. "token":getQueryString('token')
  41. },
  42. data:{
  43. id:getQueryString('id'),
  44. // id:"214268965667471360"
  45. },
  46. success: function(res) {//请求成功完成后要执行的方法
  47. // alert(JSON.stringify(res))
  48. // console.log(res)
  49. var strHtml = "";
  50. dataList=res.data.couponIdsList;
  51. id=res.data.id
  52. let totalWeight=0;
  53. dataList.forEach((item,index)=>{
  54. strHtml += '<li class="swiper-slide">';
  55. strHtml += '<img src="'+item.coverImg+'">';
  56. strHtml += '</li>';
  57. totalWeight+=Number(item.gameWeight)
  58. for(var i=0;i<item.gameWeight;i++){
  59. radomData.push(item)
  60. }
  61. })
  62. let notWinweight=100-totalWeight;
  63. let b={
  64. id:null
  65. }
  66. for(var i=0;i<notWinweight;i++){
  67. radomData.push(b)
  68. }
  69. $('.swiper-wrapper').html(strHtml);
  70. //奖品展示
  71. var show = new Swiper(".swiper-container", {
  72. direction: "horizontal",//水平方向滑动。 vertical为垂直方向滑动
  73. loop: false,//是否循环
  74. slidesPerView: "auto"//自动根据slides的宽度来设定数量
  75. });
  76. }
  77. })
  78. function init() {
  79. window.requestAnimationFrame = window.requestAnimationFrame || function (fn) {
  80. return setTimeout(fn, 1000 / 60);//1000 / 60意思是一秒钟60帧
  81. };
  82. //cancelAnimationFrame是清除requestAnimationFrame
  83. window.cancelAnimationFrame = window.cancelAnimationFrame || clearTimeout;
  84. (function move() {
  85. //后方福袋的运动
  86. left = parseFloat($behindBag.css("margin-left"));//获取margin-left并去掉单位
  87. left = left - 1.5;//改变margin-left值
  88. $behindBag.css("margin-left", left + "px");
  89. left <= -WIDTH && $behindBag.css("margin-left", "0");//如果margin-left值到达屏幕宽度则归零
  90. //前方福袋的运动
  91. right = parseFloat($frontBag.css("margin-right"));//获取margin-right并去掉单位
  92. right = right - 1.5;//改变margin-right值
  93. $frontBag.css("margin-right", right + "px");
  94. right <= -WIDTH && $frontBag.css("margin-right", "0");//如果margin-right值到达屏幕宽度则归零
  95. timer = requestAnimationFrame(move);
  96. })();
  97. }
  98. /**
  99. * 获取剩余中奖次数
  100. */
  101. function getCount(){
  102. $.ajax({
  103. url: baseUrl+"/api/game/getCount",//json文件位置
  104. type: "GET",//请求方式为get
  105. dataType: "json", //返回数据格式为json
  106. headers: {
  107. 'content-type':'application/json',
  108. // "token":"b49fa2c4-a074-4147-afbe-6913c66705d6",
  109. "token":getQueryString('token')
  110. },
  111. data:{
  112. gameId:getQueryString('id'),
  113. // id:"213206254531641344"
  114. },
  115. success: function(res) {//请求成功完成后要执行的方法
  116. if(res.code==200){
  117. if(res.data.playAble){
  118. playAble=true;
  119. data.count=res.data.playLimit-res.data.playCount;
  120. $('#change').html(data.count);
  121. if(res.data.playLimit==0){
  122. data.count=1000000;
  123. $('#change').hide();
  124. }
  125. }else{
  126. playAble=false;
  127. if(res.data.AwardLimit==res.data.AwardCount){
  128. errorMessge='您的中奖次数已经达到上限!无法继续参加游戏!'
  129. data.count=res.data.playLimit-res.data.playCount;
  130. $('#change').html(data.count);
  131. return;
  132. }else if(res.data.playLimit==res.data.playCount){
  133. errorMessge='您的剩余次数为0!无法继续参加游戏!'
  134. data.count=0;
  135. $('#change').html(0);
  136. return;
  137. }
  138. }
  139. }else{
  140. errorMessge=res.message;
  141. playAble=false;
  142. $('#change').html(0);
  143. }
  144. }
  145. })
  146. }
  147. /**
  148. * 记录游戏次数
  149. */
  150. function reduceCount(paramData){
  151. $.ajax({
  152. url: baseUrl+"/api/game/addActionLog",//json文件位置
  153. type: "POST",//请求方式为get
  154. dataType: "json", //返回数据格式为json
  155. async:true,
  156. headers: {
  157. 'content-type':'application/json;charset=UTF-8',
  158. // "token":"025e5017-a268-4c21-98b3-d47b77b3ca54"
  159. "token":getQueryString('token')
  160. },
  161. data:JSON.stringify(paramData),
  162. success: function(res) {//请求成功完成后要执行的方法
  163. // alert('成功了!')
  164. getCount()
  165. }
  166. })
  167. }
  168. //开始游戏
  169. $btn.click(function () {
  170. if (!bool) return;
  171. // if (data.count <= 0) {
  172. // alert("没有次数了");
  173. // return;
  174. // }
  175. bool = false;
  176. // data.count--;
  177. // $("#change").html(data.count);
  178. var random = Math.floor(Math.random() * 490 + 130);//130 - 620之间随机,因为这两个值是左右边界
  179. $(".left,.right").addClass("up");//张开钩子
  180. $hook.animate({left: random / rem + "rem"}, 1000);//左右值
  181. clearTimeout(times);
  182. //上下值
  183. if (random > 380) {//上面
  184. $hook.animate({top: -100 / rem + "rem"}, 1000);
  185. times = setTimeout(function () {
  186. reback1();
  187. }, 2000);
  188. } else {//下面
  189. $hook.animate({top: 50 / rem + "rem"}, 1000);
  190. times = setTimeout(function () {
  191. reback2();
  192. }, 2000);
  193. }
  194. });
  195. //判断钩子和福袋的距离
  196. function reback1() {
  197. for (var i = 0; i < $behindList.length; i++) {
  198. if ($hook.find("img").length) break;//如果钩子上已经有福袋跳出循环
  199. if ($hook.position().left - 130 <= $behindList.eq(i).position().left && $behindList.eq(i).position().left <= $hook.position().left - 50) {
  200. //获取福袋
  201. !$hook.find("img").length && $hook.append($topBag.eq(i));//如果未抓取到福袋才抓取
  202. $topBag.eq(i).css({//重设福袋大小
  203. width: 91 / rem + "rem",
  204. height: 102 / rem + "rem"
  205. });
  206. saveData()
  207. //钩子返回,弹出红包
  208. index = i;
  209. $hook.animate({top: -220 / rem + "rem"}, 1000, function () {
  210. win();
  211. $behindList.eq(index).append($topBag.eq(index));//把福袋放回原位
  212. index = undefined;
  213. });
  214. } else {
  215. setTimeout(function () {
  216. return reback1();
  217. });
  218. }
  219. }
  220. }
  221. function saveData(){
  222. let b = Math.floor(Math.random() * radomData.length)
  223. console.log(radomData[b],radomData.length)
  224. couponId=radomData[b].couponId
  225. let params={
  226. couponId:couponId,
  227. couponChannelId:radomData[b].id
  228. }
  229. if(playAble){
  230. if (data.count > 0) {
  231. if(radomData[b].id!=null){
  232. let paramContData={
  233. gameId:getQueryString('id'),
  234. orderId:'0'
  235. }
  236. //保存中奖信息
  237. $.ajax({
  238. url: baseUrl+"/api/order/save",//json文件位置
  239. type: "POST",//请求方式为get
  240. dataType: "json", //返回数据格式为json
  241. async:true,
  242. headers: {
  243. 'content-type':'application/json;charset=UTF-8',
  244. // "token":"6ded7930-5293-4e59-a207-73e1e78ce7cc"
  245. "token":getQueryString('token')
  246. },
  247. data:JSON.stringify(params),
  248. success: function(res) {//请求成功完成后要执行的方法
  249. console.log(res)
  250. if(res.code==200){
  251. let postData={
  252. payOrderId: "0",
  253. orderId: res.data.id,
  254. status: 1,
  255. reason: ""
  256. }
  257. var orderId=res.data.id;
  258. //保存中奖信息
  259. $.ajax({
  260. url: baseUrl+"/api/pay/updatePayOrder",//json文件位置
  261. type: "POST",//请求方式为get
  262. dataType: "json", //返回数据格式为json
  263. async:true,
  264. headers: {
  265. 'content-type':'application/json;charset=UTF-8',
  266. // "token":"6ded7930-5293-4e59-a207-73e1e78ce7cc"
  267. "token":getQueryString('token')
  268. },
  269. data:JSON.stringify(postData),
  270. success: function(res) {//请求成功完成后要执行的方法
  271. // alert(JSON.stringify(res))
  272. // console.log(res)
  273. if(res.code==200){
  274. var postData02={
  275. gameId:getQueryString('id'),
  276. orderId:orderId
  277. }
  278. reduceCount(postData02);
  279. $('#card .win').css({
  280. "background":'url('+radomData[b].coverImg+') no-repeat',
  281. "background-size":"cover"
  282. });
  283. $('.winning .red-body p').html(radomData[b].title+"(点击“我的”查看奖券)");
  284. $(".btn").html('再玩一把')
  285. }else{
  286. reduceCount(paramContData);
  287. $('#card .win').css({
  288. "background":'url(../common/image/redPack/weizhongjiang.png) no-repeat',
  289. "background-size":"cover"
  290. });
  291. $('.winning .red-body p').html('未中奖!(点击“我的”查看奖券)');
  292. $(".btn").html('再玩一把')
  293. }
  294. }
  295. })
  296. }else{
  297. reduceCount(paramContData);
  298. $('#card .win').css({
  299. "background":'url(../common/image/redPack/weizhongjiang.png) no-repeat',
  300. "background-size":"cover"
  301. });
  302. $('.winning .red-body p').html('未中奖!(点击“我的”查看奖券)');
  303. $(".btn").html('再玩一把')
  304. }
  305. }
  306. })
  307. }else{
  308. reduceCount(paramContData);
  309. $('#card .win').css({
  310. "background":'url(../common/image/redPack/weizhongjiang.png) no-repeat',
  311. "background-size":"cover"
  312. });
  313. $('.winning .red-body p').html('未中奖!(点击“我的”查看奖券)');
  314. $(".btn").html('再玩一把')
  315. }
  316. } else {
  317. alert(errorMessge);
  318. }
  319. }else{
  320. alert(errorMessge);
  321. }
  322. }
  323. function reback2() {
  324. for (var i = 0; i < $frontList.length; i++) {
  325. if ($hook.find("img").length) break;//如果钩子上已经有福袋跳出循环
  326. var l = $frontList.eq(i).position().left - 200;
  327. if ($hook.position().left - 130 <= l && l <= $hook.position().left) {
  328. //获取福袋
  329. !$hook.find("img").length && $hook.append($bottomBag.eq(i));//如果未抓取到福袋才抓取
  330. $bottomBag.eq(i).css({//重设福袋大小
  331. width: 139 / rem + "rem",
  332. height: 156 / rem + "rem"
  333. });
  334. saveData()
  335. //钩子返回,弹出红包
  336. index = i;
  337. $hook.animate({top: -220 / rem + "rem"}, 1000, function () {
  338. win();
  339. $frontList.eq(index).append($bottomBag.eq(index));
  340. index = undefined;
  341. });
  342. } else {
  343. setTimeout(function () {
  344. return reback2();
  345. });
  346. }
  347. }
  348. }
  349. //中奖信息提示
  350. $("#close,.win,.btn").click(function () {
  351. bool = true;
  352. $(".left,.right").removeClass("up");
  353. cancelAnimationFrame(timer);
  354. init();
  355. });
  356. //点击跳回小程序奖券列表
  357. $('#myWin').click(function(){
  358. // alert(555)
  359. wx.miniProgram.redirectTo({
  360. url:'/pages/couponorder/index/index' + "?token=" +getQueryString('token') + "&gameId=" + getQueryString('gameId') + "&id=" + getQueryString('id')+'&from=h5'
  361. })
  362. })
  363. });