personal-info.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <title></title>
  7. <script src="../js/mui.min.js"></script>
  8. <script type="text/javascript" src="../js/common.js"></script>
  9. <script src="../js/routes.js"></script>
  10. <link href="../css/mui.min.css" rel="stylesheet" />
  11. <style>
  12. .mui-input-row {
  13. padding-top: 9px !important;
  14. height: 50px !important;
  15. }
  16. .mui-input-row:after {
  17. right: 15px !important;
  18. }
  19. .my-picture {
  20. height: 100px !important;
  21. }
  22. .my-radio {
  23. height: 30px;
  24. padding: 11px 15px;
  25. overflow: hidden;
  26. position: relative;
  27. }
  28. .my-span {
  29. position: relative;
  30. }
  31. label {
  32. width: 30% !important;
  33. }
  34. .my-mui-input-row:after {
  35. height: 0px !important;
  36. }
  37. </style>
  38. </head>
  39. <body>
  40. <header class="mui-bar mui-bar-nav">
  41. <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
  42. <h1 id="title-id" class="mui-title">个人信息完善</h1>
  43. </header>
  44. <div class="mui-content">
  45. <form id="info-form" class="mui-input-group" style="padding-top: 40px;">
  46. <div class="mui-input-row">
  47. <label>姓名</label>
  48. <input id="name" name="name" type="text" placeholder="请输入姓名">
  49. </div>
  50. <div class="mui-input-row">
  51. <label>身份证</label>
  52. <input id="code" name="code" type="text" placeholder="请输入身份证号">
  53. </div>
  54. <div class="mui-button-row" style="margin-top: 20px;padding-bottom: 30px;height: 50px !important;">
  55. <button type="button" id="sign-up-btn-id" class="mui-btn mui-btn-primary" style="width: 80%;" onclick="return false;">保存</button>&nbsp;&nbsp;
  56. </div>
  57. </form>
  58. </div>
  59. <script type="text/javascript">
  60. //报名
  61. function baoming() {
  62. var _name = document.getElementById('name').value.replace(/\s+/g, "");
  63. if (_name.length == 0) {
  64. mui.toast('请输入姓名');
  65. return;
  66. }
  67. var code = document.getElementById('code').value.replace(/\s+/g, "");
  68. var reg = new RegExp("^[1-9]([0-9]{16}|[0-9]{13})[xX0-9]$");
  69. if (code.length == 0) {
  70. mui.toast('请输入身份证');
  71. return;
  72. }
  73. // if (!reg.test(code)) {
  74. // mui.toast('请输入正确的身份证');
  75. // return;
  76. // }
  77. var url = Routes.urls.user.completeUserInfo;
  78. var param = {
  79. data: {
  80. username: _name,
  81. idcard: code,
  82. phone: window.phone,
  83. id:window.localStorage.getItem('userId')
  84. },
  85. dataType: 'json', //服务器返回json格式数据
  86. type: 'post', //HTTP请求类型
  87. timeout: 10000, //超时时间设置为10秒;
  88. success: function(data) {
  89. if (data && data.success) {
  90. mui.toast('更新完成');
  91. window.localStorage.setItem('username', _name);
  92. window.localStorage.setItem('idcard', code);
  93. mui.back();
  94. } else {
  95. if (data.message) {
  96. mui.toast(data.message);
  97. } else {
  98. mui.toast("系统繁忙,请稍候再试");
  99. }
  100. }
  101. },
  102. error: function(xhr, type, errorThrown) {
  103. mui.toast("网络异常");
  104. }
  105. };
  106. console.log(JSON.stringify(param))
  107. mui.ajax(url, param);
  108. }
  109. /**
  110. * 加载用户详细信息
  111. */
  112. function loadUserInfo() {
  113. var _userName = window.localStorage.getItem('username');
  114. var idcard = window.localStorage.getItem('idcard');
  115. if (_userName != "undefined") {
  116. document.getElementById('name').value = _userName;
  117. document.getElementById("code").value = idcard;
  118. }
  119. }
  120. mui.init();
  121. mui.plusReady(function() {
  122. window.phone = window.localStorage.getItem('phone');
  123. toastNetworkInfo("网络异常,请检查");
  124. loadUserInfo();
  125. document.getElementById("sign-up-btn-id").addEventListener('tap', function() {
  126. var result = toastNetworkInfo("网络异常,请检查");
  127. if (result) {
  128. baoming();
  129. }
  130. });
  131. });
  132. </script>
  133. </body>
  134. </html>