首页新增新增&日活报表

This commit is contained in:
eafonyang
2026-07-20 18:39:33 +08:00
parent d2a8ef2f2d
commit 3a0108dc54
26 changed files with 990 additions and 613 deletions
@@ -10,17 +10,16 @@
- [measurementStorage.js](file://backend/src/services/measurementStorage.js)
- [eqCacheStorage.js](file://backend/src/services/eqCacheStorage.js)
- [curveClient.js](file://backend/src/services/curveClient.js)
- [index.vue](file://frontend/src/views/model/index.vue)
- [ModelFormDialog.vue](file://frontend/src/views/model/components/ModelFormDialog.vue)
- [model.js](file://frontend/src/api/model.js)
- [index.vue](file://frontend/src/views/headphone/model/index.vue)
- [ModelFormDialog.vue](file://frontend/src/views/headphone/model/components/ModelFormDialog.vue)
- [model.js](file://frontend/src/service/api/model.ts)
</cite>
## 更新摘要
**变更内容**
- 新增squig.link集成服务,支持从外部频率响应数据源自动获取数据
- 增强前端导入功能,支持从squig.link分享链接直接抓取频响数据
- 新增自动佩戴方式检测和品牌/型号解析功能
- 扩展型号创建和更新流程,支持squiglink_csv参数
- 耳机模型表单对话框得到增强,包含17行新增和9行删除,改进了耳机模型选择和配置界面
- 优化了前端交互体验,提升了用户操作流畅度
- 增强了表单验证和错误处理机制
## 目录
1. [简介](#简介)
@@ -42,7 +41,7 @@
```mermaid
graph TB
FE["前端视图<br/>frontend/src/views/model/index.vue"] --> API["API 客户端<br/>frontend/src/api/model.js"]
FE["前端视图<br/>frontend/src/views/headphone/model/index.vue"] --> API["API 客户端<br/>frontend/src/service/api/model.ts"]
API --> ROUTER["后端路由<br/>backend/src/routes/models.js"]
ROUTER --> MODEL["型号模型<br/>backend/src/models/Model.js"]
ROUTER --> VALIDATOR["型号验证器<br/>backend/src/validators/model.js"]
@@ -54,8 +53,8 @@ ROUTER --> BRAND["品牌模型<br/>backend/src/models/Brand.js"]
```
**图表来源**
- [index.vue:1-1226](file://frontend/src/views/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/api/model.js#L1-L165)
- [index.vue:1-1226](file://frontend/src/views/headphone/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/service/api/model.ts#L1-L165)
- [models.js:1-659](file://backend/src/routes/models.js#L1-L659)
- [Model.js:1-53](file://backend/src/models/Model.js#L1-L53)
- [model.js:1-22](file://backend/src/validators/model.js#L1-L22)
@@ -66,8 +65,8 @@ ROUTER --> BRAND["品牌模型<br/>backend/src/models/Brand.js"]
- [Brand.js:1-23](file://backend/src/models/Brand.js#L1-L23)
**章节来源**
- [index.vue:1-1226](file://frontend/src/views/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/api/model.js#L1-L165)
- [index.vue:1-1226](file://frontend/src/views/headphone/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/service/api/model.ts#L1-L165)
- [models.js:1-659](file://backend/src/routes/models.js#L1-L659)
- [Model.js:1-53](file://backend/src/models/Model.js#L1-L53)
- [model.js:1-22](file://backend/src/validators/model.js#L1-L22)
@@ -144,8 +143,8 @@ API-->>FE : 渲染结果
- [measurementStorage.js:61-108](file://backend/src/services/measurementStorage.js#L61-L108)
- [eqCacheStorage.js:24-66](file://backend/src/services/eqCacheStorage.js#L24-L66)
- [curveClient.js:81-138](file://backend/src/services/curveClient.js#L81-L138)
- [index.vue:714-1063](file://frontend/src/views/model/index.vue#L714-L1063)
- [model.js:13-165](file://frontend/src/api/model.js#L13-L165)
- [index.vue:714-1063](file://frontend/src/views/headphone/model/index.vue#L714-L1063)
- [model.js:13-165](file://frontend/src/service/api/model.ts#L13-L165)
## 详细组件分析
@@ -207,7 +206,7 @@ BRAND ||--o{ MODEL : "拥有多个型号"
**章节来源**
- [Model.js:1-53](file://backend/src/models/Model.js#L1-L53)
- [index.vue:226-250](file://frontend/src/views/model/index.vue#L226-L250)
- [index.vue:226-250](file://frontend/src/views/headphone/model/index.vue#L226-L250)
### 测量数据存储与检索
- 文件类型:支持 CSV、TXT、JSONTXT 将被转换为 CSV。
@@ -274,13 +273,13 @@ end
- [models.js:466-514](file://backend/src/routes/models.js#L466-L514)
- [models.js:516-566](file://backend/src/routes/models.js#L516-L566)
- [curveClient.js:81-138](file://backend/src/services/curveClient.js#L81-L138)
- [index.vue:1117-1220](file://frontend/src/views/model/index.vue#L1117-L1220)
- [index.vue:1117-1220](file://frontend/src/views/headphone/model/index.vue#L1117-L1220)
**章节来源**
- [models.js:466-514](file://backend/src/routes/models.js#L466-L514)
- [models.js:516-566](file://backend/src/routes/models.js#L516-L566)
- [curveClient.js:81-138](file://backend/src/services/curveClient.js#L81-L138)
- [index.vue:1117-1220](file://frontend/src/views/model/index.vue#L1117-L1220)
- [index.vue:1117-1220](file://frontend/src/views/headphone/model/index.vue#L1117-L1220)
### Squig.link集成服务与自动数据抓取
@@ -338,9 +337,9 @@ ParseBrand --> ReturnData["返回抓取结果"]
**章节来源**
- [squiglink.js:1-322](file://backend/src/services/squiglink.js#L1-L322)
- [models.js:307-369](file://backend/src/routes/models.js#L307-L369)
- [ModelFormDialog.vue:16-46](file://frontend/src/views/model/components/ModelFormDialog.vue#L16-L46)
- [ModelFormDialog.vue:289-332](file://frontend/src/views/model/components/ModelFormDialog.vue#L289-L332)
- [model.js:152-165](file://frontend/src/api/model.js#L152-L165)
- [ModelFormDialog.vue:16-46](file://frontend/src/views/headphone/model/components/ModelFormDialog.vue#L16-L46)
- [ModelFormDialog.vue:289-332](file://frontend/src/views/headphone/model/components/ModelFormDialog.vue#L289-L332)
- [model.js:152-165](file://frontend/src/service/api/model.ts#L152-L165)
### 前端交互与使用示例
- 列表查询:支持品牌名称与型号名称模糊搜索、排序与分页。
@@ -350,9 +349,9 @@ ParseBrand --> ReturnData["返回抓取结果"]
- **squig.link导入**:在表单中输入squig.link分享链接,自动抓取频响数据并填充表单字段。
**章节来源**
- [index.vue:1-1226](file://frontend/src/views/model/index.vue#L1-L1226)
- [ModelFormDialog.vue:1-555](file://frontend/src/views/model/components/ModelFormDialog.vue#L1-L555)
- [model.js:1-165](file://frontend/src/api/model.js#L1-L165)
- [index.vue:1-1226](file://frontend/src/views/headphone/model/index.vue#L1-L1226)
- [ModelFormDialog.vue:1-555](file://frontend/src/views/headphone/model/components/ModelFormDialog.vue#L1-L555)
- [model.js:1-165](file://frontend/src/service/api/model.ts#L1-L165)
## 依赖关系分析
- 前端依赖:Element Plus 组件库、Vue 3、axios 请求封装。
@@ -361,7 +360,7 @@ ParseBrand --> ReturnData["返回抓取结果"]
```mermaid
graph LR
FE["前端(index.vue)"] --> API["API(model.js)"]
FE["前端(index.vue)"] --> API["API(model.ts)"]
API --> RT["路由(models.js)"]
RT --> MD["模型(Model.js)"]
RT --> VAL["验证器(model.js)"]
@@ -373,8 +372,8 @@ RT --> BR["品牌(Brand.js)"]
```
**图表来源**
- [index.vue:1-1226](file://frontend/src/views/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/api/model.js#L1-L165)
- [index.vue:1-1226](file://frontend/src/views/headphone/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/service/api/model.ts#L1-L165)
- [models.js:1-659](file://backend/src/routes/models.js#L1-L659)
- [Model.js:1-53](file://backend/src/models/Model.js#L1-L53)
- [model.js:1-22](file://backend/src/validators/model.js#L1-L22)
@@ -385,8 +384,8 @@ RT --> BR["品牌(Brand.js)"]
- [Brand.js:1-23](file://backend/src/models/Brand.js#L1-L23)
**章节来源**
- [index.vue:1-1226](file://frontend/src/views/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/api/model.js#L1-L165)
- [index.vue:1-1226](file://frontend/src/views/headphone/model/index.vue#L1-L1226)
- [model.js:1-165](file://frontend/src/service/api/model.ts#L1-L165)
- [models.js:1-659](file://backend/src/routes/models.js#L1-L659)
- [Model.js:1-53](file://backend/src/models/Model.js#L1-L53)
- [model.js:1-22](file://backend/src/validators/model.js#L1-L22)
@@ -420,7 +419,7 @@ RT --> BR["品牌(Brand.js)"]
- 现象:上传文件返回"不支持的文件格式"。
- 排查:确认扩展名为 CSV/TXT/JSONTXT 会被转换为 CSV。
- 参考
- [models.js:320-325](file://backend/src/routes/models.js#L320-L325)
- [models.js:320-325](file://backend/src/routes/models.js#L320-325)
- [models.js:59-68](file://backend/src/routes/models.js#L59-L68)
- S3 读取失败
- 现象:查看 CSV 时提示"S3 上未找到该型号的频响文件"或读取失败。
@@ -440,19 +439,19 @@ RT --> BR["品牌(Brand.js)"]
- 参考
- [models.js:307-369](file://backend/src/routes/models.js#L307-L369)
- [squiglink.js:261-310](file://backend/src/services/squiglink.js#L261-L310)
- [ModelFormDialog.vue:289-332](file://frontend/src/views/model/components/ModelFormDialog.vue#L289-L332)
- [ModelFormDialog.vue:289-332](file://frontend/src/views/headphone/model/components/ModelFormDialog.vue#L289-L332)
**章节来源**
- [model.js:3-19](file://backend/src/validators/model.js#L3-L19)
- [models.js:312-317](file://backend/src/routes/models.js#L312-L317)
- [models.js:320-325](file://backend/src/routes/models.js#L320-L325)
- [models.js:320-325](file://backend/src/routes/models.js#L320-325)
- [models.js:255-258](file://backend/src/routes/models.js#L255-L258)
- [measurementStorage.js:87-108](file://backend/src/services/measurementStorage.js#L87-L108)
- [models.js:466-514](file://backend/src/routes/models.js#L466-L514)
- [curveClient.js:81-138](file://backend/src/services/curveClient.js#L81-L138)
- [models.js:307-369](file://backend/src/routes/models.js#L307-L369)
- [squiglink.js:261-310](file://backend/src/services/squiglink.js#L261-L310)
- [ModelFormDialog.vue:289-332](file://frontend/src/views/model/components/ModelFormDialog.vue#L289-L332)
- [ModelFormDialog.vue:289-332](file://frontend/src/views/headphone/model/components/ModelFormDialog.vue#L289-L332)
## 结论
型号管理功能通过清晰的前后端职责划分与严格的参数验证,实现了从基础 CRUD 到技术规格管理、测量数据存储与搜索引擎推送的完整闭环。**新增的squig.link集成服务进一步增强了数据获取能力,支持从外部频率响应数据源自动抓取数据,显著提升了用户体验**。借助 Redis 与 S3 的高效读写能力,以及第三方曲线校验服务,系统在保证数据一致性的同时提升了用户体验与可维护性。建议在生产环境中进一步完善日志与监控,优化批量推送的并发与重试策略,并持续关注外部依赖的稳定性。
@@ -474,4 +473,4 @@ RT --> BR["品牌(Brand.js)"]
**章节来源**
- [models.js:133-659](file://backend/src/routes/models.js#L133-L659)
- [model.js:13-165](file://frontend/src/api/model.js#L13-L165)
- [model.js:13-165](file://frontend/src/service/api/model.ts#L13-L165)