可以跑了 准备做系统

Html/static/js/login.js

@@ -0,0 +1,60 @@
+document.addEventListener('DOMContentLoaded', function() {
+    // 获取登录表单及按钮
+    const loginForm = document.querySelector('.login-form');
+    const loginButton = document.querySelector('.login-btn');
+    const usernameInput = document.getElementById('username');
+    const passwordInput = document.getElementById('password');
+    
+    // 在点击登录按钮时提交表单
+    loginButton.addEventListener('click', function(event) {
+        event.preventDefault();  // 防止表单的默认提交行为
+        
+        // 获取输入框的值
+        const username = usernameInput.value.trim();
+        const password = passwordInput.value.trim();
+        
+        // 检查输入框是否为空
+        if (!username || !password) {
+            alert('用户名和密码不能为空');
+            return;
+        }
+
+        // 显示加载提示
+        loginButton.innerHTML = '登录中...';
+        loginButton.disabled = true;
+        
+        // 创建一个请求对象
+        const data = {
+            username: username,
+            password: password
+        };
+        
+        // 使用 Fetch API 发送 POST 请求到 Flask 后端
+        fetch('/login_post', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify(data)  // 将数据转换为 JSON 格式发送
+        })
+        .then(response => response.json())  // 解析响应数据
+        .then(data => {
+            if (data.success) {
+                // 登录成功，跳转到主页
+                window.location.href = '/dashboard';  // 根据需要修改跳转的路径
+            } else {
+                // 登录失败，提示错误信息
+                alert('登录失败: ' + data.message);
+            }
+        })
+        .catch(error => {
+            console.error('Error:', error);
+            alert('登录请求失败，请稍后重试');
+        })
+        .finally(() => {
+            // 恢复按钮状态
+            loginButton.innerHTML = '登录';
+            loginButton.disabled = false;
+        });
+    });
+});