# 注册界面 + 设置界面 功能设计 ## 概述 为 Jarvis 系统添加用户注册功能和完整的设置界面。用户可以: - 在前端注册账号 - 在设置界面管理个人信息和 LLM 配置 - 配置定时任务等系统参数 **核心价值:** 支持多用户、每个用户独立配置自己的 LLM 提供商和参数。 ## 现状分析 ### 已有的功能 - 后端已有 `/api/auth/register` API - 后端使用 `pydantic-settings` 从 `.env` 读取配置 - 前端只有登录页面,无注册入口 ### 需要改动的地方 - 前端 LoginView 添加注册表单 - User 模型增加 `llm_config` 和 `scheduler_config` JSON 字段 - 新建 Settings 路由和服务 - 新建 SettingsView 页面 ## 数据模型 ### User 表扩展 ```sql ALTER TABLE users ADD COLUMN llm_config TEXT; ALTER TABLE users ADD COLUMN scheduler_config TEXT; ``` ### 字段结构 **llm_config (JSON):** ```json { "chat": { "provider": "openai|claude|ollama|deepseek|custom", "model": "gpt-4o", "base_url": "https://api.openai.com/v1", "api_key": "sk-..." }, "vlm": { "provider": "openai", "model": "gpt-4o", "base_url": "...", "api_key": "..." }, "embedding": { "provider": "openai", "model": "text-embedding-3-small", "base_url": "...", "api_key": "..." }, "rerank": { "provider": "openai", "model": "bge-reranker-v2", "base_url": "...", "api_key": "..." } } ``` **scheduler_config (JSON):** ```json { "daily_plan_time": "08:00", "forum_scan_interval_minutes": 30, "todo_ai_generate_time": "08:00", "enabled": true } ``` ## API 设计 ### 1. 注册 API (已有) ``` POST /api/auth/register Body: { email, password, full_name } Response: UserOut ``` ### 2. 获取用户设置 ``` GET /api/settings Response: { profile: { id, email, full_name, created_at }, llm_config: { ... }, scheduler_config: { ... } } ``` ### 3. 更新用户资料 ``` PUT /api/settings/profile Body: { full_name?, password? } Response: UserOut ``` ### 4. 更新 LLM 配置 ``` PUT /api/settings/llm Body: { chat?: {...}, vlm?: {...}, embedding?: {...}, rerank?: {...} } Response: { llm_config: { ... } } // 返回更新后的完整配置 ``` ### 5. 测试 LLM 连接 ``` POST /api/settings/llm/test Body: { type: "chat"|"vlm"|"embedding"|"rerank", provider, model, base_url, api_key } Response: { success: true, message: "连接成功" } 或 { success: false, error: "错误信息" } ``` ### 6. 更新定时任务配置 ``` PUT /api/settings/scheduler Body: { daily_plan_time?, forum_scan_interval_minutes?, todo_ai_generate_time?, enabled? } Response: { scheduler_config: { ... } } // 返回更新后的完整配置 ``` ## 前端页面 ### LoginView.vue 改动 - 添加"注册"和"登录"切换 Tab - 注册表单:邮箱、密码、确认密码、用户名 - 复用现有 sci-fi 登录风格 ### SettingsView.vue (新建) #### 页面布局 ``` ┌─────────────────────────────────────────────────┐ │ [⚙] SETTINGS │ ├─────────────────────────────────────────────────┤ │ ┌─────────────────────────────────────────────┐ │ │ │ PROFILE │ │ │ │ Email: operator@jarvis.ai │ │ │ │ Name: [___________] │ │ │ │ Password: [********] [Change] │ │ │ └─────────────────────────────────────────────┘ │ │ ┌─────────────────────────────────────────────┐ │ │ │ LLM CONFIGURATION │ │ │ │ ┌─ Chat ────────────────────────────────┐ │ │ │ │ │ Provider: [OpenAI ▼] │ │ │ │ │ │ Model: [gpt-4o ____________] │ │ │ │ │ │ Base URL:[https://...] ] │ │ │ │ │ │ API Key: [•••••••••••••••••] │ │ │ │ │ └──────────────────────────────────────┘ │ │ │ │ ┌─ VLM ─────────────────────────────────┐ │ │ │ │ │ ... (同上结构) │ │ │ │ │ └──────────────────────────────────────┘ │ │ │ │ ┌─ Embedding ───────────────────────────┐ │ │ │ │ │ ... (同上结构) │ │ │ │ │ └──────────────────────────────────────┘ │ │ │ │ ┌─ Rerank ──────────────────────────────┐ │ │ │ │ │ ... (同上结构) │ │ │ │ │ └──────────────────────────────────────┘ │ │ │ └─────────────────────────────────────────────┘ │ │ ┌─────────────────────────────────────────────┐ │ │ │ SCHEDULER │ │ │ │ Daily Plan Time: [08:00] │ │ │ │ Forum Scan Interval: [30] 分钟 │ │ │ │ Todo AI Generate: [08:00] │ │ │ │ Scheduler Enabled: [ON] │ │ │ └─────────────────────────────────────────────┘ │ │ ┌─────────────────────────────────────────────┐ │ │ │ [SAVE ALL SETTINGS] │ │ │ └─────────────────────────────────────────────┘ │ └─────────────────────────────────────────────────┘ ``` #### 交互行为 - 修改后点击"保存"按钮,按钮显示 loading 状态 - 保存成功显示 toast 提示"保存成功" - 保存失败显示 toast 提示错误信息 - 密码修改需二次确认弹窗 - API Key 字段支持显示/隐藏切换 - 每个模型配置卡片有独立的"测试"按钮 - Provider 切换时自动填充默认值(如 Ollama 切换到 localhost:11434) - Scheduler enabled 关闭时,时间输入框显示禁用状态 - 空配置时显示"点击配置"占位提示 #### 注册表单 - 邮箱:必填,格式校验 - 用户名:必填,2-20 字符 - 密码:必填,最少 8 字符 - 确认密码:必填,需与密码一致 - 密码强度指示器(弱/中/强) ## 路由和侧边栏 ### router/index.ts ```typescript { path: 'settings', name: 'settings', component: () => import('@/views/SettingsView.vue'), } ``` ### SidebarNav.vue ```typescript { name: '设置', path: '/settings', icon: Settings } ``` ## 技术实现 ### 后端文件 ``` backend/app/ models/ user.py # 修改:添加 llm_config, scheduler_config 字段 schemas/ auth.py # 修改:UserCreate 支持 full_name settings.py # 新建:SettingsOut, LLMConfigIn, SchedulerConfigIn routers/ settings.py # 新建:settings router services/ settings_service.py # 新建:设置逻辑服务 ``` ### 前端文件 ``` frontend/src/ api/ settings.ts # 新建:settings API 客户端 views/ LoginView.vue # 修改:添加注册 Tab SettingsView.vue # 新建:设置页面 router/ index.ts # 修改:添加 /settings 路由 components/ SidebarNav.vue # 修改:添加设置菜单 ``` ## 验证清单 1. 注册功能正常 - 可以通过注册页面创建新账号 2. 登录功能正常 - 新老用户都可以登录 3. 设置页面可访问 - 登录后可进入设置页面 4. 个人信息修改正常 - 用户名、密码可修改 5. LLM 配置保存正常 - 四种模型配置可保存 6. LLM 测试连接正常 - 可以验证配置是否正确 7. 定时任务配置正常 - 时间间隔可修改 8. 配置持久化正常 - 重新登录后配置保留 9. UI 风格一致 - 设置页面与其他页面风格统一 10. 注册表单验证正常 - 密码强度、格式校验有效