添加注册登录功能

src/flask_prompt_master/templates/base.html

@@ -10,6 +10,12 @@
     <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
     <!-- Font Awesome -->
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
+    <!-- Bootstrap CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- jQuery -->
+    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
+    <!-- Bootstrap JS -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
     <style>
         /* 全局样式 */
         :root {
@@ -68,6 +74,57 @@
             font-size: 1.5rem;
         }
 
+        .nav-links {
+            display: flex;
+            gap: 1rem;
+            align-items: center;
+        }
+
+        .nav-link {
+            color: var(--text-color);
+            text-decoration: none;
+            padding: 0.5rem 1rem;
+            border-radius: 4px;
+            transition: all 0.3s ease;
+            display: flex;
+            align-items: center;
+            gap: 0.5rem;
+        }
+
+        .nav-link:hover {
+            background: var(--background-color);
+            color: var(--primary-color);
+        }
+
+        .nav-link i {
+            font-size: 1rem;
+        }
+        
+        .user-menu {
+            display: flex;
+            align-items: center;
+        }
+        
+        .user-menu .dropdown-toggle {
+            color: var(--text-color);
+            text-decoration: none;
+            padding: 0.5rem 1rem;
+            border-radius: 4px;
+            transition: all 0.3s ease;
+            display: flex;
+            align-items: center;
+            gap: 0.5rem;
+        }
+        
+        .user-menu .dropdown-toggle:hover {
+            background: var(--background-color);
+            color: var(--primary-color);
+        }
+        
+        .user-menu .dropdown-menu {
+            min-width: 200px;
+        }
+
         /* 主要内容区域 */
         main {
             min-height: calc(100vh - 120px);
@@ -118,6 +175,72 @@
         }
     </style>
     {% block extra_css %}{% endblock %}
+    <script>
+        // 检查登录状态并更新用户菜单
+        function updateUserMenu() {
+            fetch('/api/check-login')
+                .then(response => response.json())
+                .then(data => {
+                    const userMenu = document.getElementById('userMenu');
+                    if (data.logged_in) {
+                        userMenu.innerHTML = `
+                            <div class="dropdown">
+                                <a class="dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">
+                                    <i class="fas fa-user"></i>
+                                    ${data.user.nickname}
+                                </a>
+                                <ul class="dropdown-menu">
+                                    <li><a class="dropdown-item" href="/profile">个人资料</a></li>
+                                    <li><hr class="dropdown-divider"></li>
+                                    <li><a class="dropdown-item" href="#" onclick="logout()">退出登录</a></li>
+                                </ul>
+                            </div>
+                        `;
+                    } else {
+                        userMenu.innerHTML = `
+                            <a href="/login" class="nav-link">
+                                <i class="fas fa-sign-in-alt"></i>
+                                登录
+                            </a>
+                            <a href="/register" class="nav-link">
+                                <i class="fas fa-user-plus"></i>
+                                注册
+                            </a>
+                        `;
+                    }
+                })
+                .catch(error => {
+                    console.error('检查登录状态失败:', error);
+                });
+        }
+        
+        function logout() {
+            fetch('/api/logout', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json'
+                }
+            })
+            .then(response => response.json())
+            .then(data => {
+                if (data.success) {
+                    alert('退出登录成功');
+                    window.location.reload();
+                } else {
+                    alert(data.message || '退出登录失败');
+                }
+            })
+            .catch(error => {
+                console.error('退出登录失败:', error);
+                alert('退出登录失败，请稍后重试');
+            });
+        }
+        
+        // 页面加载时更新用户菜单
+        document.addEventListener('DOMContentLoaded', function() {
+            updateUserMenu();
+        });
+    </script>
 </head>
 <body>
     <header>
@@ -126,6 +249,19 @@
                 <i class="fas fa-magic"></i>
                 提示词大师
             </a>
+            <div class="nav-links">
+                <a href="{{ url_for('main.index') }}" class="nav-link">
+                    <i class="fas fa-plus"></i>
+                    生成提示词
+                </a>
+                <a href="{{ url_for('favorites.favorites_page') }}" class="nav-link">
+                    <i class="fas fa-heart"></i>
+                    我的收藏
+                </a>
+                <div class="user-menu" id="userMenu">
+                    <!-- 用户菜单将通过JavaScript动态加载 -->
+                </div>
+            </div>
         </nav>
     </header>
 
@@ -147,6 +283,7 @@
         <p>&copy; 2025 提示词大师 - 让AI更好地理解您的需求</p>
     </footer>
 
+    {% block scripts %}{% endblock %}
     {% block extra_js %}{% endblock %}
     <script>
         // 自动隐藏闪现消息