2025-12-2genxin

frontend/history-articles.html

@@ -310,9 +310,9 @@
                     <a href="#" class="nav-link">监控中心</a>
                     <a href="#" class="nav-link">数据分析</a>
                     <a href="#" class="nav-link">帮助文档</a>
-                    <a href="user-center.html" class="nav-link" id="userMenu" style="display: none;">👤 用户中心</a>
+                    <a href="user-center.html" class="nav-link" id="userCenterLink">👤 用户中心</a>
                     <a href="login.html" class="nav-link" id="loginLink">🔐 登录</a>
-                    <a href="#" class="nav-link" id="logoutLink" style="display: none;" onclick="logout()">🚪 退出</a>
+                    <div id="userMenu" class="user-info"></div>
                 </nav>
             </div>
             <h1>历史文章</h1>
@@ -629,11 +629,18 @@
 
         // 登录状态管理
         function checkLoginStatus() {
-            const isLoggedIn = localStorage.getItem('isLoggedIn') === 'true';
-            const username = localStorage.getItem('username');
+            // 检查认证数据
+            const authData = localStorage.getItem('authData') || sessionStorage.getItem('authData');
             
-            if (isLoggedIn && username) {
-                showLoggedInState(username);
+            if (authData) {
+                try {
+                    const auth = JSON.parse(authData);
+                    const username = auth.user_info && auth.user_info.username ? auth.user_info.username : '用户';
+                    showLoggedInState(username);
+                } catch (e) {
+                    console.error('解析登录数据失败:', e);
+                    showLoggedOutState();
+                }
             } else {
                 showLoggedOutState();
             }
@@ -641,38 +648,68 @@
 
         // 显示已登录状态
         function showLoggedInState(username) {
-            document.getElementById('loginLink').style.display = 'none';
-            document.getElementById('userMenu').style.display = 'block';
-            document.getElementById('logoutLink').style.display = 'block';
+            const loginLink = document.getElementById('loginLink');
+            const userMenu = document.getElementById('userMenu');
             
-            // 为用户中心菜单添加点击事件
-            document.getElementById('userMenu').onclick = function() {
-                window.location.href = 'user-center.html';
-            };
+            if (loginLink) loginLink.style.display = 'none';
+            if (userMenu) {
+                userMenu.innerHTML = `
+                    <div class="user-info">
+                        <span class="user-name">${username}</span>
+                        <button class="logout-btn" onclick="logout()" style="background: rgba(255,255,255,0.2); color: white; border: 1px solid rgba(255,255,255,0.3); padding: 6px 16px; border-radius: 6px; cursor: pointer; font-size: 14px; transition: all 0.3s;">退出登录</button>
+                    </div>
+                `;
+                userMenu.style.display = 'flex';
+            }
         }
 
         // 显示未登录状态
         function showLoggedOutState() {
-            document.getElementById('loginLink').style.display = 'block';
-            document.getElementById('userMenu').style.display = 'none';
-            document.getElementById('logoutLink').style.display = 'none';
+            const loginLink = document.getElementById('loginLink');
+            const userMenu = document.getElementById('userMenu');
+            
+            if (loginLink) loginLink.style.display = 'inline';
+            if (userMenu) userMenu.innerHTML = '';
         }
 
         // 登出功能
         function logout() {
             if (confirm('确定要退出登录吗？')) {
-                localStorage.removeItem('isLoggedIn');
-                localStorage.removeItem('username');
-                localStorage.removeItem('token');
-                sessionStorage.removeItem('userSession');
+                // 获取认证数据
+                const authData = localStorage.getItem('authData') || sessionStorage.getItem('authData');
+                let token = '';
                 
-                showLoggedOutState();
-                alert('已成功退出登录！');
-                
-                // 如果在用户中心页面，跳转到首页
-                if (window.location.pathname.includes('user-center.html')) {
-                    window.location.href = 'frontend.html';
+                if (authData) {
+                    try {
+                        const auth = JSON.parse(authData);
+                        token = auth.token || '';
+                    } catch (e) {
+                        console.error('解析token失败:', e);
+                    }
                 }
+                
+                // 调用后端API登出
+                fetch('http://localhost:8080/api/user/logout', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                        'Authorization': token
+                    },
+                    body: JSON.stringify({ token: token })
+                })
+                .finally(() => {
+                    // 清除所有认证信息
+                    localStorage.removeItem('authData');
+                    sessionStorage.removeItem('authData');
+                    localStorage.removeItem('isLoggedIn');
+                    localStorage.removeItem('username');
+                    localStorage.removeItem('token');
+                    sessionStorage.removeItem('userSession');
+                    
+                    showLoggedOutState();
+                    alert('已成功退出登录！');
+                    window.location.href = 'login.html';
+                });
             }
         }