login.html.bak4 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <title>后台登陆管理</title>
  7. <meta name="renderer" content="webkit">
  8. <!-- core - css -->
  9. <link href="__PUBLIC__/B-JUI/themes/css/style.css" rel="stylesheet">
  10. <link href="__PUBLIC__/B-JUI/themes/blue/core.css" rel="stylesheet">
  11. <link href="__PUBLIC__/B-JUI/themes/css/fontsize.css" rel="stylesheet">
  12. <link href="__PUBLIC__/B-JUI/themes/css/FA/css/font-awesome.min.css" rel="stylesheet">
  13. <!-- init -->
  14. <link rel="stylesheet" href="__PUBLIC__/B-JUI/mycssandjava/mycss.css">
  15. <!-- bootstrap - css -->
  16. <link href="__PUBLIC__/B-JUI/themes/css/bootstrap.min.css" rel="stylesheet">
  17. <!--<link href="__PUBLIC__/B-JUI/themes/css/bootstrap.css" rel="stylesheet">-->
  18. <script src="__PUBLIC__/B-JUI/js/jquery-1.11.3.min.js"></script>
  19. <script src="__PUBLIC__/B-JUI/js/jquery.cookie.js"></script>
  20. <script src="__PUBLIC__/B-JUI/js/bjui-all.min.js"></script>
  21. <!--<script src="__PUBLIC__/B-JUI/plugins/bootstrap.min.js"></script>-->
  22. <!--<script src="__PUBLIC__/js/jquery.qrcode.js"></script>-->
  23. <script src="__PUBLIC__/js/qrcode.min.js"></script>
  24. <style>
  25. html, body { height: 100%; overflow: hidden; }
  26. body {
  27. font-family: "Verdana", "Tahoma", "Lucida Grande", "Microsoft YaHei", "Hiragino Sans GB", sans-serif;
  28. background: url(__PUBLIC__/images/loginbg_06.jpg) no-repeat center center fixed;
  29. background-size: cover;
  30. }
  31. .form-control{height:37px;}
  32. .main_box{position:absolute; top:45%; left:50%; margin:-200px 0 0 -180px; padding:15px 20px; width:360px; height:400px; min-width:320px; background:#FAFAFA; background:rgba(255,255,255,0.5); box-shadow: 1px 5px 8px #888888; border-radius:6px;}
  33. .login_msg{height:30px;}
  34. .input-group >.input-group-addon.code{padding:0;}
  35. #captcha_img{cursor:pointer;}
  36. .main_box .logo img{height:35px;}
  37. @media (min-width: 768px) {
  38. .main_box {margin-left:-240px; padding:15px 55px; width:480px;}
  39. .main_box .logo img{height:40px;}
  40. }
  41. .er{
  42. text-align: center;
  43. }
  44. .span{
  45. font-size: 24px;
  46. padding: 10px 0px 10px 0px;
  47. }
  48. .span1{
  49. font-size: 16px;
  50. padding: 10px 0px 10px 0px;
  51. }
  52. .code{
  53. display:inline-block;
  54. padding: 10px;
  55. /*margin: 10px;*/
  56. }
  57. </style>
  58. </head>
  59. <body>
  60. <div class="form-group" style="text-align:center; position:absolute; top:0px; width:100%;">
  61. <div id="ResMessage" style="margin:0px auto; width:980px;">
  62. </div>
  63. </div>
  64. <div class="container">
  65. <div class="main_box">
  66. <form action="__APP__/home/Public/login1" method="post" onsubmit="return toVaild()" >
  67. <input type="hidden" id="j_randomKey" name="j_randomKey" value="" />
  68. <input type="hidden" id="jfinal_token" name="jfinal_token" value="" />
  69. <input type="hidden" class="form-control" id="j_username" name="username" value="admin" placeholder="登录账号" >
  70. <!--<input type="hidden" class="form-control" id="j_password" name="password" value="15e1e49e643dfb95bb6xzxzx7f21f173457fe" placeholder="登录密码" >-->
  71. <input type="hidden" id="phonenumber" name="phonenumber" value="" />
  72. <input type="hidden" id="action" name="action" value="" />
  73. <div class="er">
  74. <div class="span">
  75. 登录后台管理平台
  76. </div>
  77. <div id="code" class="code"></div>
  78. <div class="span1">
  79. 请使用永天智慧云公众号扫码登录
  80. </div>
  81. <button type="submit" id="login_ok" class="btn btn-primary btn-lg">&nbsp;登&nbsp;录&nbsp;</button>&nbsp;&nbsp;&nbsp;&nbsp;
  82. </div>
  83. <div class="text-center">
  84. <hr>
  85. </div>
  86. </form>
  87. </div>
  88. </div>
  89. <script>
  90. //扫码登陆
  91. function newCode(str){
  92. var qrcode = new QRCode(document.getElementById("code"), {
  93. id: 'er_image',
  94. width : 200,
  95. height : 200
  96. });
  97. qrcode.makeCode(str);
  98. }
  99. // qrcode.clear(); // 清除代码
  100. var wsUri = "wss://iot.usky.cn:55120";
  101. var websocket = null;
  102. var initWebSocket = function() {
  103. try{
  104. websocket = new WebSocket(wsUri);
  105. websocket.onopen = function()
  106. {
  107. var json = {};
  108. json.actfrom = "loginpage";
  109. json.action = "query_ercode";
  110. websocket.send(JSON.stringify(json));
  111. setInterval(function(){
  112. websocket.send(JSON.stringify(json));
  113. },30000)
  114. };
  115. websocket.onmessage = function (evt)
  116. {
  117. console.log("Received:",evt.data);
  118. var jData = eval('(' + evt.data + ')');
  119. if (jData.action=="query_ercode"){
  120. document.getElementById("code").innerHTML = "";
  121. var evm_loing = jData.value;
  122. newCode(""+evm_loing);
  123. document.getElementById("code").title = '';
  124. }else if (jData.action=="loginphone"){
  125. websocket.close();
  126. var action = jData.action;
  127. var phonenumber = jData.phonenumber;
  128. document.getElementById("action").value='';
  129. document.getElementById("phonenumber").value='';
  130. document.getElementById("action").value=action;
  131. document.getElementById("phonenumber").value=phonenumber;
  132. document.getElementById("login_ok").click();
  133. }
  134. };
  135. websocket.onclose = function()
  136. {
  137. // 关闭 websocket
  138. console.log('连接已关闭...');
  139. // alert("连接已关闭...");
  140. };
  141. }catch(exception){
  142. console.log("Exception:",exception);
  143. (function(){})()
  144. }
  145. }
  146. $(document).ready(function(){
  147. $("#login_ok").hide();
  148. initWebSocket();
  149. });
  150. //扫码登陆
  151. var COOKIE_NAME = 'sys_em_username';
  152. $(function() {
  153. // choose_bg();
  154. // changeCode();
  155. if ($.cookie(COOKIE_NAME)){
  156. $("#j_username").val($.cookie(COOKIE_NAME));
  157. $("#j_password").focus();
  158. $("#j_remember").attr('checked', true);
  159. } else {
  160. $("#j_username").focus();
  161. }
  162. $("#captcha_img").click(function(){
  163. changeCode();
  164. });
  165. });
  166. {$almsg}
  167. function changeCode(){
  168. //$("#captcha_img").attr("src", "sys/login/getCaptcha?t="+ (new Date().getTime()));
  169. }
  170. function choose_bg() {
  171. var bg = Math.floor(Math.random() * 9 + 1);
  172. $('body').css('background-image', 'url(/spcrm/Public/images/loginbg_0'+ bg +'.jpg)');
  173. }
  174. function AltMessage(part){
  175. document.getElementById('ResMessage').innerHTML='<div class="alert alert-danger alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><strong>'+part+'</strong></div>';
  176. setTimeout(function (){
  177. document.getElementById('ResMessage').innerHTML='';
  178. }, 3000)
  179. }
  180. function toVaild(){
  181. var val = document.getElementById("j_username").value;
  182. // var verify = document.getElementById("j_password").value;
  183. if(val =="" ){
  184. AltMessage("登录账号或密码不能为空!");
  185. return false;
  186. }
  187. return true;
  188. }
  189. </script>
  190. </body>
  191. </html>