Strona główna Odkrywaj Pomoc
Zaloguj się
liujiankang
/
static
Obserwuj 1
Polub 0
Forkuj 0
Pliki Problemy 0 Oczekujące zmiany 0 Wiki
Gałąź: master
Gałęzie Tagi
static
/
watero
/
gift_card_get_give.html

gift_card_get_give.html 12 KB
Bezpośredni odnośnik Historia Czysty

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252 
  1. <!DOCTYPE html>
    2. 

  2. <html>
    3. 

  3. <head>
    4. 

  4. 	<meta charset="UTF-8">
    5. 

  5. 	<title>领取赠品</title>
    6. 

  6. 	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
    7. 

  7. 	<meta name="apple-mobile-web-app-capable" content="yes">
    8. 

  8. 	<meta name="apple-mobile-web-app-status-bar-style" content="black">
    9. 

  9. 	<link rel="stylesheet" type="text/css" href="/css/mui.min.css">
    10. 

  10. 	<link rel="stylesheet" type="text/css" href="/css/iconfont.css" />
    11. 

  11. 	<link rel="stylesheet" type="text/css" href="/css/style.css" />
    12. 

  12. 	<style>
    13. 

  13. 		.head {height: 60px;}
    14. 

  14. 		#head {line-height: 60px;}
    15. 

  15. 		h3 {margin-top: 5px;margin-bottom: 0;}
    16. 

  16. 		.icon-fuxuankuang a {color: #24cae9;text-decoration: underline;}
    17. 

  17. 		.icon-daifahuo, .icon-lease2, .icon-jiage, .icon-lipin {font-size: 15px;padding-left: 22px;}
    18. 

  18. 		.icon-fuxuankuang {font-size: 12px;padding: 5px 5px 5px 22px;}
    19. 

  19. 		.icon-fuxuankuang:before {font-size: 14px;margin-top: 5px;margin-right: 3px;}
    20. 

  20. 		.icon-daifahuo:before, .icon-lease2:before, .icon-jiage:before,
    21. 

  21. 		.icon-lipin:before {font-size: 19px;color: #24cae9;position: absolute;left: 0;width: 20px;height: 18px;}
    22. 

  22. 		.try_price {color: #f1436c;}
    23. 

  23. 		.ul_radio {width: 100%;}
    24. 

  24. 		.ul_radio li {width: 21%;height: 55px;margin: 0 1%;border: 1px solid rgba(0, 0, 0, .1);border-radius: 5px;display: inline-block;position: relative;font-family: "iconfont" !important;font-style: normal;-webkit-font-smoothing: antialiased;}
    25. 

  25. 		.ul_radio .active:after {position: absolute;right: 0;bottom: 0;content: "\e66f";color: #f1436c;line-height: 1;font-size: 20px;}
    26. 

  26. 		.radio1 {background: url(//s.iamberry.com/watero/images/cp-1.jpg)center center/auto 85% no-repeat;}
    27. 

  27. 		.radio2 {background: url(//s.iamberry.com/watero/images/cp-2.jpg)center center/auto 85% no-repeat;}
    28. 

  28. 		.radio3 {background: url(//s.iamberry.com/watero/images/cp-3.jpg)center center/auto 85% no-repeat;}
    29. 

  29. 		.radio4 {background: url(//s.iamberry.com/watero/images/cp-4.jpg)center center/auto 85% no-repeat;}
    30. 

  30. 		.head-img {position: absolute;bottom: 15px;right: 13px;width: 60px;height: 60px;border-radius: 30px;border: 3px solid #E5E5E5;}
    31. 

  31. 		.mui-table-view .mui-media .mui-media-body {height: 41px;line-height: 41px;color: #333;}
    32. 

  32. 		.mui-table-view .mui-media .mui-media-body>span {color: #f1436c;}
    33. 

  33. 		.my-table-view-try {border-top: .6em solid #f0f0f0;border-bottom: .6em solid #f0f0f0;padding-bottom: 10px;}
    34. 

  34. 		.my-table-view-try .mui-table-view-cell {padding: 10px 13px 10px 30px !important;font-size: 12px;}
    35. 

  35. 		.mui-table-view-cell:after, .mui-table-view:before, .mui-table-view:after,
    36. 

  36. 		.mui-input-group .mui-input-row:after, .mui-input-group:before,
    37. 

  37. 		.mui-input-group:after {display: none;}
    38. 

  38. 		.mui-table-view-cell>a:not (.mui-btn ){margin: -15px -15px;}
    39. 

  39. 		.mui-table-view-cell>a .mui-pull-right {color: #999;font-size: 14px;}
    40. 

  40. 		#btn_submit {color: #fff;font-size: 18px;background: #24cae9;margin-bottom: 0;border: 0;}
    41. 

  41. 		.mui-btn-block.mui-active, .btn-pull-code.mui-active {background-color: #c8c8c8 !important;}
    42. 

  42. 		.icon-fuxuankuang.mui-active:before {color: #c8c8c8;}
    43. 

  43. 		.mui-content-padded {margin: 10px 13px;}
    44. 

  44. 		.mui-input-group .mui-input-row {height: 50px;padding: 5px 0;border: 1px solid rgba(0, 0, 0, .1);margin: 10px 0;}
    45. 

  45. 		.mui-input-row label {color: #666;width: 27%;font-size: 15px;}
    46. 

  46. 		.mui-input-row label ~input{width: 73%;}
    47. 

  47. 		.mui-input-row label ~input::-webkit-input-placeholder {font-size: 15px;}
    48. 

  48. 		.triangle-down {width: 0;height: 0;border-left: 7px solid transparent;border-right: 7px solid transparent;border-top: 7px solid #ccc;}
    49. 

  49. 		.my-arrowright {position: absolute;right: 18px;top: 28px;color: #666;pointer-events: none;}
    50. 

  50. 		.mui-btn-red {background-color: #e9004c;}
    51. 

  51. 		.tips {padding-bottom: 65px;}
    52. 

  52. 		.gift-card-title {padding-top: 70px;background: url(//s.iamberry.com/watero/images/shop/gift-card-tit-bg2.png) top center/100% no-repeat #71d8ec;}
    53. 

  53. 		.gift-card-title .mui-table-view-cell.mui-active {background: transparent;}
    54. 

  54. 		.gift-card-title .mui-table-view-cell>a:not (.mui-btn ){color: #fff;}
    55. 

  55. 		.gift-card-title .mui-table-view-cell>a:not (.mui-btn ).mui-active {background: transparent;}
    56. 

  56. 		.gift-card-title .mui-navigate-right:after {color: #fff;font-size: 20px;right: 7px;}
    57. 

  57. 		.gift-card-title .mui-table-view-cell {color: #fff;}
    58. 

  58. 		.mui-table-view-cell.mui-collapse .mui-collapse-content {background: #71d8ec;}
    59. 

  59. 		.accordion {float: right;margin: 2px 15px 0 0;font-size: 12px;color: #fff;}
    60. 

  60. 		.my-btn-hand {display: block;width: 100%;height: 55px;background-color: #c5c5c5;color: #fff;border: 0;border-radius: 0;}
    61. 

  61. 		.my-btn-hand.active {background-color: #1cc9f4;}
    62. 

  62. 		.my-div {padding: 5px 0;border-bottom: 1px solid rgba(0, 0, 0, .1);margin-bottom: 5px;}
    63. 

  63. 		.mui-h5, h5 { margin-left: 30px;}
    64. 

  64. 	</style>
    65. 

  65. 	<script>
    66. 

  66.         // 屏蔽分享
    67. 

  67.         window.hiddenAllWechatMenu = true;
    68. 

  68. 	</script>
    69. 

  69. </head>
    70. 

  70. <body style="background: #fff;">
    71. 

  71. <div class="loading-bg">
    72. 

  72. 	<div class="mui-loading">
    73. 

  73. 		<div class="mui-spinner"></div>
    74. 

  74. 		&nbsp;&nbsp;加载中...
    75. 

  75. 	</div>
    76. 

  76. </div>
    77. 

  77. 

  78. <div class="mui-content" style="background: #fff;">
    79. 

  79. 	<div class="tips">
    80. 

  80. 		<ul class="mui-table-view gift-card-title">
    81. 

  81. 			<li class="mui-table-view-cell mui-text-center">您已成功推荐一位代理商，获赠价值¥3680水机一台</li>
    82. 

  82. 			<li class="mui-table-view-cell mui-text-left mui-collapse"></li>
    83. 

  83. 		</ul>
    84. 

  84. 		<div class="mui-content-padded">
    85. 

  85. 			<div class="my-div">
    86. 

  86. 				<span class="iconfont icon-lipin">选择赠品</span>
    87. 

  87. 			</div>
    88. 

  88. 			<div class="mui-h6">产品名称：美国watero净饮水一体机</div>
    89. 

  89. 			<div class="mui-h6">产品数量：1台</div>
    90. 

  90. 			<form class="mui-input-group">
    91. 

  91. 				<div style="display: table; width: 100%; padding: 10px 0;">
    92. 

  92. 					<div
    93. 

  93. 							style="display: table-cell; width: 20%; vertical-align: middle;">
    94. 

  94. 						选择颜色:</span>
    95. 

  95. 					</div>
    96. 

  96. 					<div style="display: table-cell; width: 70%; text-align: right;">
    97. 

  97. 						<ul class="ul_radio">
    98. 

  98. 							<!-- <li class="radio1 active"></li>
    99. 

  99.                             <li class="radio2"></li>
    100. 

  100.                             <li class="radio3"></li>
    101. 

  101.                             <li class="radio4"></li> -->
    102. 

  102. 						</ul>
    103. 

  103. 					</div>
    104. 

  104. 				</div>
    105. 

  105. 			</form>
    106. 

  106. 		</div>
    107. 

  107. 		<div class="my-div">
    108. 

  108. 			<span class="iconfont icon-lease2">收货信息</span>
    109. 

  109. 		</div>
    110. 

  110. 		<ul class="mui-table-view">
    111. 

  111. 			<li class="mui-table-view-cell">
    112. 

  112. 				<a class="mui-navigate-right" id="open-wechat-addres-a">
    113. 

  113. 					收货地址<span class="mui-h5">请选择收货地址</span>
    114. 

  114. 					<!-- <ul class="ft-12" style="color: #333;">
    115. 

  115.                         <li>收  货  人：林林</li>
    116. 

  116.                         <li>手 机 号：15999999999</li>
    117. 

  117.                         <li>详细地址：广东省深圳市福田区莲花街道特区报业大厦12B</li>
    118. 

  118.                     </ul> -->
    119. 

  119. 				</a>
    120. 

  120. 			</li>
    121. 

  121. 		</ul>
    122. 

  122. 	</div>
    123. 

  123. </div>
    124. 

  124. <div class="buy-footer">
    125. 

  125. 	<button type="button" data-loading-icon="mui-spinner mui-spinner-custom" data-loading-text="提交中" class="mui-btn mui-btn-block mui-btn-outlined mui-active" id="btn_submit" disabled="disabled">确认领取</button>
    126. 

  126. </div>
    127. 

  127. <script src="/js/mui.min.js"></script>
    128. 

  128. <script src="/js/jquery-2.1.1.min.js"></script>
    129. 

  129. <script src="/js/shop/main.js"></script>
    130. 

  130. <script src="/js/shop/wechat-utils-1.0.js?v=201706001"></script>
    131. 

  131. <script type="text/javascript">
    132. 

  132.     var check = false, alert_msg = '';
    133. 

  133.     var agentMachineId =getParam("agentMachineId");
    134. 

  134.     mui.ready(function(){
    135. 

  135.         mui.ajax(base_path + '/giftCard/card/product/details?dates=' + new Date().getTime(), {
    136. 

  136.             data: {"agentMachineId":agentMachineId},
    137. 

  137.             dataType: 'json',
    138. 

  138.             type: 'post',
    139. 

  139.             timeout: 15000,
    140. 

  140.             success: function(dt) {
    141. 

  141.                 //console.log(dt);
    142. 

  142.                 if(dt.isRedirect) {
    143. 

  143.                     location.href = dt.redirectURL;
    144. 

  144.                 } else {
    145. 

  145.                     if(dt.returnCode=="200" && dt.resultCode=="200"){
    146. 

  146.                         if (typeof(dt.returnMsg.msg) != "undefined"){
    147. 

  147.                             if(dt.returnMsg.msg==2){
    148. 

  148.                                 mui.alert("已经领取过，请在赠品订单列表查看",'',function(){
    149. 

  149.                                     mui.openWindow({url: '/watero/view/gift_card_give_order_list.html'})
    150. 

  150.                                 });
    151. 

  151.                             }
    152. 

  152.                         }
    153. 

  153.                         var table = document.body.querySelector('.ul_radio');
    154. 

  154.                         mui(dt.returnMsg.colors).each(function(index) {
    155. 

  155.                             var li = document.createElement('li');
    156. 

  156.                             if(index==0){
    157. 

  157.                                 li.className ='radio'+this.colorId+' active';
    158. 

  158.                             }else{
    159. 

  159.                                 li.className ='radio'+this.colorId;
    160. 

  160.                             }
    161. 

  161.                             li.setAttribute("id",this.colorId);
    162. 

  162.                             table.appendChild(li);
    163. 

  163.                         });
    164. 

  164.                         $(".ul_radio li").each(function() {
    165. 

  165.                             $(this).on("click", function() {
    166. 

  166.                                 $(this).addClass("active");
    167. 

  167.                                 $(this).siblings().removeClass("active");
    168. 

  168.                             });
    169. 

  169.                         });
    170. 

  170.                         document.querySelector('.loading-bg').style.display='none';
    171. 

  171.                     }else{
    172. 

  172.                         mui.alert(dt.resultMsg);
    173. 

  173.                     }
    174. 

  174.                 }
    175. 

  175.             },
    176. 

  176.             error: function(xhr, type, errorThrown) {
    177. 

  177.                 console.log(xhr)
    178. 

  178.             }
    179. 

  179.         });
    180. 

  180.     });
    181. 

  181.     var address='',nickname='',ads_tel='';
    182. 

  182.     // 获取微信共享地址
    183. 

  183.     mui('body').on('tap', '#open-wechat-addres-a', function() {
    184. 

  184.         editAddrV1(
    185. 

  185.             function(res) {
    186. 

  186.                 // 用户成功拉出地址
    187. 

  187.                 address = res.provinceName + "-" + res.cityName + "-" + res.countryName + "-" + res.detailInfo;
    188. 

  188.                 nickname=res.userName;
    189. 

  189.                 ads_tel= res.telNumber;
    190. 

  190.                 wechatAddr.status = true;
    191. 

  191.                 wechatAddr.detailInfo = address;
    192. 

  192.                 wechatAddr.postalCode = res.postalCode;
    193. 

  193.                 wechatAddr.userName = res.userName;
    194. 

  194.                 wechatAddr.userTel = res.telNumber;
    195. 

  195.                 wechatAddr.nationalCode = res.nationalCode;
    196. 

  196.                 $("#open-wechat-addres-a").empty().append('<ul class="ft-12" style="color: #333;"><li>收  货  人：'+ wechatAddr.userName +'</li><li>手 机 号：' + wechatAddr.userTel + '</li><li>详细地址：'+ wechatAddr.detailInfo+'</li></ul>');
    197. 

  197.                 $("#btn_submit").removeClass("mui-active").removeAttr("disabled");
    198. 

  198.             },
    199. 

  199.             function() {
    200. 

  200.                 if($('#open-wechat-addres-a').html() != null && $('#open-wechat-addres-a').html() != '') {
    201. 

  201.                     wechatAddr.status = true;
    202. 

  202.                     $("#btn_submit").removeClass("mui-active").removeAttr("disabled");
    203. 

  203.                 } else {
    204. 

  204.                     wechatAddr.status = false;
    205. 

  205.                     // 用户取消拉出地址
    206. 

  206.                     $('#open-wechat-addres-a').html('收货地址<span class="mui-h5">请选择收货地址</span>');
    207. 

  207.                     mui.alert("您没有选择收货地址!");
    208. 

  208.                 }
    209. 

  209.             }
    210. 

  210.         );
    211. 

  211. 

  212.     });
    213. 

  213.     mui('body').on('tap','#btn_submit',function() {
    214. 

  214.         if(wechatAddr.status){
    215. 

  215.             mui(this).button('loading');
    216. 

  216.             var param = {
    217. 

  217.                 "agentMachineColorId":$(".ul_radio .active").attr("id"),
    218. 

  218.                 "agentMachineId": agentMachineId,
    219. 

  219.                 "agentMachineAddressInfo": address,
    220. 

  220.                 "agentMachineAddressName":nickname,
    221. 

  221.                 "agentMachineAddressTel":ads_tel ,
    222. 

  222.             };
    223. 

  223.             $.ajax({
    224. 

  224.                 type: 'post',
    225. 

  225.                 url: base_path+'/giftCard/card/updateAgentMachine?dates=' + new Date().getTime(),
    226. 

  226.                 data:param,
    227. 

  227.                 dataType: 'json',
    228. 

  228.                 timeout: 15000,
    229. 

  229.                 success: function(dt) {
    230. 

  230.                     //console.log(dt);
    231. 

  231.                     if(dt.resultCode=="200" && dt.returnCode=="200") {
    232. 

  232.                         mui.openWindow({url: '/watero/view/gift_card_give_order_list.html'})
    233. 

  233.                     } else {
    234. 

  234.                         mui(th).button('reset');
    235. 

  235.                         mui.alert(dt.returnMsg);
    236. 

  236.                     }
    237. 

  237.                 },
    238. 

  238.                 error: function(xhr, type, errorThrown) {
    239. 

  239.                     //异常处理；
    240. 

  240.                     console.log(xhr);
    241. 

  241.                     mui.alert("请检查网络或刷新页面重试！");
    242. 

  242.                     mui(th).button('reset');
    243. 

  243.                 }
    244. 

  244.             });
    245. 

  245.         }else{
    246. 

  246.             mui.alert("请选择收货信息");
    247. 

  247.         }
    248. 

  248.     });
    249. 

  249. </script>
    250. 

  250. </body>
    251. 

  251. </html>
    252. 

  252.