profile.html 8.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241
  1. <!doctype html>
  2. <html class="no-js">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="description" content="">
  7. <meta name="keywords" content="">
  8. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  9. <title>收款方式</title>
  10. <!-- Set render engine for 360 browser -->
  11. <meta name="renderer" content="webkit">
  12. <link rel="stylesheet" href="__CDN__/assets/shop/css/amazeui.css">
  13. <link rel="stylesheet" href="__CDN__/assets/shop/css/app.css">
  14. <style type="text/css">
  15. div[data-html=form] .am-form .am-form-group{
  16. margin-bottom: 1rem;
  17. border-radius: 10px;
  18. }
  19. .userIcon{
  20. width: 50px;
  21. height: 50px;
  22. margin: 0 0 0 73%;
  23. }
  24. .icon-cearma{
  25. position: absolute;
  26. bottom: 1%;
  27. right: 5%;
  28. width: 24px;
  29. }
  30. #up-img-touch{ position: relative;}
  31. #up-img-touch1{ position: relative;}
  32. #file,#file1{
  33. position: absolute;
  34. top: 0;
  35. width: 100%;
  36. height: 100%;
  37. opacity: 0;
  38. cursor: pointer;
  39. }
  40. </style>
  41. </head>
  42. <body class="">
  43. <!-- Header -->
  44. <header data-am-widget="header" class="am-header am-header-default">
  45. <div class="am-header-left am-header-nav">
  46. <a href="javascript:void(0);" onclick="javascript:history.back(-1);return false;"><i class="am-header-icon am-icon-angle-left"></i></a>
  47. </div>
  48. <h1 class="am-header-title">
  49. <a href="#title-link">收款方式</a>
  50. </h1>
  51. </header>
  52. <!-- Content -->
  53. <div class="wapper " data-html="form" style="padding-top:49px">
  54. <div class=" am-form am-form-horizontal invest-form am-padding-bottom-xs" >
  55. <div class="am-link-muted am-padding-xs">USDT收款</div>
  56. <div class="am-bg-white">
  57. <div class="am-form-group sc-bg">
  58. <label class="am-u-sm-3 am-form-label">输入钱包地址</label>
  59. <div class="am-u-sm-9">
  60. <input type="text" class=" am-text-right" placeholder="{:__('请输入USDT钱包地址')}" name="usdt_address" value="{$user.usdt_address}">
  61. </div>
  62. </div>
  63. </div>
  64. <div class="am-link-muted am-padding-xs">银行收款</div>
  65. <div class="am-bg-white">
  66. <div class="am-form-group sc-bg">
  67. <label class="am-u-sm-3 am-form-label">输入银行</label>
  68. <div class="am-u-sm-9">
  69. <input type="text" class=" am-text-right" placeholder="{:__('请输入银行')}" name="bank" value="{$user.bank}">
  70. </div>
  71. </div>
  72. <div class="am-form-group sc-bg">
  73. <label class="am-u-sm-3 am-form-label">持卡人</label>
  74. <div class="am-u-sm-9">
  75. <input type="text" class="am-text-right " placeholder="{:__('请输入持卡人姓名')}" name="bank_user_name" value="{$user.bank_user_name}">
  76. </div>
  77. </div>
  78. <div class="am-form-group sc-bg" style="margin-bottom:0!important;">
  79. <label class="am-u-sm-3 am-form-label">银行卡号</label>
  80. <div class="am-u-sm-9">
  81. <input type="text" class=" am-text-right" placeholder="{:__('请输入银行卡号')}" name="bank_number" value="{$user.bank_number}">
  82. </div>
  83. </div>
  84. </div>
  85. <div class="am-link-muted am-padding-xs">微信收款</div>
  86. <div class="am-bg-white">
  87. <div class=" am-form-group sc-bg" style="margin-bottom:0!important;">
  88. <label class="am-u-sm-6 am-form-label"><img src="__CDN__/assets/shop/img/wx.png" width="30"/>微信收款码</label>
  89. <div class="am-u-sm-6 am-text-right">
  90. <div class=" userIcon " id="up-img-touch1">
  91. <form id="form2" class="am-form am-form-horizontal" method="post" enctype="multipart/form-data">
  92. <img src="{$user.wxprc|default='__CDN__/assets/shop/img/upload.png'}" id="img1" width="50" height="50"/>
  93. <input type="file" id="file1" name="file" />
  94. </form>
  95. </div>
  96. </div>
  97. </div>
  98. </div>
  99. <div class="am-link-muted am-padding-xs">支付宝收款</div>
  100. <div class="am-bg-white">
  101. <div class=" am-form-group sc-bg">
  102. <label class="am-u-sm-6 am-form-label"><img src="__CDN__/assets/shop/img/alipay.png" width="30"/>支付宝收款码</label>
  103. <div class="am-u-sm-6 am-text-right">
  104. <div class=" userIcon" id="up-img-touch">
  105. <form id="form1" class="am-form am-form-horizontal" method="post" enctype="multipart/form-data">
  106. <img src="{$user.wxprc|default='__CDN__/assets/shop/img/upload.png'}" id="img" width="50" height="50"/>
  107. <input type="file" id="file" name="file" />
  108. </form>
  109. </div>
  110. </div>
  111. </div>
  112. <div class="am-form-group sc-bg">
  113. <label class="am-u-sm-3 am-form-label">支付宝账号</label>
  114. <div class="am-u-sm-9">
  115. <input type="text" class="am-text-right" placeholder="{:__('请输入支付宝账号')}" name="alipayname" value="{$user.alipayname}">
  116. </div>
  117. </div>
  118. </div>
  119. </div>
  120. </div>
  121. <input type="hidden" name="alipayprc" id="alipayprc" value="{$user.alipayprc}"/>
  122. <input type="hidden" name="wxprc" id="wxprc" value="{$user.wxprc}"/>
  123. <div class="am-margin-xl">
  124. <button type="button" class="am-btn am-btn-black am-round am-btn-block" id="submit">保存</button>
  125. </div>
  126. <script src="__CDN__/assets/shop/js/jquery.min.js"></script>
  127. <script src="__CDN__/assets/shop/js/amazeui.min.js"></script>
  128. <script src="__CDN__/assets/libs/layer/layer.js"></script>
  129. <script>
  130. var file = document.getElementById('file');
  131. var image = document.getElementById("img");
  132. var file1 = document.getElementById('file1');
  133. var image1 = document.getElementById("img1");
  134. file.onchange = function() {
  135. var fileData = this.files[0];//获取到一个FileList对象中的第一个文件( File 对象),是我们上传的文件
  136. var pettern = /^image/;
  137. console.info(fileData.type)
  138. if (!pettern.test(fileData.type)) {
  139. layer.msg("图片格式不正确");
  140. return;
  141. }
  142. var reader = new FileReader();
  143. reader.readAsDataURL(fileData);//异步读取文件内容,结果用data:url的字符串形式表示
  144. /*当读取操作成功完成时调用*/
  145. reader.onload = function (e) {
  146. console.log(e); //查看对象
  147. image.setAttribute("src", this.result)
  148. }
  149. var formData = new FormData($("#form1")[0]);
  150. $.ajax({
  151. //几个参数需要注意一下
  152. type: "POST",//方法类型
  153. dataType: "json",//预期服务器返回的数据类型
  154. url: "{:url('ajax/upload')}",
  155. data: formData,
  156. contentType: false, //不设置内容类型
  157. processData: false, //不处理数据
  158. success: function (result) {
  159. if (result.code > 0) {
  160. $('#img').attr('src', result.data.url);
  161. $('#alipayprc').val(result.data.url);
  162. } else {
  163. layer.msg(result.msg);
  164. }
  165. },
  166. error: function () {
  167. layer.msg("网络异常!");
  168. }
  169. });
  170. }
  171. file1.onchange = function() {
  172. var fileData = this.files[0];//获取到一个FileList对象中的第一个文件( File 对象),是我们上传的文件
  173. var pettern = /^image/;
  174. console.info(fileData.type)
  175. if (!pettern.test(fileData.type)) {
  176. layer.msg("图片格式不正确");
  177. return;
  178. }
  179. var reader = new FileReader();
  180. reader.readAsDataURL(fileData);//异步读取文件内容,结果用data:url的字符串形式表示
  181. /*当读取操作成功完成时调用*/
  182. reader.onload = function(e) {
  183. console.log(e); //查看对象
  184. image1.setAttribute("src", this.result)
  185. }
  186. var formData = new FormData($( "#form2" )[0]);
  187. $.ajax({
  188. //几个参数需要注意一下
  189. type: "POST",//方法类型
  190. dataType: "json",//预期服务器返回的数据类型
  191. url: "{:url('ajax/upload')}" ,
  192. data: formData,
  193. contentType: false, //不设置内容类型
  194. processData: false, //不处理数据
  195. success: function (result) {
  196. if(result.code>0)
  197. {
  198. $('#img1').attr('src',result.data.url);
  199. $('#wxprc').val(result.data.url);
  200. }else{
  201. layer.msg(result.msg);
  202. }
  203. },
  204. error : function() {
  205. layer.msg("网络异常!");
  206. }
  207. });
  208. }
  209. $('#submit').click(function(){
  210. var params={};
  211. params.alipayname=$('input[name=alipayname]').val();
  212. params.alipayprc=$('#alipayprc').val();
  213. params. wxprc=$('#wxprc').val();
  214. params.usdt_address=$('input[name=usdt_address]').val();
  215. // params.alipayname='';
  216. // params.alipayprc='';
  217. // params.wxprc='';
  218. params.bank=$('input[name=bank]').val();
  219. params.bank_number=$('input[name=bank_number]').val();
  220. params.bank_user_name=$('input[name=bank_user_name]').val();
  221. params.verify=$('#verify').val();
  222. jQuery.post("{:url('api/user/profile')}" ,params,function(data) {
  223. if(data.code>0)
  224. {
  225. layer.msg(data.msg,{time:500},function(){
  226. location="index.html";
  227. });
  228. }else{
  229. layer.msg(data.msg);
  230. }
  231. });
  232. });
  233. </script>
  234. </body>
  235. </html>