index.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282
  1. <!DOCTYPE html>
  2. <html xmlns="http://www.w3.org/1999/html">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <title>安全猫官网</title>
  7. <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  8. <!-- Bootstrap 3.3.7 -->
  9. <link rel="stylesheet" href="{$Think.PLUGINS_SITE_ROOT}/layui/css/layui.css">
  10. <link rel="stylesheet" href="{$Think.USER_SITE_ROOT}/css/admin.css">
  11. <link rel="stylesheet" href="{$Think.USER_SITE_ROOT}/iconfont/iconfont.css">
  12. <script src="{$Think.PLUGINS_SITE_ROOT}/jquery-2.1.4.min.js"></script>
  13. <script src="{$Think.USER_SITE_ROOT}/js/admin.js"></script>
  14. <script type="text/javascript" src="{$Think.PLUGINS_SITE_ROOT}/layui/layui.js"></script>
  15. <script type="text/javascript">
  16. var BASESITEROOT = "{$Think.BASE_SITE_ROOT}";
  17. var ADMINSITEROOT = "{$Think.ADMIN_SITE_ROOT}";
  18. var BASESITEURL = "{$Think.BASE_SITE_URL}";
  19. var HOMESITEURL = "{$Think.HOME_SITE_URL}";
  20. var ADMINSITEURL = "{$Think.ADMIN_SITE_URL}";
  21. </script>
  22. </head>
  23. <style type="text/css">
  24. .layui-tab {
  25. position: absolute;
  26. left: 0;
  27. top: 0;
  28. height: 100%;
  29. width: 100%;
  30. z-index: 10;
  31. margin: 0;
  32. border: none;
  33. overflow: hidden;
  34. }
  35. .layui-tab-content {
  36. padding: 0;
  37. height: 100%;
  38. }
  39. .layui-tab-item {
  40. height: 100%;
  41. }
  42. .treeview .admin-nav-item{
  43. color: #a7b1c2 !important;
  44. padding-left: 5px;
  45. }
  46. .treeview .admin-nav-item:hover{
  47. color: #fff !important;
  48. }
  49. div.login_body{
  50. margin-top: -80px;
  51. }
  52. div.login_content div{
  53. margin-top: 30px;
  54. }
  55. ul#nav{
  56. float: right;
  57. }
  58. ul#nav a{
  59. font-size: 16px;
  60. color: black;
  61. margin-left: 20px;
  62. margin-right: 20px;
  63. }
  64. </style>
  65. <div class="admincp-header" style="line-height: 4;">
  66. <div class="logo">
  67. <img width="200" src="{$Think.USER_SITE_ROOT}/images/backlogo.png"/>
  68. </div>
  69. <div class="navbar">
  70. <ul class="fr" style="float:right" id="nav">
  71. <a href="{:url('Login/index')}">{$Think.lang.login}</a>
  72. <a href="{:url('Register/index')}">{$Think.lang.register}</a>
  73. </ul>
  74. </div>
  75. </div>
  76. <div class="login">
  77. <div class="login_body">
  78. <div class="login_header">
  79. <img style="margin: 0px auto; display: block; margin-bottom: 10px;" src="{$Think.ADMIN_SITE_ROOT}/images/logo.png"/>
  80. </div>
  81. <div class="login_content">
  82. <form method="post">
  83. <div class="form-group">
  84. <input type="text" name="user_email" placeholder="{:lang('email_address')}" required class="text">
  85. </div>
  86. <div class="form-group">
  87. <input type="text" name="user_password" id="user_password" placeholder="{:lang('install_pasword')}" required class="text">
  88. <div id="pwd" style="font-size: 10px;color:#aaa;margin-top: 0;">{:lang('register_password_point')}</div>
  89. </div>
  90. <div class="form-group">
  91. <input type="text" id="confirm_password" name="confirm_password" placeholder="{:lang('confirm_password')}" required class="text">
  92. <div id="confirm_pwd"></div>
  93. </div>
  94. <div class="form-group">
  95. <input type="text" id="user_phone" name="user_phone" placeholder="{:lang('phone')}" required class="text">
  96. <div id="phone"></div>
  97. </div>
  98. <div class="form-group">
  99. <input type="text" name="captcha" placeholder="{:lang('login_captcha')}" required class="text" style="width:60%;float:left;">
  100. <img src="{:captcha_src()}" style="width:30%;height:38px;" id="change_captcha"/>
  101. </div>
  102. <input type="checkbox" name="ch_box" id="ch_box" onclick="c_box()" />{:lang('register_xieyi')}<br><br>
  103. <div class="form-group" style="text-align: center;">
  104. <input type="submit" class="layui-btn" id="layui-btn" value="{:lang('register_sumbit')}" lay-submit lay-filter="login" style="margin-top: -20px;"/>
  105. </div>
  106. </form>
  107. </div>
  108. </div>
  109. </div>
  110. <script>
  111. //密码 校验
  112. $("#user_password").blur(function(){
  113. var password = document.getElementById("user_password").value;
  114. //console.log(password);
  115. var patrn=/^(?![\d]+$)(?![a-zA-Z]+$)(?![^\da-zA-Z]+$).{6,20}$/;
  116. if (!patrn.exec(password)){
  117. //console.log(1);
  118. // var addhtml = document.getElementById("pwd");
  119. // if(document.getElementById("tishi") == null){
  120. // addhtml.innerHTML = addhtml.innerText+'<span id="tishi" style="color:red;font-size: 12px;"><br>密码不合法</span>';
  121. // }
  122. document.getElementById("user_password").style.borderColor = "red";
  123. document.getElementById("layui-btn").type = "button";
  124. }else{
  125. //console.log(2);
  126. // var remove = document.getElementById("tishi");
  127. // remove.parentNode.removeChild(remove);
  128. document.getElementById("user_password").style.borderColor = "#e6e6e6";
  129. if(document.getElementById("confirm_password").style.borderColor != "red" && document.getElementById("user_phone").style.borderColor != "red"){
  130. document.getElementById("layui-btn").type = "submit";
  131. }
  132. }
  133. });
  134. $("#confirm_password").blur(function(){
  135. var password = document.getElementById("confirm_password").value;
  136. //console.log(password);
  137. var patrn=/^(?![\d]+$)(?![a-zA-Z]+$)(?![^\da-zA-Z]+$).{6,20}$/;
  138. if (!patrn.exec(password)){
  139. //console.log(1);
  140. // var addhtml = document.getElementById("confirm_pwd");
  141. // if(document.getElementById("tishi_pwd") == null){
  142. // addhtml.innerHTML = addhtml.innerText+'<span id="tishi_pwd" style="color:red;font-size: 12px;"><br>密码不合法</span>';
  143. // }
  144. document.getElementById("confirm_password").style.borderColor = "red";
  145. document.getElementById("layui-btn").type = "button";
  146. }else{
  147. // var remove = document.getElementById("tishi_pwd");
  148. // remove.parentNode.removeChild(remove);
  149. document.getElementById("confirm_password").style.borderColor = "#e6e6e6";
  150. if(document.getElementById("user_password").style.borderColor != "red" && document.getElementById("user_phone").style.borderColor != "red"){
  151. document.getElementById("layui-btn").type = "submit";
  152. }
  153. }
  154. });
  155. //电话校验
  156. $("#user_phone").blur(function(){
  157. var password = document.getElementById("user_phone").value;
  158. //console.log(password);
  159. var patrn=/^1[3456789]\d{9}$/;
  160. if (!patrn.exec(password)){
  161. // var addhtml = document.getElementById("phone");
  162. // if(document.getElementById("tishi_phone") == null){
  163. // addhtml.innerHTML = addhtml.innerText+'<span id="tishi_phone" style="color:red;font-size: 12px;"><br>电话号码不合法</span>';
  164. // }
  165. document.getElementById("user_phone").style.borderColor = "red";
  166. document.getElementById("layui-btn").type = "button";
  167. }else{
  168. // var remove = document.getElementById("tishi_phone");
  169. // remove.parentNode.removeChild(remove);
  170. document.getElementById("user_phone").style.borderColor = "#e6e6e6";
  171. if(document.getElementById("user_password").style.borderColor != "red" && document.getElementById("confirm_password").style.borderColor != "red"){
  172. document.getElementById("layui-btn").type = "submit";
  173. }
  174. }
  175. });
  176. // 协议 校验
  177. function c_box(){
  178. var c_b = document.getElementById("ch_box");
  179. var c_sub = document.getElementById("layui-btn");
  180. if(c_b.checked){
  181. c_sub.disabled=false;
  182. }else{
  183. c_sub.disabled=true;
  184. }
  185. }
  186. $('#change_captcha').click(function () {
  187. $(this).attr('src', '{:captcha_src()}?'+(new Date().getTime()));
  188. });
  189. </script>
  190. <script type="text/javascript">
  191. var width =document.body.clientWidth;
  192. var changesmall =function(){
  193. if($(".admincp-container-left").css("width")=="200px"){
  194. $(".admincp-container-left").css("width","55px");
  195. $("#layout-center").css({"position":"absolute","left":"55px","width":(width-55)+"px"});
  196. $(".title").attr('title',$(".title .title-txt").html())
  197. $(".title .title-txt").css("display","none");
  198. $('.admincp-container-right').css("left","55px");
  199. }else{
  200. $(".admincp-container-left").css("width","200px");
  201. $("#layout-center").css({"position":"absolute","left":"130px","width":(width-130)+"px"});
  202. $(".title").attr('title',"")
  203. $(".title span").css("display","inline-block");
  204. $('.admincp-container-right').css("left","200px");
  205. }
  206. }
  207. </script>
  208. <script type="text/javascript">
  209. layui.use(['jquery', 'element', 'layer'], function () {
  210. var $ = layui.jquery, element = layui.element, layer = layui.layer;
  211. $('.layui-tab-content').height($(window).height() - 145);
  212. var tab = {
  213. add: function (title, url, id) {
  214. element.tabAdd('dsTab', {
  215. title: title,
  216. content: '<iframe width="100%" height="100%" lay-id="' + id + '" frameborder="0" src="' + url + '" scrolling="yes" class="x-iframe"></iframe>',
  217. id: id
  218. });
  219. }, change: function (id) {
  220. element.tabChange('dsTab', id);
  221. }
  222. };
  223. $('.admin-nav-item').click(function (event) {
  224. var that = $(this);
  225. if ($('iframe[src="' + that.attr('href') + '"]')[0]) {
  226. tab.change(that.attr('data-id'));
  227. event.stopPropagation();
  228. return false;
  229. }
  230. if ($('iframe').length == 20) {
  231. layer.msg('最多可打开20个标签页');
  232. return false;
  233. }
  234. that.css({color: '#fff'});
  235. tab.add(that.text(), that.attr('href'), that.attr('data-id'));
  236. tab.change(that.attr('data-id'));
  237. event.stopPropagation();
  238. return false;
  239. });
  240. $(document).on('click', '.layui-tab-close', function () {
  241. $('.layui-nav-child a[data-id="' + $(this).parent('li').attr('lay-id') + '"]').css({color: 'rgba(255,255,255,.7)'});
  242. });
  243. });
  244. $('#gloMenu').on('click', '#navT', function () {
  245. var parent = $(this).closest('li');
  246. var index = parent.index();
  247. if (parent.find('#navC').find('li').length) {
  248. if (parent.hasClass('open')) {
  249. parent.find('#navC').stop(true).slideUp(300, function () {
  250. parent.removeClass('open')
  251. });
  252. } else {
  253. var openLi = $('.sidebar-menu').find('li.open');
  254. openLi.removeClass('open').find('#navC').stop(true).slideUp(300);
  255. parent.addClass('open').find('#navC').stop(true).slideDown(300);
  256. }
  257. }
  258. })
  259. $('#nav').on('click', '#nav1', function () {
  260. var parent = $(this).closest('li');
  261. var index = parent.index();
  262. if (parent.find('#nav2').find('li').length) {
  263. if (parent.hasClass('open')) {
  264. parent.find('#nav2').stop(true).slideUp(300, function () {
  265. parent.removeClass('open')
  266. });
  267. } else {
  268. var openLi = $('.sidebar-menu').find('li.open');
  269. openLi.removeClass('open').find('#nav2').stop(true).slideUp(300);
  270. parent.addClass('open').find('#nav2').stop(true).slideDown(300);
  271. }
  272. }
  273. })
  274. </script>
  275. </body>
  276. </html>