Compare commits
13 Commits
255fd7e00b
...
v1.6.2
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
dd2cf1c576 | ||
|
|
b7e9e5e472 | ||
|
|
491f2afe3f | ||
|
|
6b2a3b088f | ||
|
|
82a6e24132 | ||
|
|
4a1a78ee14 | ||
|
|
00c75fb0b8 | ||
|
|
a56d37a2e9 | ||
|
|
43e6d1f4b4 | ||
|
|
5ff5e5d18b | ||
|
|
44483120a5 | ||
|
|
18a81ae030 | ||
|
|
5178a2425a |
@@ -0,0 +1,212 @@
|
||||
# ReportAnalysisDialog 组件重构分析
|
||||
|
||||
## 📊 当前状态分析
|
||||
|
||||
### 基本指标
|
||||
|
||||
- **总行数**: 948 行
|
||||
- **函数/声明**: 9 个
|
||||
- **React Hooks**: 20 个使用
|
||||
- **职责数量**: 5+ 个主要职责
|
||||
|
||||
### 组件职责分析
|
||||
|
||||
#### 1. 数据获取与解析 (~150 行)
|
||||
|
||||
- `loadAndAnalyzeReports` - 数据加载逻辑
|
||||
- `extractReportValues` - 报告内容解析
|
||||
- `parseDurationToSeconds` - 时间解析
|
||||
|
||||
#### 2. 数据聚合与转换 (~200 行)
|
||||
|
||||
- `chartData` useMemo - 按日期聚合
|
||||
- `comparisonData` useMemo - 按用户聚合
|
||||
- `comparisonChartData` useMemo - 图表数据格式化
|
||||
- `allUsers` useMemo - 用户列表提取
|
||||
|
||||
#### 3. 状态管理 (~100 行)
|
||||
|
||||
- 6 个 useState hooks
|
||||
- 5 个 useCallback handlers
|
||||
- 复杂的状态交互逻辑
|
||||
|
||||
#### 4. UI 控制与交互 (~200 行)
|
||||
|
||||
- 指标选择按钮
|
||||
- 视图模式切换
|
||||
- 用户筛选器
|
||||
- 加载/错误状态显示
|
||||
|
||||
#### 5. 图表渲染 (~300 行)
|
||||
|
||||
- Recharts 图表配置
|
||||
- 两个不同的视图模式
|
||||
- 自定义 Tooltip 组件
|
||||
- 图表样式和布局
|
||||
|
||||
## 🎯 重构目标
|
||||
|
||||
### 主要问题
|
||||
|
||||
1. **单一文件过大**: 难以维护和理解
|
||||
2. **职责混乱**: 数据获取、处理、UI 混在一起
|
||||
3. **复用性差**: 逻辑和 UI 紧耦合
|
||||
4. **测试困难**: 难以单独测试各个部分
|
||||
|
||||
### 重构原则
|
||||
|
||||
1. **单一职责**: 每个模块只负责一件事
|
||||
2. **可复用性**: 提取通用逻辑到 hooks
|
||||
3. **可测试性**: 分离逻辑和 UI
|
||||
4. **可维护性**: 清晰的文件结构
|
||||
|
||||
## 📦 建议的文件结构
|
||||
|
||||
```
|
||||
src/renderer/src/components/report-analysis/
|
||||
├── index.tsx # 主组件入口 (~150 行)
|
||||
├── hooks/
|
||||
│ ├── useReportData.ts # 数据获取和解析 (~100 行)
|
||||
│ ├── useChartData.ts # 数据聚合和转换 (~150 行)
|
||||
│ └── useReportFilters.ts # 筛选状态管理 (~80 行)
|
||||
├── components/
|
||||
│ ├── ReportChart.tsx # 图表组件 (~200 行)
|
||||
│ ├── MetricSelector.tsx # 指标选择器 (~80 行)
|
||||
│ ├── ViewModeToggle.tsx # 视图模式切换 (~50 行)
|
||||
│ ├── UserFilter.tsx # 用户筛选器 (~100 行)
|
||||
│ ├── CustomTooltip.tsx # 自定义 tooltip (~100 行)
|
||||
│ ├── ComparisonTooltip.tsx # 对比 tooltip (~80 行)
|
||||
│ └── LoadingState.tsx # 加载状态组件 (~60 行)
|
||||
├── utils/
|
||||
│ ├── parser.ts # 报告解析工具 (~100 行)
|
||||
│ ├── aggregators.ts # 数据聚合函数 (~120 行)
|
||||
│ └── formatters.ts # 格式化工具 (~60 行)
|
||||
└── types.ts # 类型定义 (~80 行)
|
||||
```
|
||||
|
||||
## 🔧 重构方案
|
||||
|
||||
### 方案 A: 完全重构 (推荐)
|
||||
|
||||
**优点**: 最大程度的解耦和可维护性
|
||||
**缺点**: 需要更多时间,可能引入新问题
|
||||
**时间估计**: 2-3 小时
|
||||
|
||||
### 方案 B: 渐进式重构
|
||||
|
||||
**优点**: 风险较低,可以逐步验证
|
||||
**缺点**: 过渡期代码可能不够优雅
|
||||
**时间估计**: 1-2 小时
|
||||
|
||||
### 方案 C: 最小化重构
|
||||
|
||||
**优点**: 改动最小,风险最低
|
||||
**缺点**: 解决根本问题有限
|
||||
**时间估计**: 30-45 分钟
|
||||
|
||||
## 📝 详细重构步骤
|
||||
|
||||
### Phase 1: 提取类型和工具函数 (低风险)
|
||||
|
||||
1. 创建 `types.ts` - 集中管理所有类型定义
|
||||
2. 创建 `utils/parser.ts` - 提取报告解析逻辑
|
||||
3. 创建 `utils/aggregators.ts` - 提取数据聚合逻辑
|
||||
|
||||
### Phase 2: 提取自定义 Hooks (中风险)
|
||||
|
||||
1. 创建 `hooks/useReportData.ts` - 数据获取和解析
|
||||
2. 创建 `hooks/useChartData.ts` - 数据聚合和转换
|
||||
3. 创建 `hooks/useReportFilters.ts` - 筛选状态管理
|
||||
|
||||
### Phase 3: 提取 UI 组件 (中风险)
|
||||
|
||||
1. 创建 `components/MetricSelector.tsx`
|
||||
2. 创建 `components/ViewModeToggle.tsx`
|
||||
3. 创建 `components/UserFilter.tsx`
|
||||
4. 创建 `components/ReportChart.tsx`
|
||||
|
||||
### Phase 4: 重构主组件 (高风险)
|
||||
|
||||
1. 简化 `index.tsx` 只保留组合逻辑
|
||||
2. 添加错误边界
|
||||
3. 优化加载状态
|
||||
|
||||
## 🎯 重构后的预期效果
|
||||
|
||||
### 代码行数分布
|
||||
|
||||
- 主组件: ~150 行 (减少 84%)
|
||||
- 每个 hook: ~80-150 行
|
||||
- 每个 UI 组件: ~50-200 行
|
||||
- 工具函数: ~60-120 行
|
||||
|
||||
### 可维护性提升
|
||||
|
||||
- ✅ 单个文件更小,更易理解
|
||||
- ✅ 职责清晰,修改影响范围小
|
||||
- ✅ 更容易进行单元测试
|
||||
- ✅ 可以独立优化各个部分
|
||||
|
||||
### 性能影响
|
||||
|
||||
- ➡️ 性能基本不变或略有提升
|
||||
- ➡️ 代码分割优化可能略微改善首次加载
|
||||
- ➡️ 更好的 memoization 机会
|
||||
|
||||
## 🚨 风险评估
|
||||
|
||||
### 高风险区域
|
||||
|
||||
- 图表配置逻辑(Recharts 配置复杂)
|
||||
- 数据转换和聚合(业务逻辑密集)
|
||||
- 状态同步(多个状态之间的交互)
|
||||
|
||||
### 缓解措施
|
||||
|
||||
- 保持现有测试通过
|
||||
- 逐步重构,每步验证
|
||||
- 添加 TypeScript 严格检查
|
||||
- 保留原有功能注释
|
||||
|
||||
## 📋 验证清单
|
||||
|
||||
重构完成后需要验证:
|
||||
|
||||
- [ ] 所有现有功能正常工作
|
||||
- [ ] 单元测试通过
|
||||
- [ ] E2E 测试通过
|
||||
- [ ] 类型检查无错误
|
||||
- [ ] 性能无明显下降
|
||||
- [ ] 代码风格符合规范
|
||||
|
||||
## 🤔 建议的实施顺序
|
||||
|
||||
### 推荐方案: 渐进式重构 (方案 B)
|
||||
|
||||
**第1步**: 提取类型和工具函数 (15分钟)
|
||||
|
||||
- 创建类型定义文件
|
||||
- 提取解析工具函数
|
||||
- 验证编译和测试
|
||||
|
||||
**第2步**: 提取自定义 Hooks (30分钟)
|
||||
|
||||
- 提取数据获取逻辑
|
||||
- 提取数据聚合逻辑
|
||||
- 提取筛选状态管理
|
||||
- 验证功能正常
|
||||
|
||||
**第3步**: 提取 UI 组件 (30分钟)
|
||||
|
||||
- 提取控制面板组件
|
||||
- 提取图表组件
|
||||
- 提取状态显示组件
|
||||
- 验证交互正常
|
||||
|
||||
**第4步**: 简化主组件 (15分钟)
|
||||
|
||||
- 重构为组合式组件
|
||||
- 清理代码和注释
|
||||
- 最终验证
|
||||
|
||||
**总计**: 约 90 分钟,分4个阶段,每个阶段都可以独立验证
|
||||
14
docs/releases/1.6.0.md
Normal file
14
docs/releases/1.6.0.md
Normal file
@@ -0,0 +1,14 @@
|
||||
# 1.6.0
|
||||
|
||||
## 核心功能
|
||||
|
||||
- 新增管理员报表分析功能,支持多维度数据统计和可视化。
|
||||
- 提供按日期聚合和用户对比两种视图模式。
|
||||
- 支持处理订单数、删除物料数、错误数量等 7 种指标分析。
|
||||
- 提供每订单平均耗时等效率指标,帮助识别性能瓶颈。
|
||||
|
||||
## 体验优化
|
||||
|
||||
- 对比视图下自动限制指标单选,避免图表信息过载。
|
||||
- 切换视图模式时智能保留已选指标,提升交互流畅度。
|
||||
- 优化时间解析逻辑,准确提取执行耗时数据。
|
||||
42
docs/releases/1.6.1.md
Normal file
42
docs/releases/1.6.1.md
Normal file
@@ -0,0 +1,42 @@
|
||||
# 1.6.1
|
||||
|
||||
## 核心改进
|
||||
|
||||
- **重大重构**:将报告分析组件从 948 行单体组件重构为模块化架构,拆分为 11 个专注的模块文件。
|
||||
- **代码质量提升**:主组件代码量减少 79%(948 → 200 行),显著提升可维护性和可读性。
|
||||
- **架构优化**:分离数据获取、状态管理和 UI 渲染逻辑,遵循单一职责原则。
|
||||
|
||||
## 体验优化
|
||||
|
||||
- **修复 tooltip 显示问题**:解决执行时间在提示框中重复显示的问题,现在只显示一次格式化后的时间值。
|
||||
- **统一时间格式**:所有时间数值统一保留 1 位小数,提升数据显示的一致性和专业度。
|
||||
- **优化界面布局**:精简 tooltip 底部信息,避免冗余内容干扰用户视线。
|
||||
|
||||
## 性能优化
|
||||
|
||||
- **组件渲染优化**:将 tooltip 组件移出父组件并使用 React.memo,减少不必要的重新渲染。
|
||||
- **正则表达式优化**:预编译正则表达式模式,避免在循环中重复创建,提升数据处理效率。
|
||||
- **状态更新优化**:使用函数式 setState 更新,避免闭包陷阱和过期的状态读取。
|
||||
- **回调函数优化**:使用 useCallback 稳定回调函数引用,减少子组件的不必要更新。
|
||||
|
||||
## 开发体验
|
||||
|
||||
- **模块化设计**:将复杂组件拆分为可复用的 hooks 和 UI 组件,便于单独测试和维护。
|
||||
- **类型安全**:完整的 TypeScript 类型定义,提升开发时的类型检查和 IDE 支持。
|
||||
- **代码组织**:清晰的文件结构(types、hooks、components、utils),便于团队协作和代码导航。
|
||||
- **向后兼容**:保持原有 API 接口不变,现有使用方式无需修改。
|
||||
|
||||
## 技术细节
|
||||
|
||||
- 应用 Vercel React 最佳实践,包括:
|
||||
- 避免内联组件定义(rerender-no-inline-components)
|
||||
- 提升正则表达式创建位置(js-hoist-regexp)
|
||||
- 使用函数式状态更新(rerender-functional-setState)
|
||||
- 最小化回调依赖项(rerender-dependencies)
|
||||
- 新增自定义 hooks:useReportData、useChartData、useReportFilters
|
||||
- 新增 UI 组件:MetricSelector、ViewModeToggle、UserFilter、ReportChart
|
||||
- 新增工具函数:数据解析器和聚合器
|
||||
|
||||
## 破坏性变更
|
||||
|
||||
无破坏性变更,所有现有功能保持完全兼容。
|
||||
6
docs/releases/1.6.2.md
Normal file
6
docs/releases/1.6.2.md
Normal file
@@ -0,0 +1,6 @@
|
||||
# 1.6.2
|
||||
|
||||
## 系统优化
|
||||
|
||||
- 简化用户角色体系,移除未使用的 Guest 角色。
|
||||
- 优化类型安全性,加强用户认证流程健壮性。
|
||||
263
package-lock.json
generated
263
package-lock.json
generated
@@ -1,12 +1,12 @@
|
||||
{
|
||||
"name": "erpauto",
|
||||
"version": "1.5.1",
|
||||
"version": "1.6.2",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "erpauto",
|
||||
"version": "1.5.1",
|
||||
"version": "1.6.2",
|
||||
"hasInstallScript": true,
|
||||
"dependencies": {
|
||||
"@aws-sdk/client-s3": "^3.929.0",
|
||||
@@ -27,7 +27,7 @@
|
||||
"playwright-core": "^1.58.2",
|
||||
"react-focus-lock": "^2.13.7",
|
||||
"react-markdown": "^10.1.0",
|
||||
"recharts": "^2.15.4",
|
||||
"recharts": "^3.8.0",
|
||||
"reflect-metadata": "^0.2.2",
|
||||
"rehype-autolink-headings": "^7.1.0",
|
||||
"rehype-highlight": "^7.0.2",
|
||||
@@ -970,7 +970,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@azure/core-client/-/core-client-1.10.1.tgz",
|
||||
"integrity": "sha512-Nh5PhEOeY6PrnxNPsEHRr9eimxLwgLlpmguQaHKBinFYA/RU9+kOYVOQqOrTsCL+KSxrLLl1gD8Dk5BFW/7l/w==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@azure/abort-controller": "^2.1.2",
|
||||
"@azure/core-auth": "^1.10.0",
|
||||
@@ -1032,7 +1031,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@azure/core-rest-pipeline/-/core-rest-pipeline-1.22.2.tgz",
|
||||
"integrity": "sha512-MzHym+wOi8CLUlKCQu12de0nwcq9k9Kuv43j4Wa++CsCpJwps2eeBQwD2Bu8snkxTtDKDx4GwjuR9E8yC8LNrg==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@azure/abort-controller": "^2.1.2",
|
||||
"@azure/core-auth": "^1.10.0",
|
||||
@@ -1224,7 +1222,6 @@
|
||||
"integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@babel/code-frame": "^7.29.0",
|
||||
"@babel/generator": "^7.29.0",
|
||||
@@ -2002,6 +1999,7 @@
|
||||
"dev": true,
|
||||
"license": "BSD-2-Clause",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"cross-dirname": "^0.1.0",
|
||||
"debug": "^4.3.4",
|
||||
@@ -2023,6 +2021,7 @@
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"graceful-fs": "^4.2.0",
|
||||
"jsonfile": "^6.0.1",
|
||||
@@ -2039,6 +2038,7 @@
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"universalify": "^2.0.0"
|
||||
},
|
||||
@@ -2053,6 +2053,7 @@
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">= 10.0.0"
|
||||
}
|
||||
@@ -3308,6 +3309,42 @@
|
||||
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0-rc.1"
|
||||
}
|
||||
},
|
||||
"node_modules/@reduxjs/toolkit": {
|
||||
"version": "2.11.2",
|
||||
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.11.2.tgz",
|
||||
"integrity": "sha512-Kd6kAHTA6/nUpp8mySPqj3en3dm0tdMIgbttnQ1xFMVpufoj+ADi8pXLBsd4xzTRHQa7t/Jv8W5UnCuW4kuWMQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@standard-schema/spec": "^1.0.0",
|
||||
"@standard-schema/utils": "^0.3.0",
|
||||
"immer": "^11.0.0",
|
||||
"redux": "^5.0.1",
|
||||
"redux-thunk": "^3.1.0",
|
||||
"reselect": "^5.1.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.9.0 || ^17.0.0 || ^18 || ^19",
|
||||
"react-redux": "^7.2.1 || ^8.1.3 || ^9.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"react": {
|
||||
"optional": true
|
||||
},
|
||||
"react-redux": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@reduxjs/toolkit/node_modules/immer": {
|
||||
"version": "11.1.4",
|
||||
"resolved": "https://registry.npmjs.org/immer/-/immer-11.1.4.tgz",
|
||||
"integrity": "sha512-XREFCPo6ksxVzP4E0ekD5aMdf8WMwmdNaz6vuvxgI40UaEiu6q3p8X52aU6GdyvLY3XXX/8R7JOTXStz/nBbRw==",
|
||||
"license": "MIT",
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/immer"
|
||||
}
|
||||
},
|
||||
"node_modules/@rolldown/pluginutils": {
|
||||
"version": "1.0.0-rc.3",
|
||||
"resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.3.tgz",
|
||||
@@ -4405,7 +4442,12 @@
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz",
|
||||
"integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@standard-schema/utils": {
|
||||
"version": "0.3.0",
|
||||
"resolved": "https://registry.npmjs.org/@standard-schema/utils/-/utils-0.3.0.tgz",
|
||||
"integrity": "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@swc/helpers": {
|
||||
@@ -4960,7 +5002,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@types/node/-/node-22.19.13.tgz",
|
||||
"integrity": "sha512-akNQMv0wW5uyRpD2v2IEyRSZiR+BeGuoB6L310EgGObO44HSMNT8z1xzio28V8qOrgYaopIDNA18YgdXd+qTiw==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"undici-types": "~6.21.0"
|
||||
}
|
||||
@@ -4982,7 +5023,6 @@
|
||||
"resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.14.tgz",
|
||||
"integrity": "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"csstype": "^3.2.2"
|
||||
}
|
||||
@@ -5027,6 +5067,12 @@
|
||||
"integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/use-sync-external-store": {
|
||||
"version": "0.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
|
||||
"integrity": "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@types/uuid": {
|
||||
"version": "10.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@types/uuid/-/uuid-10.0.0.tgz",
|
||||
@@ -5097,7 +5143,6 @@
|
||||
"integrity": "sha512-klQbnPAAiGYFyI02+znpBRLyjL4/BrBd0nyWkdC0s/6xFLkXYQ8OoRrSkqacS1ddVxf/LDyODIKbQ5TgKAf/Fg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@typescript-eslint/scope-manager": "8.56.1",
|
||||
"@typescript-eslint/types": "8.56.1",
|
||||
@@ -5537,7 +5582,6 @@
|
||||
"integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"acorn": "bin/acorn"
|
||||
},
|
||||
@@ -5570,7 +5614,6 @@
|
||||
"integrity": "sha512-IWrosm/yrn43eiKqkfkHis7QioDleaXQHdDVPKg0FSwwd/DuvyX79TZnFOnYpB7dcsFAMmtFztZuXPDvSePkFw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"fast-deep-equal": "^3.1.1",
|
||||
"fast-json-stable-stringify": "^2.0.0",
|
||||
@@ -6333,7 +6376,6 @@
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"baseline-browser-mapping": "^2.9.0",
|
||||
"caniuse-lite": "^1.0.30001759",
|
||||
@@ -7129,7 +7171,8 @@
|
||||
"integrity": "sha512-+R08/oI0nl3vfPcqftZRpytksBXDzOUveBq/NBVx0sUp1axwzPQrKinNx5yd5sxPu8j1wIy8AfnVQ+5eFdha6Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true
|
||||
"optional": true,
|
||||
"peer": true
|
||||
},
|
||||
"node_modules/cross-spawn": {
|
||||
"version": "7.0.6",
|
||||
@@ -7662,7 +7705,6 @@
|
||||
"integrity": "sha512-glMJgnTreo8CFINujtAhCgN96QAqApDMZ8Vl1r8f0QT8QprvC1UCltV4CcWj20YoIyLZx6IUskaJZ0NV8fokcg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"app-builder-lib": "26.8.1",
|
||||
"builder-util": "26.8.1",
|
||||
@@ -7752,16 +7794,6 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/dom-helpers": {
|
||||
"version": "5.2.1",
|
||||
"resolved": "https://registry.npmjs.org/dom-helpers/-/dom-helpers-5.2.1.tgz",
|
||||
"integrity": "sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.8.7",
|
||||
"csstype": "^3.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/dotenv-expand": {
|
||||
"version": "11.0.7",
|
||||
"resolved": "https://registry.npmjs.org/dotenv-expand/-/dotenv-expand-11.0.7.tgz",
|
||||
@@ -7887,7 +7919,6 @@
|
||||
"integrity": "sha512-Rz5QvP1pTqoU1DPRrG3EeX2oWBtS3uRmd6Z/wzZsb2e/iIUsrT+XcBaAhFr4FW48gDc8uP2wYVyY5Aamha/5Zg==",
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@electron/get": "^2.0.0",
|
||||
"@types/node": "^22.7.7",
|
||||
@@ -8076,6 +8107,7 @@
|
||||
"dev": true,
|
||||
"hasInstallScript": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@electron/asar": "^3.2.1",
|
||||
"debug": "^4.1.1",
|
||||
@@ -8096,6 +8128,7 @@
|
||||
"integrity": "sha512-YJDaCJZEnBmcbw13fvdAM9AwNOJwOzrE4pqMqBq5nFiEqXUqHwlK4B+3pUw6JNvfSPtX05xFHtYy/1ni01eGCw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"graceful-fs": "^4.1.2",
|
||||
"jsonfile": "^4.0.0",
|
||||
@@ -8347,6 +8380,16 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/es-toolkit": {
|
||||
"version": "1.45.1",
|
||||
"resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.45.1.tgz",
|
||||
"integrity": "sha512-/jhoOj/Fx+A+IIyDNOvO3TItGmlMKhtX8ISAHKE90c4b/k1tqaqEZ+uUqfpU8DMnW5cgNJv606zS55jGvza0Xw==",
|
||||
"license": "MIT",
|
||||
"workspaces": [
|
||||
"docs",
|
||||
"benchmarks"
|
||||
]
|
||||
},
|
||||
"node_modules/es6-error": {
|
||||
"version": "4.1.1",
|
||||
"resolved": "https://registry.npmjs.org/es6-error/-/es6-error-4.1.1.tgz",
|
||||
@@ -8424,7 +8467,6 @@
|
||||
"integrity": "sha512-VmQ+sifHUbI/IcSopBCF/HO3YiHQx/AVd3UVyYL6weuwW+HvON9VYn5l6Zl1WZzPWXPNZrSQpxwkkZ/VuvJZzg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@eslint-community/eslint-utils": "^4.8.0",
|
||||
"@eslint-community/regexpp": "^4.12.1",
|
||||
@@ -8485,7 +8527,6 @@
|
||||
"integrity": "sha512-82GZUjRS0p/jganf6q1rEO25VSoHH0hKPCTrgillPjdI/3bgBhAE1QzHrHTizjpRvy6pGAvKjDJtk2pF9NDq8w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"eslint-config-prettier": "bin/cli.js"
|
||||
},
|
||||
@@ -8776,9 +8817,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/eventemitter3": {
|
||||
"version": "4.0.7",
|
||||
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-4.0.7.tgz",
|
||||
"integrity": "sha512-8guHBZCwKnFhYdHr2ysuRWErTwhoN2X8XELRlrRwpmfeY2jjuUN4taQMsULKUVo1K4DvZl+0pgfyoysHxvmvEw==",
|
||||
"version": "5.0.4",
|
||||
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz",
|
||||
"integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/events": {
|
||||
@@ -8900,15 +8941,6 @@
|
||||
"dev": true,
|
||||
"license": "Apache-2.0"
|
||||
},
|
||||
"node_modules/fast-equals": {
|
||||
"version": "5.4.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-equals/-/fast-equals-5.4.0.tgz",
|
||||
"integrity": "sha512-jt2DW/aNFNwke7AUd+Z+e6pz39KO5rzdbbFCg2sGafS4mk13MI7Z8O5z9cADNn5lhGODIgLwug6TZO2ctf7kcw==",
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/fast-json-stable-stringify": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
|
||||
@@ -9968,6 +10000,16 @@
|
||||
"integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/immer": {
|
||||
"version": "10.2.0",
|
||||
"resolved": "https://registry.npmjs.org/immer/-/immer-10.2.0.tgz",
|
||||
"integrity": "sha512-d/+XTN3zfODyjr89gM3mPq1WNX2B8pYsu7eORitdwyA2sBubnTl3laYlBk4sXY5FUa5qTZGBDPJICVbvqzjlbw==",
|
||||
"license": "MIT",
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/immer"
|
||||
}
|
||||
},
|
||||
"node_modules/import-fresh": {
|
||||
"version": "3.3.1",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
|
||||
@@ -11287,6 +11329,7 @@
|
||||
"version": "4.17.23",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.23.tgz",
|
||||
"integrity": "sha512-LgVTMpQtIopCi79SJeDiP0TfWi5CNEc/L/aRdTh3yIvmZXTnheWpKjSZhnvMl8iXbC1tFg9gdHHDMLoV7CnG+w==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/lodash.defaults": {
|
||||
@@ -13471,7 +13514,6 @@
|
||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
|
||||
"integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">=12"
|
||||
},
|
||||
@@ -13552,7 +13594,6 @@
|
||||
}
|
||||
],
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"nanoid": "^3.3.11",
|
||||
"picocolors": "^1.1.1",
|
||||
@@ -13576,6 +13617,7 @@
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"commander": "^9.4.0"
|
||||
},
|
||||
@@ -13593,6 +13635,7 @@
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"optional": true,
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": "^12.20.0 || >=14"
|
||||
}
|
||||
@@ -13613,7 +13656,6 @@
|
||||
"integrity": "sha512-UOnG6LftzbdaHZcKoPFtOcCKztrQ57WkHDeRD9t/PTQtmT0NHSeWWepj6pS0z/N7+08BHFDQVUrfmfMRcZwbMg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"prettier": "bin/prettier.cjs"
|
||||
},
|
||||
@@ -13755,7 +13797,6 @@
|
||||
"resolved": "https://registry.npmjs.org/react/-/react-19.2.4.tgz",
|
||||
"integrity": "sha512-9nfp2hYpCwOjAN+8TZFGhtWEwgvWHXqESH8qT89AT/lWklpLON22Lc8pEtnpsZz7VmawabSU0gCjnj8aC0euHQ==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"engines": {
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
@@ -13777,7 +13818,6 @@
|
||||
"resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.4.tgz",
|
||||
"integrity": "sha512-AXJdLo8kgMbimY95O2aKQqsz2iWi9jMgKJhRBAxECE4IFxfcazB2LmzloIoibJI3C12IlY20+KFaLv+71bUJeQ==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"scheduler": "^0.27.0"
|
||||
},
|
||||
@@ -13841,6 +13881,29 @@
|
||||
"react": ">=18"
|
||||
}
|
||||
},
|
||||
"node_modules/react-redux": {
|
||||
"version": "9.2.0",
|
||||
"resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
|
||||
"integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@types/use-sync-external-store": "^0.0.6",
|
||||
"use-sync-external-store": "^1.4.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@types/react": "^18.2.25 || ^19",
|
||||
"react": "^18.0 || ^19",
|
||||
"redux": "^5.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@types/react": {
|
||||
"optional": true
|
||||
},
|
||||
"redux": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/react-refresh": {
|
||||
"version": "0.18.0",
|
||||
"resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.18.0.tgz",
|
||||
@@ -13851,37 +13914,6 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-smooth": {
|
||||
"version": "4.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-smooth/-/react-smooth-4.0.4.tgz",
|
||||
"integrity": "sha512-gnGKTpYwqL0Iii09gHobNolvX4Kiq4PKx6eWBCYYix+8cdw+cGo3do906l1NBPKkSWx1DghC1dlWG9L2uGd61Q==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"fast-equals": "^5.0.1",
|
||||
"prop-types": "^15.8.1",
|
||||
"react-transition-group": "^4.4.5"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/react-transition-group": {
|
||||
"version": "4.4.5",
|
||||
"resolved": "https://registry.npmjs.org/react-transition-group/-/react-transition-group-4.4.5.tgz",
|
||||
"integrity": "sha512-pZcd1MCJoiKiBR2NRxeCRg13uCXbydPnmB4EOeRrY7480qNWO8IIgQG6zlDkm6uRMsURXPuKq0GWtiM59a5Q6g==",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.5.5",
|
||||
"dom-helpers": "^5.0.1",
|
||||
"loose-envify": "^1.4.0",
|
||||
"prop-types": "^15.6.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": ">=16.6.0",
|
||||
"react-dom": ">=16.6.0"
|
||||
}
|
||||
},
|
||||
"node_modules/read-binary-file-arch": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/read-binary-file-arch/-/read-binary-file-arch-1.0.6.tgz",
|
||||
@@ -13946,43 +13978,50 @@
|
||||
}
|
||||
},
|
||||
"node_modules/recharts": {
|
||||
"version": "2.15.4",
|
||||
"resolved": "https://registry.npmjs.org/recharts/-/recharts-2.15.4.tgz",
|
||||
"integrity": "sha512-UT/q6fwS3c1dHbXv2uFgYJ9BMFHu3fwnd7AYZaEQhXuYQ4hgsxLvsUXzGdKeZrW5xopzDCvuA2N41WJ88I7zIw==",
|
||||
"version": "3.8.0",
|
||||
"resolved": "https://registry.npmjs.org/recharts/-/recharts-3.8.0.tgz",
|
||||
"integrity": "sha512-Z/m38DX3L73ExO4Tpc9/iZWHmHnlzWG4njQbxsF5aSjwqmHNDDIm0rdEBArkwsBvR8U6EirlEHiQNYWCVh9sGQ==",
|
||||
"license": "MIT",
|
||||
"workspaces": [
|
||||
"www"
|
||||
],
|
||||
"dependencies": {
|
||||
"clsx": "^2.0.0",
|
||||
"eventemitter3": "^4.0.1",
|
||||
"lodash": "^4.17.21",
|
||||
"react-is": "^18.3.1",
|
||||
"react-smooth": "^4.0.4",
|
||||
"recharts-scale": "^0.4.4",
|
||||
"tiny-invariant": "^1.3.1",
|
||||
"victory-vendor": "^36.6.8"
|
||||
"@reduxjs/toolkit": "^1.9.0 || 2.x.x",
|
||||
"clsx": "^2.1.1",
|
||||
"decimal.js-light": "^2.5.1",
|
||||
"es-toolkit": "^1.39.3",
|
||||
"eventemitter3": "^5.0.1",
|
||||
"immer": "^10.1.1",
|
||||
"react-redux": "8.x.x || 9.x.x",
|
||||
"reselect": "5.1.1",
|
||||
"tiny-invariant": "^1.3.3",
|
||||
"use-sync-external-store": "^1.2.2",
|
||||
"victory-vendor": "^37.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14"
|
||||
"node": ">=18"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
"react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
|
||||
"react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts-scale": {
|
||||
"version": "0.4.5",
|
||||
"resolved": "https://registry.npmjs.org/recharts-scale/-/recharts-scale-0.4.5.tgz",
|
||||
"integrity": "sha512-kivNFO+0OcUNu7jQquLXAxz1FIwZj8nrj+YkOKc5694NbjCvcT6aSZiIzNzd2Kul4o4rTto8QVR9lMNtxD4G1w==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"decimal.js-light": "^2.4.1"
|
||||
}
|
||||
},
|
||||
"node_modules/recharts/node_modules/react-is": {
|
||||
"version": "18.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz",
|
||||
"integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==",
|
||||
"node_modules/redux": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
|
||||
"integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/redux-thunk": {
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-3.1.0.tgz",
|
||||
"integrity": "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw==",
|
||||
"license": "MIT",
|
||||
"peerDependencies": {
|
||||
"redux": "^5.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/reflect-metadata": {
|
||||
"version": "0.2.2",
|
||||
"resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
|
||||
@@ -14178,6 +14217,12 @@
|
||||
"url": "https://github.com/sponsors/jet2jet"
|
||||
}
|
||||
},
|
||||
"node_modules/reselect": {
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/reselect/-/reselect-5.1.1.tgz",
|
||||
"integrity": "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/resolve": {
|
||||
"version": "2.0.0-next.6",
|
||||
"resolved": "https://registry.npmjs.org/resolve/-/resolve-2.0.0-next.6.tgz",
|
||||
@@ -15360,6 +15405,7 @@
|
||||
"integrity": "sha512-yYrrsWnrXMcdsnu/7YMYAofM1ktpL5By7vZhf15CrXijWWrEYZks5AXBudalfSWJLlnen/QUJUB5aoB0kqZUGA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"mkdirp": "^0.5.1",
|
||||
"rimraf": "~2.6.2"
|
||||
@@ -16395,7 +16441,6 @@
|
||||
"integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
|
||||
"dev": true,
|
||||
"license": "Apache-2.0",
|
||||
"peer": true,
|
||||
"bin": {
|
||||
"tsc": "bin/tsc",
|
||||
"tsserver": "bin/tsserver"
|
||||
@@ -16807,9 +16852,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/victory-vendor": {
|
||||
"version": "36.9.2",
|
||||
"resolved": "https://registry.npmjs.org/victory-vendor/-/victory-vendor-36.9.2.tgz",
|
||||
"integrity": "sha512-PnpQQMuxlwYdocC8fIJqVXvkeViHYzotI+NJrCuav0ZYFoq912ZHBk3mCeuj+5/VpodOjPe1z0Fk2ihgzlXqjQ==",
|
||||
"version": "37.3.6",
|
||||
"resolved": "https://registry.npmjs.org/victory-vendor/-/victory-vendor-37.3.6.tgz",
|
||||
"integrity": "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ==",
|
||||
"license": "MIT AND ISC",
|
||||
"dependencies": {
|
||||
"@types/d3-array": "^3.0.3",
|
||||
@@ -16833,7 +16878,6 @@
|
||||
"resolved": "https://registry.npmjs.org/vite/-/vite-7.3.1.tgz",
|
||||
"integrity": "sha512-w+N7Hifpc3gRjZ63vYBXA56dvvRlNWRczTdmCBBa+CotUzAPf5b7YMdMR/8CQoeYE5LX3W4wj6RYTgonm1b9DA==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"esbuild": "^0.27.0",
|
||||
"fdir": "^6.5.0",
|
||||
@@ -17380,7 +17424,6 @@
|
||||
"integrity": "sha512-hOQuK7h0FGKgBAas7v0mSAsnvrIgAvWmRFjmzpJ7SwFHH3g1k2u37JtYwOwmEKhK6ZO3v9ggDBBm0La1LCK4uQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@vitest/expect": "4.0.18",
|
||||
"@vitest/mocker": "4.0.18",
|
||||
@@ -17589,7 +17632,6 @@
|
||||
"resolved": "https://registry.npmjs.org/winston/-/winston-3.19.0.tgz",
|
||||
"integrity": "sha512-LZNJgPzfKR+/J3cHkxcpHKpKKvGfDZVPS4hfJCc4cCG0CgYzvlD6yE/S3CIL/Yt91ak327YCpiF/0MyeZHEHKA==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"dependencies": {
|
||||
"@colors/colors": "^1.6.0",
|
||||
"@dabh/diagnostics": "^2.0.8",
|
||||
@@ -17827,7 +17869,6 @@
|
||||
"resolved": "https://registry.npmjs.org/zod/-/zod-4.3.6.tgz",
|
||||
"integrity": "sha512-rftlrkhHZOcjDwkGlnUtZZkvaPHCsDATp4pGpuOOMDaTdDDXF91wuVDJoWoPsKX/3YPQ5fHuF3STjcYyKr+Qhg==",
|
||||
"license": "MIT",
|
||||
"peer": true,
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/colinhacks"
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "erpauto",
|
||||
"version": "1.5.1",
|
||||
"version": "1.6.2",
|
||||
"description": "An Electron application with React and TypeScript",
|
||||
"main": "./out/main/index.js",
|
||||
"author": "example.com",
|
||||
@@ -51,13 +51,13 @@
|
||||
"playwright-core": "^1.58.2",
|
||||
"react-focus-lock": "^2.13.7",
|
||||
"react-markdown": "^10.1.0",
|
||||
"recharts": "^3.8.0",
|
||||
"reflect-metadata": "^0.2.2",
|
||||
"rehype-autolink-headings": "^7.1.0",
|
||||
"rehype-highlight": "^7.0.2",
|
||||
"rehype-slug": "^6.0.0",
|
||||
"remark-gfm": "^4.0.1",
|
||||
"typeorm": "^0.3.28",
|
||||
"recharts": "^2.15.4",
|
||||
"uuid": "^13.0.0",
|
||||
"winston": "^3.19.0",
|
||||
"winston-daily-rotate-file": "^5.0.0",
|
||||
|
||||
@@ -17,8 +17,7 @@ export default defineConfig({
|
||||
projects: [
|
||||
{
|
||||
name: 'electron',
|
||||
testMatch: '**/*.test.ts',
|
||||
testIgnore: '**/extractor-workflow.test.ts' // This file uses vitest
|
||||
testMatch: '**/*.test.ts'
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
@@ -6,15 +6,10 @@
|
||||
"sourceType": "github",
|
||||
"computedHash": "744549070132b3bc0602fd7121d42278ba74694b9d0943358093bde3543cbe97"
|
||||
},
|
||||
"find-skills": {
|
||||
"source": "vercel-labs/skills",
|
||||
"sourceType": "github",
|
||||
"computedHash": "645b891da1edbae76ab79c7b088d4e73397464f8396edaf773c0e01971ce75d6"
|
||||
},
|
||||
"vercel-react-best-practices": {
|
||||
"source": "vercel-labs/agent-skills",
|
||||
"sourceType": "github",
|
||||
"computedHash": "9fb08ab39585f6f770d0c1c735f83e619aba2089d7ad50ba2a305eff715e08b9"
|
||||
"computedHash": "e218e50fe7057a4db91390e579c7db5aafac2394c31a3d8e5fa9444c8fa00726"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,8 +5,6 @@ import { createLogger } from '../services/logger'
|
||||
import { ConfigManager } from '../services/config/config-manager'
|
||||
import { RustfsService } from '../services/rustfs'
|
||||
import { ListObjectsV2Command, S3Client } from '@aws-sdk/client-s3'
|
||||
import { SessionManager } from '../services/user/session-manager'
|
||||
import { ReportAnalyzer, type ParsedReportData } from '../services/report/report-analyzer'
|
||||
|
||||
const log = createLogger('ReportHandler')
|
||||
|
||||
@@ -179,85 +177,4 @@ export function registerReportHandlers(): void {
|
||||
}, 'report:download')
|
||||
}
|
||||
)
|
||||
|
||||
ipcMain.handle(
|
||||
IPC_CHANNELS.REPORT_ANALYZE_ALL,
|
||||
async (): Promise<IpcResult<ParsedReportData[]>> => {
|
||||
return withErrorHandling(async () => {
|
||||
// Check Admin permission
|
||||
const sessionManager = SessionManager.getInstance()
|
||||
if (!sessionManager.isAdmin()) {
|
||||
log.warn('Non-Admin user attempted to access report analysis')
|
||||
throw new Error('Unauthorized: Admin access required')
|
||||
}
|
||||
|
||||
const rustfs = getRustfsService()
|
||||
if (!rustfs) {
|
||||
throw new Error('RustFS is not configured or enabled')
|
||||
}
|
||||
|
||||
const configManager = ConfigManager.getInstance()
|
||||
const config = configManager.getConfig()
|
||||
|
||||
// Create S3Client to list objects
|
||||
const client = new S3Client({
|
||||
region: config.rustfs?.region || 'us-east-1',
|
||||
endpoint: config.rustfs?.endpoint || '',
|
||||
credentials: {
|
||||
accessKeyId: config.rustfs?.accessKey || '',
|
||||
secretAccessKey: config.rustfs?.secretKey || ''
|
||||
},
|
||||
forcePathStyle: true
|
||||
})
|
||||
|
||||
log.info('Fetching and analyzing all reports from RustFS')
|
||||
const input = {
|
||||
Bucket: config.rustfs?.bucket || '',
|
||||
Prefix: 'reports/cleaner/'
|
||||
}
|
||||
|
||||
const command = new ListObjectsV2Command(input)
|
||||
const response = await client.send(command)
|
||||
|
||||
const reports: Array<{ content: string; filename?: string }> = []
|
||||
|
||||
if (response.Contents) {
|
||||
// Download each report file
|
||||
for (const item of response.Contents) {
|
||||
if (item.Key && item.Key.endsWith('.md')) {
|
||||
const parts = item.Key.split('/')
|
||||
if (parts.length >= 4) {
|
||||
const filename = parts.slice(3).join('/')
|
||||
log.debug('Downloading report for analysis', { key: item.Key })
|
||||
const downloadResult = await rustfs.downloadFile(item.Key)
|
||||
|
||||
if (downloadResult.success) {
|
||||
reports.push({
|
||||
content: downloadResult.content.toString('utf-8'),
|
||||
filename
|
||||
})
|
||||
} else {
|
||||
log.warn('Failed to download report for analysis', {
|
||||
key: item.Key,
|
||||
error: downloadResult.error
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Analyze all reports
|
||||
const analyzer = new ReportAnalyzer()
|
||||
const analyzedData = analyzer.analyzeReports(reports)
|
||||
|
||||
log.info('Report analysis completed', {
|
||||
totalReports: reports.length,
|
||||
successfulAnalyses: analyzedData.length
|
||||
})
|
||||
|
||||
return analyzedData
|
||||
}, 'report:analyzeAll')
|
||||
}
|
||||
)
|
||||
}
|
||||
|
||||
@@ -28,7 +28,13 @@ export function registerSettingsHandlers(): void {
|
||||
|
||||
ipcMain.handle(IPC_CHANNELS.SETTINGS_GET_USER_TYPE, async (): Promise<IpcResult<UserType>> => {
|
||||
return withErrorHandling(
|
||||
async () => (sessionManager.getUserType() as UserType) || 'Guest',
|
||||
async () => {
|
||||
const userType = sessionManager.getUserType()
|
||||
if (!userType) {
|
||||
throw new ValidationError('未找到用户类型', 'VAL_INVALID_INPUT')
|
||||
}
|
||||
return userType as UserType
|
||||
},
|
||||
'settings:getUserType'
|
||||
)
|
||||
})
|
||||
|
||||
@@ -20,7 +20,7 @@ export type LoginRequestZod = z.infer<typeof LoginRequestSchema>
|
||||
export const UserInfoSchema = z.object({
|
||||
id: z.number().int().positive(),
|
||||
username: z.string().min(1),
|
||||
userType: z.enum(['Admin', 'User', 'Guest']),
|
||||
userType: z.enum(['Admin', 'User']),
|
||||
computerName: z.string().optional()
|
||||
})
|
||||
|
||||
|
||||
@@ -1,307 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { ReportAnalyzer } from '../report-analyzer'
|
||||
|
||||
describe('ReportAnalyzer', () => {
|
||||
const analyzer = new ReportAnalyzer()
|
||||
|
||||
describe('parseMarkdownReport', () => {
|
||||
it('should parse standard report with all fields', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`admin\` |
|
||||
| **处理订单数** | \`150\` |
|
||||
| **删除物料数** | \`45\` |
|
||||
| **跳过物料数** | \`30\` |
|
||||
| **错误数量** | \`2\` |
|
||||
| **重试订单数** | \`10\` |
|
||||
| **成功重试数** | \`8\` |
|
||||
| **执行耗时** | \`2 分 30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 08:30:45\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.date).toBe('2026-03-25')
|
||||
expect(result!.username).toBe('admin')
|
||||
expect(result!.ordersProcessed).toBe(150)
|
||||
expect(result!.materialsDeleted).toBe(45)
|
||||
expect(result!.materialsSkipped).toBe(30)
|
||||
expect(result!.errorCount).toBe(2)
|
||||
expect(result!.retriedOrders).toBe(10)
|
||||
expect(result!.successfulRetries).toBe(8)
|
||||
expect(result!.durationSeconds).toBe(150)
|
||||
})
|
||||
|
||||
it('should use defaults for missing fields', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`user1\` |
|
||||
| **处理订单数** | \`50\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.username).toBe('user1')
|
||||
expect(result!.ordersProcessed).toBe(50)
|
||||
expect(result!.materialsDeleted).toBe(0)
|
||||
expect(result!.materialsSkipped).toBe(0)
|
||||
expect(result!.errorCount).toBe(0)
|
||||
expect(result!.retriedOrders).toBe(0)
|
||||
expect(result!.successfulRetries).toBe(0)
|
||||
expect(result!.durationSeconds).toBe(0)
|
||||
})
|
||||
|
||||
it('should return null for malformed format', () => {
|
||||
const content = `This is not a valid report format
|
||||
Just some random text without proper structure
|
||||
No execution summary section here`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
|
||||
it('should return null for empty content', () => {
|
||||
expect(analyzer.parseMarkdownReport('')).toBeNull()
|
||||
expect(analyzer.parseMarkdownReport(' ')).toBeNull()
|
||||
})
|
||||
|
||||
it('should handle special characters in fields', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`admin@test.com\` |
|
||||
| **处理订单数** | \`100\` |
|
||||
| **删除物料数** | \`25\` |
|
||||
| **跳过物料数** | \`10\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`5\` |
|
||||
| **成功重试数** | \`5\` |
|
||||
| **执行耗时** | \`1 分\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.username).toBe('admin@test.com')
|
||||
expect(result!.durationSeconds).toBe(60)
|
||||
})
|
||||
|
||||
it('should extract date from content when execution time missing', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`20\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`30 秒\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.date).toMatch(/^\d{4}-\d{2}-\d{2}$/)
|
||||
})
|
||||
|
||||
it('should handle various duration formats', () => {
|
||||
// Test "2 分 30 秒"
|
||||
const content1 = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`2 分 30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`
|
||||
const result1 = analyzer.parseMarkdownReport(content1)
|
||||
expect(result1!.durationSeconds).toBe(150)
|
||||
|
||||
// Test "1 分"
|
||||
const content2 = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`1 分\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`
|
||||
const result2 = analyzer.parseMarkdownReport(content2)
|
||||
expect(result2!.durationSeconds).toBe(60)
|
||||
|
||||
// Test "30 秒" - use different time to avoid confusion
|
||||
const content3 = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 14:20:15\` |
|
||||
`
|
||||
const result3 = analyzer.parseMarkdownReport(content3)
|
||||
expect(result3!.durationSeconds).toBe(30)
|
||||
})
|
||||
})
|
||||
|
||||
describe('analyzeReports', () => {
|
||||
it('should batch process multiple reports', () => {
|
||||
const reports = [
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`user1\` |
|
||||
| **处理订单数** | \`100\` |
|
||||
| **删除物料数** | \`20\` |
|
||||
| **跳过物料数** | \`10\` |
|
||||
| **错误数量** | \`1\` |
|
||||
| **重试订单数** | \`5\` |
|
||||
| **成功重试数** | \`4\` |
|
||||
| **执行耗时** | \`1 分\` |
|
||||
| **执行时间** | \`2026-03-25 08:00:00\` |
|
||||
`,
|
||||
filename: 'report-2026-03-25.md'
|
||||
},
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`user2\` |
|
||||
| **处理订单数** | \`200\` |
|
||||
| **删除物料数** | \`50\` |
|
||||
| **跳过物料数** | \`20\` |
|
||||
| **错误数量** | \`2\` |
|
||||
| **重试订单数** | \`10\` |
|
||||
| **成功重试数** | \`8\` |
|
||||
| **执行耗时** | \`2 分\` |
|
||||
| **执行时间** | \`2026-03-26 09:00:00\` |
|
||||
`,
|
||||
filename: 'report-2026-03-26.md'
|
||||
}
|
||||
]
|
||||
|
||||
const results = analyzer.analyzeReports(reports)
|
||||
|
||||
expect(results.length).toBe(2)
|
||||
expect(results[0].username).toBe('user1')
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
expect(results[1].username).toBe('user2')
|
||||
expect(results[1].date).toBe('2026-03-26')
|
||||
})
|
||||
|
||||
it('should skip invalid reports in batch', () => {
|
||||
const reports = [
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`valid\` |
|
||||
| **处理订单数** | \`50\` |
|
||||
| **删除物料数** | \`10\` |
|
||||
| **跳过物料数** | \`5\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`,
|
||||
filename: 'valid-report.md'
|
||||
},
|
||||
{
|
||||
content: 'Invalid report content',
|
||||
filename: 'invalid-report.md'
|
||||
}
|
||||
]
|
||||
|
||||
const results = analyzer.analyzeReports(reports)
|
||||
|
||||
expect(results.length).toBe(1)
|
||||
expect(results[0].username).toBe('valid')
|
||||
})
|
||||
|
||||
it('should use filename date to override content date', () => {
|
||||
const reports = [
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`30\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`20 秒\` |
|
||||
| **执行时间** | \`2026-03-20 10:00:00\` |
|
||||
`,
|
||||
filename: 'report-2026-03-25-08-30-45.md'
|
||||
}
|
||||
]
|
||||
|
||||
const results = analyzer.analyzeReports(reports)
|
||||
|
||||
expect(results.length).toBe(1)
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
})
|
||||
})
|
||||
|
||||
describe('date extraction', () => {
|
||||
it('should extract date from filename with ISO format', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`10 秒\` |
|
||||
| **执行时间** | \`2026-03-20 10:00:00\` |
|
||||
`
|
||||
|
||||
const report = {
|
||||
content,
|
||||
filename: 'cleaner-report-2026-03-25-08-30-45.md'
|
||||
}
|
||||
|
||||
const results = analyzer.analyzeReports([report])
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
})
|
||||
|
||||
it('should extract date from filename with YYYYMMDD format', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`10 秒\` |
|
||||
| **执行时间** | \`2026-03-20 10:00:00\` |
|
||||
`
|
||||
|
||||
const report = {
|
||||
content,
|
||||
filename: 'report-20260325-100000.md'
|
||||
}
|
||||
|
||||
const results = analyzer.analyzeReports([report])
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -1,212 +0,0 @@
|
||||
import { createLogger } from '../logger'
|
||||
|
||||
const log = createLogger('ReportAnalyzer')
|
||||
|
||||
/**
|
||||
* Parsed report data structure
|
||||
*/
|
||||
export interface ParsedReportData {
|
||||
/** 报告日期 (从文件名或内容提取) */
|
||||
date: string
|
||||
/** 操作用户 */
|
||||
username: string
|
||||
/** 处理订单数 */
|
||||
ordersProcessed: number
|
||||
/** 删除物料数 */
|
||||
materialsDeleted: number
|
||||
/** 跳过物料数 */
|
||||
materialsSkipped: number
|
||||
/** 错误数量 */
|
||||
errorCount: number
|
||||
/** 重试订单数 */
|
||||
retriedOrders: number
|
||||
/** 成功重试数 */
|
||||
successfulRetries: number
|
||||
/** 执行耗时 (秒) */
|
||||
durationSeconds: number
|
||||
}
|
||||
|
||||
/**
|
||||
* ReportAnalyzer - 解析和分析 ERP 物料清理执行报告
|
||||
*/
|
||||
export class ReportAnalyzer {
|
||||
/**
|
||||
* 解析单个 markdown 报告内容
|
||||
* @param content markdown 报告内容
|
||||
* @returns 解析后的结构化数据,解析失败返回 null
|
||||
*/
|
||||
parseMarkdownReport(content: string): ParsedReportData | null {
|
||||
try {
|
||||
// 从执行摘要表格中提取数据 - 捕获整个表格直到空行或下一个标题
|
||||
const summarySectionMatch = content.match(/## 执行摘要\s*\n([\s\S]*?)(?=\n---|\n##|\n$)/)
|
||||
if (!summarySectionMatch) {
|
||||
log.warn('Failed to find execution summary section')
|
||||
return null
|
||||
}
|
||||
|
||||
const summaryTable = summarySectionMatch[0]
|
||||
|
||||
// 提取各个字段的值
|
||||
const username = this.extractFieldValue(summaryTable, '操作用户') || ''
|
||||
const ordersProcessed = this.extractNumericField(summaryTable, '处理订单数') || 0
|
||||
const materialsDeleted = this.extractNumericField(summaryTable, '删除物料数') || 0
|
||||
const materialsSkipped = this.extractNumericField(summaryTable, '跳过物料数') || 0
|
||||
const errorCount = this.extractNumericField(summaryTable, '错误数量') || 0
|
||||
const retriedOrders = this.extractNumericField(summaryTable, '重试订单数') || 0
|
||||
const successfulRetries = this.extractNumericField(summaryTable, '成功重试数') || 0
|
||||
|
||||
// 提取执行耗时并转换为秒
|
||||
const durationStr = this.extractFieldValue(summaryTable, '执行耗时')
|
||||
const durationSeconds = durationStr ? this.parseDuration(durationStr) : 0
|
||||
|
||||
// 从内容或执行时间字段提取日期
|
||||
const executionTimeStr = this.extractFieldValue(summaryTable, '执行时间')
|
||||
const date = executionTimeStr
|
||||
? this.extractDateFromDateTime(executionTimeStr)
|
||||
: this.extractDateFromContent(content)
|
||||
|
||||
return {
|
||||
date,
|
||||
username,
|
||||
ordersProcessed,
|
||||
materialsDeleted,
|
||||
materialsSkipped,
|
||||
errorCount,
|
||||
retriedOrders,
|
||||
successfulRetries,
|
||||
durationSeconds
|
||||
}
|
||||
} catch (error) {
|
||||
log.error('Failed to parse markdown report', {
|
||||
error: error instanceof Error ? error.message : error
|
||||
})
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 批量解析多个报告
|
||||
* @param reports 报告元数据和内容列表
|
||||
* @returns 解析后的数据列表 (自动跳过解析失败的报告)
|
||||
*/
|
||||
analyzeReports(reports: Array<{ content: string; filename?: string }>): ParsedReportData[] {
|
||||
const results: ParsedReportData[] = []
|
||||
|
||||
for (const report of reports) {
|
||||
const parsed = this.parseMarkdownReport(report.content)
|
||||
if (parsed) {
|
||||
// 如果有文件名,尝试从文件名提取日期覆盖
|
||||
if (report.filename) {
|
||||
const dateFromFilename = this.extractDateFromFilename(report.filename)
|
||||
if (dateFromFilename) {
|
||||
parsed.date = dateFromFilename
|
||||
}
|
||||
}
|
||||
results.push(parsed)
|
||||
} else {
|
||||
log.warn('Skipping report due to parse failure', { filename: report.filename })
|
||||
}
|
||||
}
|
||||
|
||||
return results
|
||||
}
|
||||
|
||||
/**
|
||||
* 从表格行中提取字段的字符串值
|
||||
*/
|
||||
private extractFieldValue(tableContent: string, fieldName: string): string | null {
|
||||
// 匹配格式:| **字段名** | `值` |
|
||||
const pattern = new RegExp(
|
||||
`\\|\\s*\\*\\*${this.escapeRegex(fieldName)}\\*\\*\\s*\\|\\s*\`([^\`]*)\``,
|
||||
'i'
|
||||
)
|
||||
const match = tableContent.match(pattern)
|
||||
log.debug('extractFieldValue', { fieldName, matched: match?.[1], pattern })
|
||||
return match ? match[1].trim() : null
|
||||
}
|
||||
|
||||
/**
|
||||
* 从表格行中提取数值字段
|
||||
*/
|
||||
private extractNumericField(tableContent: string, fieldName: string): number | null {
|
||||
const value = this.extractFieldValue(tableContent, fieldName)
|
||||
if (value === null) return null
|
||||
|
||||
// 移除可能的非数字字符 (如单位)
|
||||
const numStr = value.replace(/[^\d]/g, '')
|
||||
if (!numStr) return null
|
||||
|
||||
return parseInt(numStr, 10)
|
||||
}
|
||||
|
||||
/**
|
||||
* 解析耗时字符串为秒数
|
||||
* 支持格式:"2 分 30 秒", "1 分", "30 秒", "5 分钟"
|
||||
*/
|
||||
private parseDuration(durationStr: string): number {
|
||||
let totalSeconds = 0
|
||||
|
||||
// 匹配分钟 - 支持 "X 分" 或 "X 分钟" 格式
|
||||
const minMatch = durationStr.match(/(\d+) 分/)
|
||||
if (minMatch) {
|
||||
totalSeconds += parseInt(minMatch[1], 10) * 60
|
||||
}
|
||||
|
||||
// 匹配秒
|
||||
const secMatch = durationStr.match(/(\d+) 秒/)
|
||||
if (secMatch) {
|
||||
totalSeconds += parseInt(secMatch[1], 10)
|
||||
}
|
||||
|
||||
return totalSeconds
|
||||
}
|
||||
|
||||
/**
|
||||
* 从日期时间字符串中提取日期部分
|
||||
* 格式:"2026-03-25 08:30:45" -> "2026-03-25"
|
||||
*/
|
||||
private extractDateFromDateTime(dateTimeStr: string): string {
|
||||
const match = dateTimeStr.match(/(\d{4}-\d{2}-\d{2})/)
|
||||
return match ? match[1] : dateTimeStr
|
||||
}
|
||||
|
||||
/**
|
||||
* 从内容中提取日期 (备选方案)
|
||||
*/
|
||||
private extractDateFromContent(content: string): string {
|
||||
// 尝试从报告标题或执行时间提取
|
||||
const dateMatch = content.match(/(\d{4}-\d{2}-\d{2})/)
|
||||
return dateMatch ? dateMatch[1] : new Date().toISOString().split('T')[0]
|
||||
}
|
||||
|
||||
/**
|
||||
* 从文件名中提取日期
|
||||
* 格式:"cleaner-report-2026-03-25-08-30-45.md" -> "2026-03-25"
|
||||
*/
|
||||
private extractDateFromFilename(filename: string): string | null {
|
||||
// 匹配 ISO 日期格式
|
||||
const isoMatch = filename.match(/(\d{4}-\d{2}-\d{2})/)
|
||||
if (isoMatch) {
|
||||
return isoMatch[1]
|
||||
}
|
||||
|
||||
// 匹配其他常见日期格式
|
||||
const dateMatch = filename.match(/(\d{8})/)
|
||||
if (dateMatch) {
|
||||
const str = dateMatch[1]
|
||||
// 尝试解析 YYYYMMDD
|
||||
if (str.length === 8) {
|
||||
return `${str.slice(0, 4)}-${str.slice(4, 6)}-${str.slice(6, 8)}`
|
||||
}
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
/**
|
||||
* 转义正则表达式特殊字符
|
||||
*/
|
||||
private escapeRegex(str: string): string {
|
||||
return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
|
||||
}
|
||||
}
|
||||
@@ -29,7 +29,7 @@ export class UpdateCatalogService {
|
||||
|
||||
public getDialogCatalog(status: UpdateStatus, catalog: UpdateCatalog): UpdateDialogCatalog {
|
||||
const currentUserType = status.currentUserType
|
||||
if (!status.enabled || !currentUserType || currentUserType === 'Guest') {
|
||||
if (!status.enabled || !currentUserType) {
|
||||
return { mode: 'disabled' }
|
||||
}
|
||||
|
||||
|
||||
@@ -106,7 +106,7 @@ export class UpdateService {
|
||||
this.ensureInitialized()
|
||||
this.status.currentUserType = userType
|
||||
|
||||
if (!this.status.enabled || !userType || userType === 'Guest') {
|
||||
if (!this.status.enabled || !userType) {
|
||||
this.clearPolling()
|
||||
this.catalog = { stable: [], preview: [] }
|
||||
this.publishStatus({
|
||||
|
||||
@@ -139,7 +139,7 @@ export class BIPUsersDAO {
|
||||
return {
|
||||
id: row.ID as number,
|
||||
username: row.UserName as string,
|
||||
userType: row.UserType as 'Admin' | 'User' | 'Guest'
|
||||
userType: row.UserType as 'Admin' | 'User'
|
||||
}
|
||||
}
|
||||
return null
|
||||
@@ -157,7 +157,7 @@ export class BIPUsersDAO {
|
||||
return {
|
||||
id: row.ID as number,
|
||||
username: row.UserName as string,
|
||||
userType: row.UserType as 'Admin' | 'User' | 'Guest'
|
||||
userType: row.UserType as 'Admin' | 'User'
|
||||
}
|
||||
}
|
||||
return null
|
||||
@@ -198,7 +198,7 @@ export class BIPUsersDAO {
|
||||
return {
|
||||
id: row.ID as number,
|
||||
username: row.UserName as string,
|
||||
userType: row.UserType as 'Admin' | 'User' | 'Guest'
|
||||
userType: row.UserType as 'Admin' | 'User'
|
||||
}
|
||||
}
|
||||
return null
|
||||
@@ -216,7 +216,7 @@ export class BIPUsersDAO {
|
||||
return {
|
||||
id: row.ID as number,
|
||||
username: row.UserName as string,
|
||||
userType: row.UserType as 'Admin' | 'User' | 'Guest'
|
||||
userType: row.UserType as 'Admin' | 'User'
|
||||
}
|
||||
}
|
||||
return null
|
||||
@@ -254,7 +254,7 @@ export class BIPUsersDAO {
|
||||
return result.rows.map((row) => ({
|
||||
id: row.ID as number,
|
||||
username: row.UserName as string,
|
||||
userType: row.UserType as 'Admin' | 'User' | 'Guest',
|
||||
userType: row.UserType as 'Admin' | 'User',
|
||||
createTime: row.CreateTime as Date | undefined
|
||||
}))
|
||||
} catch (error) {
|
||||
@@ -270,7 +270,7 @@ export class BIPUsersDAO {
|
||||
* Create a new user
|
||||
* @param username - The username (must be unique)
|
||||
* @param password - The password
|
||||
* @param userType - User type ('Admin', 'User', or 'Guest')
|
||||
* @param userType - User type ('Admin' or 'User')
|
||||
* @param computerName - Optional computer name for silent login
|
||||
* @returns True if successful
|
||||
*/
|
||||
|
||||
@@ -126,13 +126,6 @@ export class SessionManager {
|
||||
return this.currentUser?.userType === 'Admin'
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if the current user is a guest
|
||||
*/
|
||||
public isGuest(): boolean {
|
||||
return this.currentUser?.userType === 'Guest'
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the current username
|
||||
*/
|
||||
|
||||
@@ -199,23 +199,4 @@ export interface ReportAPI {
|
||||
* @param key - Report object key in RustFS
|
||||
*/
|
||||
download: (key: string) => Promise<IpcResult<string>>
|
||||
|
||||
/**
|
||||
* Analyze all reports and return parsed data (Admin only)
|
||||
*/
|
||||
analyzeAll: () => Promise<
|
||||
IpcResult<
|
||||
{
|
||||
date: string
|
||||
username: string
|
||||
ordersProcessed: number
|
||||
materialsDeleted: number
|
||||
materialsSkipped: number
|
||||
errorCount: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
durationSeconds: number
|
||||
}[]
|
||||
>
|
||||
>
|
||||
}
|
||||
|
||||
@@ -10,7 +10,7 @@
|
||||
/**
|
||||
* User type for settings permission control
|
||||
*/
|
||||
export type UserType = 'Admin' | 'User' | 'Guest'
|
||||
export type UserType = 'Admin' | 'User'
|
||||
|
||||
/**
|
||||
* Database type selection
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
/**
|
||||
* User type enumeration
|
||||
*/
|
||||
export type UserType = 'Admin' | 'User' | 'Guest'
|
||||
export type UserType = 'Admin' | 'User'
|
||||
|
||||
/**
|
||||
* User information interface
|
||||
|
||||
@@ -71,8 +71,7 @@ export const configApi = {
|
||||
export const reportApi = {
|
||||
listAll: () => invokeIpc(IPC_CHANNELS.REPORT_LIST_ALL),
|
||||
listByUser: (username: string) => invokeIpc(IPC_CHANNELS.REPORT_LIST_BY_USER, username),
|
||||
download: (key: string) => invokeIpc(IPC_CHANNELS.REPORT_DOWNLOAD, key),
|
||||
analyzeAll: () => invokeIpc(IPC_CHANNELS.REPORT_ANALYZE_ALL)
|
||||
download: (key: string) => invokeIpc(IPC_CHANNELS.REPORT_DOWNLOAD, key)
|
||||
} as const
|
||||
|
||||
export const updateApi = {
|
||||
|
||||
@@ -1,295 +1,35 @@
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import { X, FileText, Loader2, AlertCircle, RefreshCw } from 'lucide-react'
|
||||
import { Checkbox } from '@headlessui/react'
|
||||
import {
|
||||
LineChart,
|
||||
Line,
|
||||
XAxis,
|
||||
YAxis,
|
||||
CartesianGrid,
|
||||
Tooltip,
|
||||
Legend,
|
||||
ResponsiveContainer
|
||||
} from 'recharts'
|
||||
/**
|
||||
* ReportAnalysisDialog Component - Re-export
|
||||
*
|
||||
* This file now re-exports the refactored component from the report-analysis module.
|
||||
* All functionality has been preserved while improving code organization.
|
||||
*
|
||||
* The refactored version is located at: ./report-analysis/index.tsx
|
||||
*
|
||||
* Refactoring changes:
|
||||
* - Split into 11 focused files (was 948 lines, now ~150 lines per file)
|
||||
* - Extracted custom hooks for business logic
|
||||
* - Separated UI components for better reusability
|
||||
* - Centralized type definitions
|
||||
* - Isolated utility functions for easier testing
|
||||
*
|
||||
* @see ./report-analysis/ for the refactored implementation
|
||||
*/
|
||||
|
||||
interface ParsedReportData {
|
||||
date: string
|
||||
username: string
|
||||
ordersProcessed: number
|
||||
materialsDeleted: number
|
||||
materialsSkipped: number
|
||||
errorCount: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
durationSeconds: number
|
||||
}
|
||||
// Re-export everything from the refactored module
|
||||
export { ReportAnalysisDialog as default, ReportAnalysisDialog } from './report-analysis'
|
||||
|
||||
interface ReportAnalysisDialogProps {
|
||||
isOpen: boolean
|
||||
onClose: () => void
|
||||
isAdmin: boolean
|
||||
}
|
||||
// Re-export types for external use
|
||||
export type {
|
||||
ReportMetrics,
|
||||
DailyMetrics,
|
||||
UserDailyMetrics,
|
||||
MetricKey,
|
||||
ViewMode,
|
||||
ReportAnalysisDialogProps,
|
||||
CustomTooltipProps,
|
||||
ComparisonTooltipProps
|
||||
} from './report-analysis/types'
|
||||
|
||||
export const ReportAnalysisDialog: React.FC<ReportAnalysisDialogProps> = ({
|
||||
isOpen,
|
||||
onClose,
|
||||
isAdmin
|
||||
}) => {
|
||||
// Metric definitions (exclude username from numeric metrics for chart)
|
||||
const numericMetrics = [
|
||||
{ key: 'ordersProcessed', label: '处理订单数', color: '#3b82f6' },
|
||||
{ key: 'materialsDeleted', label: '删除物料数', color: '#10b981' },
|
||||
{ key: 'materialsSkipped', label: '跳过物料数', color: '#f59e0b' },
|
||||
{ key: 'errorCount', label: '错误数量', color: '#ef4444' },
|
||||
{ key: 'retriedOrders', label: '重试订单数', color: '#8b5cf6' },
|
||||
{ key: 'successfulRetries', label: '成功重试数', color: '#06b6d4' },
|
||||
{ key: 'durationSeconds', label: '执行耗时', color: '#ec4899' }
|
||||
]
|
||||
|
||||
// State: selected metrics (default all)
|
||||
const [selectedMetrics, setSelectedMetrics] = useState<string[]>(numericMetrics.map((m) => m.key))
|
||||
|
||||
// Toggle metric selection
|
||||
const toggleMetric = (metricKey: string) => {
|
||||
setSelectedMetrics((prev) =>
|
||||
prev.includes(metricKey) ? prev.filter((k) => k !== metricKey) : [...prev, metricKey]
|
||||
)
|
||||
}
|
||||
|
||||
// Data state
|
||||
const [reportData, setReportData] = useState<ParsedReportData[]>([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
|
||||
// Fetch data when dialog opens
|
||||
useEffect(() => {
|
||||
if (!isOpen || !isAdmin) return
|
||||
|
||||
const fetchData = async () => {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
try {
|
||||
const result = await window.electron.report.analyzeAll()
|
||||
if (result.success && result.data) {
|
||||
setReportData(result.data)
|
||||
} else {
|
||||
setError(result.error || '加载失败')
|
||||
}
|
||||
} catch (err) {
|
||||
setError(err instanceof Error ? err.message : '未知错误')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
fetchData()
|
||||
}, [isOpen, isAdmin])
|
||||
|
||||
// Transform data for chart
|
||||
const chartData = reportData.map((item) => ({
|
||||
name: item.date,
|
||||
...item
|
||||
}))
|
||||
|
||||
// Non-Admin users should not see anything
|
||||
if (!isAdmin) {
|
||||
return null
|
||||
}
|
||||
|
||||
if (!isOpen) return null
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 z-[100] flex items-center justify-center bg-slate-900/50 backdrop-blur-sm animate-in fade-in duration-200">
|
||||
<div className="bg-white rounded-2xl shadow-2xl w-[900px] max-w-[90vw] h-[80vh] flex flex-col border border-slate-200 overflow-hidden animate-in zoom-in-95 duration-200">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between px-6 py-4 border-b border-slate-200 bg-slate-50 flex-shrink-0">
|
||||
<div className="flex items-center gap-2 text-slate-800">
|
||||
<FileText size={20} className="text-blue-600" />
|
||||
<h2 className="text-lg font-semibold">报告分析</h2>
|
||||
</div>
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-slate-400 hover:text-slate-600 hover:bg-slate-200/50 p-1.5 rounded-lg transition-colors"
|
||||
aria-label="关闭对话框"
|
||||
>
|
||||
<X size={20} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Controls */}
|
||||
<div className="px-6 py-4 border-b border-slate-200 bg-white flex-shrink-0">
|
||||
<div className="flex items-center gap-4">
|
||||
<label className="text-sm font-medium text-slate-700 flex-shrink-0">选择指标:</label>
|
||||
<div className="grid grid-cols-2 gap-3 flex-1">
|
||||
{numericMetrics.map((metric) => (
|
||||
<Checkbox
|
||||
key={metric.key}
|
||||
checked={selectedMetrics.includes(metric.key)}
|
||||
onChange={() => toggleMetric(metric.key)}
|
||||
className="group flex items-center gap-2 p-2 rounded-lg border border-slate-200 hover:border-blue-300 hover:bg-blue-50/50 transition-all cursor-pointer"
|
||||
>
|
||||
<div
|
||||
className={`w-5 h-5 rounded border-2 flex items-center justify-center transition-all ${
|
||||
selectedMetrics.includes(metric.key)
|
||||
? 'bg-blue-600 border-blue-600'
|
||||
: 'bg-white border-slate-300 group-hover:border-blue-400'
|
||||
}`}
|
||||
>
|
||||
{selectedMetrics.includes(metric.key) && (
|
||||
<svg
|
||||
className="w-3.5 h-3.5 text-white"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeWidth={3}
|
||||
d="M5 13l4 4L19 7"
|
||||
/>
|
||||
</svg>
|
||||
)}
|
||||
</div>
|
||||
<span
|
||||
className={`text-sm font-medium transition-colors ${
|
||||
selectedMetrics.includes(metric.key) ? 'text-slate-900' : 'text-slate-500'
|
||||
}`}
|
||||
>
|
||||
{metric.label}
|
||||
</span>
|
||||
</Checkbox>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<div className="flex-1 bg-slate-50 overflow-hidden relative">
|
||||
{/* Loading State */}
|
||||
{loading && (
|
||||
<div className="absolute inset-0 flex flex-col items-center justify-center text-slate-500 bg-white/80 z-10">
|
||||
<Loader2 size={32} className="animate-spin text-blue-500 mb-4" />
|
||||
<p>正在加载报告数据...</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Error State */}
|
||||
{error && (
|
||||
<div className="absolute inset-0 flex flex-col items-center justify-center text-slate-500 bg-white/80 z-10">
|
||||
<AlertCircle size={48} className="mb-4 text-red-500" />
|
||||
<p className="text-lg font-medium text-slate-700 mb-2">加载失败</p>
|
||||
<p className="text-sm text-slate-500 mb-4">{error}</p>
|
||||
<button
|
||||
className="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white rounded-lg transition-colors font-medium"
|
||||
onClick={() => {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
window.electron.report
|
||||
.analyzeAll()
|
||||
.then((result) => {
|
||||
if (result.success && result.data) {
|
||||
setReportData(result.data)
|
||||
} else {
|
||||
setError(result.error || '加载失败')
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
setError(err instanceof Error ? err.message : '未知错误')
|
||||
})
|
||||
.finally(() => {
|
||||
setLoading(false)
|
||||
})
|
||||
}}
|
||||
>
|
||||
<RefreshCw size={16} />
|
||||
重试
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Empty State */}
|
||||
{!loading && !error && reportData.length === 0 && (
|
||||
<div className="absolute inset-0 flex flex-col items-center justify-center text-slate-400">
|
||||
<FileText size={48} className="mb-4 text-slate-300 opacity-50" />
|
||||
<p className="text-lg font-medium text-slate-500 mb-2">暂无报告数据</p>
|
||||
<p className="text-sm text-slate-400">还没有可用的执行报告</p>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Chart */}
|
||||
{!loading && !error && reportData.length > 0 && (
|
||||
<div className="w-full h-full p-6">
|
||||
<ResponsiveContainer width="100%" height="100%">
|
||||
<LineChart data={chartData} margin={{ top: 20, right: 30, left: 20, bottom: 5 }}>
|
||||
<CartesianGrid strokeDasharray="3 3" stroke="#e2e8f0" />
|
||||
<XAxis
|
||||
dataKey="name"
|
||||
stroke="#64748b"
|
||||
tick={{ fill: '#64748b', fontSize: 12 }}
|
||||
label={{ value: '日期', position: 'insideBottom', offset: -5, fill: '#64748b' }}
|
||||
/>
|
||||
<YAxis
|
||||
stroke="#64748b"
|
||||
tick={{ fill: '#64748b', fontSize: 12 }}
|
||||
label={{
|
||||
value: '数值',
|
||||
angle: -90,
|
||||
position: 'insideLeft',
|
||||
fill: '#64748b'
|
||||
}}
|
||||
/>
|
||||
<Tooltip content={<CustomTooltip />} />
|
||||
<Legend />
|
||||
{numericMetrics
|
||||
.filter((m) => selectedMetrics.includes(m.key))
|
||||
.map((metric) => (
|
||||
<Line
|
||||
key={metric.key}
|
||||
type="monotone"
|
||||
dataKey={metric.key}
|
||||
stroke={metric.color}
|
||||
strokeWidth={2}
|
||||
dot={{ r: 4 }}
|
||||
activeDot={{ r: 6 }}
|
||||
name={metric.label}
|
||||
/>
|
||||
))}
|
||||
</LineChart>
|
||||
</ResponsiveContainer>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// Custom Tooltip with Chinese labels
|
||||
interface CustomTooltipProps {
|
||||
active?: boolean
|
||||
payload?: Array<{
|
||||
name: string
|
||||
value: number
|
||||
color: string
|
||||
}>
|
||||
label?: string
|
||||
}
|
||||
|
||||
const CustomTooltip: React.FC<CustomTooltipProps> = ({ active, payload, label }) => {
|
||||
if (active && payload && payload.length) {
|
||||
return (
|
||||
<div className="bg-white/95 backdrop-blur px-3 py-2 border border-slate-200 rounded-lg shadow-lg">
|
||||
<p className="text-sm font-semibold text-slate-800 mb-2">{`日期:${label}`}</p>
|
||||
{payload.map((entry, index) => (
|
||||
<p key={index} style={{ color: entry.color }} className="text-xs">
|
||||
{`${entry.name}: ${entry.value.toLocaleString()}`}
|
||||
</p>
|
||||
))}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
export default ReportAnalysisDialog
|
||||
// Re-export constants
|
||||
export { METRIC_LABELS, METRIC_COLORS, USER_COLORS } from './report-analysis/types'
|
||||
|
||||
@@ -8,7 +8,6 @@ import rehypeSlug from 'rehype-slug'
|
||||
import rehypeAutolinkHeadings from 'rehype-autolink-headings'
|
||||
import 'github-markdown-css/github-markdown-light.css'
|
||||
import 'highlight.js/styles/github.css'
|
||||
import { ReportAnalysisDialog } from './ReportAnalysisDialog'
|
||||
|
||||
interface ReportMetadata {
|
||||
key: string
|
||||
@@ -23,13 +22,15 @@ interface ReportViewerDialogProps {
|
||||
onClose: () => void
|
||||
isAdmin: boolean
|
||||
currentUsername: string
|
||||
onOpenAnalysis?: () => void
|
||||
}
|
||||
|
||||
export const ReportViewerDialog: React.FC<ReportViewerDialogProps> = ({
|
||||
isOpen,
|
||||
onClose,
|
||||
isAdmin,
|
||||
currentUsername
|
||||
currentUsername,
|
||||
onOpenAnalysis
|
||||
}) => {
|
||||
const [reports, setReports] = useState<ReportMetadata[]>([])
|
||||
const [selectedReport, setSelectedReport] = useState<ReportMetadata | null>(null)
|
||||
@@ -38,7 +39,6 @@ export const ReportViewerDialog: React.FC<ReportViewerDialogProps> = ({
|
||||
const [isLoadingContent, setIsLoadingContent] = useState<boolean>(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [query, setQuery] = useState('')
|
||||
const [isAnalysisDialogOpen, setIsAnalysisDialogOpen] = useState(false)
|
||||
|
||||
const loadReports = useCallback(async () => {
|
||||
setIsLoadingList(true)
|
||||
@@ -131,23 +131,24 @@ export const ReportViewerDialog: React.FC<ReportViewerDialogProps> = ({
|
||||
<div className="flex items-center gap-2 text-slate-800">
|
||||
<FileText size={20} className="text-blue-600" />
|
||||
<h2 className="text-lg font-semibold">执行报告浏览器</h2>
|
||||
{isAdmin && (
|
||||
</div>
|
||||
<div className="flex items-center gap-3">
|
||||
{isAdmin && onOpenAnalysis && (
|
||||
<button
|
||||
onClick={() => setIsAnalysisDialogOpen(true)}
|
||||
className="ml-2 flex items-center gap-1.5 px-3 py-1.5 text-sm bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors"
|
||||
title="分析报告"
|
||||
onClick={onOpenAnalysis}
|
||||
className="text-xs bg-white border border-slate-300 text-slate-700 px-3 py-1.5 rounded shadow-sm hover:bg-slate-50 flex items-center gap-1.5 font-medium transition-colors"
|
||||
>
|
||||
<BarChart3 size={16} />
|
||||
分析报告
|
||||
<BarChart3 size={14} className="text-blue-600" />
|
||||
报告分析
|
||||
</button>
|
||||
)}
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-slate-400 hover:text-slate-600 hover:bg-slate-200/50 p-1.5 rounded-lg transition-colors"
|
||||
>
|
||||
<X size={20} />
|
||||
</button>
|
||||
</div>
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-slate-400 hover:text-slate-600 hover:bg-slate-200/50 p-1.5 rounded-lg transition-colors"
|
||||
>
|
||||
<X size={20} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Controls */}
|
||||
@@ -267,14 +268,6 @@ export const ReportViewerDialog: React.FC<ReportViewerDialogProps> = ({
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{isAdmin && (
|
||||
<ReportAnalysisDialog
|
||||
isOpen={isAnalysisDialogOpen}
|
||||
onClose={() => setIsAnalysisDialogOpen(false)}
|
||||
isAdmin={isAdmin}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -13,7 +13,7 @@ import { Modal } from './ui/Modal'
|
||||
export interface UserInfo {
|
||||
id: number
|
||||
username: string
|
||||
userType: 'Admin' | 'User' | 'Guest'
|
||||
userType: 'Admin' | 'User'
|
||||
createTime?: Date
|
||||
}
|
||||
|
||||
@@ -61,8 +61,7 @@ export const UserSelectionDialog: React.FC<UserSelectionDialogProps> = ({
|
||||
|
||||
const userTypeStyles: Record<string, string> = {
|
||||
Admin: 'bg-amber-50 text-amber-600',
|
||||
User: 'bg-blue-50 text-blue-600',
|
||||
Guest: 'bg-gray-100 text-gray-600'
|
||||
User: 'bg-blue-50 text-blue-600'
|
||||
}
|
||||
|
||||
if (!isOpen) return null
|
||||
|
||||
@@ -4,7 +4,7 @@ import UserSelectionDialog, { type UserInfo as SelectedUserInfo } from '../UserS
|
||||
|
||||
interface CurrentUser {
|
||||
username: string
|
||||
userType: 'Admin' | 'User' | 'Guest'
|
||||
userType: 'Admin' | 'User'
|
||||
}
|
||||
|
||||
interface UnauthenticatedAppProps {
|
||||
|
||||
@@ -0,0 +1,70 @@
|
||||
/**
|
||||
* ComparisonTooltip Component
|
||||
* Custom tooltip for comparison chart view showing user-specific metrics
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import { MetricKey } from '../types'
|
||||
|
||||
interface ComparisonTooltipProps {
|
||||
active?: boolean
|
||||
payload?: any[]
|
||||
label?: string
|
||||
users: string[]
|
||||
selectedUsers: Set<string>
|
||||
selectedMetrics: Set<MetricKey>
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders a detailed tooltip for the comparison chart view
|
||||
* Shows user-specific metric values for the selected date
|
||||
*/
|
||||
export const ComparisonTooltip = React.memo(
|
||||
({ active, payload, label, users, selectedUsers, selectedMetrics }: ComparisonTooltipProps) => {
|
||||
if (!active || !payload || !payload.length) {
|
||||
return null
|
||||
}
|
||||
|
||||
const displayUsers = selectedUsers.size === 0 ? users : Array.from(selectedUsers)
|
||||
const firstMetric = Array.from(selectedMetrics)[0]
|
||||
|
||||
return (
|
||||
<div className="bg-white p-4 border border-slate-200 shadow-lg rounded-lg max-w-sm">
|
||||
<p className="font-semibold text-slate-800 mb-2 border-b border-slate-100 pb-2">{label}</p>
|
||||
|
||||
<div className="space-y-1.5 text-sm">
|
||||
{displayUsers.map((user: string) => {
|
||||
const userEntry = payload.find((p: any) => p.name === (user || '未分配'))
|
||||
if (!userEntry) return null
|
||||
|
||||
return (
|
||||
<div key={user} className="flex justify-between items-center gap-4">
|
||||
<span className="flex items-center gap-1.5 text-slate-600">
|
||||
<span
|
||||
className="w-2.5 h-2.5 rounded-full"
|
||||
style={{ backgroundColor: userEntry.color }}
|
||||
/>
|
||||
{user || '未分配'}:
|
||||
</span>
|
||||
<span className="font-medium text-slate-900">
|
||||
{firstMetric === 'executionTimeSecs' ? Number(userEntry.value).toFixed(1) : userEntry.value} {firstMetric === 'executionTimeSecs' ? '秒' : ''}
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
},
|
||||
(prevProps, nextProps) => {
|
||||
// Custom comparison for memoization
|
||||
return (
|
||||
prevProps.label === nextProps.label &&
|
||||
prevProps.selectedUsers.size === nextProps.selectedUsers.size &&
|
||||
prevProps.selectedMetrics.size === nextProps.selectedMetrics.size &&
|
||||
prevProps.payload?.length === nextProps.payload?.length
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
ComparisonTooltip.displayName = 'ComparisonTooltip'
|
||||
@@ -0,0 +1,68 @@
|
||||
/**
|
||||
* CustomTooltip Component
|
||||
* Custom tooltip for aggregated chart view showing daily metrics
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import { DailyMetrics } from '../types'
|
||||
|
||||
interface CustomTooltipProps {
|
||||
active?: boolean
|
||||
payload?: any[]
|
||||
label?: string
|
||||
chartData: DailyMetrics[]
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders a detailed tooltip for the aggregated chart view
|
||||
* Shows metric values along with additional context like user count and report count
|
||||
*/
|
||||
export const CustomTooltip = React.memo(
|
||||
({ active, payload, label, chartData }: CustomTooltipProps) => {
|
||||
if (!active || !payload || !payload.length) {
|
||||
return null
|
||||
}
|
||||
|
||||
const dailyData = chartData.find((d) => d.date === label)
|
||||
|
||||
return (
|
||||
<div className="bg-white p-4 border border-slate-200 shadow-lg rounded-lg max-w-sm">
|
||||
<p className="font-semibold text-slate-800 mb-2 border-b border-slate-100 pb-2">{label}</p>
|
||||
|
||||
<div className="space-y-1.5 text-sm">
|
||||
{payload.map((entry: any, index: number) => (
|
||||
<div key={`${entry.name}-${index}`} className="flex justify-between items-center gap-4">
|
||||
<span className="flex items-center gap-1.5 text-slate-600">
|
||||
<span
|
||||
className="w-2.5 h-2.5 rounded-full"
|
||||
style={{ backgroundColor: entry.color }}
|
||||
></span>
|
||||
{entry.name}:
|
||||
</span>
|
||||
<span className="font-medium text-slate-900">
|
||||
{entry.dataKey === 'executionTimeSecs' ? Number(entry.value).toFixed(1) : entry.value} {entry.dataKey === 'executionTimeSecs' ? '秒' : ''}
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
{dailyData && (
|
||||
<div className="mt-3 pt-2 border-t border-slate-100 text-xs text-slate-500">
|
||||
<p>操作用户: {dailyData.users.join(', ')}</p>
|
||||
<p className="mt-1">报告总数: {dailyData.reportCount}</p>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
},
|
||||
(prevProps, nextProps) => {
|
||||
// Custom comparison for memoization
|
||||
return (
|
||||
prevProps.label === nextProps.label &&
|
||||
prevProps.payload?.length === nextProps.payload?.length &&
|
||||
prevProps.chartData === nextProps.chartData
|
||||
)
|
||||
}
|
||||
)
|
||||
|
||||
CustomTooltip.displayName = 'CustomTooltip'
|
||||
@@ -0,0 +1,54 @@
|
||||
/**
|
||||
* MetricSelector Component
|
||||
* Allows users to select which metrics to display in the chart
|
||||
* Supports both single-select (comparison mode) and multi-select (aggregated mode)
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import { MetricKey, METRIC_LABELS, METRIC_COLORS } from '../types'
|
||||
|
||||
interface MetricSelectorProps {
|
||||
selectedMetrics: Set<MetricKey>
|
||||
viewMode: 'aggregated' | 'comparison'
|
||||
onMetricToggle: (metric: MetricKey) => void
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders a list of metric selection buttons
|
||||
* Shows multi-select hint in aggregated mode and single-select hint in comparison mode
|
||||
*/
|
||||
export const MetricSelector: React.FC<MetricSelectorProps> = ({
|
||||
selectedMetrics,
|
||||
viewMode,
|
||||
onMetricToggle
|
||||
}) => {
|
||||
return (
|
||||
<div className="mb-8">
|
||||
<h3 className="text-sm font-medium text-slate-700 mb-3">
|
||||
选择呈现内容 ({viewMode === 'comparison' ? '单选' : '多选'})
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{(Object.keys(METRIC_LABELS) as MetricKey[]).map((key) => {
|
||||
const isSelected = selectedMetrics.has(key)
|
||||
return (
|
||||
<button
|
||||
key={key}
|
||||
onClick={() => onMetricToggle(key)}
|
||||
className={`px-3 py-1.5 rounded-full text-xs font-medium border transition-colors flex items-center gap-1.5 ${
|
||||
isSelected
|
||||
? 'bg-blue-50 border-blue-200 text-blue-700'
|
||||
: 'bg-white border-slate-200 text-slate-600 hover:bg-slate-50'
|
||||
}`}
|
||||
>
|
||||
<div
|
||||
className="w-2 h-2 rounded-full"
|
||||
style={{ backgroundColor: isSelected ? METRIC_COLORS[key] : '#cbd5e1' }}
|
||||
/>
|
||||
{METRIC_LABELS[key]}
|
||||
</button>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,148 @@
|
||||
/**
|
||||
* ReportChart Component
|
||||
* Renders the main chart display with support for both aggregated and comparison views
|
||||
* Uses Recharts library for responsive, interactive charts
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import {
|
||||
XAxis,
|
||||
YAxis,
|
||||
CartesianGrid,
|
||||
Tooltip,
|
||||
Legend,
|
||||
ResponsiveContainer,
|
||||
Line,
|
||||
ComposedChart
|
||||
} from 'recharts'
|
||||
import { DailyMetrics, MetricKey, METRIC_LABELS, METRIC_COLORS, USER_COLORS } from '../types'
|
||||
import { CustomTooltip } from './CustomTooltip'
|
||||
import { ComparisonTooltip } from './ComparisonTooltip'
|
||||
|
||||
interface ReportChartProps {
|
||||
viewMode: 'aggregated' | 'comparison'
|
||||
selectedMetrics: Set<MetricKey>
|
||||
selectedUsers: Set<string>
|
||||
allUsers: string[]
|
||||
chartData: DailyMetrics[]
|
||||
comparisonChartData: any[]
|
||||
}
|
||||
|
||||
/**
|
||||
* Helper function to get consistent color for a user
|
||||
*/
|
||||
const getUserColor = (user: string, users: string[]): string => {
|
||||
const index = users.indexOf(user)
|
||||
return USER_COLORS[index % USER_COLORS.length]
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders the appropriate chart based on view mode
|
||||
* - Aggregated: Shows metrics grouped by date
|
||||
* - Comparison: Shows metrics grouped by user for comparison
|
||||
*/
|
||||
export const ReportChart: React.FC<ReportChartProps> = ({
|
||||
viewMode,
|
||||
selectedMetrics,
|
||||
selectedUsers,
|
||||
allUsers,
|
||||
chartData,
|
||||
comparisonChartData
|
||||
}) => {
|
||||
return (
|
||||
<div className="flex-1 min-h-[400px]">
|
||||
{viewMode === 'aggregated' ? (
|
||||
// Aggregated view: metrics by date
|
||||
<ResponsiveContainer width="100%" height="100%">
|
||||
<ComposedChart data={chartData} margin={{ top: 20, right: 30, left: 20, bottom: 20 }}>
|
||||
<CartesianGrid strokeDasharray="3 3" vertical={false} stroke="#e2e8f0" />
|
||||
<XAxis
|
||||
dataKey="date"
|
||||
axisLine={false}
|
||||
tickLine={false}
|
||||
tick={{ fill: '#64748b', fontSize: 12 }}
|
||||
dy={10}
|
||||
/>
|
||||
<YAxis axisLine={false} tickLine={false} tick={{ fill: '#64748b', fontSize: 12 }} />
|
||||
<Tooltip content={<CustomTooltip chartData={chartData} />} />
|
||||
<Legend wrapperStyle={{ paddingTop: '20px' }} iconType="circle" />
|
||||
|
||||
{Array.from(selectedMetrics).map((metric) => (
|
||||
<Line
|
||||
key={metric}
|
||||
type="monotone"
|
||||
dataKey={metric}
|
||||
name={METRIC_LABELS[metric]}
|
||||
stroke={METRIC_COLORS[metric]}
|
||||
strokeWidth={2}
|
||||
dot={{ r: 4, strokeWidth: 2 }}
|
||||
activeDot={{ r: 6, strokeWidth: 0 }}
|
||||
/>
|
||||
))}
|
||||
</ComposedChart>
|
||||
</ResponsiveContainer>
|
||||
) : (
|
||||
// Comparison view: metrics by user
|
||||
<ResponsiveContainer width="100%" height="100%">
|
||||
<ComposedChart
|
||||
data={comparisonChartData}
|
||||
margin={{ top: 20, right: 30, left: 20, bottom: 20 }}
|
||||
>
|
||||
<CartesianGrid strokeDasharray="3 3" vertical={false} stroke="#e2e8f0" />
|
||||
<XAxis
|
||||
dataKey="date"
|
||||
axisLine={false}
|
||||
tickLine={false}
|
||||
tick={{ fill: '#64748b', fontSize: 12 }}
|
||||
dy={10}
|
||||
/>
|
||||
<YAxis axisLine={false} tickLine={false} tick={{ fill: '#64748b', fontSize: 12 }} />
|
||||
<Tooltip
|
||||
content={
|
||||
<ComparisonTooltip
|
||||
users={allUsers}
|
||||
selectedUsers={selectedUsers}
|
||||
selectedMetrics={selectedMetrics}
|
||||
/>
|
||||
}
|
||||
/>
|
||||
<Legend wrapperStyle={{ paddingTop: '20px' }} iconType="circle" />
|
||||
|
||||
{selectedUsers.size === 0 || selectedUsers.size > 1
|
||||
? // Multiple users: show first metric for each user
|
||||
allUsers
|
||||
.filter((user) => selectedUsers.size === 0 || selectedUsers.has(user))
|
||||
.map((user) => (
|
||||
<Line
|
||||
key={user}
|
||||
type="monotone"
|
||||
dataKey={`${user}_${Array.from(selectedMetrics)[0]}`}
|
||||
name={user || '未分配'}
|
||||
stroke={getUserColor(user, allUsers)}
|
||||
strokeWidth={2}
|
||||
dot={{ r: 4, strokeWidth: 2 }}
|
||||
activeDot={{ r: 6, strokeWidth: 0 }}
|
||||
/>
|
||||
))
|
||||
: // Single user: show all metrics for that user
|
||||
Array.from(selectedMetrics).map((metric) => {
|
||||
const user = Array.from(selectedUsers)[0]
|
||||
return (
|
||||
<Line
|
||||
key={metric}
|
||||
type="monotone"
|
||||
dataKey={`${user}_${metric}`}
|
||||
name={METRIC_LABELS[metric]}
|
||||
stroke={METRIC_COLORS[metric]}
|
||||
strokeWidth={2}
|
||||
dot={{ r: 4, strokeWidth: 2 }}
|
||||
activeDot={{ r: 6, strokeWidth: 0 }}
|
||||
/>
|
||||
)
|
||||
})}
|
||||
</ComposedChart>
|
||||
</ResponsiveContainer>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,82 @@
|
||||
/**
|
||||
* UserFilter Component
|
||||
* Allows users to filter which users to display in comparison view
|
||||
* Shows all users as selectable chips with color coding
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import { USER_COLORS } from '../types'
|
||||
|
||||
interface UserFilterProps {
|
||||
allUsers: string[]
|
||||
selectedUsers: Set<string>
|
||||
onUserToggle: (user: string) => void
|
||||
onSelectAll: () => void
|
||||
onClearAll: () => void
|
||||
}
|
||||
|
||||
/**
|
||||
* Helper function to get consistent color for a user
|
||||
*/
|
||||
const getUserColor = (user: string, users: string[]): string => {
|
||||
const index = users.indexOf(user)
|
||||
return USER_COLORS[index % USER_COLORS.length]
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders user filter interface with selectable user chips
|
||||
* Only displayed in comparison view mode
|
||||
*/
|
||||
export const UserFilter: React.FC<UserFilterProps> = ({
|
||||
allUsers,
|
||||
selectedUsers,
|
||||
onUserToggle,
|
||||
onSelectAll,
|
||||
onClearAll
|
||||
}) => {
|
||||
return (
|
||||
<div className="mb-6">
|
||||
<div className="flex items-center justify-between mb-3">
|
||||
<h3 className="text-sm font-medium text-slate-700">筛选用户</h3>
|
||||
<div className="flex gap-2">
|
||||
<button onClick={onSelectAll} className="text-xs text-blue-600 hover:underline">
|
||||
全选
|
||||
</button>
|
||||
<button onClick={onClearAll} className="text-xs text-slate-500 hover:underline">
|
||||
清空
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex flex-wrap gap-2">
|
||||
{allUsers.map((user) => {
|
||||
const isSelected = selectedUsers.has(user)
|
||||
const color = getUserColor(user, allUsers)
|
||||
|
||||
return (
|
||||
<button
|
||||
key={user}
|
||||
onClick={() => onUserToggle(user)}
|
||||
className={`px-3 py-1.5 rounded-full text-xs font-medium border transition-colors flex items-center gap-1.5 ${
|
||||
isSelected
|
||||
? 'bg-white border-current'
|
||||
: 'bg-white border-slate-200 text-slate-600 hover:bg-slate-50'
|
||||
}`}
|
||||
style={isSelected ? { color, borderColor: color } : {}}
|
||||
>
|
||||
<div
|
||||
className="w-2 h-2 rounded-full"
|
||||
style={{ backgroundColor: isSelected ? color : '#cbd5e1' }}
|
||||
/>
|
||||
{user || '未分配'}
|
||||
</button>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
|
||||
{selectedUsers.size === 0 && (
|
||||
<p className="text-xs text-slate-500 mt-2">未选择用户时将显示所有用户数据</p>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,47 @@
|
||||
/**
|
||||
* ViewModeToggle Component
|
||||
* Allows users to switch between aggregated and comparison view modes
|
||||
*/
|
||||
|
||||
import React from 'react'
|
||||
import { ViewMode } from '../types'
|
||||
|
||||
interface ViewModeToggleProps {
|
||||
viewMode: ViewMode
|
||||
onViewModeChange: (newMode: ViewMode) => void
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders toggle buttons for switching between view modes
|
||||
* Aggregated: shows data grouped by date
|
||||
* Comparison: shows data grouped by user for comparison
|
||||
*/
|
||||
export const ViewModeToggle: React.FC<ViewModeToggleProps> = ({ viewMode, onViewModeChange }) => {
|
||||
return (
|
||||
<div className="mb-6">
|
||||
<h3 className="text-sm font-medium text-slate-700 mb-3">视图模式</h3>
|
||||
<div className="flex gap-2">
|
||||
<button
|
||||
onClick={() => onViewModeChange('aggregated')}
|
||||
className={`px-4 py-2 rounded-lg text-sm font-medium border transition-colors ${
|
||||
viewMode === 'aggregated'
|
||||
? 'bg-blue-50 border-blue-200 text-blue-700'
|
||||
: 'bg-white border-slate-200 text-slate-600 hover:bg-slate-50'
|
||||
}`}
|
||||
>
|
||||
按日期聚合
|
||||
</button>
|
||||
<button
|
||||
onClick={() => onViewModeChange('comparison')}
|
||||
className={`px-4 py-2 rounded-lg text-sm font-medium border transition-colors ${
|
||||
viewMode === 'comparison'
|
||||
? 'bg-blue-50 border-blue-200 text-blue-700'
|
||||
: 'bg-white border-slate-200 text-slate-600 hover:bg-slate-50'
|
||||
}`}
|
||||
>
|
||||
用户对比
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
50
src/renderer/src/components/report-analysis/export.ts
Normal file
50
src/renderer/src/components/report-analysis/export.ts
Normal file
@@ -0,0 +1,50 @@
|
||||
/**
|
||||
* Report Analysis Feature Module
|
||||
* Centralized exports for the refactored report analysis components
|
||||
*/
|
||||
|
||||
// Main component
|
||||
export { ReportAnalysisDialog, default } from './index'
|
||||
|
||||
// Types
|
||||
export type {
|
||||
ReportMetrics,
|
||||
DailyMetrics,
|
||||
UserDailyMetrics,
|
||||
MetricKey,
|
||||
ViewMode,
|
||||
ReportAnalysisDialogProps,
|
||||
CustomTooltipProps,
|
||||
ComparisonTooltipProps
|
||||
} from './types'
|
||||
|
||||
export { METRIC_LABELS, METRIC_COLORS, USER_COLORS } from './types'
|
||||
|
||||
// Hooks
|
||||
export { useReportData } from './hooks/useReportData'
|
||||
export { useChartData } from './hooks/useChartData'
|
||||
export { useReportFilters } from './hooks/useReportFilters'
|
||||
|
||||
// Components
|
||||
export { MetricSelector } from './components/MetricSelector'
|
||||
export { ViewModeToggle } from './components/ViewModeToggle'
|
||||
export { UserFilter } from './components/UserFilter'
|
||||
export { ReportChart } from './components/ReportChart'
|
||||
export { CustomTooltip } from './components/CustomTooltip'
|
||||
export { ComparisonTooltip } from './components/ComparisonTooltip'
|
||||
|
||||
// Utilities
|
||||
export {
|
||||
extractReportValues,
|
||||
parseDurationToSeconds,
|
||||
formatDateToChinese,
|
||||
parseReportData
|
||||
} from './utils/parser'
|
||||
|
||||
export {
|
||||
aggregateByDate,
|
||||
extractAllUsers,
|
||||
aggregateByUserAndDate,
|
||||
formatComparisonChartData,
|
||||
getUserColor
|
||||
} from './utils/aggregators'
|
||||
@@ -0,0 +1,59 @@
|
||||
/**
|
||||
* Custom hook for transforming report data into chart-ready formats
|
||||
* Handles data aggregation for different view modes
|
||||
*/
|
||||
|
||||
import { useMemo } from 'react'
|
||||
import { ReportMetrics, DailyMetrics, UserDailyMetrics, MetricKey } from '../types'
|
||||
import {
|
||||
aggregateByDate,
|
||||
extractAllUsers,
|
||||
aggregateByUserAndDate,
|
||||
formatComparisonChartData
|
||||
} from '../utils/aggregators'
|
||||
|
||||
interface UseChartDataResult {
|
||||
chartData: DailyMetrics[]
|
||||
allUsers: string[]
|
||||
comparisonData: UserDailyMetrics[]
|
||||
comparisonChartData: any[]
|
||||
}
|
||||
|
||||
/**
|
||||
* Hook for managing chart data transformations
|
||||
*
|
||||
* @param reportData - Raw report metrics data
|
||||
* @param selectedUsers - Set of selected users for filtering
|
||||
* @param selectedMetrics - Set of selected metrics to display
|
||||
* @returns Transformed data ready for chart rendering
|
||||
*/
|
||||
export const useChartData = (
|
||||
reportData: ReportMetrics[],
|
||||
selectedUsers: Set<string>,
|
||||
selectedMetrics: Set<MetricKey>
|
||||
): UseChartDataResult => {
|
||||
// Aggregate data by date
|
||||
const chartData = useMemo(() => aggregateByDate(reportData), [reportData])
|
||||
|
||||
// Extract all unique users from report data
|
||||
const allUsers = useMemo(() => extractAllUsers(reportData), [reportData])
|
||||
|
||||
// Aggregate data by date AND user for comparison view
|
||||
const comparisonData = useMemo(
|
||||
() => aggregateByUserAndDate(reportData, selectedUsers),
|
||||
[reportData, selectedUsers]
|
||||
)
|
||||
|
||||
// Format comparison data for chart rendering
|
||||
const comparisonChartData = useMemo(
|
||||
() => formatComparisonChartData(comparisonData, selectedUsers, selectedMetrics),
|
||||
[comparisonData, selectedUsers, selectedMetrics]
|
||||
)
|
||||
|
||||
return {
|
||||
chartData,
|
||||
allUsers,
|
||||
comparisonData,
|
||||
comparisonChartData
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,106 @@
|
||||
/**
|
||||
* Custom hook for fetching and managing report data
|
||||
* Handles data loading, parsing, and error states
|
||||
*/
|
||||
|
||||
import { useState, useCallback, useEffect } from 'react'
|
||||
import { ReportMetrics } from '../types'
|
||||
import { parseReportData } from '../utils/parser'
|
||||
|
||||
interface UseReportDataResult {
|
||||
isLoading: boolean
|
||||
error: string | null
|
||||
reportData: ReportMetrics[]
|
||||
loadAndAnalyzeReports: () => Promise<void>
|
||||
clearData: () => void
|
||||
}
|
||||
|
||||
/**
|
||||
* Hook for managing report data fetching and parsing
|
||||
*
|
||||
* @param isAdmin - Whether the current user has admin privileges
|
||||
* @param isOpen - Whether the dialog is open
|
||||
* @returns Report data state and control functions
|
||||
*/
|
||||
export const useReportData = (isAdmin: boolean, isOpen: boolean): UseReportDataResult => {
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
const [error, setError] = useState<string | null>(null)
|
||||
const [reportData, setReportData] = useState<ReportMetrics[]>([])
|
||||
|
||||
const loadAndAnalyzeReports = useCallback(async () => {
|
||||
if (!isAdmin) return
|
||||
|
||||
setIsLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
// 1. Fetch report list
|
||||
const listResult = await window.electron.report.listAll()
|
||||
if (!listResult.success || !listResult.data) {
|
||||
throw new Error(listResult.error || '获取报告列表失败')
|
||||
}
|
||||
|
||||
const reports = listResult.data
|
||||
const metricsList: ReportMetrics[] = []
|
||||
|
||||
// 2. Fetch content for each report (in chunks to avoid memory/network issues)
|
||||
// Rule: async-parallel - Using Promise.all for parallel fetching
|
||||
const chunkSize = 10
|
||||
for (let i = 0; i < reports.length; i += chunkSize) {
|
||||
const chunk = reports.slice(i, i + chunkSize)
|
||||
const contentPromises = chunk.map(async (report) => {
|
||||
try {
|
||||
const contentResult = await window.electron.report.download(report.key)
|
||||
if (contentResult.success && contentResult.data) {
|
||||
return { report, content: contentResult.data }
|
||||
}
|
||||
} catch (e) {
|
||||
console.warn(`Failed to fetch content for report ${report.key}`, e)
|
||||
}
|
||||
return null
|
||||
})
|
||||
|
||||
const chunkContents = await Promise.all(contentPromises)
|
||||
|
||||
// 3. Parse each report's markdown content
|
||||
// Rule: js-hoist-regexp - Regex patterns now in parseReportData function
|
||||
for (const item of chunkContents) {
|
||||
if (!item) continue
|
||||
|
||||
const { report, content } = item
|
||||
const parsedData = parseReportData(report, content)
|
||||
|
||||
metricsList.push(parsedData)
|
||||
}
|
||||
}
|
||||
|
||||
setReportData(metricsList)
|
||||
} catch (err: any) {
|
||||
setError(err.message || '分析报告时发生错误')
|
||||
} finally {
|
||||
setIsLoading(false)
|
||||
}
|
||||
}, [isAdmin])
|
||||
|
||||
const clearData = useCallback(() => {
|
||||
setReportData([])
|
||||
setError(null)
|
||||
}, [])
|
||||
|
||||
// Auto-load data when dialog opens
|
||||
useEffect(() => {
|
||||
if (isOpen && isAdmin) {
|
||||
void loadAndAnalyzeReports()
|
||||
} else {
|
||||
clearData()
|
||||
}
|
||||
}, [isOpen, isAdmin, loadAndAnalyzeReports, clearData])
|
||||
|
||||
return {
|
||||
isLoading,
|
||||
error,
|
||||
reportData,
|
||||
loadAndAnalyzeReports,
|
||||
clearData
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,122 @@
|
||||
/**
|
||||
* Custom hook for managing report analysis filters and view modes
|
||||
* Handles metric selection, view mode switching, and user filtering
|
||||
*/
|
||||
|
||||
import { useState, useCallback } from 'react'
|
||||
import { MetricKey, ViewMode } from '../types'
|
||||
|
||||
interface UseReportFiltersResult {
|
||||
selectedMetrics: Set<MetricKey>
|
||||
viewMode: ViewMode
|
||||
selectedUsers: Set<string>
|
||||
handleMetricToggle: (metric: MetricKey) => void
|
||||
handleViewModeChange: (newMode: ViewMode) => void
|
||||
handleUserToggle: (user: string) => void
|
||||
handleSelectAllUsers: (users: string[]) => void
|
||||
handleClearAllUsers: () => void
|
||||
}
|
||||
|
||||
/**
|
||||
* Hook for managing filter state and user interactions
|
||||
*
|
||||
* @returns Filter state and handler functions
|
||||
*/
|
||||
export const useReportFilters = (): UseReportFiltersResult => {
|
||||
const [selectedMetrics, setSelectedMetrics] = useState<Set<MetricKey>>(
|
||||
new Set(['processedOrders', 'deletedMaterials', 'errors'])
|
||||
)
|
||||
|
||||
const [viewMode, setViewMode] = useState<ViewMode>('aggregated')
|
||||
|
||||
const [selectedUsers, setSelectedUsers] = useState<Set<string>>(new Set())
|
||||
|
||||
/**
|
||||
* Handles metric selection with view mode awareness
|
||||
* In comparison view: single selection only
|
||||
* In aggregated view: multiple selection allowed
|
||||
*/
|
||||
const handleMetricToggle = useCallback(
|
||||
(metric: MetricKey) => {
|
||||
setSelectedMetrics((prev) => {
|
||||
const next = new Set(prev)
|
||||
|
||||
if (viewMode === 'comparison') {
|
||||
// Single selection mode for comparison view
|
||||
return new Set([metric])
|
||||
} else {
|
||||
// Multi-selection mode for aggregated view
|
||||
if (next.has(metric)) {
|
||||
// Ensure at least one metric is selected
|
||||
if (next.size > 1) {
|
||||
next.delete(metric)
|
||||
}
|
||||
} else {
|
||||
next.add(metric)
|
||||
}
|
||||
return next
|
||||
}
|
||||
})
|
||||
},
|
||||
[viewMode]
|
||||
)
|
||||
|
||||
/**
|
||||
* Handles view mode switching with automatic metric adjustment
|
||||
* When switching to comparison view, keeps only first selected metric
|
||||
*/
|
||||
const handleViewModeChange = useCallback((newMode: ViewMode) => {
|
||||
setViewMode(newMode)
|
||||
|
||||
// When switching to comparison view, keep only the first selected metric
|
||||
if (newMode === 'comparison') {
|
||||
setSelectedMetrics((prev) => {
|
||||
if (prev.size > 1) {
|
||||
const firstMetric = Array.from(prev)[0]
|
||||
return new Set([firstMetric])
|
||||
}
|
||||
return prev
|
||||
})
|
||||
}
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* Handles user selection toggle
|
||||
*/
|
||||
const handleUserToggle = useCallback((user: string) => {
|
||||
setSelectedUsers((prev) => {
|
||||
const next = new Set(prev)
|
||||
if (next.has(user)) {
|
||||
next.delete(user)
|
||||
} else {
|
||||
next.add(user)
|
||||
}
|
||||
return next
|
||||
})
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* Selects all provided users
|
||||
*/
|
||||
const handleSelectAllUsers = useCallback((users: string[]) => {
|
||||
setSelectedUsers(new Set(users))
|
||||
}, [])
|
||||
|
||||
/**
|
||||
* Clears all user selections
|
||||
*/
|
||||
const handleClearAllUsers = useCallback(() => {
|
||||
setSelectedUsers(new Set())
|
||||
}, [])
|
||||
|
||||
return {
|
||||
selectedMetrics,
|
||||
viewMode,
|
||||
selectedUsers,
|
||||
handleMetricToggle,
|
||||
handleViewModeChange,
|
||||
handleUserToggle,
|
||||
handleSelectAllUsers,
|
||||
handleClearAllUsers
|
||||
}
|
||||
}
|
||||
211
src/renderer/src/components/report-analysis/index.tsx
Normal file
211
src/renderer/src/components/report-analysis/index.tsx
Normal file
@@ -0,0 +1,211 @@
|
||||
/**
|
||||
* ReportAnalysisDialog Component - Refactored
|
||||
*
|
||||
* A comprehensive dashboard for analyzing ERP system execution reports.
|
||||
* Features include:
|
||||
* - Aggregated view: Daily metrics overview
|
||||
* - Comparison view: User performance comparison
|
||||
* - Interactive filtering and metric selection
|
||||
*
|
||||
* This refactored version separates concerns into:
|
||||
* - Custom hooks for business logic
|
||||
* - Reusable components for UI
|
||||
* - Utility functions for data processing
|
||||
*/
|
||||
|
||||
import React, { useCallback } from 'react'
|
||||
import { X, BarChart3, Loader2, AlertCircle } from 'lucide-react'
|
||||
import { ReportAnalysisDialogProps, MetricKey } from './types'
|
||||
import { useReportData } from './hooks/useReportData'
|
||||
import { useChartData } from './hooks/useChartData'
|
||||
import { useReportFilters } from './hooks/useReportFilters'
|
||||
import { MetricSelector } from './components/MetricSelector'
|
||||
import { ViewModeToggle } from './components/ViewModeToggle'
|
||||
import { UserFilter } from './components/UserFilter'
|
||||
import { ReportChart } from './components/ReportChart'
|
||||
|
||||
export const ReportAnalysisDialog: React.FC<ReportAnalysisDialogProps> = ({
|
||||
isOpen,
|
||||
onClose,
|
||||
isAdmin
|
||||
}) => {
|
||||
// Data management hook
|
||||
const { isLoading, error, reportData, loadAndAnalyzeReports } = useReportData(isAdmin, isOpen)
|
||||
|
||||
// Filter state management hook
|
||||
const {
|
||||
selectedMetrics,
|
||||
viewMode,
|
||||
selectedUsers,
|
||||
handleMetricToggle,
|
||||
handleViewModeChange,
|
||||
handleUserToggle,
|
||||
handleSelectAllUsers: handleSelectAllUsersWithParam,
|
||||
handleClearAllUsers
|
||||
} = useReportFilters()
|
||||
|
||||
// Chart data transformation hook (must be called before using allUsers)
|
||||
const { chartData, allUsers, comparisonChartData } = useChartData(
|
||||
reportData,
|
||||
selectedUsers,
|
||||
selectedMetrics
|
||||
)
|
||||
|
||||
// Adapt handleSelectAllUsers to match component interface
|
||||
const handleSelectAllUsers = useCallback(() => {
|
||||
handleSelectAllUsersWithParam(allUsers)
|
||||
}, [allUsers, handleSelectAllUsersWithParam])
|
||||
|
||||
// Early returns for conditional rendering
|
||||
if (!isOpen) return null
|
||||
if (!isAdmin) return null
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 z-[110] flex items-center justify-center bg-slate-900/50 backdrop-blur-sm animate-in fade-in duration-200">
|
||||
<div className="bg-white rounded-2xl shadow-2xl w-[1000px] max-w-[95vw] h-[85vh] flex flex-col border border-slate-200 overflow-hidden animate-in zoom-in-95 duration-200">
|
||||
{/* Header */}
|
||||
<div className="flex items-center justify-between px-6 py-4 border-b border-slate-200 bg-slate-50 flex-shrink-0">
|
||||
<div className="flex items-center gap-2 text-slate-800">
|
||||
<BarChart3 size={20} className="text-blue-600" />
|
||||
<h2 className="text-lg font-semibold">执行报告分析</h2>
|
||||
</div>
|
||||
<button
|
||||
onClick={onClose}
|
||||
className="text-slate-400 hover:text-slate-600 hover:bg-slate-200/50 p-1.5 rounded-lg transition-colors"
|
||||
>
|
||||
<X size={20} />
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Content */}
|
||||
<div className="flex-1 overflow-hidden flex flex-col bg-white">
|
||||
{isLoading ? (
|
||||
<LoadingState />
|
||||
) : error ? (
|
||||
<ErrorState error={error} onRetry={loadAndAnalyzeReports} />
|
||||
) : chartData.length === 0 ? (
|
||||
<EmptyState />
|
||||
) : (
|
||||
<MainContent
|
||||
viewMode={viewMode}
|
||||
selectedMetrics={selectedMetrics}
|
||||
selectedUsers={selectedUsers}
|
||||
allUsers={allUsers}
|
||||
chartData={chartData}
|
||||
comparisonChartData={comparisonChartData}
|
||||
handleMetricToggle={handleMetricToggle}
|
||||
handleViewModeChange={handleViewModeChange}
|
||||
handleUserToggle={handleUserToggle}
|
||||
handleSelectAllUsers={handleSelectAllUsers}
|
||||
handleClearAllUsers={handleClearAllUsers}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
// Sub-components for better organization
|
||||
// ============================================================================
|
||||
|
||||
const LoadingState: React.FC = () => (
|
||||
<div className="flex-1 flex flex-col items-center justify-center text-slate-500">
|
||||
<Loader2 size={32} className="animate-spin text-blue-500 mb-4" />
|
||||
<p>正在分析报告数据,可能需要几秒钟...</p>
|
||||
</div>
|
||||
)
|
||||
|
||||
const ErrorState: React.FC<{ error: string; onRetry: () => void }> = ({ error, onRetry }) => (
|
||||
<div className="flex-1 flex flex-col items-center justify-center text-red-500 p-8 text-center">
|
||||
<AlertCircle size={48} className="mb-4 opacity-80" />
|
||||
<p className="text-lg font-medium mb-2">分析失败</p>
|
||||
<p className="text-sm opacity-80">{error}</p>
|
||||
<button
|
||||
onClick={onRetry}
|
||||
className="mt-6 px-4 py-2 bg-red-50 text-red-600 border border-red-200 rounded-lg hover:bg-red-100 transition-colors"
|
||||
>
|
||||
重试
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
|
||||
const EmptyState: React.FC = () => (
|
||||
<div className="flex-1 flex flex-col items-center justify-center text-slate-400">
|
||||
<BarChart3 size={48} className="mb-4 opacity-50 text-slate-300" />
|
||||
<p>暂无报告数据可供分析</p>
|
||||
</div>
|
||||
)
|
||||
|
||||
interface MainContentProps {
|
||||
viewMode: 'aggregated' | 'comparison'
|
||||
selectedMetrics: Set<MetricKey>
|
||||
selectedUsers: Set<string>
|
||||
allUsers: string[]
|
||||
chartData: any[]
|
||||
comparisonChartData: any[]
|
||||
handleMetricToggle: (metric: MetricKey) => void
|
||||
handleViewModeChange: (newMode: 'aggregated' | 'comparison') => void
|
||||
handleUserToggle: (user: string) => void
|
||||
handleSelectAllUsers: () => void
|
||||
handleClearAllUsers: () => void
|
||||
}
|
||||
|
||||
const MainContent: React.FC<MainContentProps> = ({
|
||||
viewMode,
|
||||
selectedMetrics,
|
||||
selectedUsers,
|
||||
allUsers,
|
||||
chartData,
|
||||
comparisonChartData,
|
||||
handleMetricToggle,
|
||||
handleViewModeChange,
|
||||
handleUserToggle,
|
||||
handleSelectAllUsers,
|
||||
handleClearAllUsers
|
||||
}) => (
|
||||
<div className="flex-1 flex flex-col p-6 overflow-y-auto">
|
||||
{/* Metric Selector */}
|
||||
<MetricSelector
|
||||
selectedMetrics={selectedMetrics}
|
||||
viewMode={viewMode}
|
||||
onMetricToggle={handleMetricToggle}
|
||||
/>
|
||||
|
||||
{/* View Mode Toggle */}
|
||||
<ViewModeToggle viewMode={viewMode} onViewModeChange={handleViewModeChange} />
|
||||
|
||||
{/* User Filter - Only in comparison mode */}
|
||||
{viewMode === 'comparison' && (
|
||||
<UserFilter
|
||||
allUsers={allUsers}
|
||||
selectedUsers={selectedUsers}
|
||||
onUserToggle={handleUserToggle}
|
||||
onSelectAll={handleSelectAllUsers}
|
||||
onClearAll={handleClearAllUsers}
|
||||
/>
|
||||
)}
|
||||
|
||||
{/* Chart */}
|
||||
<ReportChart
|
||||
viewMode={viewMode}
|
||||
selectedMetrics={selectedMetrics}
|
||||
selectedUsers={selectedUsers}
|
||||
allUsers={allUsers}
|
||||
chartData={chartData}
|
||||
comparisonChartData={comparisonChartData}
|
||||
/>
|
||||
|
||||
{/* Description */}
|
||||
<div className="mt-4 text-center text-xs text-slate-400">
|
||||
{viewMode === 'aggregated'
|
||||
? '数据以天为单位进行聚合统计。展示的是选定时间段内的总量。'
|
||||
: selectedUsers.size === 0
|
||||
? '展示所有用户的数据对比。未选择用户时显示全部。'
|
||||
: '展示选定用户的数据对比。'}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
export default ReportAnalysisDialog
|
||||
153
src/renderer/src/components/report-analysis/types.ts
Normal file
153
src/renderer/src/components/report-analysis/types.ts
Normal file
@@ -0,0 +1,153 @@
|
||||
/**
|
||||
* Type definitions for Report Analysis feature
|
||||
* Centralized type management for better maintainability
|
||||
*/
|
||||
|
||||
// ============================================================================
|
||||
// Domain Types
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Extracted metrics from a single report
|
||||
*/
|
||||
export interface ReportMetrics {
|
||||
date: string
|
||||
user: string
|
||||
processedOrders: number
|
||||
deletedMaterials: number
|
||||
skippedMaterials: number
|
||||
errors: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
executionTimeSecs: number
|
||||
timestamp: number
|
||||
}
|
||||
|
||||
/**
|
||||
* Aggregated daily metrics
|
||||
*/
|
||||
export interface DailyMetrics {
|
||||
date: string
|
||||
processedOrders: number
|
||||
deletedMaterials: number
|
||||
skippedMaterials: number
|
||||
errors: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
executionTimeSecs: number
|
||||
avgExecutionTimeSecs: number
|
||||
users: string[] // Unique users who ran reports on this day
|
||||
reportCount: number
|
||||
}
|
||||
|
||||
/**
|
||||
* User-specific daily metrics for comparison view
|
||||
*/
|
||||
export interface UserDailyMetrics {
|
||||
date: string
|
||||
user: string
|
||||
processedOrders: number
|
||||
deletedMaterials: number
|
||||
skippedMaterials: number
|
||||
errors: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
executionTimeSecs: number
|
||||
reportCount: number
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
// UI Types
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Available metric keys for chart display
|
||||
*/
|
||||
export type MetricKey = keyof Omit<
|
||||
DailyMetrics,
|
||||
'date' | 'users' | 'reportCount' | 'avgExecutionTimeSecs'
|
||||
>
|
||||
|
||||
/**
|
||||
* View mode for the analysis display
|
||||
*/
|
||||
export type ViewMode = 'aggregated' | 'comparison'
|
||||
|
||||
// ============================================================================
|
||||
// Component Props Types
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Props for the main ReportAnalysisDialog component
|
||||
*/
|
||||
export interface ReportAnalysisDialogProps {
|
||||
isOpen: boolean
|
||||
onClose: () => void
|
||||
isAdmin: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* Props for custom tooltip component
|
||||
*/
|
||||
export interface CustomTooltipProps {
|
||||
active?: boolean
|
||||
payload?: any[]
|
||||
label?: string
|
||||
chartData: DailyMetrics[]
|
||||
}
|
||||
|
||||
/**
|
||||
* Props for comparison tooltip component
|
||||
*/
|
||||
export interface ComparisonTooltipProps {
|
||||
active?: boolean
|
||||
payload?: any[]
|
||||
label?: string
|
||||
users: string[]
|
||||
selectedUsers: Set<string>
|
||||
selectedMetrics: Set<MetricKey>
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
// Configuration Types
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Metric labels mapping
|
||||
*/
|
||||
export const METRIC_LABELS: Record<MetricKey, string> = {
|
||||
processedOrders: '处理订单数',
|
||||
deletedMaterials: '删除物料数',
|
||||
skippedMaterials: '跳过物料数',
|
||||
errors: '错误数量',
|
||||
retriedOrders: '重试订单数',
|
||||
successfulRetries: '成功重试数',
|
||||
executionTimeSecs: '每订单平均耗时(秒)'
|
||||
}
|
||||
|
||||
/**
|
||||
* Metric colors mapping
|
||||
*/
|
||||
export const METRIC_COLORS: Record<MetricKey, string> = {
|
||||
processedOrders: '#3b82f6', // blue-500
|
||||
deletedMaterials: '#ef4444', // red-500
|
||||
skippedMaterials: '#eab308', // yellow-500
|
||||
errors: '#000000', // black
|
||||
retriedOrders: '#8b5cf6', // violet-500
|
||||
successfulRetries: '#10b981', // emerald-500
|
||||
executionTimeSecs: '#f97316' // orange-500
|
||||
}
|
||||
|
||||
/**
|
||||
* User colors for comparison view
|
||||
*/
|
||||
export const USER_COLORS = [
|
||||
'#3b82f6', // blue-500
|
||||
'#10b981', // emerald-500
|
||||
'#f59e0b', // amber-500
|
||||
'#ef4444', // red-500
|
||||
'#8b5cf6', // violet-500
|
||||
'#ec4899', // pink-500
|
||||
'#06b6d4', // cyan-500
|
||||
'#84cc16' // lime-500
|
||||
]
|
||||
202
src/renderer/src/components/report-analysis/utils/aggregators.ts
Normal file
202
src/renderer/src/components/report-analysis/utils/aggregators.ts
Normal file
@@ -0,0 +1,202 @@
|
||||
/**
|
||||
* Data aggregation utilities for transforming raw report data
|
||||
* Handles date-based and user-based aggregations
|
||||
*/
|
||||
|
||||
import { ReportMetrics, DailyMetrics, UserDailyMetrics, MetricKey } from '../types'
|
||||
|
||||
// ============================================================================
|
||||
// Aggregation Functions
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Aggregates report data by date for the overview chart
|
||||
* Calculates totals and averages for each day
|
||||
*
|
||||
* @param reportData - Array of individual report metrics
|
||||
* @returns Array of daily aggregated metrics sorted by date
|
||||
*/
|
||||
export const aggregateByDate = (reportData: ReportMetrics[]): DailyMetrics[] => {
|
||||
if (!reportData.length) return []
|
||||
|
||||
const dailyMap = new Map<string, DailyMetrics>()
|
||||
|
||||
// First pass: aggregate by date
|
||||
for (const data of reportData) {
|
||||
const { date } = data
|
||||
|
||||
if (!dailyMap.has(date)) {
|
||||
dailyMap.set(date, {
|
||||
date,
|
||||
processedOrders: 0,
|
||||
deletedMaterials: 0,
|
||||
skippedMaterials: 0,
|
||||
errors: 0,
|
||||
retriedOrders: 0,
|
||||
successfulRetries: 0,
|
||||
executionTimeSecs: 0,
|
||||
avgExecutionTimeSecs: 0,
|
||||
users: [],
|
||||
reportCount: 0
|
||||
})
|
||||
}
|
||||
|
||||
const day = dailyMap.get(date)!
|
||||
day.processedOrders += data.processedOrders
|
||||
day.deletedMaterials += data.deletedMaterials
|
||||
day.skippedMaterials += data.skippedMaterials
|
||||
day.errors += data.errors
|
||||
day.retriedOrders += data.retriedOrders
|
||||
day.successfulRetries += data.successfulRetries
|
||||
day.executionTimeSecs += data.executionTimeSecs
|
||||
day.reportCount += 1
|
||||
|
||||
if (!day.users.includes(data.user)) {
|
||||
day.users.push(data.user)
|
||||
}
|
||||
}
|
||||
|
||||
// Second pass: calculate averages
|
||||
for (const day of dailyMap.values()) {
|
||||
day.avgExecutionTimeSecs =
|
||||
day.processedOrders > 0 ? day.executionTimeSecs / day.processedOrders : 0
|
||||
// Replace executionTimeSecs with avgExecutionTimeSecs for chart display
|
||||
day.executionTimeSecs = day.avgExecutionTimeSecs
|
||||
}
|
||||
|
||||
// Convert map to array and sort by date
|
||||
return Array.from(dailyMap.values()).sort((a, b) => a.date.localeCompare(b.date))
|
||||
}
|
||||
|
||||
/**
|
||||
* Extracts all unique users from report data
|
||||
*
|
||||
* @param reportData - Array of individual report metrics
|
||||
* @returns Sorted array of unique usernames
|
||||
*/
|
||||
export const extractAllUsers = (reportData: ReportMetrics[]): string[] => {
|
||||
const userSet = new Set<string>()
|
||||
reportData.forEach((data) => userSet.add(data.user))
|
||||
return Array.from(userSet).sort()
|
||||
}
|
||||
|
||||
/**
|
||||
* Aggregates report data by date AND user for comparison view
|
||||
* Allows comparing multiple users across the same time periods
|
||||
*
|
||||
* @param reportData - Array of individual report metrics
|
||||
* @param selectedUsers - Set of selected users for filtering (empty = all)
|
||||
* @returns Array of user-daily aggregated metrics sorted by date and user
|
||||
*/
|
||||
export const aggregateByUserAndDate = (
|
||||
reportData: ReportMetrics[],
|
||||
selectedUsers: Set<string>
|
||||
): UserDailyMetrics[] => {
|
||||
if (!reportData.length) return []
|
||||
|
||||
// Filter by selected users if any
|
||||
const filteredData =
|
||||
selectedUsers.size > 0 ? reportData.filter((data) => selectedUsers.has(data.user)) : reportData
|
||||
|
||||
// Group by date + user
|
||||
const keyMap = new Map<string, UserDailyMetrics>()
|
||||
|
||||
for (const data of filteredData) {
|
||||
const key = `${data.date}|${data.user}`
|
||||
|
||||
if (!keyMap.has(key)) {
|
||||
keyMap.set(key, {
|
||||
date: data.date,
|
||||
user: data.user,
|
||||
processedOrders: 0,
|
||||
deletedMaterials: 0,
|
||||
skippedMaterials: 0,
|
||||
errors: 0,
|
||||
retriedOrders: 0,
|
||||
successfulRetries: 0,
|
||||
executionTimeSecs: 0,
|
||||
reportCount: 0
|
||||
})
|
||||
}
|
||||
|
||||
const entry = keyMap.get(key)!
|
||||
entry.processedOrders += data.processedOrders
|
||||
entry.deletedMaterials += data.deletedMaterials
|
||||
entry.skippedMaterials += data.skippedMaterials
|
||||
entry.errors += data.errors
|
||||
entry.retriedOrders += data.retriedOrders
|
||||
entry.successfulRetries += data.successfulRetries
|
||||
entry.executionTimeSecs += data.executionTimeSecs
|
||||
entry.reportCount += 1
|
||||
}
|
||||
|
||||
// Calculate average execution time per order for each entry
|
||||
for (const entry of keyMap.values()) {
|
||||
entry.executionTimeSecs =
|
||||
entry.processedOrders > 0 ? entry.executionTimeSecs / entry.processedOrders : 0
|
||||
}
|
||||
|
||||
return Array.from(keyMap.values()).sort((a, b) => {
|
||||
const dateCompare = a.date.localeCompare(b.date)
|
||||
if (dateCompare !== 0) return dateCompare
|
||||
return a.user.localeCompare(b.user)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Formats comparison data for chart rendering
|
||||
* Transforms user-date data into a format suitable for Recharts
|
||||
*
|
||||
* @param comparisonData - Array of user-daily aggregated metrics
|
||||
* @param selectedUsers - Set of selected users for filtering
|
||||
* @param selectedMetrics - Set of selected metrics to display
|
||||
* @returns Array of chart data points formatted for Recharts
|
||||
*/
|
||||
export const formatComparisonChartData = (
|
||||
comparisonData: UserDailyMetrics[],
|
||||
selectedUsers: Set<string>,
|
||||
selectedMetrics: Set<MetricKey>
|
||||
): any[] => {
|
||||
if (!comparisonData.length) return []
|
||||
|
||||
const dates = [...new Set(comparisonData.map((d) => d.date))].sort()
|
||||
const users = [...new Set(comparisonData.map((d) => d.user))]
|
||||
.filter((user) => selectedUsers.size === 0 || selectedUsers.has(user))
|
||||
.sort()
|
||||
|
||||
const lookup = new Map<string, UserDailyMetrics>()
|
||||
comparisonData.forEach((d) => {
|
||||
lookup.set(`${d.date}|${d.user}`, d)
|
||||
})
|
||||
|
||||
return dates.map((date) => {
|
||||
const point: any = { date }
|
||||
users.forEach((user) => {
|
||||
const key = `${date}|${user}`
|
||||
const data = lookup.get(key)
|
||||
|
||||
Array.from(selectedMetrics).forEach((metric) => {
|
||||
const userKey = `${user}_${metric}` as any
|
||||
point[userKey] = data ? (data as any)[metric] : 0
|
||||
})
|
||||
})
|
||||
return point
|
||||
})
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
// Utility Functions
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Gets a consistent color for a user based on their position in the list
|
||||
*
|
||||
* @param user - Username to get color for
|
||||
* @param users - Array of all users (for consistent indexing)
|
||||
* @param colors - Array of color values to cycle through
|
||||
* @returns Color hex string
|
||||
*/
|
||||
export const getUserColor = (user: string, users: string[], colors: string[]): string => {
|
||||
const index = users.indexOf(user)
|
||||
return colors[index % colors.length]
|
||||
}
|
||||
178
src/renderer/src/components/report-analysis/utils/parser.ts
Normal file
178
src/renderer/src/components/report-analysis/utils/parser.ts
Normal file
@@ -0,0 +1,178 @@
|
||||
/**
|
||||
* Parser utilities for extracting report data from markdown content
|
||||
* Optimized for performance with pre-compiled regex patterns
|
||||
*/
|
||||
|
||||
// ============================================================================
|
||||
// Result Types
|
||||
// ============================================================================
|
||||
|
||||
interface ExtractValueResult {
|
||||
execTimeStr: string | null
|
||||
user: string
|
||||
processedOrders: number
|
||||
deletedMaterials: number
|
||||
skippedMaterials: number
|
||||
errors: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
executionTimeStr: string
|
||||
}
|
||||
|
||||
interface ParsedReportData {
|
||||
date: string
|
||||
user: string
|
||||
processedOrders: number
|
||||
deletedMaterials: number
|
||||
skippedMaterials: number
|
||||
errors: number
|
||||
retriedOrders: number
|
||||
successfulRetries: number
|
||||
executionTimeSecs: number
|
||||
timestamp: number
|
||||
}
|
||||
|
||||
// ============================================================================
|
||||
// Parser Functions
|
||||
// ============================================================================
|
||||
|
||||
/**
|
||||
* Extracts values from markdown report content using pre-compiled regex patterns.
|
||||
* Patterns are created once and reused for better performance.
|
||||
*
|
||||
* @param content - The markdown content to parse
|
||||
* @returns Extracted metrics values
|
||||
*/
|
||||
export const extractReportValues = (content: string): ExtractValueResult => {
|
||||
// Pre-compile regex patterns for better performance (js-hoist-regexp)
|
||||
const createPattern = (key: string) => ({
|
||||
standard: new RegExp(`\\|\\s*\\*\\*${key}\\*\\*\\s*\\|\\s*\`([^\`]+)\`\\s*\\|`),
|
||||
noBackticks: new RegExp(
|
||||
`\\|\\s*\\*\\*${key}\\*\\*\\s*\\|\\s*([^\\|\\s]+(?:\\s+[^\\|\\s]+)*)\\s*\\|`
|
||||
),
|
||||
relaxed: new RegExp(`\\|\\s*\\*\\*${key}\\*\\*\\s*\\|\\s*(.+?)\\s*\\|`)
|
||||
})
|
||||
|
||||
const extractValue = (key: string): string | null => {
|
||||
const patterns = createPattern(key)
|
||||
|
||||
for (const pattern of Object.values(patterns)) {
|
||||
const match = content.match(pattern)
|
||||
if (match && match[1]) {
|
||||
const value = match[1].trim()
|
||||
return value.replace(/`/g, '')
|
||||
}
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
return {
|
||||
execTimeStr: extractValue('执行时间'),
|
||||
user: extractValue('操作用户') || 'unknown',
|
||||
processedOrders: parseInt(extractValue('处理订单数') || '0', 10),
|
||||
deletedMaterials: parseInt(extractValue('删除物料数') || '0', 10),
|
||||
skippedMaterials: parseInt(extractValue('跳过物料数') || '0', 10),
|
||||
errors: parseInt(extractValue('错误数量') || '0', 10),
|
||||
retriedOrders: parseInt(extractValue('重试订单数') || '0', 10),
|
||||
successfulRetries: parseInt(extractValue('成功重试数') || '0', 10),
|
||||
executionTimeStr: extractValue('执行耗时') || '0秒'
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Parses duration string (e.g., "5分30秒", "120秒") to total seconds
|
||||
*
|
||||
* @param durationStr - Duration string to parse
|
||||
* @returns Total seconds
|
||||
*/
|
||||
export const parseDurationToSeconds = (durationStr: string): number => {
|
||||
// Handle empty or zero case
|
||||
if (!durationStr || durationStr === '0秒' || durationStr === '0分0秒') {
|
||||
return 0
|
||||
}
|
||||
|
||||
// Remove any remaining backticks
|
||||
const cleanStr = durationStr.replace(/`/g, '').trim()
|
||||
|
||||
let totalSeconds = 0
|
||||
const minutesMatch = cleanStr.match(/(\d+)分/)
|
||||
if (minutesMatch) {
|
||||
totalSeconds += parseInt(minutesMatch[1], 10) * 60
|
||||
}
|
||||
const secondsMatch = cleanStr.match(/(\d+)秒/)
|
||||
if (secondsMatch) {
|
||||
totalSeconds += parseInt(secondsMatch[1], 10)
|
||||
}
|
||||
|
||||
return totalSeconds
|
||||
}
|
||||
|
||||
/**
|
||||
* Formats a date object to Chinese date string format (YYYY-MM-DD)
|
||||
*
|
||||
* @param date - Date object to format
|
||||
* @returns Formatted date string
|
||||
*/
|
||||
export const formatDateToChinese = (date: Date): string => {
|
||||
return date
|
||||
.toLocaleDateString('zh-CN', {
|
||||
year: 'numeric',
|
||||
month: '2-digit',
|
||||
day: '2-digit'
|
||||
})
|
||||
.replace(/\//g, '-')
|
||||
}
|
||||
|
||||
/**
|
||||
* Parses report metadata and content into a structured ReportMetrics object
|
||||
*
|
||||
* @param report - Report metadata with key, username, lastModified
|
||||
* @param content - Markdown content of the report
|
||||
* @returns Parsed report metrics
|
||||
*/
|
||||
export const parseReportData = (
|
||||
report: { key: string; username?: string; lastModified?: string | number | Date },
|
||||
content: string
|
||||
): ParsedReportData => {
|
||||
const values = extractReportValues(content)
|
||||
const user = values.user || report.username || 'unknown'
|
||||
const executionTimeSecs = parseDurationToSeconds(values.executionTimeStr)
|
||||
|
||||
if (values.executionTimeStr === '0秒') {
|
||||
console.warn('Failed to extract execution time from report:', report.key)
|
||||
}
|
||||
|
||||
// Try to parse the date
|
||||
let dateStr = '未知日期'
|
||||
let timestamp = report.lastModified ? new Date(report.lastModified).getTime() : 0
|
||||
|
||||
if (values.execTimeStr) {
|
||||
try {
|
||||
const parsedDate = new Date(values.execTimeStr)
|
||||
if (!isNaN(parsedDate.getTime())) {
|
||||
dateStr = formatDateToChinese(parsedDate)
|
||||
timestamp = parsedDate.getTime()
|
||||
}
|
||||
} catch {
|
||||
// Fallback to report lastModified
|
||||
}
|
||||
}
|
||||
|
||||
if (dateStr === '未知日期' && report.lastModified) {
|
||||
const d = new Date(report.lastModified)
|
||||
dateStr = formatDateToChinese(d)
|
||||
}
|
||||
|
||||
return {
|
||||
date: dateStr,
|
||||
user,
|
||||
processedOrders: values.processedOrders,
|
||||
deletedMaterials: values.deletedMaterials,
|
||||
skippedMaterials: values.skippedMaterials,
|
||||
errors: values.errors,
|
||||
retriedOrders: values.retriedOrders,
|
||||
successfulRetries: values.successfulRetries,
|
||||
executionTimeSecs,
|
||||
timestamp
|
||||
}
|
||||
}
|
||||
@@ -17,7 +17,7 @@ export interface CurrentUser {
|
||||
export interface SelectedUserInfo {
|
||||
id: number
|
||||
username: string
|
||||
userType: 'Admin' | 'User' | 'Guest'
|
||||
userType: 'Admin' | 'User'
|
||||
computerName?: string
|
||||
}
|
||||
|
||||
|
||||
@@ -3,7 +3,7 @@ import { useState, useCallback } from 'react'
|
||||
interface UserInfo {
|
||||
id: number
|
||||
username: string
|
||||
userType: 'Admin' | 'User' | 'Guest'
|
||||
userType: 'Admin' | 'User'
|
||||
computerName?: string
|
||||
}
|
||||
|
||||
|
||||
@@ -11,6 +11,7 @@ const MaterialTypeManagementDialog = React.lazy(
|
||||
)
|
||||
const ExecutionReportDialog = React.lazy(() => import('../components/ExecutionReportDialog'))
|
||||
const ReportViewerDialog = React.lazy(() => import('../components/ReportViewerDialog'))
|
||||
const ReportAnalysisDialog = React.lazy(() => import('../components/ReportAnalysisDialog'))
|
||||
|
||||
const CleanerPage: React.FC = () => {
|
||||
const typeManagementButtonRef = React.useRef<HTMLButtonElement>(null)
|
||||
@@ -66,6 +67,7 @@ const CleanerPage: React.FC = () => {
|
||||
} = useCleaner()
|
||||
|
||||
const [isReportViewerOpen, setIsReportViewerOpen] = React.useState(false)
|
||||
const [isReportAnalysisOpen, setIsReportAnalysisOpen] = React.useState(false)
|
||||
|
||||
return (
|
||||
<div className="h-full flex flex-col xl:flex-row gap-6 animate-in fade-in slide-in-from-bottom-4 duration-500">
|
||||
@@ -169,6 +171,15 @@ const CleanerPage: React.FC = () => {
|
||||
onClose={() => setIsReportViewerOpen(false)}
|
||||
isAdmin={isAdmin}
|
||||
currentUsername={currentUsername}
|
||||
onOpenAnalysis={() => setIsReportAnalysisOpen(true)}
|
||||
/>
|
||||
</Suspense>
|
||||
|
||||
<Suspense fallback={null}>
|
||||
<ReportAnalysisDialog
|
||||
isOpen={isReportAnalysisOpen}
|
||||
onClose={() => setIsReportAnalysisOpen(false)}
|
||||
isAdmin={isAdmin}
|
||||
/>
|
||||
</Suspense>
|
||||
|
||||
|
||||
@@ -10,7 +10,7 @@ import { create } from 'zustand'
|
||||
interface UserInfo {
|
||||
id: number
|
||||
username: string
|
||||
userType: 'Admin' | 'User' | 'Guest'
|
||||
userType: 'Admin' | 'User'
|
||||
computerName?: string
|
||||
}
|
||||
|
||||
|
||||
@@ -97,7 +97,6 @@ export const IPC_CHANNELS = {
|
||||
REPORT_LIST_ALL: 'report:listAll',
|
||||
REPORT_LIST_BY_USER: 'report:listByUser',
|
||||
REPORT_DOWNLOAD: 'report:download',
|
||||
REPORT_ANALYZE_ALL: 'report:analyzeAll',
|
||||
|
||||
// Update
|
||||
UPDATE_GET_STATUS: 'update:getStatus',
|
||||
|
||||
@@ -1,474 +0,0 @@
|
||||
/**
|
||||
* E2E Tests for Report Analysis Feature (Task 11)
|
||||
*
|
||||
* Tests the complete report analysis workflow:
|
||||
* - Admin login → View Reports → Click Analysis → View Charts
|
||||
* - All 8 filter checkboxes functionality
|
||||
* - Chart updates when filters toggle
|
||||
* - Tooltip shows correct data
|
||||
* - Loading state
|
||||
* - Empty state
|
||||
* - Error state with retry
|
||||
* - Admin vs non-Admin access control
|
||||
* - Data accuracy verification
|
||||
*/
|
||||
|
||||
import { test, expect, ElectronApplication, Page } from '@playwright/test'
|
||||
import { _electron as electron } from '@playwright/test'
|
||||
import path from 'path'
|
||||
import fs from 'fs'
|
||||
|
||||
let electronApp: ElectronApplication
|
||||
let page: Page
|
||||
|
||||
// Evidence directory
|
||||
const EVIDENCE_DIR = path.join(__dirname, '../../.sisyphus/evidence')
|
||||
|
||||
// Ensure evidence directory exists
|
||||
if (!fs.existsSync(EVIDENCE_DIR)) {
|
||||
fs.mkdirSync(EVIDENCE_DIR, { recursive: true })
|
||||
}
|
||||
|
||||
test.describe('Report Analysis Feature - Task 11', () => {
|
||||
test.beforeAll(async () => {
|
||||
// Launch Electron app
|
||||
electronApp = await electron.launch({
|
||||
args: [path.join(__dirname, '../../out/main/index.js')],
|
||||
env: {
|
||||
NODE_ENV: 'test'
|
||||
}
|
||||
})
|
||||
|
||||
// Get the first window
|
||||
page = await electronApp.firstWindow()
|
||||
|
||||
// Wait for app to load
|
||||
await page.waitForLoadState('domcontentloaded')
|
||||
await page.waitForTimeout(2000) // Wait for app initialization
|
||||
})
|
||||
|
||||
test.afterAll(async () => {
|
||||
// Save final screenshot
|
||||
try {
|
||||
await page.screenshot({ path: path.join(EVIDENCE_DIR, 'task-11-final-state.png') })
|
||||
} catch {
|
||||
// Ignore screenshot errors
|
||||
}
|
||||
await electronApp.close()
|
||||
})
|
||||
|
||||
test.describe('Scenario 1: Complete E2E Flow (Admin User)', () => {
|
||||
test('should complete full flow: Admin login → View Reports → Analysis → Charts', async () => {
|
||||
test.setTimeout(120000)
|
||||
|
||||
// Step 1: Login as Admin
|
||||
await page.waitForSelector(
|
||||
'[data-testid="login-form"], input[name="username"], input[type="text"]',
|
||||
{
|
||||
state: 'visible',
|
||||
timeout: 10000
|
||||
}
|
||||
)
|
||||
|
||||
// Try to find and fill login form
|
||||
const usernameInput = page.locator('input[name="username"]').first()
|
||||
const passwordInput = page.locator('input[name="password"]').first()
|
||||
const loginButton = page.locator('button:has-text("登录")').first()
|
||||
|
||||
// Fill with admin credentials (adjust based on your test setup)
|
||||
await usernameInput.fill('Admin')
|
||||
await passwordInput.fill('admin123')
|
||||
await loginButton.click()
|
||||
|
||||
// Wait for navigation to CleanerPage
|
||||
await page.waitForTimeout(3000)
|
||||
|
||||
// Step 2: Click "View Reports" button
|
||||
const viewReportsButton = page
|
||||
.locator('button:has-text("查看报告"), button:has-text("报告")')
|
||||
.first()
|
||||
const hasReportsButton = await viewReportsButton.count()
|
||||
|
||||
if (hasReportsButton > 0) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
// Step 3: Wait for report list to load
|
||||
const reportListLoading = page.locator('.loading, [role="progressbar"]')
|
||||
const hasLoading = await reportListLoading.count()
|
||||
|
||||
if (hasLoading > 0) {
|
||||
await reportListLoading.first().waitFor({ state: 'hidden', timeout: 15000 })
|
||||
}
|
||||
|
||||
// Step 4: Click "Analyze Reports" button (Admin-only)
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")').first()
|
||||
const hasAnalyzeButton = await analyzeButton.count()
|
||||
|
||||
// Record evidence
|
||||
if (hasAnalyzeButton > 0) {
|
||||
await analyzeButton.click()
|
||||
await page.waitForTimeout(3000)
|
||||
|
||||
// Step 5: Wait for analysis dialog to open
|
||||
const analysisDialog = page.locator('text=报告分析')
|
||||
await expect(analysisDialog).toBeVisible({ timeout: 10000 })
|
||||
|
||||
// Step 6: Wait for charts to render
|
||||
const chartContainer = page.locator('.recharts-wrapper, [class*="recharts"]')
|
||||
const hasChart = await chartContainer.count()
|
||||
|
||||
// Step 7: Verify chart displays at least 3 data points
|
||||
if (hasChart > 0) {
|
||||
const dataPoints = page.locator('.recharts-dot, circle[class*="recharts"]')
|
||||
const dataPointCount = await dataPoints.count()
|
||||
|
||||
// Save evidence
|
||||
await page.screenshot({
|
||||
path: path.join(EVIDENCE_DIR, 'task-11-e2e-flow.png'),
|
||||
fullPage: false
|
||||
})
|
||||
|
||||
// Verify we have data points (at least 1 for basic test)
|
||||
expect(dataPointCount).toBeGreaterThanOrEqual(0)
|
||||
}
|
||||
|
||||
// Step 8: Toggle each filter checkbox
|
||||
const checkboxes = page.locator('[role="checkbox"], input[type="checkbox"]').filter({
|
||||
hasText:
|
||||
/处理订单数 | 删除物料数 | 跳过物料数 | 错误数量 | 重试订单数 | 成功重试数 | 执行耗时 | 操作用户/
|
||||
})
|
||||
const checkboxCount = await checkboxes.count()
|
||||
|
||||
// Verify all 8 checkboxes exist
|
||||
expect(checkboxCount).toBeGreaterThanOrEqual(1) // At least some filters exist
|
||||
|
||||
// Step 9: Verify chart updates when filters toggle
|
||||
if (checkboxCount > 0) {
|
||||
const firstCheckbox = checkboxes.first()
|
||||
await firstCheckbox.click()
|
||||
await page.waitForTimeout(500)
|
||||
|
||||
// Toggle back
|
||||
await firstCheckbox.click()
|
||||
await page.waitForTimeout(500)
|
||||
}
|
||||
|
||||
// Step 10: Hover to verify tooltip
|
||||
if (hasChart > 0) {
|
||||
const chartArea = page.locator('.recharts-wrapper').first()
|
||||
await chartArea.hover({ position: { x: 100, y: 100 } })
|
||||
await page.waitForTimeout(500)
|
||||
|
||||
// Check for tooltip
|
||||
const tooltip = page.locator('.recharts-tooltip, [class*="tooltip"]')
|
||||
const hasTooltip = await tooltip.count()
|
||||
|
||||
// Tooltip may or may not appear depending on data
|
||||
if (hasTooltip > 0) {
|
||||
await expect(tooltip.first()).toBeVisible()
|
||||
}
|
||||
}
|
||||
|
||||
// Step 11: Close analysis dialog
|
||||
const closeAnalysisButton = page
|
||||
.locator('button[aria-label*="关闭"], button:has-text("×")')
|
||||
.last()
|
||||
if (await closeAnalysisButton.count()) {
|
||||
await closeAnalysisButton.click()
|
||||
await page.waitForTimeout(500)
|
||||
}
|
||||
|
||||
// Step 12: Close report viewer
|
||||
const closeReportViewerButton = page.locator('button[aria-label*="关闭"]').first()
|
||||
if (await closeReportViewerButton.count()) {
|
||||
await closeReportViewerButton.click()
|
||||
await page.waitForTimeout(500)
|
||||
}
|
||||
} else {
|
||||
// No analyze button - might not have reports
|
||||
console.log('Analyze button not found - may not have test reports')
|
||||
}
|
||||
} else {
|
||||
console.log('View Reports button not found')
|
||||
}
|
||||
|
||||
// Test passes if we completed without errors
|
||||
expect(true).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 2: Admin Access Control', () => {
|
||||
test('should show analyze button for Admin users', async () => {
|
||||
// Assuming we're already logged in as Admin from previous test
|
||||
|
||||
// Open report viewer
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
// Verify analyze button exists for Admin
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")')
|
||||
const hasButton = await analyzeButton.count()
|
||||
|
||||
// Save evidence
|
||||
await page.screenshot({
|
||||
path: path.join(EVIDENCE_DIR, 'task-11-admin-sees-button.png')
|
||||
})
|
||||
|
||||
// Button should exist for Admin (may be 0 if no reports exist)
|
||||
console.log(`Admin sees analyze button: ${hasButton > 0}`)
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 3: Filter Functionality', () => {
|
||||
test('should have all 8 filter checkboxes', async () => {
|
||||
// Open report viewer if not already open
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
}
|
||||
|
||||
// Click analyze button
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")').first()
|
||||
if (await analyzeButton.count()) {
|
||||
await analyzeButton.click()
|
||||
await page.waitForTimeout(3000)
|
||||
|
||||
// Look for filter checkboxes with expected labels
|
||||
const expectedLabels = [
|
||||
'处理订单数',
|
||||
'删除物料数',
|
||||
'跳过物料数',
|
||||
'错误数量',
|
||||
'重试订单数',
|
||||
'成功重试数',
|
||||
'执行耗时'
|
||||
]
|
||||
|
||||
// Count visible checkboxes
|
||||
const checkboxes = page.locator('[role="checkbox"]').filter({ visible: true })
|
||||
const checkboxCount = await checkboxes.count()
|
||||
|
||||
// Verify we have filters (at least some)
|
||||
expect(checkboxCount).toBeGreaterThanOrEqual(1)
|
||||
|
||||
// Save evidence
|
||||
await page.screenshot({
|
||||
path: path.join(EVIDENCE_DIR, 'task-11-filter-checkboxes.png')
|
||||
})
|
||||
|
||||
// Close dialog
|
||||
const closeButton = page.locator('button[aria-label*="关闭"]').last()
|
||||
if (await closeButton.count()) {
|
||||
await closeButton.click()
|
||||
await page.waitForTimeout(500)
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 4: Loading State', () => {
|
||||
test('should show loading state while fetching data', async () => {
|
||||
// This test verifies loading state exists
|
||||
// Open report viewer
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
// Click analyze
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")').first()
|
||||
if (await analyzeButton.count()) {
|
||||
await analyzeButton.click()
|
||||
|
||||
// Loading state should appear briefly (or be already loaded)
|
||||
const loadingIndicator = page.locator('.loading, [role="progressbar"], .animate-spin')
|
||||
const hasLoading = await loadingIndicator.count()
|
||||
|
||||
console.log(`Loading indicator found: ${hasLoading > 0}`)
|
||||
|
||||
// Close dialog
|
||||
await page.waitForTimeout(2000)
|
||||
const closeButton = page.locator('button[aria-label*="关闭"]').last()
|
||||
if (await closeButton.count()) {
|
||||
await closeButton.click()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 5: Empty State', () => {
|
||||
test('should show empty state when no reports exist', async () => {
|
||||
// This would require setting up a test environment with no reports
|
||||
// For now, we verify the empty state UI exists in the component
|
||||
console.log('Empty state test - requires specific test setup')
|
||||
|
||||
// Open and check for empty state handling
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")').first()
|
||||
if (await analyzeButton.count()) {
|
||||
await analyzeButton.click()
|
||||
await page.waitForTimeout(3000)
|
||||
|
||||
// Check for empty state message
|
||||
const emptyState = page.locator('text=暂无报告数据, text=暂无数据')
|
||||
const hasEmptyState = await emptyState.count()
|
||||
|
||||
console.log(`Empty state shown: ${hasEmptyState > 0}`)
|
||||
|
||||
// Close
|
||||
const closeButton = page.locator('button[aria-label*="关闭"]').last()
|
||||
if (await closeButton.count()) {
|
||||
await closeButton.click()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 6: Error State with Retry', () => {
|
||||
test('should show error state with retry button', async () => {
|
||||
// This would require mocking a failed API call
|
||||
// For now, verify error UI exists
|
||||
console.log('Error state test - requires API mocking')
|
||||
|
||||
// Open dialog to verify retry button exists in component
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")').first()
|
||||
if (await analyzeButton.count()) {
|
||||
await analyzeButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
// Check for retry button (visible on error)
|
||||
const retryButton = page.locator('button:has-text("重试")')
|
||||
const hasRetryButton = await retryButton.count()
|
||||
|
||||
console.log(`Retry button exists in component: ${hasRetryButton > 0}`)
|
||||
|
||||
// Close
|
||||
const closeButton = page.locator('button[aria-label*="关闭"]').last()
|
||||
if (await closeButton.count()) {
|
||||
await closeButton.click()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 7: Data Accuracy Verification', () => {
|
||||
test('should verify chart data matches original reports', async () => {
|
||||
test.setTimeout(60000)
|
||||
|
||||
// This test requires known test data
|
||||
// For now, we'll verify data is displayed and record what we see
|
||||
|
||||
const evidenceFile = path.join(EVIDENCE_DIR, 'task-11-data-accuracy.txt')
|
||||
let evidenceContent = 'Report Analysis Data Accuracy Verification\n'
|
||||
evidenceContent += '============================================\n\n'
|
||||
evidenceContent += `Test Date: ${new Date().toISOString()}\n\n`
|
||||
|
||||
// Open report viewer
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
// Get first report if available
|
||||
const reportSelector = page.locator('[role="option"]').first()
|
||||
const hasReports = await reportSelector.count()
|
||||
|
||||
if (hasReports > 0) {
|
||||
evidenceContent += 'Available Reports:\n'
|
||||
|
||||
// List first few reports
|
||||
const reportCount = Math.min(hasReports, 5)
|
||||
for (let i = 0; i < reportCount; i++) {
|
||||
const reportName = await page.locator('[role="option"]').nth(i).textContent()
|
||||
evidenceContent += ` ${i + 1}. ${reportName?.trim()}\n`
|
||||
}
|
||||
|
||||
// Select first report
|
||||
await reportSelector.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
// Get report content
|
||||
const reportContent = await page.locator('.markdown-body').textContent()
|
||||
if (reportContent) {
|
||||
evidenceContent += '\n\nFirst Report Content (excerpt):\n'
|
||||
evidenceContent += reportContent.substring(0, 1000)
|
||||
evidenceContent += '\n...'
|
||||
}
|
||||
} else {
|
||||
evidenceContent += 'No reports available for comparison\n'
|
||||
}
|
||||
|
||||
// Close report viewer
|
||||
const closeButton = page.locator('button[aria-label*="关闭"]').first()
|
||||
if (await closeButton.count()) {
|
||||
await closeButton.click()
|
||||
await page.waitForTimeout(500)
|
||||
}
|
||||
}
|
||||
|
||||
// Save evidence
|
||||
fs.writeFileSync(evidenceFile, evidenceContent)
|
||||
console.log(`Data accuracy evidence saved to: ${evidenceFile}`)
|
||||
|
||||
// Test passes if we recorded data
|
||||
expect(fs.existsSync(evidenceFile)).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
test.describe('Scenario 8: Chart Rendering Verification', () => {
|
||||
test('should render chart with correct elements', async () => {
|
||||
// Open analysis dialog
|
||||
const viewReportsButton = page.locator('button:has-text("查看报告")').first()
|
||||
if (await viewReportsButton.count()) {
|
||||
await viewReportsButton.click()
|
||||
await page.waitForTimeout(2000)
|
||||
|
||||
const analyzeButton = page.locator('button:has-text("分析报告")').first()
|
||||
if (await analyzeButton.count()) {
|
||||
await analyzeButton.click()
|
||||
await page.waitForTimeout(3000)
|
||||
|
||||
// Verify chart elements exist
|
||||
const chartElements = {
|
||||
wrapper: await page.locator('.recharts-wrapper').count(),
|
||||
xAxis: await page.locator('.recharts-xaxis').count(),
|
||||
yAxis: await page.locator('.recharts-yaxis').count(),
|
||||
grid: await page.locator('.recharts-cartesian-grid').count(),
|
||||
tooltip: await page.locator('.recharts-tooltip-wrapper').count(),
|
||||
legend: await page.locator('.recharts-legend').count()
|
||||
}
|
||||
|
||||
console.log('Chart elements found:', chartElements)
|
||||
|
||||
// Save screenshot
|
||||
await page.screenshot({
|
||||
path: path.join(EVIDENCE_DIR, 'task-11-chart-rendering.png')
|
||||
})
|
||||
|
||||
// Close
|
||||
const closeButton = page.locator('button[aria-label*="关闭"]').last()
|
||||
if (await closeButton.count()) {
|
||||
await closeButton.click()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
BIN
tests/playwright/screenshot.png
Normal file
BIN
tests/playwright/screenshot.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
18
tests/playwright/verify_report_analysis.js
Normal file
18
tests/playwright/verify_report_analysis.js
Normal file
@@ -0,0 +1,18 @@
|
||||
const { _electron: electron } = require('playwright')
|
||||
|
||||
;(async () => {
|
||||
const electronApp = await electron.launch({
|
||||
args: ['.', '--no-sandbox', '--disable-gpu']
|
||||
})
|
||||
|
||||
// Get the first window that the app opens
|
||||
const window = await electronApp.firstWindow()
|
||||
|
||||
// Try to bypass auth and navigate to cleaner page if possible, but we don't know the exact DOM
|
||||
await window.waitForTimeout(5000)
|
||||
|
||||
await window.screenshot({ path: 'tests/playwright/screenshot.png' })
|
||||
console.log('Took screenshot')
|
||||
|
||||
await electronApp.close()
|
||||
})()
|
||||
@@ -1,313 +0,0 @@
|
||||
import { describe, it, expect } from 'vitest'
|
||||
import { ReportAnalyzer } from '../../src/main/services/report/report-analyzer'
|
||||
|
||||
describe('ReportAnalyzer', () => {
|
||||
const analyzer = new ReportAnalyzer()
|
||||
|
||||
describe('parseMarkdownReport', () => {
|
||||
it('should parse standard report with all fields', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`admin\` |
|
||||
| **处理订单数** | \`150\` |
|
||||
| **删除物料数** | \`45\` |
|
||||
| **跳过物料数** | \`30\` |
|
||||
| **错误数量** | \`2\` |
|
||||
| **重试订单数** | \`10\` |
|
||||
| **成功重试数** | \`8\` |
|
||||
| **执行耗时** | \`2 分 30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 08:30:45\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.date).toBe('2026-03-25')
|
||||
expect(result!.username).toBe('admin')
|
||||
expect(result!.ordersProcessed).toBe(150)
|
||||
expect(result!.materialsDeleted).toBe(45)
|
||||
expect(result!.materialsSkipped).toBe(30)
|
||||
expect(result!.errorCount).toBe(2)
|
||||
expect(result!.retriedOrders).toBe(10)
|
||||
expect(result!.successfulRetries).toBe(8)
|
||||
expect(result!.durationSeconds).toBe(150)
|
||||
})
|
||||
|
||||
it('should use defaults for missing fields', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`user1\` |
|
||||
| **处理订单数** | \`50\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.username).toBe('user1')
|
||||
expect(result!.ordersProcessed).toBe(50)
|
||||
expect(result!.materialsDeleted).toBe(0)
|
||||
expect(result!.materialsSkipped).toBe(0)
|
||||
expect(result!.errorCount).toBe(0)
|
||||
expect(result!.retriedOrders).toBe(0)
|
||||
expect(result!.successfulRetries).toBe(0)
|
||||
expect(result!.durationSeconds).toBe(0)
|
||||
})
|
||||
|
||||
it('should return null for malformed format', () => {
|
||||
const content = `This is not a valid report format
|
||||
Just some random text without proper structure
|
||||
No execution summary section here`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
expect(result).toBeNull()
|
||||
})
|
||||
|
||||
it('should return null for empty content', () => {
|
||||
expect(analyzer.parseMarkdownReport('')).toBeNull()
|
||||
expect(analyzer.parseMarkdownReport(' ')).toBeNull()
|
||||
})
|
||||
|
||||
it('should handle special characters in fields', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`admin@test.com\` |
|
||||
| **处理订单数** | \`100\` |
|
||||
| **删除物料数** | \`25\` |
|
||||
| **跳过物料数** | \`10\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`5\` |
|
||||
| **成功重试数** | \`5\` |
|
||||
| **执行耗时** | \`1 分\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.username).toBe('admin@test.com')
|
||||
expect(result!.durationSeconds).toBe(60)
|
||||
})
|
||||
|
||||
it('should extract date from content when execution time missing', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`20\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`30 秒\` |
|
||||
`
|
||||
|
||||
const result = analyzer.parseMarkdownReport(content)
|
||||
|
||||
expect(result).not.toBeNull()
|
||||
expect(result!.date).toMatch(/^\d{4}-\d{2}-\d{2}$/)
|
||||
})
|
||||
|
||||
it('should handle various duration formats', () => {
|
||||
// Test "2 分 30 秒"
|
||||
const content1 = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`2 分 30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`
|
||||
const result1 = analyzer.parseMarkdownReport(content1)
|
||||
expect(result1!.durationSeconds).toBe(150)
|
||||
|
||||
// Test "1 分"
|
||||
const content2 = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`1 分\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`
|
||||
const result2 = analyzer.parseMarkdownReport(content2)
|
||||
expect(result2!.durationSeconds).toBe(60)
|
||||
|
||||
// Test "30 秒" - use different time to avoid confusion
|
||||
const content3 = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 14:20:15\` |
|
||||
`
|
||||
const result3 = analyzer.parseMarkdownReport(content3)
|
||||
console.log(
|
||||
'Duration test - extracted duration:',
|
||||
result3?.durationSeconds,
|
||||
'content:',
|
||||
content3
|
||||
)
|
||||
expect(result3!.durationSeconds).toBe(30)
|
||||
})
|
||||
})
|
||||
|
||||
describe('analyzeReports', () => {
|
||||
it('should batch process multiple reports', () => {
|
||||
const reports = [
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`user1\` |
|
||||
| **处理订单数** | \`100\` |
|
||||
| **删除物料数** | \`20\` |
|
||||
| **跳过物料数** | \`10\` |
|
||||
| **错误数量** | \`1\` |
|
||||
| **重试订单数** | \`5\` |
|
||||
| **成功重试数** | \`4\` |
|
||||
| **执行耗时** | \`1 分\` |
|
||||
| **执行时间** | \`2026-03-25 08:00:00\` |
|
||||
`,
|
||||
filename: 'report-2026-03-25.md'
|
||||
},
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`user2\` |
|
||||
| **处理订单数** | \`200\` |
|
||||
| **删除物料数** | \`50\` |
|
||||
| **跳过物料数** | \`20\` |
|
||||
| **错误数量** | \`2\` |
|
||||
| **重试订单数** | \`10\` |
|
||||
| **成功重试数** | \`8\` |
|
||||
| **执行耗时** | \`2 分\` |
|
||||
| **执行时间** | \`2026-03-26 09:00:00\` |
|
||||
`,
|
||||
filename: 'report-2026-03-26.md'
|
||||
}
|
||||
]
|
||||
|
||||
const results = analyzer.analyzeReports(reports)
|
||||
|
||||
expect(results.length).toBe(2)
|
||||
expect(results[0].username).toBe('user1')
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
expect(results[1].username).toBe('user2')
|
||||
expect(results[1].date).toBe('2026-03-26')
|
||||
})
|
||||
|
||||
it('should skip invalid reports in batch', () => {
|
||||
const reports = [
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`valid\` |
|
||||
| **处理订单数** | \`50\` |
|
||||
| **删除物料数** | \`10\` |
|
||||
| **跳过物料数** | \`5\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`30 秒\` |
|
||||
| **执行时间** | \`2026-03-25 10:00:00\` |
|
||||
`,
|
||||
filename: 'valid-report.md'
|
||||
},
|
||||
{
|
||||
content: 'Invalid report content',
|
||||
filename: 'invalid-report.md'
|
||||
}
|
||||
]
|
||||
|
||||
const results = analyzer.analyzeReports(reports)
|
||||
|
||||
expect(results.length).toBe(1)
|
||||
expect(results[0].username).toBe('valid')
|
||||
})
|
||||
|
||||
it('should use filename date to override content date', () => {
|
||||
const reports = [
|
||||
{
|
||||
content: `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`30\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`20 秒\` |
|
||||
| **执行时间** | \`2026-03-20 10:00:00\` |
|
||||
`,
|
||||
filename: 'report-2026-03-25-08-30-45.md'
|
||||
}
|
||||
]
|
||||
|
||||
const results = analyzer.analyzeReports(reports)
|
||||
|
||||
expect(results.length).toBe(1)
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
})
|
||||
})
|
||||
|
||||
describe('date extraction', () => {
|
||||
it('should extract date from filename with ISO format', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`10 秒\` |
|
||||
| **执行时间** | \`2026-03-20 10:00:00\` |
|
||||
`
|
||||
|
||||
const report = {
|
||||
content,
|
||||
filename: 'cleaner-report-2026-03-25-08-30-45.md'
|
||||
}
|
||||
|
||||
const results = analyzer.analyzeReports([report])
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
})
|
||||
|
||||
it('should extract date from filename with YYYYMMDD format', () => {
|
||||
const content = `## 执行摘要
|
||||
|
||||
| **操作用户** | \`test\` |
|
||||
| **处理订单数** | \`10\` |
|
||||
| **删除物料数** | \`5\` |
|
||||
| **跳过物料数** | \`2\` |
|
||||
| **错误数量** | \`0\` |
|
||||
| **重试订单数** | \`0\` |
|
||||
| **成功重试数** | \`0\` |
|
||||
| **执行耗时** | \`10 秒\` |
|
||||
| **执行时间** | \`2026-03-20 10:00:00\` |
|
||||
`
|
||||
|
||||
const report = {
|
||||
content,
|
||||
filename: 'report-20260325-100000.md'
|
||||
}
|
||||
|
||||
const results = analyzer.analyzeReports([report])
|
||||
expect(results[0].date).toBe('2026-03-25')
|
||||
})
|
||||
})
|
||||
})
|
||||
@@ -5,7 +5,7 @@ export default defineConfig({
|
||||
test: {
|
||||
globals: true,
|
||||
environment: 'node',
|
||||
include: ['tests/**/*.{test,spec}.{ts,tsx}', 'src/**/__tests__/**/*.{test,spec}.{ts,tsx}'],
|
||||
include: ['tests/**/*.{test,spec}.{ts,tsx}'],
|
||||
exclude: ['node_modules', 'dist', 'out', 'tests/e2e'],
|
||||
setupFiles: ['tests/setup.ts'],
|
||||
coverage: {
|
||||
|
||||
Reference in New Issue
Block a user