setting.html 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  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">
  9. <title>设置</title>
  10. <!-- Set render engine for 360 browser -->
  11. <meta name="renderer" content="webkit">
  12. <!-- No Baidu Siteapp-->
  13. <meta http-equiv="Cache-Control" content="no-siteapp" />
  14. <!-- Add to homescreen for Chrome on Android -->
  15. <meta name="mobile-web-app-capable" content="yes">
  16. <!-- Add to homescreen for Safari on iOS -->
  17. <meta name="apple-mobile-web-app-capable" content="yes">
  18. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  19. <meta name="apple-mobile-web-app-title" content="幸运生肖" />
  20. <!-- Tile icon for Win8 (144x144 + tile color) -->
  21. <meta name="msapplication-TileColor" content="#0e90d2">
  22. <link rel="stylesheet" href="__CDN__/assets/shop/css/amazeui.css">
  23. <link rel="stylesheet" href="__CDN__/assets/shop/css/app.css">
  24. <style>
  25. .am-list > li{border-bottom: 1px solid #eee}
  26. .userIcon{
  27. width: 40px;
  28. height: 40px;
  29. margin: 0 auto;
  30. }
  31. #img1{
  32. position: absolute;
  33. top: -5px;
  34. right:0;
  35. }
  36. .icon-cearma{
  37. position: absolute;
  38. bottom: 1%;
  39. right: 5%;
  40. width: 24px;
  41. }
  42. #up-img-touch{ position: relative;}
  43. #file{
  44. position: absolute;
  45. top: 0;
  46. width: 60px;
  47. height: 100%;
  48. opacity: 0;
  49. cursor: pointer;
  50. left:-50px;
  51. }
  52. </style>
  53. </head>
  54. <body>
  55. <!-- Header -->
  56. <header data-am-widget="header" class="am-header am-header-default">
  57. <div class="am-header-left am-header-nav">
  58. <a href="javascript:void(0);" onclick="javascript:history.back(-1);return false;"><i class="am-header-icon am-icon-angle-left"></i></a>
  59. </div>
  60. <h1 class="am-header-title">
  61. <a href="#title-link">设置</a>
  62. </h1>
  63. <div class="am-header-right am-header-nav"></div>
  64. </header>
  65. <!-- Content -->
  66. <div class="wapper">
  67. <div class="am-margin-bottom-xs">
  68. <ul class="am-list am-list-static am-list-border am-margin-bottom-0">
  69. <li>
  70. <span>头像</span>
  71. <span class="am-fr am-link-muted">
  72. <em class="am-text-black userIcon" id="up-img-touch">
  73. <form id="form1" class="am-form am-form-horizontal" method="post" enctype="multipart/form-data">
  74. <img src="{$user.avatar|default='__CDN__/assets/shop/img/avatar.png'}" id="img1" class="am-round"width="30" />
  75. <input type="file" id="file" name="file" />
  76. </form>
  77. </em>
  78. <i class="am-icon am-icon-angle-right am-padding-left-sm"></i>
  79. </span>
  80. </li>
  81. <li onclick="window.location.href='updatenickname.html'">
  82. <span>昵称</span>
  83. <span class="am-fr am-link-muted am-padding-left-sm">{$user.nickname} <em class="am-icon am-icon-angle-right"></em></span>
  84. </li>
  85. <li>
  86. <span>手机号</span>
  87. <span class="am-fr am-link-muted">{$user.mobile}</span>
  88. </li>
  89. <li>
  90. <span>推荐人</span>
  91. <span class="am-fr am-link-muted">{$user.referee_name}</span>
  92. </li>
  93. <li>
  94. <span>房间号</span>
  95. <span class="am-fr am-link-muted">{$user.login_studio}</span>
  96. </li>
  97. <li onclick="window.location.href='updatepwd1.html'">
  98. <span>修改登录密码</span>
  99. <span class="am-fr am-link-muted am-icon am-icon-angle-right am-padding-left-sm"></span>
  100. </li>
  101. <li onclick="window.location.href='updatepwd2.html'">
  102. <span>修改支付密码</span>
  103. <span class="am-fr am-link-muted am-icon am-icon-angle-right am-padding-left-sm"></span>
  104. </li>
  105. <li onclick="cache()">
  106. <span>清楚缓存</span>
  107. <span class="am-fr am-link-muted am-icon am-icon-angle-right am-padding-left-sm"></span>
  108. </li>
  109. <li >
  110. <span>当前版本</span>
  111. <span class="am-fr am-link-muted am-padding-left-sm">{:config('site')['banben']}</span>
  112. </li>
  113. </ul>
  114. </div>
  115. <div class="am-margin-xl">
  116. <button type="button" class="am-btn am-btn-black am-round am-btn-block" onclick="window.location='logout'">安全退出</button>
  117. </div>
  118. </div>
  119. <!--[if (gte IE 9)|!(IE)]><!-->
  120. <script src="__CDN__/assets/shop/js/jquery.min.js"></script>
  121. <!--<![endif]-->
  122. <!--[if lte IE 8 ]>
  123. <script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
  124. <script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
  125. <script src="__CDN__/assets/shop/js/amazeui.ie8polyfill.min.js"></script>
  126. <![endif]-->
  127. <script src="__CDN__/assets/shop/js/amazeui.min.js"></script>
  128. <script src="__CDN__/assets/shop/js/app.js"></script>
  129. <script src="__CDN__/assets/libs/layer/layer.js"></script>
  130. <script>
  131. /*上传头像*/
  132. var file = document.getElementById('file');
  133. var image = 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. {
  161. $('input[name=avatar]').val(result.data.url);
  162. jQuery.post("{:url('api/user/toupdateuserinfo')}" ,{avatar:result.data.url},function(data) {
  163. if(data.code>0)
  164. {
  165. layer.msg(data.msg,{time:500},function(){
  166. locaiton=location;
  167. });
  168. }else{
  169. layer.msg(data.msg);
  170. }
  171. });
  172. }else{
  173. layer.msg(result.msg);
  174. }
  175. },
  176. error : function() {
  177. layer.msg("网络异常!");
  178. }
  179. });
  180. }
  181. function cache()
  182. {
  183. jQuery.post("{:url('shop/ajax/clearcache')}" ,{},function(data) {
  184. if(data.code>0)
  185. {
  186. layer.msg('执行完毕');
  187. }else{
  188. layer.msg('网络错误,请重新操作~');
  189. }
  190. });
  191. }
  192. </script>
  193. </body>
  194. </html>