feat(desktop): ✨ 实现一些功能
1. 实现任务暂停功能 2. 实现页面的国际化功能 3.优化项目的结构以及BUG 4. 优化系统架构 5. 实现一大堆的功能
This commit is contained in:
175
.trae/documents/plan_20260124_170009.md
Normal file
175
.trae/documents/plan_20260124_170009.md
Normal file
@@ -0,0 +1,175 @@
|
||||
# i18n集成和语言配置功能实现计划
|
||||
|
||||
## 1. 依赖安装
|
||||
|
||||
| 任务ID | 任务名称 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|----------|
|
||||
| I18N-001 | 安装Vue I18n依赖 | Vue I18n | 使用pnpm安装Vue I18n库 |
|
||||
|
||||
## 2. 配置服务扩展
|
||||
|
||||
| 任务ID | 任务名称 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|----------|
|
||||
| I18N-002 | 更新配置类型定义 | TypeScript | 在IConfig.ts中添加语言配置类型 |
|
||||
| I18N-003 | 扩展配置服务 | TypeScript | 在ConfigService中添加语言配置的读写方法 |
|
||||
|
||||
## 3. i18n配置实现
|
||||
|
||||
| 任务ID | 任务名称 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|----------|
|
||||
| I18N-004 | 创建i18n配置文件 | Vue I18n | 创建i18n配置文件和初始化逻辑 |
|
||||
| I18N-005 | 创建语言包 | JSON | 创建中英文语言包文件 |
|
||||
| I18N-006 | 集成i18n到Vue应用 | Vue 3 | 在main.ts中注册i18n插件 |
|
||||
|
||||
## 4. 语言设置页面实现
|
||||
|
||||
| 任务ID | 任务名称 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|----------|
|
||||
| I18N-007 | 添加语言设置组件 | Vue 3 | 在setting页面添加语言选择组件 |
|
||||
| I18N-008 | 实现语言切换逻辑 | Vue 3 | 实现语言切换功能和配置保存 |
|
||||
|
||||
## 5. 前端页面i18n集成
|
||||
|
||||
| 任务ID | 任务名称 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|----------|
|
||||
| I18N-009 | 翻译任务管理页面 | Vue I18n | 将任务管理页面的文本替换为i18n翻译 |
|
||||
| I18N-010 | 翻译阅读心得页面 | Vue I18n | 将阅读心得页面的文本替换为i18n翻译 |
|
||||
| I18N-011 | 翻译设置页面 | Vue I18n | 将设置页面的文本替换为i18n翻译 |
|
||||
| I18N-012 | 翻译其他页面 | Vue I18n | 将其他页面的文本替换为i18n翻译 |
|
||||
|
||||
## 6. 测试和优化
|
||||
|
||||
| 任务ID | 任务名称 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|----------|
|
||||
| I18N-013 | 测试语言切换功能 | Vue I18n | 测试语言切换是否正常工作 |
|
||||
| I18N-014 | 测试配置持久化 | Electron Store | 测试语言配置是否持久化保存 |
|
||||
| I18N-015 | 优化i18n性能 | Vue I18n | 优化i18n加载性能和使用体验 |
|
||||
|
||||
## 技术实现细节
|
||||
|
||||
### 1. 配置服务扩展
|
||||
|
||||
1. **更新IConfig.ts**:
|
||||
- 添加语言配置类型定义
|
||||
- 添加语言配置Schema验证
|
||||
|
||||
2. **扩展ConfigService**:
|
||||
- 添加LANGUAGE_KEY常量
|
||||
- 添加getLanguageConfig方法
|
||||
- 添加saveLanguageConfig方法
|
||||
- 在schema中添加语言配置定义
|
||||
|
||||
### 2. i18n配置实现
|
||||
|
||||
1. **创建i18n配置文件**:
|
||||
```typescript
|
||||
// src/renderer/plugins/i18n.ts
|
||||
import { createI18n } from 'vue-i18n'
|
||||
import zh from '@renderer/locales/zh.json'
|
||||
import en from '@renderer/locales/en.json'
|
||||
|
||||
const i18n = createI18n({
|
||||
legacy: false,
|
||||
locale: 'zh',
|
||||
messages: {
|
||||
zh,
|
||||
en
|
||||
}
|
||||
})
|
||||
|
||||
export default i18n
|
||||
```
|
||||
|
||||
2. **创建语言包**:
|
||||
- src/renderer/locales/zh.json(中文语言包)
|
||||
- src/renderer/locales/en.json(英文语言包)
|
||||
|
||||
3. **集成到Vue应用**:
|
||||
```typescript
|
||||
// src/renderer/main.ts
|
||||
import i18n from '@renderer/plugins/i18n'
|
||||
|
||||
app.use(i18n)
|
||||
```
|
||||
|
||||
### 3. 语言设置页面实现
|
||||
|
||||
1. **添加语言设置组件**:
|
||||
```vue
|
||||
<!-- src/renderer/src/pages/setting/components/LanguageSetting.vue -->
|
||||
<template>
|
||||
<div class="language-setting">
|
||||
<h3>语言设置</h3>
|
||||
<a-radio-group v-model="selectedLanguage" @change="handleLanguageChange">
|
||||
<a-radio value="zh">中文</a-radio>
|
||||
<a-radio value="en">English</a-radio>
|
||||
</a-radio-group>
|
||||
</div>
|
||||
</template>
|
||||
```
|
||||
|
||||
2. **实现语言切换逻辑**:
|
||||
```typescript
|
||||
// src/renderer/src/pages/setting/components/LanguageSetting.vue
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { trpc } from '@renderer/lib/trpc'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
const { locale } = useI18n()
|
||||
const selectedLanguage = ref('zh')
|
||||
|
||||
onMounted(async () => {
|
||||
// 从配置中获取当前语言
|
||||
const languageConfig = await trpc.config.getLanguageConfig.query()
|
||||
selectedLanguage.value = languageConfig?.language || 'zh'
|
||||
locale.value = selectedLanguage.value
|
||||
})
|
||||
|
||||
const handleLanguageChange = async () => {
|
||||
// 更新i18n语言
|
||||
locale.value = selectedLanguage.value
|
||||
// 保存到配置
|
||||
await trpc.config.saveLanguageConfig.mutate({ language: selectedLanguage.value })
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
### 4. 前端页面i18n集成
|
||||
|
||||
1. **在组件中使用i18n**:
|
||||
```vue
|
||||
<template>
|
||||
<div>{{ t('common.title') }}</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
const { t } = useI18n()
|
||||
</script>
|
||||
```
|
||||
|
||||
2. **批量替换文本**:
|
||||
- 逐个页面替换硬编码文本为i18n翻译
|
||||
- 确保所有动态文本都能正确翻译
|
||||
- 添加必要的语言包条目
|
||||
|
||||
## 预期效果
|
||||
|
||||
1. **语言切换功能**:用户可以在设置页面切换中文和英文
|
||||
2. **配置持久化**:语言设置会保存到electron-store中,应用重启后保持不变
|
||||
3. **全页面翻译**:所有前端页面的文本都会根据当前语言显示对应的翻译
|
||||
4. **平滑切换**:语言切换时页面会实时更新,无需刷新
|
||||
|
||||
## 技术栈
|
||||
|
||||
- Vue 3
|
||||
- Vue I18n
|
||||
- TypeScript
|
||||
- Electron Store
|
||||
- tRPC
|
||||
|
||||
## 实现时间
|
||||
|
||||
计划在1-2小时内完成所有任务,包括依赖安装、配置扩展、i18n集成和页面翻译。
|
||||
183
.trae/documents/plan_20260124_172544.md
Normal file
183
.trae/documents/plan_20260124_172544.md
Normal file
@@ -0,0 +1,183 @@
|
||||
# 任务暂停功能实现计划
|
||||
|
||||
## 1. 实现顺序
|
||||
|
||||
按照Task.md中的优先级顺序,我将按以下步骤实现任务暂停功能:
|
||||
|
||||
### 1.1 数据库模型扩展 (PAUSE-001)
|
||||
- 检查ReadingReflectionTaskBatch实体当前定义
|
||||
- 添加isPaused和pausedAt字段
|
||||
- 运行数据库迁移
|
||||
|
||||
### 1.2 实现暂停/恢复API (PAUSE-002)
|
||||
- 在task.router.ts中添加pauseBatch和resumeBatch方法
|
||||
- 实现暂停和恢复任务的业务逻辑
|
||||
|
||||
### 1.3 任务执行器改进 (PAUSE-003)
|
||||
- 在TaskExecutor中添加任务状态检查
|
||||
- 实现任务执行的中断和恢复机制
|
||||
- 确保任务执行过程中能响应暂停命令
|
||||
|
||||
### 1.4 前端暂停按钮功能 (PAUSE-004)
|
||||
- 为暂停按钮添加点击事件处理
|
||||
- 实现暂停/恢复状态的切换逻辑
|
||||
- 调用后端API实现暂停和恢复操作
|
||||
|
||||
### 1.5 暂停状态视觉反馈 (PAUSE-005)
|
||||
- 添加暂停状态的视觉提示
|
||||
- 实现按钮样式和文字的动态变化
|
||||
- 显示暂停原因和预计恢复时间
|
||||
|
||||
### 1.6 任务队列管理 (PAUSE-006)
|
||||
- 实现任务队列管理系统
|
||||
- 支持暂停/恢复整个队列
|
||||
- 处理队列中任务的状态管理
|
||||
|
||||
### 1.7 持久化暂停状态 (PAUSE-007)
|
||||
- 确保暂停状态能持久化保存
|
||||
- 应用重启后恢复暂停状态
|
||||
- 处理断电等异常情况
|
||||
|
||||
## 2. 技术实现细节
|
||||
|
||||
### 2.1 数据库模型扩展
|
||||
|
||||
```typescript
|
||||
// src/main/db/entities/ReadingReflectionTaskBatch.ts
|
||||
@Entity('reading_reflection_task_batches')
|
||||
export class ReadingReflectionTaskBatch {
|
||||
// 现有字段...
|
||||
|
||||
@Column({ type: 'boolean', default: false })
|
||||
isPaused!: boolean
|
||||
|
||||
@CreateDateColumn({ type: 'datetime', nullable: true })
|
||||
pausedAt!: Date | null
|
||||
}
|
||||
```
|
||||
|
||||
### 2.2 实现暂停/恢复API
|
||||
|
||||
```typescript
|
||||
// src/rpc/router/task.router.ts
|
||||
export const taskRouter = router({
|
||||
// 现有方法...
|
||||
|
||||
/**
|
||||
* 暂停任务批次
|
||||
*/
|
||||
pauseBatch: publicProcedure
|
||||
.input(z.object({ batchId: z.string() }))
|
||||
.mutation(async ({ input }) => {
|
||||
// 暂停任务逻辑
|
||||
}),
|
||||
|
||||
/**
|
||||
* 恢复任务批次
|
||||
*/
|
||||
resumeBatch: publicProcedure
|
||||
.input(z.object({ batchId: z.string() }))
|
||||
.mutation(async ({ input }) => {
|
||||
// 恢复任务逻辑
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
### 2.3 任务执行器改进
|
||||
|
||||
```typescript
|
||||
// src/main/manager/taskExecutor.ts
|
||||
export class TaskExecutor {
|
||||
// 现有方法...
|
||||
|
||||
private async checkPauseStatus(taskId: string): Promise<boolean> {
|
||||
// 检查任务是否被暂停
|
||||
}
|
||||
|
||||
private async executeSubTask(taskId: string, subTaskId: string, task: any, index: number, total: number): Promise<void> {
|
||||
// 执行子任务,定期检查暂停状态
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### 2.4 前端暂停按钮功能
|
||||
|
||||
```vue
|
||||
<!-- src/renderer/src/pages/task/index.vue -->
|
||||
<template>
|
||||
<a-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
@click="handlePauseResume"
|
||||
>
|
||||
<template #icon>
|
||||
<pause v-if="!isPaused" theme="outline" size="12" />
|
||||
<play v-else theme="outline" size="12" />
|
||||
</template>
|
||||
{{ isPaused ? '恢复队列' : '暂停队列' }}
|
||||
</a-button>
|
||||
</template>
|
||||
```
|
||||
|
||||
## 3. 预期效果
|
||||
|
||||
1. **暂停功能**:用户可以通过暂停按钮暂停正在执行的任务
|
||||
2. **恢复功能**:用户可以恢复被暂停的任务
|
||||
3. **状态反馈**:界面会显示当前任务的暂停状态
|
||||
4. **持久化**:任务暂停状态会被持久化保存
|
||||
5. **队列管理**:支持暂停/恢复整个任务队列
|
||||
|
||||
## 4. 测试计划
|
||||
|
||||
1. **功能测试**:
|
||||
- 验证暂停按钮能正常触发暂停操作
|
||||
- 验证恢复按钮能正常恢复任务
|
||||
- 验证暂停状态能正确显示
|
||||
|
||||
2. **边界测试**:
|
||||
- 测试同时暂停多个任务
|
||||
- 测试应用重启后暂停状态是否保持
|
||||
- 测试暂停状态下的任务进度更新
|
||||
|
||||
3. **性能测试**:
|
||||
- 测试大量任务时的暂停/恢复响应时间
|
||||
- 验证暂停状态下的系统资源占用
|
||||
|
||||
## 5. 风险评估
|
||||
|
||||
1. **任务中断风险**:任务执行过程中中断可能导致数据不一致
|
||||
2. **性能影响**:频繁检查暂停状态可能影响性能
|
||||
3. **并发冲突**:多个任务同时暂停/恢复可能导致冲突
|
||||
4. **持久化失败**:断电等异常情况可能导致暂停状态丢失
|
||||
|
||||
## 6. 解决方案
|
||||
|
||||
1. **任务中断处理**:实现事务机制,确保任务中断时数据一致性
|
||||
2. **性能优化**:合理设置暂停状态检查频率,避免频繁查询数据库
|
||||
3. **并发控制**:使用锁机制确保任务状态更新的原子性
|
||||
4. **持久化保障**:使用事务确保暂停状态能可靠保存
|
||||
|
||||
## 7. 代码规范
|
||||
|
||||
- 遵循项目现有的代码风格和命名规范
|
||||
- 确保类型安全,使用TypeScript严格模式
|
||||
- 添加必要的注释和文档
|
||||
- 编写单元测试确保功能正确性
|
||||
|
||||
## 8. 交付标准
|
||||
|
||||
1. 所有暂停功能按优先级实现完成
|
||||
2. 代码通过TypeScript类型检查
|
||||
3. 没有语法错误和运行时错误
|
||||
4. 功能测试通过
|
||||
5. 代码符合项目的质量标准
|
||||
|
||||
## 9. 后续优化
|
||||
|
||||
1. 添加任务暂停的原因记录
|
||||
2. 实现自动恢复功能
|
||||
3. 支持基于时间的暂停计划
|
||||
4. 添加暂停状态的日志记录
|
||||
5. 优化暂停状态的查询性能
|
||||
|
||||
现在我将按照这个计划开始实现任务暂停功能,首先检查数据库模型。
|
||||
380
.trae/documents/优化任务列表和添加技术文档.md
Normal file
380
.trae/documents/优化任务列表和添加技术文档.md
Normal file
@@ -0,0 +1,380 @@
|
||||
# 优化任务列表和技术实现文档
|
||||
|
||||
## 1. 任务列表优化
|
||||
|
||||
### 1.1 国际化支持优化
|
||||
|
||||
| 任务ID | 任务名称 | 优先级 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|--------|----------|
|
||||
| I18N-001 | 选择并集成i18n库 | P1 | Vue I18n | 选择合适的i18n库并集成到项目中,配置基本的国际化环境 |
|
||||
| I18N-002 | 提取前端文本资源 | P1 | Vue I18n | 将所有前端组件中的硬编码文本提取到国际化资源文件中 |
|
||||
| I18N-003 | 实现语言切换功能 | P2 | Vue I18n | 添加语言切换组件,支持中英文切换 |
|
||||
| I18N-004 | 优化i18n性能 | P3 | Vue I18n | 实现按需加载语言包,优化国际化性能 |
|
||||
|
||||
### 1.2 暂停功能优化
|
||||
|
||||
| 任务ID | 任务名称 | 优先级 | 技术栈 | 详细描述 |
|
||||
|--------|----------|--------|--------|----------|
|
||||
| PAUSE-001 | 数据库模型扩展 | P0 | TypeORM | 为ReadingReflectionTaskBatch添加isPaused和pausedAt字段 |
|
||||
| PAUSE-002 | 实现暂停/恢复API | P0 | tRPC | 添加暂停和恢复任务的RPC方法 |
|
||||
| PAUSE-003 | 任务执行器改进 | P0 | TypeScript | 在TaskExecutor中实现任务状态检查和暂停逻辑 |
|
||||
| PAUSE-004 | 前端暂停按钮功能 | P0 | Vue 3 | 为暂停按钮添加点击事件和状态切换逻辑 |
|
||||
| PAUSE-005 | 暂停状态视觉反馈 | P1 | Vue 3 | 添加暂停状态的视觉提示,包括按钮样式变化和状态文字 |
|
||||
| PAUSE-006 | 任务队列管理 | P1 | TypeScript | 实现任务队列管理,支持暂停/恢复整个队列 |
|
||||
| PAUSE-007 | 持久化暂停状态 | P2 | TypeORM | 确保任务暂停状态在应用重启后保持 |
|
||||
|
||||
## 2. 技术实现文档
|
||||
|
||||
### 2.1 国际化支持实现指南
|
||||
|
||||
#### 2.1.1 集成Vue I18n
|
||||
|
||||
1. **安装依赖**
|
||||
```bash
|
||||
npm install vue-i18n@next
|
||||
```
|
||||
|
||||
2. **创建i18n配置文件**
|
||||
```typescript
|
||||
// src/renderer/plugins/i18n.ts
|
||||
import { createI18n } from 'vue-i18n'
|
||||
import zh from '@renderer/locales/zh.json'
|
||||
import en from '@renderer/locales/en.json'
|
||||
|
||||
const i18n = createI18n({
|
||||
legacy: false,
|
||||
locale: 'zh',
|
||||
messages: {
|
||||
zh,
|
||||
en
|
||||
}
|
||||
})
|
||||
|
||||
export default i18n
|
||||
```
|
||||
|
||||
3. **在main.ts中注册**
|
||||
```typescript
|
||||
// src/renderer/main.ts
|
||||
import i18n from '@renderer/plugins/i18n'
|
||||
|
||||
app.use(i18n)
|
||||
```
|
||||
|
||||
#### 2.1.2 提取文本资源
|
||||
|
||||
1. **创建语言包文件**
|
||||
```json
|
||||
// src/renderer/locales/zh.json
|
||||
{
|
||||
"task": {
|
||||
"title": "任务管理",
|
||||
"status": {
|
||||
"pending": "任务排队中",
|
||||
"writing": "运行中",
|
||||
"completed": "任务完成",
|
||||
"failed": "任务失败"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
2. **在组件中使用**
|
||||
```vue
|
||||
<template>
|
||||
<div>{{ t('task.title') }}</div>
|
||||
<div>{{ t(`task.status.${task.status}`) }}</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useI18n } from 'vue-i18n'
|
||||
|
||||
const { t } = useI18n()
|
||||
</script>
|
||||
```
|
||||
|
||||
### 2.2 暂停功能实现指南
|
||||
|
||||
#### 2.2.1 数据库模型扩展
|
||||
|
||||
1. **修改实体类**
|
||||
```typescript
|
||||
// src/main/db/entities/ReadingReflectionTaskBatch.ts
|
||||
import { Column, CreateDateColumn, Entity, OneToMany, PrimaryColumn } from 'typeorm'
|
||||
|
||||
@Entity('reading_reflection_task_batches')
|
||||
export class ReadingReflectionTaskBatch {
|
||||
// 现有字段...
|
||||
|
||||
@Column({ type: 'boolean', default: false })
|
||||
isPaused!: boolean
|
||||
|
||||
@CreateDateColumn({ type: 'datetime', nullable: true })
|
||||
pausedAt!: Date | null
|
||||
}
|
||||
```
|
||||
|
||||
2. **运行数据库迁移**
|
||||
```bash
|
||||
npm run typeorm migration:generate -- -n AddPauseFields
|
||||
npm run typeorm migration:run
|
||||
```
|
||||
|
||||
#### 2.2.2 实现暂停/恢复API
|
||||
|
||||
1. **添加RPC方法**
|
||||
```typescript
|
||||
// src/rpc/router/task.router.ts
|
||||
export const taskRouter = router({
|
||||
// 现有方法...
|
||||
|
||||
/**
|
||||
* 暂停任务批次
|
||||
*/
|
||||
pauseBatch: publicProcedure
|
||||
.input(z.object({ batchId: z.string() }))
|
||||
.mutation(async ({ input }) => {
|
||||
const batchRepo = AppDataSource.getRepository(ReadingReflectionTaskBatch)
|
||||
await batchRepo.update(input.batchId, {
|
||||
isPaused: true,
|
||||
pausedAt: new Date()
|
||||
})
|
||||
return { success: true }
|
||||
}),
|
||||
|
||||
/**
|
||||
* 恢复任务批次
|
||||
*/
|
||||
resumeBatch: publicProcedure
|
||||
.input(z.object({ batchId: z.string() }))
|
||||
.mutation(async ({ input }) => {
|
||||
const batchRepo = AppDataSource.getRepository(ReadingReflectionTaskBatch)
|
||||
await batchRepo.update(input.batchId, {
|
||||
isPaused: false,
|
||||
pausedAt: null
|
||||
})
|
||||
return { success: true }
|
||||
})
|
||||
})
|
||||
```
|
||||
|
||||
#### 2.2.3 任务执行器改进
|
||||
|
||||
1. **添加暂停检查逻辑**
|
||||
```typescript
|
||||
// src/main/manager/taskExecutor.ts
|
||||
export class TaskExecutor {
|
||||
// 现有方法...
|
||||
|
||||
private async checkPauseStatus(taskId: string): Promise<boolean> {
|
||||
const batch = await this.batchRepo.findOne({ where: { id: taskId } })
|
||||
return batch?.isPaused || false
|
||||
}
|
||||
|
||||
private async executeSubTask(taskId: string, subTaskId: string, task: any, index: number, total: number): Promise<void> {
|
||||
// 现有代码...
|
||||
|
||||
for await (const chunk of stream) {
|
||||
// 检查暂停状态
|
||||
if (await this.checkPauseStatus(taskId)) {
|
||||
await this.itemRepo.update(subTaskId, {
|
||||
status: 'PAUSED'
|
||||
})
|
||||
await this.taskStatusManager.updateBatchStatus(taskId)
|
||||
return // 退出执行
|
||||
}
|
||||
|
||||
// 现有处理逻辑...
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### 2.2.4 前端暂停按钮功能
|
||||
|
||||
1. **添加按钮点击事件**
|
||||
```vue
|
||||
<!-- src/renderer/src/pages/task/index.vue -->
|
||||
<template>
|
||||
<a-button
|
||||
size="mini"
|
||||
type="primary"
|
||||
class="bg-[#7816ff] border-none shadow-sm shadow-purple-200"
|
||||
@click="handlePauseResume"
|
||||
>
|
||||
<template #icon>
|
||||
<pause v-if="!isPaused" theme="outline" size="12" />
|
||||
<play v-else theme="outline" size="12" />
|
||||
</template>
|
||||
{{ isPaused ? '恢复队列' : '暂停队列' }}
|
||||
</a-button>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Pause, Play } from '@icon-park/vue-next'
|
||||
import { ref, computed } from 'vue'
|
||||
import { trpc } from '@renderer/lib/trpc'
|
||||
|
||||
const activeTaskId = computed(() => getQuery('id') as string)
|
||||
const isPaused = ref(false)
|
||||
|
||||
// 监听任务状态
|
||||
const batchSub = trpc.task.onBatchProgressUpdate.subscribe(undefined, {
|
||||
onData(data) {
|
||||
if (data.batchId === activeTaskId.value) {
|
||||
// 更新暂停状态
|
||||
isPaused.value = data.isPaused || false
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const handlePauseResume = async () => {
|
||||
try {
|
||||
if (isPaused.value) {
|
||||
await trpc.task.resumeBatch.mutate({ batchId: activeTaskId.value })
|
||||
} else {
|
||||
await trpc.task.pauseBatch.mutate({ batchId: activeTaskId.value })
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('暂停/恢复失败:', err)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
```
|
||||
|
||||
## 3. 学习资源
|
||||
|
||||
### 3.1 国际化支持学习
|
||||
|
||||
1. **Vue I18n官方文档**
|
||||
- 地址:https://vue-i18n.intlify.dev/
|
||||
- 内容:详细的API文档和使用示例
|
||||
|
||||
2. **国际化最佳实践**
|
||||
- 地址:https://www.smashingmagazine.com/2018/09/internationalization-vue-apps/)
|
||||
- 内容:国际化的设计原则和最佳实践
|
||||
|
||||
### 3.2 暂停功能学习
|
||||
|
||||
1. **TypeORM官方文档**
|
||||
- 地址:https://typeorm.io/
|
||||
- 内容:数据库模型设计和迁移
|
||||
|
||||
2. **tRPC官方文档**
|
||||
- 地址:https://trpc.io/
|
||||
- 内容:API设计和实现
|
||||
|
||||
3. **任务队列管理**
|
||||
- 地址:https://www.alexdebrie.com/posts/nodejs-task-queues/)
|
||||
- 内容:任务队列的设计和实现
|
||||
|
||||
## 4. 测试指南
|
||||
|
||||
### 4.1 国际化支持测试
|
||||
|
||||
1. **功能测试**
|
||||
- 验证所有文本都能正确显示
|
||||
- 验证语言切换功能正常
|
||||
- 验证动态文本(如任务状态)能正确翻译
|
||||
|
||||
2. **性能测试**
|
||||
- 检查语言切换时的页面响应时间
|
||||
- 验证语言包加载性能
|
||||
|
||||
### 4.2 暂停功能测试
|
||||
|
||||
1. **功能测试**
|
||||
- 验证暂停按钮能正常触发暂停操作
|
||||
- 验证恢复按钮能正常恢复任务
|
||||
- 验证暂停状态能正确持久化
|
||||
- 验证任务执行过程中能被暂停
|
||||
|
||||
2. **边界测试**
|
||||
- 测试同时暂停多个任务
|
||||
- 测试应用重启后暂停状态是否保持
|
||||
- 测试暂停状态下的任务进度更新
|
||||
|
||||
3. **性能测试**
|
||||
- 测试大量任务时的暂停/恢复响应时间
|
||||
- 验证暂停状态下的系统资源占用
|
||||
|
||||
## 5. 部署指南
|
||||
|
||||
### 5.1 国际化支持部署
|
||||
|
||||
1. **构建生产版本**
|
||||
```bash
|
||||
npm run build:renderer
|
||||
```
|
||||
|
||||
2. **验证构建产物**
|
||||
- 检查语言包是否正确包含在构建产物中
|
||||
- 验证国际化功能在生产环境中正常工作
|
||||
|
||||
### 5.2 暂停功能部署
|
||||
|
||||
1. **数据库迁移**
|
||||
- 在生产环境运行数据库迁移
|
||||
- 验证数据库字段添加成功
|
||||
|
||||
2. **部署应用**
|
||||
```bash
|
||||
npm run build:main
|
||||
npm run build:renderer
|
||||
npm run package
|
||||
```
|
||||
|
||||
3. **验证部署**
|
||||
- 验证暂停/恢复功能在生产环境中正常工作
|
||||
- 监控系统性能和稳定性
|
||||
|
||||
## 6. 维护指南
|
||||
|
||||
### 6.1 国际化支持维护
|
||||
|
||||
1. **添加新语言**
|
||||
- 复制现有语言包文件
|
||||
- 翻译所有文本
|
||||
- 在i18n配置中添加新语言
|
||||
|
||||
2. **更新文本**
|
||||
- 修改对应语言包中的文本
|
||||
- 重新构建应用
|
||||
|
||||
### 6.2 暂停功能维护
|
||||
|
||||
1. **监控暂停状态**
|
||||
- 添加暂停状态的日志记录
|
||||
- 监控长时间暂停的任务
|
||||
|
||||
2. **优化暂停逻辑**
|
||||
- 根据实际使用情况调整暂停检查频率
|
||||
- 优化暂停状态的数据库查询性能
|
||||
|
||||
3. **添加新功能**
|
||||
- 支持批量暂停/恢复
|
||||
- 添加暂停原因记录
|
||||
- 实现自动恢复功能
|
||||
|
||||
## 7. 总结
|
||||
|
||||
通过本技术文档,您可以学习到:
|
||||
|
||||
1. **国际化支持的完整实现流程**
|
||||
- 从库的选择到最终部署
|
||||
- 最佳实践和性能优化
|
||||
|
||||
2. **暂停功能的设计和实现**
|
||||
- 数据库模型扩展
|
||||
- API设计和实现
|
||||
- 前端交互逻辑
|
||||
- 任务执行器改进
|
||||
|
||||
3. **完整的技术文档编写规范**
|
||||
- 任务列表优化
|
||||
- 实现指南
|
||||
- 学习资源
|
||||
- 测试指南
|
||||
- 部署和维护指南
|
||||
|
||||
希望本技术文档能够帮助您学习和掌握相关技术,顺利完成项目优化任务。
|
||||
98
.trae/documents/项目优化计划.md
Normal file
98
.trae/documents/项目优化计划.md
Normal file
@@ -0,0 +1,98 @@
|
||||
# 项目优化计划
|
||||
|
||||
根据 `d:\working\tools\read_book\Task.md` 文件中的优化建议,我将按照以下计划逐步优化项目:
|
||||
|
||||
## 1. 代码结构与组织优化
|
||||
|
||||
### 1.1 目录结构优化(进行中)
|
||||
- ✅ 创建了 `src/main/services/ai/core` 和 `src/main/services/ai/utils` 目录
|
||||
- ✅ 将 `llmService.ts` 移动到了 `core` 目录中
|
||||
- ✅ 更新了相关文件的导入路径
|
||||
|
||||
### 1.2 模块拆分
|
||||
- **目标**:将 `readingReflectionsTaskManager.ts` 拆分为多个小类
|
||||
- **实施步骤**:
|
||||
- 创建 `NotificationService` 类,负责处理通知逻辑
|
||||
- 创建 `TaskStatusManager` 类,负责管理任务状态
|
||||
- 创建 `TaskExecutor` 类,负责执行任务
|
||||
- 重构 `TaskManager` 类,使其成为协调器
|
||||
|
||||
## 2. 错误处理改进
|
||||
|
||||
### 2.1 实现完善的错误处理机制
|
||||
- **目标**:改进当前简单的错误处理方式
|
||||
- **实施步骤**:
|
||||
- 创建自定义错误类,如 `DatabaseError`、`AIError` 等
|
||||
- 实现统一的错误处理中间件
|
||||
- 添加详细的日志记录
|
||||
- 为关键操作添加重试机制
|
||||
|
||||
## 3. 数据库操作优化
|
||||
|
||||
### 3.1 使用批量更新和批量查询
|
||||
- **目标**:减少数据库交互次数,提高性能
|
||||
- **实施步骤**:
|
||||
- 优化 `updateBatchStatus` 方法,使用聚合查询替代多次查询
|
||||
- 实现批量更新任务状态的功能
|
||||
- 优化 `startBatchTask` 方法中的数据库操作
|
||||
|
||||
### 3.2 添加数据库索引
|
||||
- **目标**:提高查询性能
|
||||
- **实施步骤**:
|
||||
- 为 `ReadingReflectionTaskItem` 的 `batchId` 字段添加索引
|
||||
- 为常用查询字段添加索引
|
||||
|
||||
## 4. 异步操作优化
|
||||
|
||||
### 4.1 改进并发控制策略
|
||||
- **目标**:提高异步操作的效率和可靠性
|
||||
- **实施步骤**:
|
||||
- 实现动态调整并发数的机制
|
||||
- 改进 `startBatchTask` 方法中的并发处理
|
||||
- 优化异步流处理逻辑
|
||||
|
||||
## 5. 安全性增强
|
||||
|
||||
### 5.1 改进数据加密方式
|
||||
- **目标**:提高数据安全性
|
||||
- **实施步骤**:
|
||||
- 改进 `electron-store` 的加密方式
|
||||
- 实现更安全的密钥管理策略
|
||||
|
||||
### 5.2 实现严格的输入验证
|
||||
- **目标**:防止恶意输入和安全漏洞
|
||||
- **实施步骤**:
|
||||
- 使用 Zod 库实现严格的输入验证
|
||||
- 为所有外部输入添加验证逻辑
|
||||
- 实现 API 调用的验证机制
|
||||
|
||||
## 6. 功能改进
|
||||
|
||||
### 6.1 实现配置管理系统
|
||||
- **目标**:提高配置的灵活性和可维护性
|
||||
- **实施步骤**:
|
||||
- 实现配置管理服务
|
||||
- 支持不同环境的配置
|
||||
- 提供配置界面
|
||||
|
||||
## 7. 技术栈升级
|
||||
|
||||
### 7.1 更新依赖版本
|
||||
- **目标**:保持技术的先进性,获取最新的功能和安全修复
|
||||
- **实施步骤**:
|
||||
- 更新 `p-limit` 等依赖到最新版本
|
||||
- 测试更新后的依赖兼容性
|
||||
|
||||
## 实施顺序
|
||||
|
||||
按照优先级和实施难度,我将按照以下顺序实施优化:
|
||||
|
||||
1. **代码结构优化**:重新组织目录结构和拆分大型模块
|
||||
2. **错误处理改进**:实现完善的错误处理机制
|
||||
3. **数据库操作优化**:使用批量更新和批量查询,添加数据库索引
|
||||
4. **异步操作优化**:改进并发控制策略
|
||||
5. **安全性增强**:改进数据加密方式,实现严格的输入验证
|
||||
6. **功能改进**:实现配置管理系统
|
||||
7. **技术栈升级**:更新依赖版本
|
||||
|
||||
现在,我将开始实施第一个优化任务:拆分 `readingReflectionsTaskManager.ts` 模块。
|
||||
Reference in New Issue
Block a user