index.htm 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>${context.getContextName()}</title>
  5. <meta charset="UTF-8">
  6. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
  7. ${Styles.src(zhiqim.css)}
  8. ${Scripts.src(zhiqim.js)}
  9. ${Scripts.src(jsencrypt.js)}
  10. ${Styles.htmlOverflowHidden()}
  11. <style>
  12. body{color:#333;background:#4865e7 url(ztmpl/zhiqim_manager/index_bg_00.jpg) no-repeat top center; background-size:auto 100%;}
  13. body,table,td,div{font-size:14px;line-height:120%;}
  14. a,a:visited{color:#333;text-decoration:none;cursor:pointer;}
  15. a:active,a:hover{color:#1e7eec;text-decoration:none;}
  16. .header{width:100%;background:rgba(255,255,255,.3); filter:alpha(opacity=30); height:40px;}
  17. .footer{position:fixed;bottom:0px; width:100%;height:40px;background:rgba(255,255,255,0.2);line-height:40px;text-align:center;color:#fff;}
  18. .login{width:825px; background:rgba(255,255,255,.3); filter:alpha(opacity=30); border-radius:12px; position: absolute; right:7%; top:50%; margin:-180px 0 0 0;}
  19. input{background:#fff;color:#86BFE9; width:320px; font-size:14px;border:1px solid #3b8edc;border-radius:5px;height:45px;line-height:45px;text-indent:10px;}
  20. input::-webkit-input-placeholder{color:#86BFE9;}
  21. .input.verificationCode{letter-spacing:4px;}
  22. .event-class{float:right; font-size:14px; color:#fff; margin:16px 86px 20px 0;}
  23. .event-class a{color:#fff;}
  24. .z-relative{ position: relative;}
  25. .register{ position: absolute; top:30px; right:58px; color:#ffd200!important; font-size:14px; text-decoration: underline;}
  26. .z-checkbox{ border:2px solid #fff; border-radius:16px; width:18px; height:18px;}
  27. </style>
  28. <script>
  29. Z.onload(function()
  30. {//默认焦点
  31. if (Z.V.isEmpty(Z("#operatorCode").val()))
  32. Z("#operatorCode").focus();
  33. else if (Z.V.isEmpty(Z("#operatorPass").val()))
  34. Z("#operatorPass").focus();
  35. else if (Z("#verificationCode").length > 0)
  36. Z("#verificationCode").focus();
  37. Z(document).keydown(function(e)
  38. {
  39. if (Z.E.key(e) != Z.E.KEY.ENTER)
  40. return;
  41. if (!Z.Dialog.cache.isEmpty())
  42. return;
  43. doLogin();
  44. });
  45. });
  46. function doRememberCode(rememberCode)
  47. {//取消记住账号时,同时取消记住密码
  48. if (!rememberCode.checked)
  49. {
  50. Z("#rememberPass")[0].checked = false;
  51. Z("[data-id=rememberPass]").removeClass("z-active");
  52. }
  53. }
  54. function doRememberPass(rememberPass)
  55. {//记住密码时,同时记住账号
  56. if (rememberPass.checked)
  57. {
  58. Z("#rememberCode")[0].checked = true;
  59. Z("[data-id=rememberCode]").addClass("z-active");
  60. }
  61. }
  62. function doLogin()
  63. {//ajax登陆
  64. var operatorCode = Z("#operatorCode").val();
  65. if (Z.V.isEmptyBlank(operatorCode))
  66. {//用户名和密码必填
  67. Z.failure("用户名不能为空!");
  68. Z("#operatorCode").focus();
  69. return;
  70. }
  71. var operatorPass = Z("#operatorPass").val();
  72. if (Z.V.isEmptyBlank(operatorPass))
  73. {//用户名和密码必填
  74. Z.failure("密码不能为空!");
  75. Z("#operatorPass").focus();
  76. return;
  77. }
  78. var verificationCode = Z("#verificationCode").val();
  79. if (Z("#verificationCode").length > 0 && verificationCode.length != 4)
  80. {//如果有验证码框的时候,要求值必须是4位(数字在输入时控制)
  81. Z.failure("验证码为4位数字!");
  82. return;
  83. }
  84. //对密码进行RSA加密
  85. var publicKey = "${ZmrParamDao.getPublicKey(context)}";
  86. var encrypt = new JSEncrypt();
  87. encrypt.setPublicKey(publicKey);
  88. operatorPass = encrypt.encrypt(operatorPass);
  89. var ajax = new Z.Ajax();
  90. ajax.setContextPath("${context.getContextPath()}");
  91. ajax.setClassName("ZmrLoginPresenter");
  92. ajax.setMethodName("doLogin");
  93. ajax.addParam("operatorCode", operatorCode);
  94. ajax.addParam("operatorPass", operatorPass);
  95. ajax.addParam("role", "designer");
  96. <#if hasRememberPass>
  97. if (Z("#rememberPass")[0].checked)
  98. ajax.addParam("rememberPass", "true");
  99. </#if>
  100. <#if hasRememberCode>
  101. if (Z("#rememberCode")[0].checked)
  102. ajax.addParam("rememberCode", "true");
  103. </#if>
  104. ajax.addParam("verificationCode", verificationCode);
  105. ajax.setFailureAlert();
  106. ajax.setSuccess(function(){window.location.href= this.responseText;});
  107. ajax.execute();
  108. }
  109. </script>
  110. </head>
  111. <body>
  112. <#-- 主题变量和函数定义 -->
  113. <#include "/ztmpl/zhiqim_manager/"+themeIndex+"/define.htm"/>
  114. ${Htmls.toCallFrame()}
  115. <div class="header">
  116. <div class="z-float-left z-w400 z-lh40 z-pd-l10 z-color-white">欢迎登录&nbsp;&nbsp;[&nbsp;${context.getContextName()}&nbsp;]!</div>
  117. <div class="z-float-right z-text-right z-w200 z-lh40 z-pd-r10"></div>
  118. </div>
  119. <div class="login" style="height:<#if hasVerificationCode && hasRememberCode>410<#elseif hasVerificationCode>360<#elseif hasRememberCode>360<#else>300</#if>px">
  120. <table class="z-table z-h100p">
  121. <tr>
  122. <td width="50%" class="z-text-center"><img src="ztmpl/zhiqim_manager/designLogo.png"></td>
  123. <td width="50%" valign="top" rowspan="2" class="z-relative">
  124. <input type="text" class="z-hidden-fixed"/>
  125. <input type="password" class="z-hidden-fixed"/>
  126. <a class="register" href='/reg.htm'>注册设计师</a>
  127. <table class="z-table z-mg-l30 z-h70-tr z-pd5 z-color-white">
  128. <tr>
  129. <td class="z-px20 z-mg-t10">用户登录</td>
  130. </tr>
  131. <tr>
  132. <td><input id="operatorCode" class="input" placeholder="用户名/手机号" value="#{operatorCode}" maxlength="16" spellcheck="false" autocomplete="off"></td>
  133. </tr>
  134. <tr>
  135. <td><input id="operatorPass" type="password" class="input" placeholder="密码" value="#{operatorPass}" maxlength="16" spellcheck="false" autocomplete="off"></td>
  136. </tr>
  137. <#if hasVerificationCode>
  138. <tr>
  139. <td>
  140. <input id="verificationCode" class="z-w200 input verificationCode" placeholder="验证码" data-options="type:Numeric;paste:true;" maxlength="4" spellcheck="false" autocomplete="off">
  141. <img class="z-pointer z-bd-rd5 z-mg-t-8" title="点击刷新验证码" onclick="this.src='service/vcode.jpg?bgColor=%231299ec&width=95&height=42&fontSize=20&yawp=true&t='+new Date().getTime();" src="service/vcode.jpg?bgColor=%231299ec&width=95&height=42&fontSize=20&yawp=true&t=${DateTimes.getDateTime17String()}">
  142. </td>
  143. </tr>
  144. </#if>
  145. <#if hasRememberCode>
  146. <tr class="zi-h40">
  147. <td class="z-px16" style="font-size:14px;">
  148. <input id="rememberCode" style="width:30px;" type="checkbox" data-role="z-checkbox" data-class="z-mg-r10 ${zmr_color_class}" onclick="doRememberCode(this);" <#if Validates.isNotEmpty(operatorCode)>checked</#if>>记住用户名
  149. <#if hasRememberPass>
  150. &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  151. <input id="rememberPass" style='margin:0 0 0 70px;width:30px;' type="checkbox" data-role="z-checkbox" data-class="z-mg-r10 ${zmr_color_class}" onclick="doRememberPass(this);" <#if Validates.isNotEmpty(operatorPass)>checked</#if>/>记住密码
  152. </#if>
  153. </td>
  154. </tr>
  155. </#if>
  156. <tr>
  157. <td><button style="width:320px; border-radius:5px;" class="z-button z-h50 zi-px20 ${zmr_color_class}" onclick="doLogin()">登&nbsp;&nbsp;录</button>
  158. <div class="event-class"><a href='/resetPassword.htm'>忘记密码</a></div>
  159. </td>
  160. </tr>
  161. </table>
  162. </td>
  163. </tr>
  164. </table>
  165. </div>
  166. <div class="footer">Copyright © 2023 领淘众创 All Rights Reserved <a href="https://beian.miit.gov.cn/" style="color: white" target="_blank">备案号:闽ICP备2023014112号-1 </a></div>
  167. </body>
  168. </html>