qrcode.html 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. <!doctype html>
  2. <html class="x-admin-sm">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>后台登录-X-admin2.2</title>
  6. <meta name="renderer" content="webkit|ie-comp|ie-stand">
  7. <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  8. <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
  9. <meta http-equiv="Cache-Control" content="no-siteapp" />
  10. <link rel="stylesheet" href="/static/layui/css/font.css">
  11. <link rel="stylesheet" href="/static/layui/css/login.css">
  12. <link rel="stylesheet" href="/static/layui/css/xadmin.css">
  13. <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
  14. <script src="/static/layui/lib/layui/layui.js" charset="utf-8"></script>
  15. <style>
  16. .qrcode_image_container img{
  17. width:100%;
  18. }
  19. .qrcode_image_container h4 {
  20. text-align:center;
  21. top:47%;
  22. left:47%;
  23. transform:translate(-50%,-50%);
  24. position:absolute;
  25. font-weight: bold;
  26. }
  27. .qrcode_image_container .expier_cont {
  28. width: 340px;
  29. height: 340px;
  30. position: absolute;
  31. background: rgba(255,255,255,.95);
  32. left: 50px;
  33. top: 150px;
  34. z-index: 9999;
  35. }
  36. </style>
  37. <!--[if lt IE 9]>
  38. <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
  39. <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
  40. <![endif]-->
  41. </head>
  42. <body class="login-bg">
  43. <div class="login layui-anim layui-anim-up">
  44. <div class="message"><strong style="padding:0px 0px 0px 20px;font-size:18px;">微信扫码登录</strong></div>
  45. <div id="darkbannerwrap"></div>
  46. <div class="qrcode_image_container">
  47. <img src="{$srcUrl}" id ="wxewm">
  48. <div class="expier_cont" style="display: none;"> <h4>二维码已失效,请重新刷新页面</h4></div>
  49. </div>
  50. <input type="hidden" name="code" value="{$state}">
  51. </div>
  52. <script>
  53. var t1 = '';
  54. $(function () {
  55. t1 = window.setInterval("login()",2000);
  56. setTimeout("end()",120000);
  57. });
  58. function end(){ //停止定时器
  59. $('.expier_cont').css('display','block');
  60. clearInterval(t1); //清除定时器
  61. }
  62. // window 失去焦点,停止输出
  63. window.onblur = function() {
  64. clearInterval(t1);
  65. };
  66. // window 每次获得焦点
  67. window.onfocus = function() {
  68. t1 = window.setInterval("login()",2000);
  69. };
  70. function login(){ //验证是否扫描二维码
  71. var code =$('input[name=code]').val();
  72. var url = "/admin/index/weixinLogin";
  73. $.post(url,{state:code},function(data){
  74. if(data){
  75. window.location.href="/admin/index/index";
  76. }
  77. });
  78. }
  79. </script>
  80. <!-- 底部结束 -->
  81. <script>
  82. //百度统计可去掉
  83. var _hmt = _hmt || [];
  84. (function() {
  85. var hm = document.createElement("script");
  86. hm.src = "https://hm.baidu.com/hm.js?b393d153aeb26b46e9431fabaf0f6190";
  87. var s = document.getElementsByTagName("script")[0];
  88. s.parentNode.insertBefore(hm, s);
  89. })();
  90. </script>
  91. </body>
  92. </html>