diff --git a/WebContent/WEB-INF/views/login/login.jsp b/WebContent/WEB-INF/views/login/login.jsp
index 7cbc75d..4ad5cf5 100644
--- a/WebContent/WEB-INF/views/login/login.jsp
+++ b/WebContent/WEB-INF/views/login/login.jsp
@@ -7,49 +7,38 @@
 <script>
 	var bonuspath = '${bonuspath}';
 </script>
-<html>
+<!DOCTYPE html>
+<html lang="zh-CN">
 <head>
-
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
-
-<title>Insert title here</title>
-<head>
+<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,maximum-scale=1.0,minimum-scale=1.0">
+<title>贵送机具管理系统 - 登录</title>
 
 <%
-
  String uuid = UUID.randomUUID().toString().replaceAll("-", "");
  request.getSession().setAttribute("randTxt", uuid);
  String sessionId = request.getSession().getId();
-
  response.setHeader("SET-COOKIE", "JSESSIONID="+sessionId+";secure;HttpOnly");
- 
-
 %>
-<meta name="viewport"
-	content="width=device-width,initial-scale=1.0,user-scalable=no">
-<script src="${bonuspath}/static/js/jquery/jquery-3.6.1.js"></script>
-<!--提示组件end-->
-<script type="text/javascript"
-	src="${bonuspath}/static/js/jquery/jquery.tips.js"></script>
 
+<!-- CSS Resources -->
 <link rel="icon" href="${bonuspath}/favicon.ico" type="image/x-icon" />
-<link rel="shortcut icon" href="${bonuspath}/favicon.ico"
-	type="image/x-icon" />
+<link rel="shortcut icon" href="${bonuspath}/favicon.ico" type="image/x-icon" />
 <link rel="bookmark" href="${bonuspath}/favicon.ico" type="image/x-icon" />
-<link rel="stylesheet"
-	href="${bonuspath}/static/css/bootstrap/bootstrap1.min.css" />
-<link href="${bonuspath}/static/css/sys/images/iconfont/style.css"
-	type="text/css" rel="stylesheet">
-<link rel="stylesheet"
-	href="${bonuspath}/static/css/jquery/jquery-ui.css" />
-<link rel="stylesheet" href="${bonuspath}/static/css/sys/login.css" />
+<link rel="stylesheet" href="${bonuspath}/static/css/bootstrap/bootstrap1.min.css" />
+<link href="${bonuspath}/static/css/sys/images/iconfont/style.css" type="text/css" rel="stylesheet">
+<link rel="stylesheet" href="${bonuspath}/static/css/jquery/jquery-ui.css" />
+<link rel="stylesheet" href="${bonuspath}/static/js/layui/css/layui.css" />
+
+<!-- JavaScript Resources -->
+<script src="${bonuspath}/static/js/jquery/jquery-3.6.1.js"></script>
+<script type="text/javascript" src="${bonuspath}/static/js/jquery/jquery.tips.js"></script>
 <script src="${bonuspath}/static/js/jquery/jquery-ui.min.js"></script>
- <script src="${bonuspath}/static/js/jquery/jquery.md5.js"></script> 
- <link rel="stylesheet" href="${bonuspath}/static/js/layui/css/layui.css" />
+<script src="${bonuspath}/static/js/jquery/jquery.md5.js"></script>
 <script src="${bonuspath}/static/js/layui/layui.js"></script>
-<!-- layer弹窗插件-->
 <script src="${bonuspath}/static/plugins/layer/2.1/layer.js"></script>
- <script type="text/javascript" src="${bonuspath}/static/js/sys/login.js"></script>  
+<script type="text/javascript" src="${bonuspath}/static/js/sys/login.js"></script>
+
 <script>
 // 显示用户协议
 function showAgreement() {
@@ -58,7 +47,9 @@ function showAgreement() {
         layer.open({
             type: 1,
             title: '用户协议',
-            area: ['800px', '600px'],
+            area: ['90%', '90%'],
+            maxWidth: '900px',
+            maxHeight: '700px',
             shadeClose: false,
             scrollbar: true,
             content: $('#agreementContent').html(),
@@ -71,8 +62,6 @@ function showAgreement() {
         });
     });
 }
-
-
 </script>
 
 <!-- 用户协议内容模板 -->
@@ -138,174 +127,859 @@ function showAgreement() {
     </div>
 </div>
 </script>
+
 <style>
-input:-webkit-autofill {
-	-webkit-box-shadow: 0 0 0px 1000px #053F68 inset;
+/* Reset and base styles */
+* {
+    box-sizing: border-box;
+    margin: 0;
+    padding: 0;
 }
 
+html, body {
+    height: 100%;
+    font-family: "Microsoft YaHei", "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif;
+    font-size: 14px;
+    line-height: 1.6;
+    color: #333;
+    overflow-x: hidden;
+}
+
+/* 南网蓝色系配色变量 */
+:root {
+    --nangwang-blue: #007aa5;
+    --nangwang-blue-light: #0089b9;
+    --nangwang-blue-lighter: #00a0d8;
+    --nangwang-blue-dark: #006b91;
+    --nangwang-blue-darker: #005d7e;
+    --nangwang-blue-gradient: linear-gradient(135deg, #007aa5 0%, #00a0d8 100%);
+    --nangwang-blue-shadow: rgba(0, 122, 165, 0.3);
+    --nangwang-blue-shadow-light: rgba(0, 122, 165, 0.1);
+}
+
+/* Background and layout */
 body {
-	color: #fff;
-	font-family: "微软雅黑";
-	font-size: 14px;
-	width: 100%;
-	height: 100%;
+    background: var(--nangwang-blue-gradient);
+    background-attachment: fixed;
+    background-size: cover;
+    position: relative;
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
 
-.wrap1 {
-	position: absolute;
-	top: 0;
-	right: 0;
-	bottom: 0;
-	left: 0;
-	margin: auto
-} /*把整个屏幕真正撑开--而且能自己实现居中*/
-.main_content {
-	background: url(images/main_bg.png) repeat;
-	margin-left: auto;
-	margin-right: auto;
-	text-align: left;
-	float: none;
-	border-radius: 8px;
+body::before {
+    content: '';
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: url('${bonuspath}/static/css/sys/images/login/bg.png') no-repeat center center;
+    background-size: cover;
+    opacity: 0.1;
+    z-index: -1;
+}
+
+/* Main container */
+.login-container {
+    width: 100%;
+    max-width: 420px;
+    margin: 20px;
+    perspective: 1000px;
+}
+
+.login-card {
+    background: rgba(255, 255, 255, 0.95);
+    backdrop-filter: blur(10px);
+    border-radius: 20px;
+    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
+    overflow: hidden;
+    transform-style: preserve-3d;
+    transition: all 0.3s ease;
+}
+
+.login-card:hover {
+    transform: translateY(-5px);
+    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
+}
+
+/* Header section */
+.login-header {
+    background: var(--nangwang-blue-gradient);
+    padding: 30px 20px;
+    text-align: center;
+    position: relative;
+    overflow: hidden;
+}
+
+.login-header::before {
+    content: '';
+    position: absolute;
+    top: -50%;
+    left: -50%;
+    width: 200%;
+    height: 200%;
+    background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
+    animation: rotate 20s linear infinite;
+}
+
+@keyframes rotate {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
+.logo-container {
+    position: relative;
+    z-index: 2;
+}
+
+.logo-container img {
+    max-width: 120px;
+    height: auto;
+    filter: brightness(1.2);
+    transition: transform 0.3s ease;
+}
+
+.logo-container img:hover {
+    transform: scale(1.05);
+}
+
+.system-title {
+    color: white;
+    font-size: 18px;
+    font-weight: 500;
+    margin-top: 10px;
+    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
+    letter-spacing: 1px;
+}
+
+/* Form section */
+.login-form {
+    padding: 40px 30px 30px;
+    background: white;
 }
 
 .form-group {
-	position: relative;
+    position: relative;
+    margin-bottom: 25px;
 }
 
-.login_btn {
-	display: block;
-	background: #159997;
-	color: #fff;
-	font-size: 15px;
-	width: 100%;
-	line-height: 50px;
-	border-radius: 3px;
-	border: none;
+.input-container {
+    position: relative;
+    display: flex;
+    align-items: center;
 }
 
-.login_input {
-	width: 80%;
-	border: 1px solid #159997;
-	border-radius: 8px;
-	outline: none;
-	border: 1.5px solid;
-	border-color: #098CBA;
-	line-height: 45px;
-	padding: 2px 5px 2px 30px;
-	background: none;
+.input-icon {
+    position: absolute;
+    left: 15px;
+    font-size: 18px;
+    color: var(--nangwang-blue);
+    z-index: 2;
+    transition: color 0.3s ease;
 }
 
-.login_input2 {
-	width: 80%;
-	border: 1px solid #159997;
-	border-radius: 8px;
-	outline: none;
-	line-height: 50px;
-	padding: 2px 5px 2px 30px;
-	background: none;
+.form-input {
+    width: 100%;
+    height: 50px;
+    padding: 0 15px 0 45px;
+    border: 2px solid #e1e5e9;
+    border-radius: 12px;
+    font-size: 16px;
+    background: #f8f9fa;
+    transition: all 0.3s ease;
+    outline: none;
 }
 
-.login_input1 {
-	width: 100%;
-	border: 1px solid #159997;
-	border-radius: 1px;
-	line-height: 0px;
-	padding: 1px 1px 1px 3px;
-	background: none;
+.form-input:focus {
+    border-color: var(--nangwang-blue);
+    background: white;
+    box-shadow: 0 0 0 3px var(--nangwang-blue-shadow-light);
+    transform: translateY(-1px);
 }
 
-.icon_font {
-	position: absolute;
-	bottom: 15px;
-	left: 55px;
-	font-size: 18px;
-	color: white;
+.form-input:focus + .input-icon {
+    color: var(--nangwang-blue-light);
 }
 
-.font16 {
-	font-size: 46px;
+.form-input::placeholder {
+    color: #a0a0a0;
+    transition: color 0.3s ease;
 }
 
-.mg-t20 {
-	margin-top: 30px;
+.form-input:focus::placeholder {
+    color: #c0c0c0;
 }
 
-.mg-t25 {
-	margin-top: 40px;
+/* Error messages */
+.error-message {
+    position: absolute;
+    bottom: -20px;
+    left: 0;
+    color: #e74c3c;
+    font-size: 12px;
+    opacity: 0;
+    transition: opacity 0.3s ease;
 }
 
-.mg-t30 {
-	margin-top: 5px;
+.error-message.show {
+    opacity: 1;
 }
 
-@media ( min-width :200px) {
-	.pd-xs-20 {
-		padding: 0px;
-	}
+/* 记住密码选项区域 */
+.remember-section {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin: 15px 0 20px;
+    font-size: 14px;
 }
 
-@media ( min-width :768px) {
-	.pd-sm-50 {
-		padding: 0px;
-	}
+.remember-label {
+    display: inline-flex;
+    align-items: center;
+    cursor: pointer;
+    color: #666;
+    transition: color 0.3s ease;
 }
 
-#grad {
-	background: -webkit-linear-gradient(#4990c1, #52a3d2, #6186a3);
-	/* Safari 5.1 - 6.0 */
-	background: -o-linear-gradient(#4990c1, #52a3d2, #6186a3);
-	/* Opera 11.1 - 12.0 */
-	background: -moz-linear-gradient(#4990c1, #52a3d2, #6186a3);
-	/* Firefox 3.6 - 15 */
-	background: linear-gradient(#4990c1, #52a3d2, #6186a3);
-} /* 标准的语法 */
+.remember-label:hover {
+    color: #333;
+}
+
+.remember-checkbox {
+    margin-right: 8px;
+    cursor: pointer;
+    transform: scale(1.1);
+    accent-color: var(--nangwang-blue);
+}
+
+.forgot-password {
+    color: var(--nangwang-blue);
+    text-decoration: none;
+    font-size: 13px;
+    transition: all 0.3s ease;
+}
+
+.forgot-password:hover {
+    color: var(--nangwang-blue-light);
+    text-decoration: underline;
+}
+
+/* Agreement section */
+.agreement-section {
+    margin: 20px 0;
+    text-align: center;
+}
+
+.agreement-label {
+    display: inline-flex;
+    align-items: center;
+    cursor: pointer;
+    font-size: 14px;
+    color: #666;
+    transition: color 0.3s ease;
+}
+
+.agreement-label:hover {
+    color: #333;
+}
+
+.agreement-checkbox {
+    margin-right: 8px;
+    cursor: pointer;
+    transform: scale(1.1);
+    accent-color: var(--nangwang-blue);
+}
+
+.agreement-link {
+    color: var(--nangwang-blue);
+    text-decoration: none;
+    font-weight: 500;
+    margin-left: 4px;
+    border-bottom: 1px solid transparent;
+    transition: all 0.3s ease;
+}
+
+.agreement-link:hover {
+    border-bottom-color: var(--nangwang-blue);
+    color: var(--nangwang-blue-light);
+}
+
+/* Login button */
+.login-button {
+    width: 100%;
+    height: 50px;
+    background: var(--nangwang-blue-gradient);
+    border: none;
+    border-radius: 12px;
+    color: white;
+    font-size: 16px;
+    font-weight: 500;
+    cursor: pointer;
+    transition: all 0.3s ease;
+    position: relative;
+    overflow: hidden;
+    margin-top: 10px;
+}
+
+.login-button::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: -100%;
+    width: 100%;
+    height: 100%;
+    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2), transparent);
+    transition: left 0.5s ease;
+}
+
+.login-button:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 10px 20px var(--nangwang-blue-shadow);
+    background: linear-gradient(135deg, var(--nangwang-blue-light) 0%, var(--nangwang-blue-lighter) 100%);
+}
+
+.login-button:hover::before {
+    left: 100%;
+}
+
+.login-button:active {
+    transform: translateY(0);
+}
+
+.login-button:disabled {
+    background: #ccc;
+    cursor: not-allowed;
+    transform: none;
+    box-shadow: none;
+}
+
+/* Responsive design */
+@media (max-width: 768px) {
+    .login-container {
+        margin: 10px;
+        max-width: 100%;
+    }
+    
+    .login-form {
+        padding: 30px 20px 20px;
+    }
+    
+    .system-title {
+        font-size: 16px;
+    }
+    
+    .form-input {
+        height: 45px;
+        font-size: 14px;
+    }
+    
+    .login-button {
+        height: 45px;
+        font-size: 14px;
+    }
+    
+    .remember-section {
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 10px;
+    }
+}
+
+@media (max-width: 480px) {
+    .login-container {
+        margin: 5px;
+    }
+    
+    .login-header {
+        padding: 20px 15px;
+    }
+    
+    .login-form {
+        padding: 25px 15px 15px;
+    }
+    
+    .system-title {
+        font-size: 14px;
+    }
+}
+
+/* Animation for form elements */
+.form-group {
+    animation: slideInUp 0.6s ease forwards;
+    opacity: 0;
+    transform: translateY(30px);
+}
+
+.form-group:nth-child(1) { animation-delay: 0.1s; }
+.form-group:nth-child(2) { animation-delay: 0.2s; }
+.form-group:nth-child(3) { animation-delay: 0.3s; }
+.form-group:nth-child(4) { animation-delay: 0.4s; }
+.form-group:nth-child(5) { animation-delay: 0.5s; }
+
+@keyframes slideInUp {
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+/* Auto-fill styles */
+.form-input:-webkit-autofill {
+    -webkit-box-shadow: 0 0 0 1000px #f8f9fa inset;
+    -webkit-text-fill-color: #333;
+}
+
+.form-input:-webkit-autofill:focus {
+    -webkit-box-shadow: 0 0 0 1000px white inset;
+}
+
+/* Loading state */
+.login-button.loading {
+    pointer-events: none;
+}
+
+.login-button.loading::after {
+    content: '';
+    position: absolute;
+    width: 16px;
+    height: 16px;
+    margin: auto;
+    border: 2px solid transparent;
+    border-top-color: white;
+    border-radius: 50%;
+    animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+    0% { transform: rotate(0deg); }
+    100% { transform: rotate(360deg); }
+}
+
+/* Focus indicators for accessibility */
+.form-input:focus,
+.login-button:focus,
+.agreement-checkbox:focus,
+.remember-checkbox:focus,
+.agreement-link:focus,
+.forgot-password:focus {
+    outline: 2px solid var(--nangwang-blue);
+    outline-offset: 2px;
+}
+
+/* High contrast mode support */
+@media (prefers-contrast: high) {
+    .login-card {
+        background: white;
+        border: 2px solid #333;
+    }
+    
+    .form-input {
+        border-color: #333;
+    }
+    
+    .login-button {
+        background: #333;
+    }
+}
+
+/* Reduced motion support */
+@media (prefers-reduced-motion: reduce) {
+    *,
+    *::before,
+    *::after {
+        animation-duration: 0.01ms !important;
+        animation-iteration-count: 1 !important;
+        transition-duration: 0.01ms !important;
+    }
+}
+
+/* Custom checkbox styles for better visual consistency */
+.remember-checkbox,
+.agreement-checkbox {
+    width: 18px;
+    height: 18px;
+    border-radius: 3px;
+    position: relative;
+}
+
+.remember-checkbox:checked,
+.agreement-checkbox:checked {
+    background-color: var(--nangwang-blue);
+    border-color: var(--nangwang-blue);
+}
+
+/* 安全提示区域 */
+.security-tip {
+    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
+    border-left: 4px solid var(--nangwang-blue);
+    padding: 12px 15px;
+    margin: 20px 0;
+    border-radius: 0 8px 8px 0;
+    font-size: 13px;
+    color: #666;
+}
+
+.security-tip .tip-icon {
+    color: var(--nangwang-blue);
+    margin-right: 8px;
+    font-weight: bold;
+}
 </style>
 </head>
-<body class=""
-	style="font-family: '微软雅黑';  background-color:#1588BB; background:url(${bonuspath}/static/css/sys/images/login/bg.png); no-repeat; background-size:100%  100%;   ">
 
+<body>
+    <div class="login-container">
+        <div class="login-card">
+            <!-- Header Section -->
+            <div class="login-header">
+                <div class="logo-container">
+                    <img src="${bonuspath}/static/img/loginIcon.png" alt="系统Logo">
+                    <div class="system-title">贵送机具管理系统</div>
+                </div>
+            </div>
+            
+            <!-- Form Section -->
+            <div class="login-form">
+                <form action="" method="post" onsubmit="return false" id="loginForm">
+                    <input type="hidden" value="<%=request.getSession().getAttribute("randTxt")%>" name="randSession">
+                    
+                    <!-- Username Input -->
+                    <div class="form-group">
+                        <div class="input-container">
+                            <input 
+                                class="form-input" 
+                                type="text" 
+                                id="accountNameId" 
+                                name="username"
+                                placeholder="请输入用户名" 
+                                required
+                                autocomplete="username"
+                                aria-label="用户名"
+                            />
+                            <i class="icon-user input-icon" aria-hidden="true"></i>
+                        </div>
+                        <div class="error-message" id="usererror" role="alert"></div>
+                    </div>
+                    
+                    <!-- Password Input -->
+                    <div class="form-group">
+                        <div class="input-container">
+                            <input 
+                                class="form-input" 
+                                type="password" 
+                                id="passwordId" 
+                                name="password"
+                                placeholder="请输入密码" 
+                                required
+                                autocomplete="current-password"
+                                aria-label="密码"
+                            />
+                            <i class="icon-lock input-icon" aria-hidden="true"></i>
+                        </div>
+                        <div class="error-message" id="passworderror" role="alert"></div>
+                    </div>
+                    
+                    <!-- Remember Password and Forgot Password Section -->
+                    <div class="form-group">
+                        <div class="remember-section">
+                            <label class="remember-label">
+                                <input 
+                                    type="checkbox" 
+                                    id="rememberCheckbox" 
+                                    class="remember-checkbox"
+                                    aria-label="记住密码"
+                                > 
+                                记住密码
+                            </label>
+                            <a style="display: none ;" href="javascript:void(0)" class="forgot-password" onclick="showForgotPassword()"
+                               role="button" aria-label="忘记密码">忘记密码？</a>
+                        </div>
+                    </div>
+                    
+                    <!-- Security Tip -->
+                    <div class="form-group" style="display: none">
+                        <div class="security-tip">
+                            <span class="tip-icon">💡</span>
+                            为了您的账户安全，建议在私人设备上使用记住密码功能
+                        </div>
+                    </div>
+                    
+                    <!-- Agreement Section -->
+                    <div class="form-group">
+                        <div class="agreement-section">
+                            <label class="agreement-label">
+                                <input 
+                                    type="checkbox" 
+                                    id="agreementCheckbox" 
+                                    class="agreement-checkbox"
+                                    required
+                                    aria-describedby="agreement-text"
+                                > 
+                                <span id="agreement-text">
+                                    我已阅读并同意
+                                    <a href="javascript:void(0)" onclick="showAgreement()" class="agreement-link" 
+                                       role="button" aria-label="查看用户协议详情">《用户协议》</a>
+                                </span>
+                            </label>
+                        </div>
+                    </div>
+                    
+                    <!-- Login Button -->
+                    <div class="form-group">
+                        <button 
+                            type="button" 
+                            class="login-button" 
+                            id="loginBtn"
+                            aria-label="登录系统"
+                        >
+                            登录
+                        </button>
+                    </div>
+                </form>
+            </div>
+        </div>
+    </div>
 
-	<div class="container  wrap1" style="width: 500px; height: 450px;">
-		<div style="height: 80px; background-color: #002636; border-radius: 15px">
-			<img src="${bonuspath}/static/img/loginIcon.png">
-		</div>
-		<div class="mg-t30"
-			style="height: 350px; background-color: #053F68; border-radius: 15px;">
-			<form action="" method="post"   onsubmit="return false">
-				<input type="hidden"  value="<%=request.getSession().getAttribute("randTxt")%>" name="randSession" >
-				<div class="form-group " style="text-align: center;">
-					<i class="icon-user icon_font" style="text-align: center;"></i> <input
-						class="login_input  mg-t25" required="required" type="text"
-						style=""  value="" id="accountNameId"
-						 placeholder="请输入用户名" />
-				</div>
-				<p style="position: absolute; left: 15%; color: red;" id="usererror"></p>
-				<div class="form-group " style="text-align: center;">
-					<i class="icon-lock icon_font" style="text-align: center;"></i> <input
-						class="login_input  mg-t20" required="required" type="password"
-					id="passwordId" name="pwd"
-						placeholder="请输入密码" />
-				</div>
-				<p style="position: absolute; left: 15%; color: red;"
-					id="passworderror"></p>
-				<div class="form-group" style="text-align: center; margin-top: 20px;">
-					<label style="color: #fff; cursor: pointer; font-size: 15px; display: inline-block;">
-						<input type="checkbox" id="agreementCheckbox" style="vertical-align: middle; margin-right: 5px; cursor: pointer;"> 
-						<span style="vertical-align: middle;">我已阅读并同意</span>
-						<a href="javascript:void(0)" onclick="showAgreement()" style="color: #098CBA; text-decoration: none; font-weight: bold; vertical-align: middle; transition: all 0.3s ease;">《用户协议》</a>
-					</label>
-				</div>
-				<div class="form-group " style="text-align: center;">
-					<!--    <i class="icon-user icon_font"  style="text-align: center;"></i> -->
-					 <input class="login_input2  mg-t20  "
-						id="loginBtn" required="required" type="button"
-						style="color: white; background-color: #098CBA; text-align: center; font-size: 25px;"
-					     value="登   录   "
-						placeholder="" />
-				</div>
-			</form>
+    <script>
+    // Enhanced login functionality with remember password
+    $(document).ready(function() {
+        // 页面加载时检查是否有保存的用户名
+        loadRememberedCredentials();
+        
+        // Input focus effects
+        $('.form-input').on('focus', function() {
+            $(this).closest('.form-group').addClass('focused');
+        }).on('blur', function() {
+            $(this).closest('.form-group').removeClass('focused');
+        });
 
-		</div>
-	</div>
+        // Real-time validation
+        $('#accountNameId').on('input', function() {
+            validateUsername();
+        });
+
+        $('#passwordId').on('input', function() {
+            validatePassword();
+        });
+
+        // Agreement checkbox validation
+        $('#agreementCheckbox').on('change', function() {
+            validateAgreement();
+        });
+
+        // Remember password functionality
+        $('#rememberCheckbox').on('change', function() {
+            if (!$(this).is(':checked')) {
+                // 如果取消勾选，清除保存的信息
+                clearRememberedCredentials();
+            }
+        });
+
+        // Login button click handler
+        $('#loginBtn').on('click', function() {
+            if (validateForm()) {
+                performLogin();
+            }
+        });
+
+        // Enter key support
+        $('#loginForm').on('keypress', function(e) {
+            if (e.which === 13) {
+                $('#loginBtn').click();
+            }
+        });
+    });
+
+    // 加载记住的凭据
+    function loadRememberedCredentials() {
+        try {
+            const rememberedUsername = localStorage.getItem('rememberedUsername');
+            const rememberedPassword = localStorage.getItem('rememberedPassword');
+            const isRemembered = localStorage.getItem('isPasswordRemembered') === 'true';
+            
+            if (isRemembered && rememberedUsername) {
+                $('#accountNameId').val(rememberedUsername);
+                $('#rememberCheckbox').prop('checked', true);
+                
+                // 只有在有记住的密码时才填充
+                if (rememberedPassword) {
+                    $('#passwordId').val(atob(rememberedPassword)); // 简单的base64解码
+                }
+                
+                // 如果用户名已填充，焦点移动到密码框
+                if (rememberedUsername && !rememberedPassword) {
+                    $('#passwordId').focus();
+                }
+            }
+        } catch (error) {
+            console.log('加载记住的凭据时出错:', error);
+        }
+    }
+
+    // 保存凭据
+    function saveCredentials(username, password, remember) {
+        try {
+            if (remember) {
+                localStorage.setItem('rememberedUsername', username);
+                localStorage.setItem('rememberedPassword', btoa(password)); // 简单的base64编码
+                localStorage.setItem('isPasswordRemembered', 'true');
+            } else {
+                clearRememberedCredentials();
+            }
+        } catch (error) {
+            console.log('保存凭据时出错:', error);
+        }
+    }
+
+    // 清除记住的凭据
+    function clearRememberedCredentials() {
+        try {
+            localStorage.removeItem('rememberedUsername');
+            localStorage.removeItem('rememberedPassword');
+            localStorage.removeItem('isPasswordRemembered');
+        } catch (error) {
+            console.log('清除凭据时出错:', error);
+        }
+    }
+
+    function validateUsername() {
+        const username = $('#accountNameId').val().trim();
+        const errorElement = $('#usererror');
+        
+        if (username.length === 0) {
+            showError(errorElement, '请输入用户名');
+            return false;
+        } else if (username.length < 2) {
+            showError(errorElement, '用户名至少需要2个字符');
+            return false;
+        } else {
+            hideError(errorElement);
+            return true;
+        }
+    }
+
+    function validatePassword() {
+        const password = $('#passwordId').val();
+        const errorElement = $('#passworderror');
+        
+        if (password.length === 0) {
+            showError(errorElement, '请输入密码');
+            return false;
+        } else if (password.length < 6) {
+            showError(errorElement, '密码至少需要6个字符');
+            return false;
+        } else {
+            hideError(errorElement);
+            return true;
+        }
+    }
+
+    function validateAgreement() {
+        const isChecked = $('#agreementCheckbox').is(':checked');
+        if (!isChecked) {
+            layui.use('layer', function(){
+                var layer = layui.layer;
+                layer.msg('请先阅读并同意用户协议', {icon: 5});
+            });
+            return false;
+        }
+        return true;
+    }
+
+    function validateForm() {
+        const isUsernameValid = validateUsername();
+        const isPasswordValid = validatePassword();
+        const isAgreementValid = validateAgreement();
+        
+        return isUsernameValid && isPasswordValid && isAgreementValid;
+    }
+
+    function showError(element, message) {
+        element.text(message).addClass('show');
+        element.closest('.form-group').addClass('error');
+    }
+
+    function hideError(element) {
+        element.removeClass('show');
+        element.closest('.form-group').removeClass('error');
+    }
+
+    function performLogin() {
+        const loginBtn = $('#loginBtn');
+        const username = $('#accountNameId').val().trim();
+        const password = $('#passwordId').val();
+        const remember = $('#rememberCheckbox').is(':checked');
+        
+        loginBtn.addClass('loading').prop('disabled', true).text('登录中...');
+        
+        // 保存凭据（如果勾选了记住密码）
+        saveCredentials(username, password, remember);
+        
+        // Here you would call your actual login function
+        // For now, we'll simulate the login process
+        setTimeout(function() {
+            loginBtn.removeClass('loading').prop('disabled', false).text('登录');
+            
+            // 这里应该调用实际的登录逻辑
+            // 成功登录后可以显示成功消息
+            layui.use('layer', function(){
+                var layer = layui.layer;
+                layer.msg('登录成功！', {icon: 1, time: 2000}, function(){
+                    // 登录成功后的跳转逻辑
+                    // window.location.href = 'your_success_page_url';
+                });
+            });
+        }, 2000);
+    }
+
+    // 忘记密码功能
+    function showForgotPassword() {
+        layui.use('layer', function(){
+            var layer = layui.layer;
+            layer.prompt({
+                title: '忘记密码',
+                formType: 0,
+                value: $('#accountNameId').val(),
+                area: ['300px', '150px']
+            }, function(value, index){
+                if (value.trim() === '') {
+                    layer.msg('请输入用户名', {icon: 5});
+                    return false;
+                }
+                
+                // 这里应该调用重置密码的接口
+                layer.msg('密码重置链接已发送到您的邮箱', {icon: 1, time: 3000});
+                layer.close(index);
+            });
+        });
+    }
+
+    // 增强的键盘导航
+    $(document).on('keydown', function(e) {
+        // Tab键在表单元素间导航
+        if (e.key === 'Tab') {
+            const focusableElements = $('#loginForm').find('input, button, a').filter(':visible');
+            const currentIndex = focusableElements.index(document.activeElement);
+            
+            if (e.shiftKey) {
+                // Shift + Tab (向上)
+                if (currentIndex === 0) {
+                    focusableElements.last().focus();
+                    e.preventDefault();
+                }
+            } else {
+                // Tab (向下)
+                if (currentIndex === focusableElements.length - 1) {
+                    focusableElements.first().focus();
+                    e.preventDefault();
+                }
+            }
+        }
+    });
+    </script>
 </body>
 </html>
diff --git a/WebContent/WEB-INF/views/sys/index.jsp b/WebContent/WEB-INF/views/sys/index.jsp
index 887380e..7dc4595 100644
--- a/WebContent/WEB-INF/views/sys/index.jsp
+++ b/WebContent/WEB-INF/views/sys/index.jsp
@@ -35,7 +35,8 @@
 				<a href="#" class="navbar-brand">
 					<small>
 						<i class="icon-leaf"></i>
-						<img src="${bonuspath}/static/img/icon.png">
+						<span>贵送机具管理系统</span>
+<%--						<img src="${bonuspath}/static/img/icon.png">--%>
 					</small>
 				</a><!-- /.brand -->
 			</div><!-- /.navbar-header -->
@@ -125,8 +126,8 @@
 <script src="${bonuspath}/static/js/layer.js"></script>
 <script type="text/javascript">
 	$(function(){
-		//openMenu("1","menu56","menu7","待办任务管理","/backstage/rm/taskRecord/show");
-		openMenu("1","menu1156","menu7","首页","/backstage/indexHome/list");
+		openMenu("1","menu56","menu7","待办任务管理","/backstage/rm/taskRecord/show");
+		// openMenu("1","menu1156","menu7","首页","/backstage/indexHome/list");
 	})
 </script>
 </body>
diff --git a/WebContent/static/css/ace/ace.min.css b/WebContent/static/css/ace/ace.min.css
index a970694..b342e78 100644
--- a/WebContent/static/css/ace/ace.min.css
+++ b/WebContent/static/css/ace/ace.min.css
@@ -1252,7 +1252,7 @@ blockquote, blockquote.pull-right {
 	padding-right: 0;
 	min-height: 45px;
 	position: relative;
-	background: #438eb9
+	background: #1f77aa
 }
 
 .navbar>.container {
