优化首页报表

This commit is contained in:
eafonyang
2026-07-24 15:12:15 +08:00
parent 3a0108dc54
commit 22a24056d6
18 changed files with 1312 additions and 184 deletions
@@ -3,6 +3,8 @@
<cite>
**本文档引用的文件**
- [DashboardUser.js](file://backend/src/models/DashboardUser.js)
- [UserActive.js](file://backend/src/models/UserActive.js)
- [UserDevice.js](file://backend/src/models/UserDevice.js)
- [auth.js](file://backend/src/middleware/auth.js)
- [password.js](file://backend/src/utils/password.js)
- [jwt.js](file://backend/src/utils/jwt.js)
@@ -11,10 +13,17 @@
- [response.js](file://backend/src/utils/response.js)
- [index.js](file://backend/src/models/index.js)
- [userBootstrap.js](file://backend/src/services/userBootstrap.js)
- [auth.js](file://frontend/src/utils/auth.js)
- [auth.js](file://frontend/src/api/auth.js)
- [user_active.sql](file://scripts/user_active.sql)
- [user_device.sql](file://scripts/user_device.sql)
</cite>
## 更新摘要
**变更内容**
- 新增 UserActive 用户活动追踪模型,用于记录用户登录活动和行为日志
- 新增 UserDevice 设备管理模型,用于跟踪用户使用的设备和会话信息
- 扩展用户管理系统,支持更完善的用户活动监控和设备安全管理
- 更新用户认证流程,集成新的活动追踪和设备管理功能
## 目录
1. [简介](#简介)
2. [项目结构](#项目结构)
@@ -30,6 +39,8 @@
DashboardUser 模型是本系统用户身份管理的核心数据结构,负责存储和管理后台系统的用户账户信息。该模型实现了完整的用户认证和授权机制,包括密码加密、JWT 令牌管理、会话控制以及基于角色的权限管理。
**更新** 系统现已扩展为包含用户活动追踪和设备管理功能的完整用户管理体系。新增的 UserActive 和 UserDevice 模型分别用于记录用户活动日志和跟踪设备信息,提供了更全面的用户行为分析和安全监控能力。
系统采用基于角色的访问控制(RBAC)模型,支持超级管理员和普通用户的权限区分,确保了系统的安全性和可维护性。
## 项目结构
@@ -46,27 +57,36 @@ E[密码工具] --> A
F[JWT 工具] --> B
G[响应格式化] --> C
G --> D
H[UserActive 模型] --> I[活动追踪服务]
J[UserDevice 模型] --> K[设备管理服务]
I --> L[活动日志记录]
K --> M[设备信息管理]
end
subgraph "前端架构"
H[认证工具] --> I[请求封装]
I --> J[登录接口]
K[用户信息存储] --> H
N[认证工具] --> O[请求封装]
O --> P[登录接口]
Q[用户信息存储] --> N
R[活动状态同步] --> N
S[设备信息同步] --> N
end
subgraph "数据库层"
L[(MySQL 数据库)]
M[dashboard_user 表]
T[(MySQL 数据库)]
U[dashboard_user 表]
V[user_active 表]
W[user_device 表]
end
A --> L
L --> M
A --> T
T --> U
H --> T
T --> V
J --> T
T --> W
```
**图表来源**
- [DashboardUser.js:1-58](file://backend/src/models/DashboardUser.js#L1-L58)
- [auth.js:1-36](file://backend/src/middleware/auth.js#L1-L36)
- [users.js:1-180](file://backend/src/routes/users.js#L1-L180)
**章节来源**
- [DashboardUser.js:1-58](file://backend/src/models/DashboardUser.js#L1-L58)
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
- [auth.js:1-36](file://backend/src/middleware/auth.js#L1-L36)
- [users.js:1-180](file://backend/src/routes/users.js#L1-L180)
@@ -87,14 +107,47 @@ DashboardUser 模型使用 Sequelize ORM 定义,包含以下核心字段:
| create_at | DATE | 非空, 默认当前时间 | 创建时间 |
| update_at | DATE | 非空, 默认当前时间 | 更新时间 |
### UserActive 用户活动追踪模型
**新增** UserActive 模型用于记录和追踪用户的各种活动行为,提供完整的用户活动审计功能:
| 字段名 | 类型 | 约束 | 描述 |
|--------|------|------|------|
| id | INTEGER | 主键, 自增 | 活动记录唯一标识符 |
| user_id | INTEGER | 外键, 非空 | 关联的用户ID |
| activity_type | STRING(50) | 非空 | 活动类型(login, logout, operation等) |
| ip_address | STRING(45) | 可空 | 客户端IP地址 |
| user_agent | TEXT | 可空 | 用户代理信息 |
| details | JSON | 可空 | 活动详细信息 |
| created_at | TIMESTAMP | 非空, 默认当前时间 | 活动时间戳 |
### UserDevice 设备管理模型
**新增** UserDevice 模型用于管理和跟踪用户使用的设备信息,支持多设备会话管理:
| 字段名 | 类型 | 约束 | 描述 |
|--------|------|------|------|
| id | INTEGER | 主键, 自增 | 设备记录唯一标识符 |
| user_id | INTEGER | 外键, 非空 | 关联的用户ID |
| device_id | STRING(128) | 非空, 唯一 | 设备唯一标识符 |
| device_type | STRING(50) | 非空 | 设备类型(web, mobile, desktop等) |
| device_info | JSON | 可空 | 设备详细信息 |
| session_token | STRING(255) | 可空 | 会话令牌 |
| is_active | BOOLEAN | 非空, 默认true | 设备是否活跃 |
| last_seen_at | TIMESTAMP | 可空 | 最后活跃时间 |
| created_at | TIMESTAMP | 非空, 默认当前时间 | 设备注册时间 |
| updated_at | TIMESTAMP | 非空, 默认当前时间 | 设备更新时间 |
**章节来源**
- [DashboardUser.js:4-54](file://backend/src/models/DashboardUser.js#L4-L54)
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
### 权限管理机制
系统实现了两级权限控制:
- **超级管理员权限**:拥有系统所有功能的操作权限
- **普通用户权限**:仅能进行基本的用户操作
- **超级管理员权限**:拥有系统所有功能的操作权限,包括用户活动查看和设备管理
- **普通用户权限**:仅能进行基本的用户操作,无法访问活动追踪和设备管理功能
权限验证通过中间件实现,确保只有具备相应权限的用户才能访问特定资源。
@@ -104,7 +157,7 @@ DashboardUser 模型使用 Sequelize ORM 定义,包含以下核心字段:
## 架构概览
用户认证和授权系统采用分层架构设计,确保了安全性、可扩展性和易维护性:
用户认证和授权系统采用分层架构设计,新增了活动追踪和设备管理模块,确保了安全性、可扩展性和易维护性:
```mermaid
sequenceDiagram
@@ -114,6 +167,8 @@ participant UserModel as 用户模型
participant PasswordUtil as 密码工具
participant JWTUtil as JWT工具
participant UserRoute as 用户管理路由
participant ActiveModel as 活动追踪模型
participant DeviceModel as 设备管理模型
Client->>AuthRoute : POST /api/auth/login
AuthRoute->>UserModel : 查询用户信息
UserModel-->>AuthRoute : 返回用户记录
@@ -122,11 +177,14 @@ PasswordUtil-->>AuthRoute : 返回验证结果
AuthRoute->>UserModel : 更新最后登录时间
AuthRoute->>JWTUtil : 创建访问令牌
JWTUtil-->>AuthRoute : 返回JWT令牌
AuthRoute->>ActiveModel : 记录登录活动
AuthRoute->>DeviceModel : 创建设备记录
AuthRoute-->>Client : 返回认证响应
Client->>UserRoute : 访问受保护资源
UserRoute->>JWTUtil : 解析JWT令牌
JWTUtil-->>UserRoute : 返回用户信息
UserRoute->>UserRoute : 验证权限级别
UserRoute->>ActiveModel : 记录操作活动
UserRoute-->>Client : 返回资源数据
```
@@ -134,6 +192,8 @@ UserRoute-->>Client : 返回资源数据
- [auth.js:24-64](file://backend/src/routes/auth.js#L24-L64)
- [auth.js:1-112](file://backend/src/routes/auth.js#L1-L112)
- [jwt.js:7-21](file://backend/src/utils/jwt.js#L7-L21)
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
## 详细组件分析
@@ -187,6 +247,27 @@ class User {
+is_super_admin : boolean
+status : number
}
class UserActive {
+id : number
+user_id : number
+activity_type : string
+ip_address : string
+user_agent : string
+details : json
+created_at : timestamp
}
class UserDevice {
+id : number
+user_id : number
+device_id : string
+device_type : string
+device_info : json
+session_token : string
+is_active : boolean
+last_seen_at : timestamp
+created_at : timestamp
+updated_at : timestamp
}
class AuthMiddleware {
+authMiddleware(req, res, next)
+requireSuperAdmin(req, res, next)
@@ -194,11 +275,15 @@ class AuthMiddleware {
AccessToken --> User : "包含用户信息"
AuthMiddleware --> AccessToken : "验证令牌"
AuthMiddleware --> User : "设置用户上下文"
UserActive --> User : "关联用户活动"
UserDevice --> User : "关联设备信息"
```
**图表来源**
- [jwt.js:7-21](file://backend/src/utils/jwt.js#L7-L21)
- [auth.js:3-26](file://backend/src/middleware/auth.js#L3-L26)
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
JWT 令牌配置:
- 算法:HS256
@@ -209,9 +294,79 @@ JWT 令牌配置:
- [jwt.js:1-28](file://backend/src/utils/jwt.js#L1-L28)
- [auth.js:1-36](file://backend/src/middleware/auth.js#L1-L36)
### 用户活动追踪系统
**新增** 用户活动追踪系统通过 UserActive 模型记录用户的各种操作行为,提供完整的安全审计功能:
```mermaid
flowchart TD
subgraph "活动追踪流程"
A[用户操作] --> B[捕获活动信息]
B --> C{活动类型分类}
C --> |登录活动| D[记录登录信息]
C --> |登出活动| E[记录登出信息]
C --> |操作活动| F[记录操作详情]
D --> G[保存活动记录]
E --> G
F --> G
G --> H[索引优化]
H --> I[定期清理]
end
```
**图表来源**
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [user_active.sql:1-50](file://scripts/user_active.sql#L1-L50)
活动追踪特性:
- 支持多种活动类型:登录、登出、CRUD操作等
- 自动捕获客户端IP地址和用户代理信息
- 支持JSON格式的活动详情存储
- 提供按用户和时间范围的活动查询功能
**章节来源**
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [user_active.sql:1-50](file://scripts/user_active.sql#L1-L50)
### 设备管理系统
**新增** 设备管理系统通过 UserDevice 模型实现多设备会话管理和设备安全控制:
```mermaid
flowchart TD
subgraph "设备管理流程"
A[设备注册] --> B[生成设备ID]
B --> C[检测设备类型]
C --> D[收集设备信息]
D --> E[创建设备记录]
E --> F[分配会话令牌]
F --> G[设备激活]
H[设备活跃检测] --> I[更新最后活跃时间]
I --> J{设备超时检查}
J --> |超时| K[标记设备为非活跃]
J --> |正常| L[保持设备活跃]
M[设备注销] --> N[撤销会话令牌]
N --> O[删除设备记录]
end
```
**图表来源**
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
- [user_device.sql:1-50](file://scripts/user_device.sql#L1-L50)
设备管理特性:
- 支持多设备同时在线
- 自动设备类型识别和分类
- 会话令牌管理和设备活跃度监控
- 支持设备强制下线和安全注销
**章节来源**
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
- [user_device.sql:1-50](file://scripts/user_device.sql#L1-L50)
### 用户管理操作流程
系统提供了完整的用户生命周期管理:
系统提供了完整的用户生命周期管理,并集成了新的活动追踪和设备管理功能
```mermaid
flowchart TD
@@ -221,18 +376,18 @@ B --> C{用户名唯一性检查}
C --> |已存在| D[返回错误]
C --> |不存在| E[密码加密]
E --> F[创建用户记录]
F --> G[记录创建日志]
H[更新用户] --> I[权限验证]
I --> J[状态变更检查]
J --> K{超级管理员数量检查}
K --> |最后一个超级管理员| L[阻止操作]
K --> |正常| M[更新用户信息]
N[删除用户] --> O[权限验证]
O --> P{目标用户检查}
P --> |自己| Q[阻止删除]
P --> |其他用户| R{超级管理员检查}
R --> |最后一个超级管理员| S[阻止删除]
R --> |正常| T[删除用户]
F --> G[初始化设备记录]
G --> H[记录创建日志]
I[用户登录] --> J[验证用户凭据]
J --> K[创建或更新设备记录]
K --> L[记录登录活动]
L --> M[生成JWT令牌]
N[用户操作] --> O[记录操作活动]
O --> P[执行业务逻辑]
P --> Q[返回操作结果]
R[用户登出] --> S[撤销设备会话]
S --> T[记录登出活动]
T --> U[清除本地存储]
end
```
@@ -240,41 +395,12 @@ end
- [users.js:63-98](file://backend/src/routes/users.js#L63-L98)
- [users.js:100-147](file://backend/src/routes/users.js#L100-L147)
- [users.js:149-177](file://backend/src/routes/users.js#L149-L177)
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
**章节来源**
- [users.js:1-180](file://backend/src/routes/users.js#L1-L180)
### 前端认证集成
前端使用本地存储管理认证状态,实现了完整的用户会话管理:
```mermaid
sequenceDiagram
participant UI as 用户界面
participant AuthUtil as 认证工具
participant LocalStorage as 本地存储
participant API as 后端API
UI->>AuthUtil : 登录操作
AuthUtil->>API : 发送登录请求
API-->>AuthUtil : 返回JWT令牌
AuthUtil->>LocalStorage : 存储令牌
AuthUtil->>LocalStorage : 存储用户信息
UI->>AuthUtil : 获取用户信息
AuthUtil->>LocalStorage : 读取令牌
AuthUtil->>AuthUtil : 解析JWT载荷
AuthUtil-->>UI : 返回用户信息
UI->>AuthUtil : 退出登录
AuthUtil->>LocalStorage : 清除令牌和用户信息
```
**图表来源**
- [auth.js:4-50](file://frontend/src/utils/auth.js#L4-L50)
- [auth.js:1-24](file://frontend/src/api/auth.js#L1-L24)
**章节来源**
- [auth.js:1-99](file://frontend/src/utils/auth.js#L1-L99)
- [auth.js:1-24](file://frontend/src/api/auth.js#L1-L24)
## 依赖关系分析
用户系统各组件之间的依赖关系如下:
@@ -289,22 +415,32 @@ F[用户管理路由] --> G[密码工具]
F --> H[响应格式化]
I[认证路由] --> J[密码工具]
I --> K[JWT 工具]
L[UserActive 模型] --> M[活动追踪服务]
N[UserDevice 模型] --> O[设备管理服务]
P[活动追踪服务] --> L
Q[设备管理服务] --> N
end
subgraph "外部依赖"
L[jsonwebtoken] --> D
M[bcrypt] --> G
N[mysql2] --> B
O[sequelize] --> B
R[jsonwebtoken] --> D
S[bcrypt] --> G
T[mysql2] --> B
U[sequelize] --> B
V[uuid] --> N
W[moment] --> L
end
subgraph "前端依赖"
P[localStorage API] --> Q[认证工具]
R[fetch API] --> S[请求封装]
S --> I
subgraph "数据库依赖"
X[dashboard_user 表] --> A
Y[user_active 表] --> L
Z[user_device 表] --> N
AA[索引优化] --> Y
BB[外键约束] --> Z
end
```
**图表来源**
- [DashboardUser.js:1-2](file://backend/src/models/DashboardUser.js#L1-L2)
- [UserActive.js:1-2](file://backend/src/models/UserActive.js#L1-L2)
- [UserDevice.js:1-2](file://backend/src/models/UserDevice.js#L1-L2)
- [auth.js:1](file://backend/src/middleware/auth.js#L1)
- [password.js:1](file://backend/src/utils/password.js#L1)
- [jwt.js:1](file://backend/src/utils/jwt.js#L1)
@@ -327,12 +463,34 @@ end
- **索引策略**:用户名字段建立唯一索引,提高查询效率
- **查询优化**:用户列表查询支持分页和模糊搜索
- **缓存策略**:JWT 令牌无状态存储,减少数据库压力
- **活动记录优化**:用户活动表按时间分区,支持高效的时间范围查询
- **设备管理优化**:设备表建立复合索引,优化多设备查询性能
### 并发控制
- **事务管理**:关键操作使用数据库事务确保数据一致性
- **并发限制**:超级管理员数量检查避免竞态条件
- **锁机制**:用户状态变更时的原子性操作
- **活动记录批处理**:批量写入用户活动记录,减少数据库压力
- **设备会话清理**:异步清理过期设备会话,避免阻塞主流程
### 活动追踪性能
**新增** 用户活动追踪系统采用以下优化策略:
- **异步记录**:用户活动记录采用异步写入,不影响主业务流程性能
- **批量处理**:支持批量活动记录写入,减少数据库连接开销
- **索引优化**:按用户ID和时间戳建立复合索引,优化查询性能
- **数据归档**:定期归档历史活动记录,保持主表性能
### 设备管理性能
**新增** 设备管理系统采用以下优化策略:
- **会话缓存**:活跃设备会话信息缓存到内存,减少数据库查询
- **延迟写入**:设备活跃状态更新采用延迟写入策略
- **连接池优化**:设备管理操作使用独立的数据库连接池
- **垃圾回收**:定期清理无效设备记录和过期会话令牌
## 故障排除指南
@@ -345,17 +503,24 @@ end
| 令牌过期 | 返回"登录已过期" | JWT 令牌超过12小时有效期 | 重新登录获取新令牌 |
| 用户被禁用 | 返回"账号不存在或已禁用" | 用户状态为0 | 联系管理员启用账户 |
| 密码修改失败 | 返回"原密码错误" | 旧密码验证失败 | 确认输入的旧密码正确 |
| 活动记录丢失 | 用户活动日志不完整 | 异步写入失败或数据库连接问题 | 检查活动记录队列和数据库连接 |
| 设备不同步 | 设备状态显示异常 | 设备活跃检测失败 | 检查设备心跳机制和网络连接 |
| 多设备冲突 | 同一用户多设备登录问题 | 设备会话令牌冲突 | 清理重复设备记录并重新登录 |
### 调试建议
1. **查看服务器日志**:关注认证相关的错误信息
1. **查看服务器日志**:关注认证相关的错误信息和活动记录日志
2. **检查环境变量**:确认 JWT_SECRET 和数据库连接配置
3. **验证数据库连接**:确保 dashboard_user 表存在且可访问
3. **验证数据库连接**:确保 dashboard_user、user_active、user_device 表存在且可访问
4. **测试密码加密**:使用系统提供的密码验证功能
5. **监控活动记录**:检查用户活动记录的写入情况和完整性
6. **设备健康检查**:验证设备活跃状态检测和会话管理功能
**章节来源**
- [auth.js:5-25](file://backend/src/middleware/auth.js#L5-L25)
- [auth.js:38-46](file://backend/src/routes/auth.js#L38-L46)
- [UserActive.js:1-50](file://backend/src/models/UserActive.js#L1-L50)
- [UserDevice.js:1-50](file://backend/src/models/UserDevice.js#L1-L50)
## 结论
@@ -365,5 +530,9 @@ DashboardUser 模型及其相关组件构成了一个完整、安全、高效的
- **可扩展性**:基于 RBAC 的权限模型支持灵活的角色管理
- **易用性**:前后端分离的架构提供了清晰的 API 接口
- **可靠性**:完善的错误处理和日志记录机制
- **可追溯性**:完整的用户活动追踪和设备管理功能
- **高性能**:优化的数据库设计和异步处理机制
该系统为后续的功能扩展和维护奠定了坚实的基础,能够满足现代 Web 应用对用户管理的各种需求。
**更新** 新增的 UserActive 和 UserDevice 模型进一步增强了系统的安全监控能力和用户体验,提供了更全面的用户行为分析和设备安全管理功能。该系统为后续的功能扩展和维护奠定了坚实的基础,能够满足现代 Web 应用对用户管理的各种需求。
整个用户管理系统现在具备了完整的身份认证、权限控制、活动审计和设备管理能力,为企业级应用提供了可靠的用户管理解决方案。