login.html 3.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  5. <!-- 避免IE使用兼容模式 -->
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
  7. <meta name="renderer" content="webkit">
  8. <title>系统登录</title>
  9. <link rel="shortcut icon" href="/static/logo.png"/>
  10. <link type="text/css" rel="stylesheet" href="/static/plugins/font-awesome/css/font-awesome.min.css"/>
  11. <link type="text/css" rel="stylesheet" href="/static/css/login.css"/>
  12. </head>
  13. <body>
  14. <div class="login-body">
  15. <div class="login-body-box">
  16. <form id="form" method="post">
  17. <dl class="login-dl-form">
  18. <dt class="login-dl-title">家园公众号管理系统</dt>
  19. <dd>
  20. <div class="login-dl-name">用户名</div>
  21. <div class="login-dl-info">
  22. <input id="loginName" name="loginName" type="text" placeholder="请输入用户名/工卡号"
  23. style="font-size:14px;"/>
  24. <i class="fa fa-user"></i>
  25. </div>
  26. </dd>
  27. <dd>
  28. <div class="login-dl-name">密码</div>
  29. <div class="login-dl-info">
  30. <input id="loginPwd" name="loginPwd" type="password" placeholder="请输入密码"
  31. style="font-size:14px;"/>
  32. <i class="fa fa-unlock-alt"></i>
  33. </div>
  34. </dd>
  35. <dd class="errorinfo"></dd>
  36. </dl>
  37. <dl class="login-dl-submit"><a class="submit">登录</a></dl>
  38. </form>
  39. </div>
  40. </div>
  41. </body>
  42. </html>
  43. <!-- jQuery相关引用 -->
  44. <script type="text/javascript" src="/static/plugins/jquery/jquery.min.js"></script>
  45. <script type="text/javascript" src="/static/plugins/jquery/jquery.cookie.js"></script>
  46. <script type="text/javascript" src="/app.js"></script>
  47. <script type="text/javascript" src="/app/whepi/env.js"></script>
  48. <script>
  49. $(function () {
  50. $('.submit').click(function () {
  51. $('.errorinfo').html('');
  52. if (!$('#loginName').val()) {
  53. $('.errorinfo').html('请填写用户名');
  54. return;
  55. }
  56. if (!$('#loginPwd').val()) {
  57. $('.errorinfo').html('请填写密码');
  58. return;
  59. }
  60. $('#form').submit();
  61. });
  62. $(document).keyup(function (event) {
  63. if (event.keyCode === 13) {
  64. $(".submit").trigger("click");
  65. }
  66. });
  67. $('#form').submit(function () {
  68. $.ajax({
  69. url: api('/user/login.json'),
  70. crossDomain: true,
  71. type: 'post',
  72. data: {
  73. loginName: $('#loginName').val(),
  74. loginPwd: $('#loginPwd').val()
  75. },
  76. success: function (root) {
  77. if (!root.success) {
  78. $('.errorinfo').html(root.msg);
  79. } else {
  80. $.cookie('auth', root.data.token, {path: '/'});
  81. window.location.href = '/app/whepi/index.html#';
  82. }
  83. },
  84. error: function () {
  85. $('.errorinfo').html('网络异常');
  86. }
  87. });
  88. return false;
  89. });
  90. });
  91. </script>