周口人民医院呼叫中心前端

login.html 7.9KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  6. <title>登录</title>
  7. <meta name="keywords">
  8. <meta name="description">
  9. <meta name="renderer" content="webkit|ie-comp|ie-stand" />
  10. <link rel="shortcut icon" href="img/32.ico" />
  11. <script src="Script/Common/huayi.load.js"></script>
  12. <script src="Script/Common/huayi.config.js"></script>
  13. <link href="./css/login.css" rel="stylesheet">
  14. <!--[if lt IE 9]>
  15. <meta http-equiv="refresh" content="0;ie.html" />
  16. <![endif]-->
  17. <style>
  18. .signin_left{
  19. position: relative;
  20. }
  21. .left_word{
  22. position: absolute;
  23. height: 100%;
  24. width: 50%;
  25. z-index: 3;
  26. }
  27. .left_word_bj{
  28. position: absolute;
  29. left: 0;
  30. top:0;
  31. height: 100%;
  32. width: 50%;
  33. background: #2a303c;
  34. filter:alpha(opacity=75);
  35. -moz-opacity:0.75;
  36. -khtml-opacity: 0.75;
  37. opacity: 0.75;
  38. z-index: 2;
  39. padding: 0;
  40. }
  41. .left_word .left_text{
  42. width: 55%;
  43. left: 40%;
  44. position: absolute;
  45. right: 0;
  46. top: 7%
  47. }
  48. .left_word .left_text h2{
  49. }
  50. .left_word .left_text .logo{
  51. position: relative;
  52. font-size: 36px;
  53. color: #FFFFFF;
  54. font-weight: 600;
  55. }
  56. .left_word .left_text .logo img{
  57. left: 0;
  58. top: 0;
  59. }
  60. .left_word .left_text .logo span{
  61. padding-left: 10px;
  62. }
  63. .signin_left h4{
  64. font-size: 20px;
  65. color: #006967;
  66. margin-bottom: 2.5%;
  67. }
  68. .signin_left h3 + p{
  69. line-height: 30px;
  70. font-size: 18px;
  71. }
  72. </style>
  73. </head>
  74. <body class="signin">
  75. <div class="signin_bg row">
  76. <div class="signin_bg_left col-md-5"></div>
  77. <div class="signin_bg_mask col-md-5"></div>
  78. <div class="left_word_bj col-md-5"></div>
  79. <div class="left_word">
  80. <div class="left_text">
  81. <div class="logo"><img src="img/logo.png"><span>医院随访系统平台</span></div>
  82. <h3>厚德 博学 严谨 创新</h3>
  83. <p>2007年被国家人事部、劳动部、中医药管理局联合授予“全国卫生系统先进集体”。 2008年5月,正式成为河南大学附属周口医院,挂牌北京安贞医院心脏病治疗技术合作中心。
  84. 2008年,被省卫生厅评为“医院管理年及‘三优一满意’先进单位”及“三优一满意A级医院”,被市委、市政府评为“十佳医院”。</p>
  85. </div>
  86. </div>
  87. </div>
  88. <div class="container">
  89. <div class="row clearfix">
  90. <div class="signin_left col-md-5"></div>
  91. <div class="signin_right col-md-5">
  92. <div class="signin_panel">
  93. <h1>医院随访系统登录平台</h1>
  94. <div class="signin_user">
  95. <i class="signin_icons"></i>
  96. <input class="form-control" type="text" placeholder="请输入您的管理账号" id="user" autofocus autocomplete="off">
  97. <i class="ts user_ts"></i>
  98. </div>
  99. <div class="signin_seat">
  100. <i class="signin_icons"></i>
  101. <input class="form-control" type="text" placeholder="请输入分机号" id="userSeat" autocomplete="off">
  102. </div>
  103. <div class="signin_password">
  104. <i class="signin_icons"></i>
  105. <input class="form-control" type="password" placeholder="请输入您的密码" id="password" autocomplete="off">
  106. <i class="ts password_ts"></i>
  107. </div>
  108. <div class="clearfix singin_rpassword">
  109. <div class="rpassword">
  110. <label for="rpassword">
  111. <input type="checkbox" id="rpassword">
  112. <span class="checkbox_icon"></span>
  113. 记住密码
  114. </label>
  115. </div>
  116. <!--<div class="fpassword">
  117. <a href="#" title="忘记密码">忘记秘密?</a>
  118. </div>-->
  119. </div>
  120. <div class="btns" type="button">登录</div>
  121. <!--<div class="fregister">
  122. <span>还没有账号?</span>
  123. <a href="#" title="立即注册">立即注册&gt;&gt;</a>
  124. </div>-->
  125. <div class="signfooter">
  126. <p>COPYRIGHT 2011-2025 AMT</p>
  127. </div>
  128. </div>
  129. </div>
  130. </div>
  131. </div>
  132. <script>
  133. $(function () {
  134. /*输入框样式改变*/
  135. $("#user").focus(function () {
  136. $(this).parent().addClass("_success");
  137. });
  138. $("#user").blur(function () {
  139. $(this).parent().removeClass("_success");
  140. });
  141. $("#password").focus(function () {
  142. $(this).parent().addClass("_success");
  143. });
  144. $("#password").blur(function () {
  145. $(this).parent().removeClass("_success");
  146. });
  147. /*cook存储数据*/
  148. if ($.cookie("username")) {
  149. //取值如果存在则赋值
  150. $("#user").val($.cookie("user"));//用户名
  151. }
  152. $(".btns").click(function () {
  153. login();
  154. });
  155. $('input').bind('keypress', function (event) {
  156. if (event.keyCode == "13") {
  157. $('.btns').trigger("click");
  158. }
  159. });
  160. });
  161. /*点击提交*/
  162. function login() {
  163. var User = $("#user").val();
  164. var Password = $("#password").val();
  165. var userSeat = $("#userSeat").val();
  166. /*保存COOK*/
  167. //$.cookie("user", $("#user").val(),{expires: 7,secure:true});
  168. /*表单验证*/
  169. if (User == "" || Password == "") {
  170. $(".ts").addClass("Yz_error");
  171. if ($("#user").val() == "") {
  172. $("#user").focus(function () {
  173. $(".user_ts").removeClass("Yz_error");
  174. $(".password_ts").removeClass("Yz_error");
  175. $(this).parent().addClass("_success");
  176. });
  177. } else {
  178. $(".user_ts").addClass("Yz_success");
  179. }
  180. } else {
  181. /*请求后台*/
  182. $.ajax({
  183. type: "post",
  184. url: huayi.config.callcenter_url + "/Login/login",
  185. dataType: 'json',
  186. async: true,
  187. beforeSend: function() { //触发ajax请求开始时执行
  188. $('.btns').text('登录中...');
  189. loadIndex = layer.load();
  190. },
  191. data: {
  192. username: User,
  193. extensionphone: userSeat,
  194. password: Password
  195. },
  196. success: function (data) {
  197. /*验证请求*/
  198. if (data.state == "success") {
  199. $.cookie("token", data.data.token, { expires: 7 });
  200. $.cookie("extno", userSeat, { expires: 7 });
  201. window.location.href = "index.html";
  202. } else {
  203. layer.msg("登录失败");
  204. $("#user").val('');
  205. $('.btns').text('登录');
  206. $("#userSeat").val('');
  207. $("#password").val('');
  208. }
  209. }
  210. });
  211. }
  212. }
  213. </script>
  214. </body>
  215. </html>