share-voucher.html 3.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>领取代金券</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
  7. <meta name="apple-mobile-web-app-capable" content="yes">
  8. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  9. <link rel="stylesheet" type="text/css" href="css/mui.min.css" />
  10. <link rel="stylesheet" type="text/css" href="css/iconfont.css" />
  11. <link rel="stylesheet" type="text/css" href="css/main.css" />
  12. </head>
  13. <body style="background: #fff;overflow-x: hidden;">
  14. <div class="loading-bg">
  15. <div class="mui-loading">
  16. <div class="mui-spinner">
  17. </div>
  18. &nbsp;&nbsp;加载中...
  19. </div>
  20. </div>
  21. <div class="mui-content" style="background: #fff;">
  22. <div class="share-voucher-bg">
  23. </div>
  24. <div class="share-voucher-logo">
  25. <img src="images/2019081307.png" />
  26. </div>
  27. <ul class="vip-voucher-list" style="background: transparent;position: absolute;left: 0;top: 180px;">
  28. <li>
  29. <div class="mui-table">
  30. <div class="mui-table-cell mui-col-xs-4 table-middle mui-text-center">
  31. ¥<span id="coupon-aomunt">0</span>
  32. <!--<div class="left-badge">数量:5张 </div>-->
  33. </div>
  34. <div class="mui-table-cell mui-col-xs-8 table-middle mui-text-center">
  35. <div class="voucher-tit" id="coupon-name">净水机专用代金券</div>
  36. <div class="date">有效期 90 天</div>
  37. </div>
  38. </div>
  39. </li>
  40. </ul>
  41. <button type="button" class="mui-btn btn-share-know-voucher">立即领取</button>
  42. <div class="mui-text-center">
  43. <br /><br /><br />
  44. <img style="width: 140px;-webkit-user-select:all;" src="images/2019081308.png" />
  45. <div class="cl-red">长按识别 关注Aiberle公众号</div>
  46. <br />
  47. <p>领取成功后,可在公众号“我的-券包”查看<br>在Aiberle爱贝源微信商城,购买代金券指定产品即可减免此代金券的票面金额</p>
  48. </div>
  49. </div>
  50. <script type="text/javascript" src="js/mui.min.js"></script>
  51. <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
  52. <script type="text/javascript" src="js/main.js"></script>
  53. <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.1.0.js"></script>
  54. <script type="text/javascript" src="//s.iamberry.com/aiberle/wechat/js/wechat-utils-1.0.js"></script>
  55. <script type="text/javascript">
  56. //ready 参考mui官方文档
  57. var couponId = getParam("couponId");
  58. var isGive = true;
  59. mui.ready(function() {
  60. $('.loading-bg').hide();
  61. ajax("post", "/wechat/welfare/getCoupon", {"time":new Date().getTime(), "id":couponId}, function(res) {
  62. isGive = (res.data.couponIsGive==1);
  63. $("#coupon-aomunt").text(new Number(res.data.couponReduce/100));
  64. $("#coupon-name").text(res.data.couponName);
  65. });
  66. /* 注册分享 */
  67. init_share();
  68. });
  69. function init_share() {
  70. window.wxFriend.imgUrl='https://s.iamberry.com/aiberle/wechat/images/welfare_share.jpg';
  71. window.wxFriend.link=location.href;
  72. window.wxFriend.desc="代金券可直接抵现,请尽快领取使用。";
  73. window.wxFriend.title="亲测好用,快领券买有优惠!";
  74. getConfig();
  75. }
  76. //跳转产品列表
  77. mui('body').on('tap', '.btn-share-know-voucher', function() {
  78. if (!isGive) {
  79. mui.toast('此优惠券已经被其他好友领取了(您可关注公众号联系客服 或 联系好友再分享)');
  80. return;
  81. }
  82. ajax("post", "/wechat/welfare/drawShareCoupon", {"time":new Date().getTime(), "id":couponId}, function(res) {
  83. if (res.status) {
  84. location.href="coupon_list.html";
  85. } else {
  86. mui.toast('领取失败(自己不可领取 或 优惠券已过期)');
  87. }
  88. });
  89. });
  90. </script>
  91. </body>
  92. </html>