From 3c0d1b30ae06dfaad52b11614b843056235c93c9 Mon Sep 17 00:00:00 2001
From: liuwei <liuwei@wdtrgf.com.cn>
Date: Thu, 27 Mar 2025 11:22:23 +0800
Subject: [PATCH] =?UTF-8?q?=E5=B0=86=E7=9C=8B=E6=9D=BF=E5=8A=9F=E8=83=BD?=
 =?UTF-8?q?=E7=8B=AC=E7=AB=8B=EF=BC=8C=E6=96=B9=E4=BE=BF=E7=8B=AC=E7=AB=8B?=
 =?UTF-8?q?=E7=BB=B4=E6=8A=A4=E5=8A=9F=E8=83=BD=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 admin/dashboard/templates/login.html | 100 ++++++++++++++++-----------
 1 file changed, 60 insertions(+), 40 deletions(-)
diff --git a/admin/dashboard/templates/login.html b/admin/dashboard/templates/login.html
index c983a3a..4b98847 100644
--- a/admin/dashboard/templates/login.html
+++ b/admin/dashboard/templates/login.html
@@ -1,10 +1,18 @@
 <!DOCTYPE html>
-<html>
+<html lang="zh-CN">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>登录 - WeChatRobot管理后台</title>
+    <!-- 添加favicon -->
+    <link rel="icon" href="/static/favicon.ico" type="image/x-icon">
+    <link rel="shortcut icon" href="/static/favicon.ico" type="image/x-icon">
+    <!-- Element UI CSS -->
     <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
+    <!-- Vue.js -->
+    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>
+    <!-- Element UI JS -->
+    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
     <style>
         body {
             margin: 0;
@@ -19,7 +27,7 @@
         .login-container {
             width: 400px;
             padding: 30px;
-            background-color: #fff;
+            background-color: white;
             border-radius: 4px;
             box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
         }
@@ -43,22 +51,24 @@
     </style>
 </head>
 <body>
-    <div id="app" class="login-container">
-        <h2 class="login-title">WeChatRobot管理后台</h2>
-        <el-form class="login-form" :model="loginForm" :rules="loginRules" ref="loginForm">
-            <el-form-item prop="username">
-                <el-input v-model="loginForm.username" placeholder="用户名" prefix-icon="el-icon-user"></el-input>
-            </el-form-item>
-            <el-form-item prop="password">
-                <el-input v-model="loginForm.password" placeholder="密码" prefix-icon="el-icon-lock" show-password></el-input>
-            </el-form-item>
-            <el-button type="primary" class="login-button" @click="submitForm('loginForm')">登录</el-button>
+    <div id="app">
+        <div class="login-container">
+            <h2 class="login-title">WeChatRobot管理后台</h2>
+            <el-form class="login-form" ref="loginForm" :model="loginForm" :rules="rules" label-width="0px">
+                <el-form-item prop="username">
+                    <el-input v-model="loginForm.username" prefix-icon="el-icon-user" placeholder="用户名"></el-input>
+                </el-form-item>
+                <el-form-item prop="password">
+                    <el-input v-model="loginForm.password" prefix-icon="el-icon-lock" placeholder="密码" type="password" @keyup.enter.native="submitForm"></el-input>
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" class="login-button" @click="submitForm" :loading="loading">登录</el-button>
+                </el-form-item>
+            </el-form>
             <div class="error-message" v-if="errorMessage">{{ errorMessage }}</div>
-        </el-form>
+        </div>
     </div>
 
-    <script src="https://unpkg.com/vue/dist/vue.js"></script>
-    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
     <script>
         new Vue({
             el: '#app',
@@ -68,7 +78,7 @@
                         username: '',
                         password: ''
                     },
-                    loginRules: {
+                    rules: {
                         username: [
                             { required: true, message: '请输入用户名', trigger: 'blur' }
                         ],
@@ -76,34 +86,44 @@
                             { required: true, message: '请输入密码', trigger: 'blur' }
                         ]
                     },
-                    errorMessage: '{{ error }}'
-                };
+                    loading: false,
+                    errorMessage: ''
+                }
             },
             methods: {
-                submitForm(formName) {
-                    this.$refs[formName].validate((valid) => {
+                submitForm() {
+                    this.$refs.loginForm.validate((valid) => {
                         if (valid) {
-                            // 创建表单并提交
-                            const form = document.createElement('form');
-                            form.method = 'POST';
-                            form.action = '/login';
+                            this.loading = true;
+                            // 创建表单数据
+                            const formData = new FormData();
+                            formData.append('username', this.loginForm.username);
+                            formData.append('password', this.loginForm.password);
                             
-                            const usernameInput = document.createElement('input');
-                            usernameInput.type = 'hidden';
-                            usernameInput.name = 'username';
-                            usernameInput.value = this.loginForm.username;
-                            form.appendChild(usernameInput);
-                            
-                            const passwordInput = document.createElement('input');
-                            passwordInput.type = 'hidden';
-                            passwordInput.name = 'password';
-                            passwordInput.value = this.loginForm.password;
-                            form.appendChild(passwordInput);
-                            
-                            document.body.appendChild(form);
-                            form.submit();
-                        } else {
-                            return false;
+                            // 发送POST请求
+                            fetch('/login', {
+                                method: 'POST',
+                                body: formData
+                            })
+                            .then(response => {
+                                if (response.redirected) {
+                                    window.location.href = response.url;
+                                } else {
+                                    return response.text();
+                                }
+                            })
+                            .then(html => {
+                                if (html) {
+                                    // 如果返回HTML，说明登录失败
+                                    this.errorMessage = '用户名或密码错误';
+                                    this.loading = false;
+                                }
+                            })
+                            .catch(error => {
+                                console.error('登录出错:', error);
+                                this.errorMessage = '登录请求失败，请稍后重试';
+                                this.loading = false;
+                            });
                         }
                     });
                 }
