order20191001.html 8.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. <!DOCTYPE html>
  2. <html lang="en">
  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="viewport" content="width=device-width, height=device-height, maximum-scale=1.0, user-scalable=no">
  8. <meta name="apple-mobile-web-app-capable" content="yes">
  9. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  10. <meta name="format-detection" content="telephone=no">
  11. <script type="text/javascript">
  12. var deviceWidth = document.documentElement.clientWidth;
  13. if (deviceWidth > 750) {
  14. deviceWidth = 750;
  15. }
  16. document.documentElement.style.fontSize = deviceWidth / 7.5 + 'px';
  17. </script>
  18. <link rel="stylesheet" href="20191001/1yuan/scss/order.css?v=20190630">
  19. <script type="text/javascript" src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  20. <script src="https://s3.pstatp.com/inapp/toutiao.js"></script>
  21. </head>
  22. <body>
  23. <input type="hidden" id="useraccount_tt" value="" />
  24. <input type="hidden" id="fog_tt" />
  25. <input type="hidden" id="sendsms_order_tt" />
  26. <div class="section-banner">
  27. <div class="title">
  28. <img src="20191001/1yuan/images/title.png">
  29. </div>
  30. <div class="products">
  31. <ul>
  32. <li><img src="20191001/1yuan/images/app-ds.png"></li>
  33. <li><img src="20191001/1yuan/images/app-ppx.png"></li>
  34. <li><img src="20191001/1yuan/images/app-xg.png"></li>
  35. <li><img src="20191001/1yuan/images/app-tt.png"></li>
  36. <li><img src="20191001/1yuan/images/app-dy.png"></li>
  37. <li><img src="20191001/1yuan/images/app-hs.png"></li>
  38. <li><img src="20191001/1yuan/images/app-tc.png"></li>
  39. <li><img src="20191001/1yuan/images/app-dcd.png"></li>
  40. </ul>
  41. </div>
  42. <div class="duration">
  43. 活动时间:2019.10.1-2019.10.7
  44. </div>
  45. </div>
  46. <div class="section-order">
  47. <div class="btn"><input type="button" id="major" value="立即开通" class="red_btn"></div>
  48. </div>
  49. <div class="section-agr">
  50. <a id="moreinfo" href="javascript:void(0)">了解更多产品信息</a>
  51. </div>
  52. <script>
  53. $('#major').unbind('click').on('click',function() {
  54. $("#major").attr('disabled',true);
  55. $("body").css("overflow","hidden");
  56. var $iframe = $('<iframe id="uniauthframe" src="https://cap.chinaunicom.cn/CAP-AUTH/auth-tt.html?_=148040518646"></iframe>')
  57. var params = {
  58. "PRODUCT_NAME" : "今日头条定向流量9元10G月包",
  59. "PRODUCT_PRICE" : "9.00元",
  60. "CLIENT_ID" : "",
  61. "CLIENT" : "3",
  62. "SERVICE_ID" : "",
  63. "AUTH_NO" : "",
  64. "CLIENT_SECRET" : "",
  65. "VERSION" : "1.0",
  66. "SERVICE_PHONE" : "",
  67. "THEME" : "",
  68. "PRODUCT_ID" : "8434545",
  69. "PRODUCT_TYPE" : "1"
  70. }
  71. $iframe.on('load',function() {
  72. $.ajax({
  73. url : getRootPath() + "-s1api" + "/ini/clientsecret",
  74. dataType : "JSON",
  75. method : "GET",
  76. success : function(data) {
  77. params.CLIENT_ID = data.client_id;
  78. params.AUTH_NO = data.auth_no;
  79. params.CLIENT_SECRET = data.client_secret;
  80. $('#uniauthframe')[0].contentWindow.postMessage(JSON.stringify(params),"https://cap.chinaunicom.cn/CAP-AUTH/")
  81. }
  82. })
  83. })
  84. $('body').append($iframe);
  85. //监听统一认证结果
  86. window.addEventListener('message', function(e) {
  87. var data = JSON.parse(e.data);
  88. $('html,body').addClass('ovfHiden');
  89. switch (data.RSP.RSP_CODE) {
  90. case "0000": //处理成功
  91. $('iframe').remove();
  92. order(data, 'tt');
  93. break;
  94. case "0001"://auth_no无效 (入参流水)
  95. $("#major").attr('disabled',false);
  96. break;
  97. case "0003"://client_id不存在 (注册id存在问题)
  98. $("#major").attr('disabled',false);
  99. break;
  100. case "4444"://服务暂时不可用(系统忙/系统队列满)
  101. $("#major").attr('disabled',false);
  102. break;
  103. case "9001"://关闭H5认证页面
  104. $("#major").attr('disabled',false);
  105. $('iframe').remove();
  106. break;
  107. }
  108. }, false);
  109. })
  110. $('#moreinfo').on('click', function () {
  111. showDialogAgr();
  112. })
  113. function showDialogAgr() {
  114. var $overlay = $('<div class="overlay"></div>')
  115. var $dialog = $(
  116. '<div class="dialog dialog-agr">' +
  117. ' <h3>温馨提示</h3>' +
  118. ' <ul style="height: 8rem;overflow: scroll;">' +
  119. ' <li>' +
  120. ' <h4>一、活动说明</h4>' +
  121. ' <ul style="margin: 0.1rem 0;">' +
  122. ' <li>1. 活动时间:2019年10月1日-10月7日</li>' +
  123. ' <li>2. 参加活动的用户按9元/月扣费,成功订购用户15个工作日内返还8元话费至订购手机号码(联通OCS智能网用户,不参与此次赠送话费活动);</li>' +
  124. ' <li>3. 参加活动的用户持续订购,次月起不再返还话费;</li>' +
  125. ' <li>4. 话费返还到账请留意短信通知,关于活动如有疑问请咨询联通客服:10010。</li>' +
  126. ' </ul>' +
  127. ' </li>' +
  128. ' <li>' +
  129. ' <h4>二、免流说明</h4>' +
  130. ' <ul style="margin: 0.1rem 0;">' +
  131. ' <li>1.定向免流量包适用范围包含:抖音APP、今日头条、西瓜视频、火山小视频、多闪、懂车帝、图虫APP。免流内容不包含第三方提供的广告、视频、图片及直播类视频上传、在线观看/下载/缓存第三方视频所产生的流量;</li>' +
  132. ' <li>2.UNINET、3GNET 、WONET接入点访问能使用该定向流量,其他接入点不能免流使用;</li>' +
  133. ' <li>3.如您为头条相关免流卡用户,如蚂蚁宝卡、阿里宝卡、钉钉宝卡或工商银行e卡等其他免头条系产品卡类,将优先使用免流卡产品的流量,免流卡流量用罄后将消耗定向流量包的流量;</li>' +
  134. ' <li>4.用户成功订购该头条系流量包后,如果遇到页面提示不免流,敬请忽略,正常使用;</li>' +
  135. ' </ul>' +
  136. ' </li>' +
  137. ' <li>' +
  138. ' <h4>三、业务说明</h4>' +
  139. ' <ul style="margin: 0.1rem 0;">' +
  140. ' <li>1.中国联通手机4G(除冰激凌套餐、懂我卡等)用户,上海、广东、吉林、安徽、浙江、湖北、山东、河南、四川、重庆、陕西、河北以及天津2/3G用户均可订购,4G套餐中的共享类套餐不共享该月包,需单独订购(暂不支持携号转网用户订购);</li>' +
  141. ' <li>2.如您已成功订购流量包,点此<a onclick="gotoUrl(\'Tou/Dy/cancel\')" href="javascript:void(0)">退订</a>。</li>' +
  142. ' <li>关于免流量如有疑问请咨询联通客服:10010。</li>' +
  143. ' </ul>' +
  144. ' </li>' +
  145. ' </ul>' +
  146. '</div>'
  147. )
  148. $overlay.appendTo($(document.body))
  149. $dialog.appendTo($(document.body))
  150. $overlay.on('click', function () {
  151. $overlay.remove();
  152. $dialog.remove();
  153. $dialog = null;
  154. })
  155. return $dialog;
  156. }
  157. </script>
  158. <script type="text/javascript" src="../Dy/js/tuil.js"></script>
  159. <script type="text/javascript" src="../Dy/js/order.js"></script>
  160. </body>
  161. </html>