admin/waveform-analysis
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 22 Wiki Activity

feat(chart): add multi-axis overlay controls

Browse Source
This commit is contained in:
李启源
2026-07-20 15:35:19 +08:00
parent 0cab86f7b6
commit c9e4dae25f
44 changed files with 1882 additions and 523 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
DAILY_SUMMARY_2026-07-18.md
View File

@@ -49,13 +49,13 @@ src/
### 关键收益
| 指标 | 成果 |
|------|------|
| ✅ 模块数量 | 从 3 个增加到 13 个 |
| 指标 | 成果 |
| ----------------- | --------------------------- |
| ✅ 模块数量 | 从 3 个增加到 13 个 |
| ✅ 单文件平均行数 | 从 762 行降到 219 行 (-71%) |
| ✅ 类型定义 | 集中管理，易于维护 |
| ✅ 核心引擎 | 框架无关，可跨框架复用 |
| ✅ 向后兼容 | 完全兼容，旧代码无需修改 |
| ✅ 类型定义 | 集中管理，易于维护 |
| ✅ 核心引擎 | 框架无关，可跨框架复用 |
| ✅ 向后兼容 | 完全兼容，旧代码无需修改 |
### 验证结果
@@ -81,12 +81,14 @@ src/
### 解决方案
**智能间隔显示策略**：
- 当轨道高度 ≥ 80px：显示所有标签
- 当轨道高度 40-79px：每隔 1 个显示
- 当轨道高度 27-39px：每隔 2 个显示
- 当轨道高度 < 27px：每隔 3+ 个显示
**视觉增强**：
- 添加半透明白色背景，提高标签可读性
- 标签与背景对比度更高
@@ -96,7 +98,7 @@ src/
function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean {
const MIN_HEIGHT_FOR_LABEL = 80
if (trackHeight >= MIN_HEIGHT_FOR_LABEL) return true
const labelSpacing = Math.ceil(MIN_HEIGHT_FOR_LABEL / trackHeight)
return trackIndex % labelSpacing === 0
}
@@ -124,11 +126,13 @@ function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean
创建了 2 个独立的可复用组件：
#### 1. WaveformToolbar.vue (174 行)
- 交互模式切换（缩放、选择、标注）
- 标注工具按钮（文字、垂直线、区间）
- 编辑和删除操作
#### 2. WaveformEditor.vue (143 行)
- 多行文本输入
- 自动聚焦和全选
- 键盘快捷键（Ctrl+Enter 确认，Escape 取消）
@@ -136,16 +140,17 @@ function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean
### 代码统计
| 指标 | 数值 |
|------|------|
| **新增组件** | 2 个 |
| **新增代码** | 317 行 |
| **主组件减少** | ~90 行 |
| 指标 | 数值 |
| -------------- | ----------------------- |
| **新增组件** | 2 个 |
| **新增代码** | 317 行 |
| **主组件减少** | ~90 行 |
| **主组件行数** | 1913 → ~1823 行 (-4.7%) |
### 架构改进
**重构前** (70 行内联代码):
```vue
<div class="waveform-chart__toolbar">
<button>...</button>
@@ -160,6 +165,7 @@ function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean
```
**重构后** (16 行组件调用):
```vue
<WaveformToolbar
:interaction-mode="activeInteractionMode"
@@ -197,21 +203,21 @@ function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean
### 代码变更统计
| 项目 | 新增 | 修改 | 删除 | 净增 |
|------|------|------|------|------|
| **目录结构拆分** | 8 个文件 (368 行) | 3 个文件 | - | +368 行 |
| **Y 轴标签修复** | 31 行 | 15 行 | - | +46 行 |
| **组件拆分** | 2 个组件 (317 行) | 主组件 | 90 行 | +227 行 |
| **总计** | **10 个新文件** | **多个文件** | **90 行** | **+641 行** |
| 项目 | 新增 | 修改 | 删除 | 净增 |
| ---------------- | ----------------- | ------------ | --------- | ----------- |
| **目录结构拆分** | 8 个文件 (368 行) | 3 个文件 | - | +368 行 |
| **Y 轴标签修复** | 31 行 | 15 行 | - | +46 行 |
| **组件拆分** | 2 个组件 (317 行) | 主组件 | 90 行 | +227 行 |
| **总计** | **10 个新文件** | **多个文件** | **90 行** | **+641 行** |
### 主组件瘦身进度
| 阶段 | 行数 | 变化 | 累计减少 |
|------|------|------|----------|
| 原始 | 1975 | - | - |
| 阶段 1：工具函数拆分 | 1913 | -62 | -62 (3.1%) |
| Y 轴标签修复 | 1944 | +31 | -31 (1.6%) |
| 组件拆分 | 1823 | -121 | -152 (7.7%) |
| 阶段 | 行数 | 变化 | 累计减少 |
| -------------------- | ---- | ---- | ----------- |
| 原始 | 1975 | - | - |
| 阶段 1：工具函数拆分 | 1913 | -62 | -62 (3.1%) |
| Y 轴标签修复 | 1944 | +31 | -31 (1.6%) |
| 组件拆分 | 1823 | -121 | -152 (7.7%) |
**说明**: Y 轴标签修复新增了功能代码，但通过组件拆分又减少了更多代码。
@@ -221,23 +227,23 @@ function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean
### 模块化程度
| 维度 | 重构前 | 重构后 | 改善 |
|------|--------|--------|------|
| 独立模块数 | 3 | 13 | ✅ +333% |
| 维度 | 重构前 | 重构后 | 改善 |
| ------------ | ---------- | ----------- | ----------- |
| 独立模块数 | 3 | 13 | ✅ +333% |
| 类型定义文件 | 混在组件中 | 独立 types/ | ✅ 集中管理 |
| 工具函数 | 混在组件中 | 独立 utils/ | ✅ 可复用 |
| 核心引擎 | 耦合 Vue | 框架无关 | ✅ 可跨框架 |
| UI 组件 | 单体 | 模块化 | ✅ 易维护 |
| 工具函数 | 混在组件中 | 独立 utils/ | ✅ 可复用 |
| 核心引擎 | 耦合 Vue | 框架无关 | ✅ 可跨框架 |
| UI 组件 | 单体 | 模块化 | ✅ 易维护 |
### 代码质量
| 指标 | 状态 |
|------|------|
| TypeScript 类型覆盖 | ✅ 100% |
| 单元测试覆盖 | ✅ 24/24 通过 |
| ESLint 规范 | ✅ 0 错误 0 警告 |
| 依赖关系 | ✅ 单向，无循环 |
| 向后兼容 | ✅ 完全兼容 |
| 指标 | 状态 |
| ------------------- | ---------------- |
| TypeScript 类型覆盖 | ✅ 100% |
| 单元测试覆盖 | ✅ 24/24 通过 |
| ESLint 规范 | ✅ 0 错误 0 警告 |
| 依赖关系 | ✅ 单向，无循环 |
| 向后兼容 | ✅ 完全兼容 |
---
@@ -409,10 +415,10 @@ function shouldShowYAxisLabel(trackHeight: number, trackIndex: number): boolean
### 项目健康度
| 维度 | 评分 |
|------|------|
| 维度 | 评分 |
| -------- | ---------- |
| 代码组织 | ⭐⭐⭐⭐⭐ |
| 测试覆盖 | ⭐⭐⭐⭐☆ |
| 测试覆盖 | ⭐⭐⭐⭐☆ |
| 文档完善 | ⭐⭐⭐⭐⭐ |
| 可维护性 | ⭐⭐⭐⭐⭐ |
| 可扩展性 | ⭐⭐⭐⭐⭐ |