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.
 
 
 
 
 

235 linhas
6.7 KiB

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  5. <meta charset="utf-8">
  6. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
  7. <!-- 控制浏览器缓存-->
  8. <meta http-equiv="Cache-Control" content="no-store">
  9. <!-- 优先使用 IE 最新版本和 Chrome-->
  10. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  11. <!-- 页面描述-->
  12. <meta name="description" content="不超过150个字符">
  13. <!-- 页面关键词-->
  14. <meta name="keywords" content="">
  15. <title>支付金额</title>
  16. <style>
  17. * {
  18. margin: 0;
  19. padding: 0;
  20. box-sizing: border-box;
  21. }
  22. html,
  23. body {
  24. height: 100%;
  25. overflow: hidden;
  26. }
  27. .clearfix:after {
  28. content: "\200B";
  29. display: block;
  30. height: 0;
  31. clear: both;
  32. }
  33. .clearfix {
  34. *zoom: 1;
  35. }
  36. /*IE/7/6*/
  37. .shuru div::-webkit-scrollbar {
  38. width: 0;
  39. height: 0;
  40. -webkit-transition: 1s;
  41. }
  42. .shuru div::-webkit-scrollbar-thumb {
  43. background-color: #a7afb4;
  44. background-clip: padding-box;
  45. min-height: 28px;
  46. }
  47. .shuru div::-webkit-scrollbar-thumb:hover {
  48. background-color: #525252;
  49. background-clip: padding-box;
  50. min-height: 28px;
  51. }
  52. .shuru div::-webkit-scrollbar-track-piece {
  53. background-color: #ccd0d2;
  54. }
  55. .wrap {
  56. position: relative;
  57. margin: auto;
  58. max-width: 640px;
  59. min-width: 320px;
  60. width: 100%;
  61. height: 100%;
  62. background: #F0EFF5;
  63. overflow: hidden;
  64. }
  65. .layer-content {
  66. position: absolute;
  67. left: 50%;
  68. bottom: -200px;
  69. width: 100%;
  70. max-width: 640px;
  71. height: auto;
  72. z-index: 12;
  73. -webkit-transform: translateX(-50%);
  74. transform: translateX(-50%);
  75. }
  76. /* 输入表单 */
  77. .edit_cash {
  78. display: block;
  79. margin-top: 15px;
  80. padding: 15px;
  81. margin: 0 auto;
  82. width: 90%;
  83. border: 1px solid #CFCFCF;
  84. border-radius: 10px;
  85. background-color: #fff;
  86. }
  87. .edit_cash p {
  88. font-size: 14px;
  89. color: #8D8D8F;
  90. }
  91. .shuru {
  92. position: relative;
  93. margin-bottom: 10px;
  94. }
  95. .shuru div {
  96. border: none;
  97. width: 100%;
  98. height: 50px;
  99. font-size: 25px;
  100. line-height: 50px;
  101. border-bottom: 1px solid #CFCFCF;
  102. text-indent: 30px;
  103. outline: none;
  104. white-space: pre;
  105. overflow-x: scroll;
  106. }
  107. .shuru span {
  108. position: absolute;
  109. top: 5px;
  110. font-size: 25px;
  111. }
  112. .submit {
  113. display: block;
  114. margin: 20px auto 0;
  115. width: 90%;
  116. height: 40px;
  117. font-size: 16px;
  118. color: #fff;
  119. background: #80D983;
  120. border: 1px solid #47D14C;
  121. border-radius: 3px;
  122. }
  123. /* 键盘 */
  124. .form_edit {
  125. width: 100%;
  126. background: #D1D4DD;
  127. }
  128. .form_edit > div {
  129. margin-bottom: 2px;
  130. margin-right: 0.5%;
  131. float: left;
  132. width: 33%;
  133. height: 45px;
  134. text-align: center;
  135. color: #333;
  136. line-height: 45px;
  137. font-size: 18px;
  138. font-weight: 600;
  139. background-color: #fff;
  140. border-radius: 5px;
  141. }
  142. .form_edit > div:nth-child(3n) {
  143. margin-right: 0;
  144. }
  145. .form_edit > div:last-child {
  146. background-color: #DEE1E9;
  147. }
  148. </style>
  149. </head>
  150. <body>
  151. <div class="wrap" style="padding-top: 20px;">
  152. <div style="text-align: left;font-size: 24px;font-weight: 900;margin-bottom: 5px;margin-left: 35px"><?php echo $orderInfo['pro_cate_name']; ?></div>
  153. <div style="text-align: left;font-size: 16px;margin-bottom: 5px;margin-left: 35px;">购买数量:<?php echo $orderInfo['prod_cnt']; ?></div>
  154. <div style="text-align: left;font-size: 16px;margin-bottom: 5px;margin-left: 35px">联系人:<?php echo $orderInfo['contacts_name']; ?></div>
  155. <div style="text-align: left;font-size: 16px;margin-bottom: 5px;margin-left: 35px">手机号:<?php echo $orderInfo['contacts_phone']; ?></div>
  156. <div style="text-align: left;font-size: 16px;margin-bottom: 5px;margin-left: 35px">出游时间:<?php echo $orderInfo['run_time']; ?></div>
  157. <form action="" class="edit_cash">
  158. <p>消费总额</p>
  159. <div class="shuru">
  160. <span>¥</span>
  161. <div id="div"><?php echo $params['total_fee']; ?></div>
  162. </div>
  163. </form>
  164. <input value="确认支付" class="submit" type="button" onclick="call();">
  165. </div>
  166. </body>
  167. <script type="text/javascript">
  168. // window.onload = function () {
  169. // if (typeof WeixinJSBridge == "undefined") {
  170. // if (document.addEventListener) {
  171. // document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
  172. // } else if (document.attachEvent) {
  173. // document.attachEvent('WeixinJSBridgeReady', jsApiCall);
  174. // document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
  175. // }
  176. // } else {
  177. // jsApiCall();
  178. // }
  179. // };
  180. function call() {
  181. if (typeof WeixinJSBridge == "undefined") {
  182. if (document.addEventListener) {
  183. document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
  184. } else if (document.attachEvent) {
  185. document.attachEvent('WeixinJSBridgeReady', jsApiCall);
  186. document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
  187. }
  188. } else {
  189. jsApiCall();
  190. }
  191. }
  192. //调用微信JS api 支付
  193. function jsApiCall() {
  194. WeixinJSBridge.invoke(
  195. 'getBrandWCPayRequest',
  196. <?php echo json_encode($info); ?>,
  197. function (res) {
  198. WeixinJSBridge.log(res.err_msg);
  199. if (res.err_msg == 'get_brand_wcpay_request:ok') {
  200. alert('支付成功');
  201. } else if (res.err_msg == 'get_brand_wcpay_request:cancel') {
  202. alert('支付取消');
  203. } else {
  204. alert('支付失败');
  205. }
  206. }
  207. );
  208. }
  209. </script>
  210. </html>