From bc56530307e0e92b94a1abb5d38368f04b92e990 Mon Sep 17 00:00:00 2001
From: zhang <zc857179121@qq.com>
Date: 星期四, 12 三月 2026 15:52:15 +0800
Subject: [PATCH] 1
---
zy-acs-hex/src/main/webapp/views/login.html | 148 ++++++++++++++++++++++++++++++++++---------------
1 files changed, 103 insertions(+), 45 deletions(-)
diff --git a/zy-acs-hex/src/main/webapp/views/login.html b/zy-acs-hex/src/main/webapp/views/login.html
index f39e7b1..707fb4c 100644
--- a/zy-acs-hex/src/main/webapp/views/login.html
+++ b/zy-acs-hex/src/main/webapp/views/login.html
@@ -10,95 +10,153 @@
padding: 0;
box-sizing: border-box;
}
+
body {
- font-family: Arial, sans-serif;
- background-color: #f0f2f5;
+ font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
+
.login-container {
background-color: white;
padding: 40px;
- border-radius: 8px;
- box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+ border-radius: 12px;
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
width: 100%;
max-width: 400px;
+ animation: fadeIn 0.5s ease-in-out;
}
+
+ @keyframes fadeIn {
+ from {
+ opacity: 0;
+ transform: translateY(20px);
+ }
+ to {
+ opacity: 1;
+ transform: translateY(0);
+ }
+ }
+
h2 {
text-align: center;
margin-bottom: 30px;
color: #333;
+ font-size: 24px;
+ font-weight: 600;
}
+
.form-group {
margin-bottom: 20px;
}
+
label {
display: block;
margin-bottom: 8px;
color: #666;
+ font-weight: 500;
}
+
input {
width: 100%;
- padding: 10px;
- border: 1px solid #ddd;
- border-radius: 4px;
+ padding: 12px 16px;
+ border: 2px solid #e0e0e0;
+ border-radius: 8px;
font-size: 16px;
+ transition: border-color 0.3s ease;
}
+
+ input:focus {
+ outline: none;
+ border-color: #667eea;
+ box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
+ }
+
button {
width: 100%;
- padding: 12px;
- background-color: #1890ff;
+ padding: 14px;
+ background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
border: none;
- border-radius: 4px;
+ border-radius: 8px;
font-size: 16px;
+ font-weight: 600;
cursor: pointer;
margin-top: 10px;
+ transition: transform 0.2s ease;
}
+
button:hover {
- background-color: #40a9ff;
+ transform: translateY(-2px);
}
+
+ button:active {
+ transform: translateY(0);
+ }
+
.error-message {
- color: red;
- margin-top: 10px;
+ color: #ff4d4f;
+ margin-top: 12px;
text-align: center;
+ font-size: 14px;
}
</style>
</head>
<body>
- <div class="login-container">
- <h2>鏈哄櫒浜烘棩蹇楃郴缁�</h2>
- <form id="loginForm">
- <div class="form-group">
- <label for="username">鐢ㄦ埛鍚�</label>
- <input type="text" id="username" name="username" required>
- </div>
- <div class="form-group">
- <label for="password">瀵嗙爜</label>
- <input type="password" id="password" name="password" required>
- </div>
- <button type="submit">鐧诲綍</button>
- <div id="errorMessage" class="error-message"></div>
- </form>
- </div>
- <script>
- document.getElementById('loginForm').addEventListener('submit', function(e) {
- e.preventDefault();
- const username = document.getElementById('username').value;
- const password = document.getElementById('password').value;
-
- // 绠�鍗曠殑鐧诲綍楠岃瘉锛堝疄闄呴」鐩腑搴旇璋冪敤鍚庣API锛�
- if (username === 'admin' && password === 'admin123') {
- // 瀛樺偍鐧诲綍鐘舵��
- localStorage.setItem('loggedIn', 'true');
- // 璺宠浆鍒颁富椤甸潰
- window.location.href = '/';
- } else {
- document.getElementById('errorMessage').textContent = '鐢ㄦ埛鍚嶆垨瀵嗙爜閿欒';
- }
- });
- </script>
+<div class="login-container">
+ <h2>鏈哄櫒浜烘棩蹇楃郴缁�</h2>
+ <form id="loginForm">
+ <div class="form-group">
+ <label for="username">鐢ㄦ埛鍚�</label>
+ <input type="text" id="username" name="username" required>
+ </div>
+ <div class="form-group">
+ <label for="password">瀵嗙爜</label>
+ <input type="password" id="password" name="password" required>
+ </div>
+ <button type="submit">鐧诲綍</button>
+ <div id="errorMessage" class="error-message"></div>
+ </form>
+</div>
+<script>
+ document.getElementById('loginForm').addEventListener('submit', function (e) {
+ e.preventDefault();
+ const username = document.getElementById('username').value;
+ const password = document.getElementById('password').value;
+ const errorMessage = document.getElementById('errorMessage');
+
+ // 鏄剧ず鍔犺浇鐘舵��
+ errorMessage.textContent = '鐧诲綍涓�...';
+
+ // 璋冪敤鍚庣鐧诲綍鎺ュ彛
+ fetch('/login/auth', {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/x-www-form-urlencoded'
+ },
+ body: `user=${encodeURIComponent(username)}&pass=${encodeURIComponent(password)}`
+ })
+ .then(response => response.json())
+ .then(data => {
+ if (data && data.code === 200) {
+ // 鐧诲綍鎴愬姛锛屽瓨鍌ㄧ櫥褰曠姸鎬�
+ localStorage.setItem('loggedIn', 'true');
+ // 璺宠浆鍒颁富椤甸潰
+ window.location.href = '/';
+ } else {
+ // 鐧诲綍澶辫触锛屾樉绀洪敊璇俊鎭�
+ errorMessage.textContent = data.message || '鐢ㄦ埛鍚嶆垨瀵嗙爜閿欒';
+ }
+ })
+ .catch(error => {
+ // 缃戠粶閿欒锛屾樉绀洪敊璇俊鎭�
+ errorMessage.textContent = '鐧诲綍澶辫触锛岃绋嶅悗閲嶈瘯';
+ console.error('鐧诲綍澶辫触:', error);
+ });
+ });
+</script>
</body>
</html>
\ No newline at end of file
--
Gitblit v1.9.1