diff --git a/.claude/settings.local.json b/.claude/settings.local.json index aec80adaf0..9746b14786 100644 --- a/.claude/settings.local.json +++ b/.claude/settings.local.json @@ -29,7 +29,12 @@ "Bash(openspec:*)", "Bash(node -c /d/projects/sionrui/frontend/app/web-gold/src/views/system/task-management/digital-human-task/index.vue)", "Bash(echo \"=== Token 自动刷新功能验证 ===\n\n✅ 已实现的功能:\n1. 请求前检查 token 是否即将过期(5分钟缓冲)\n2. 如果即将过期,自动触发 refreshToken 刷新\n3. 并发请求时,只有一个请求触发刷新,其他请求等待\n4. 刷新完成后,所有等待的请求使用新 token\n5. 白名单接口(login、refresh-token等)跳过检查\n6. 401 错误:尝试刷新,失败则跳转登录页\n7. 403 错误:直接跳转登录页\n\n✅ 核心文件修改:\n- frontend/api/axios/client.js - 添加了预检查和刷新逻辑\n- frontend/app/web-gold/src/api/http.js - 保持原有的 401/403 处理\n\n✅ 兼容性:\n- 向后兼容:不影响现有认证流程\n- API 兼容:不改变后端接口契约\n- 用户透明:完全无感知的自动刷新\n\n=== 验证完成 ===\")", - "Bash(node:*)" + "Bash(node:*)", + "Bash(dos2unix:*)", + "Bash(python3:*)", + "Skill(openspec:apply)", + "Skill(openspec:apply:*)", + "Bash(pnpm run lint)" ], "deny": [], "ask": [] diff --git a/CLAUDE.md b/CLAUDE.md index 9a68746f3f..de2d165fac 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -44,6 +44,81 @@ Keep this managed block so 'openspec update' can refresh the instructions. - Pinia 3.0.3 状态管理 - TailwindCSS 4.1.14 样式 +### 代码规范 + +#### Vue.js 最佳实践 + +##### 代码规划 +- 代码简洁易于人类阅读 + +##### 组件结构 +- 优先使用组合式 API 而非选项式 API +- 保持组件小巧且功能专注 +- 采用恰当的 TypeScript 集成方案 +- 实现规范的 props 验证 +- 使用标准的 emit 声明 +- 保持模板逻辑简洁 +- 优先使用template 语法,而不是函数组件 +- 优先使用函数或者hook,而不是类 + +##### 组合式 API +- 正确使用 ref 与 reactive +- state模块化 + +```js +const uiState = ref({ dialogVisible:false, tableLoading:false}) +const open = ()=>{ + uiState.value.dialogVisible = true +} +``` + +- 合理实现生命周期钩子 +- 通过组合式函数封装可复用逻辑 +- 保持 setup 函数整洁 +- 规范使用计算属性 +- 合理实现侦听器 + +##### 状态管理 +- 使用 Pinia 进行状态管理 +- 保持仓库模块化 +- 采用合理的状态组织方式 +- 规范实现操作逻辑 +- 正确使用获取器 +- 妥善处理异步状态 + +##### 性能优化 +- 实现组件懒加载 +- 配置恰当的缓存策略 +- 高效使用计算属性 +- 避免不必要的侦听器 +- 区分使用 v-show 与 v-if +- 实现科学的 key 管理 + +##### 路由管理 +- 规范使用 Vue Router +- 实现完整的导航守卫 +- 合理配置路由元字段 +- 正确处理路由参数 +- 实现路由懒加载 +- 使用标准的导航方法 + +##### 表单处理 +- 正确使用 v-model +- 实现完善的验证机制 +- 规范处理表单提交 +- 展示合理的加载状态 +- 配置完整的错误处理 +- 实现表单重置功能 + +##### TypeScript 集成 +- 使用规范的组件类型定义 +- 实现完整的 props 类型声明 +- 规范 emit 类型声明 +- 处理类型推断 +- 使用标准的组合函数类型 +- 实现完整的仓库类型定义 + + ## 代码简化 - 只保留核心分支,移除重复校验 / 冗余注释”,例:“生成 Java 订单支付接口逻辑,仅包含参数非空校验、支付状态判断 2 个核心分支,无需异常场景的冗余兜底代码 - 用三目运算符简化 if-else 冗余,避免单分支重复判断;变量仅定义必要的,移除未被调用的临时变量 diff --git a/frontend/app/web-gold/src/views/kling/IdentifyFace.vue b/frontend/app/web-gold/src/views/kling/IdentifyFace.vue index 897bea2579..27b650a2a9 100644 --- a/frontend/app/web-gold/src/views/kling/IdentifyFace.vue +++ b/frontend/app/web-gold/src/views/kling/IdentifyFace.vue @@ -19,7 +19,7 @@ :show-count="true" class="tts-textarea" /> -
+
💡 视频中人脸出现时长约 {{ (faceDuration / 1000).toFixed(1) }} 秒,建议文案不超过 {{ suggestedMaxChars }} 字
@@ -108,7 +108,7 @@
-
+

上传视频文件

支持 MP4、MOV

@@ -117,36 +117,15 @@
- -

{{ videoFile?.name }}

+ +

{{ videoState.videoFile?.name }}

- -
-

任务状态

-
-
- 状态: - {{ getStatusText(currentTaskStatus) }} -
-
- 步骤: - {{ getStepText(currentTaskStep) }} -
-
- -
-
- 错误: - {{ currentTaskError }} -
-
-
-
+

配音生成与校验

@@ -155,30 +134,30 @@ type="default" size="large" :disabled="!canGenerateAudio" - :loading="generatingAudio" + :loading="audioState.generating" block @click="handleGenerateAudio" > - {{ generatingAudio ? '生成中...' : '生成配音(用于校验时长)' }} + {{ audioState.generating ? '生成中...' : '生成配音(用于校验时长)' }}
-
+

生成的配音

音频时长: - {{ (audioDurationMs / 1000).toFixed(1) }} 秒 + {{ (audioState.durationMs / 1000).toFixed(1) }} 秒
人脸区间: {{ (faceDuration / 1000).toFixed(1) }} 秒
-
+
校验结果: - {{ audioValidationPassed ? '✅ 通过' : '❌ 不通过(需至少2秒重合)' }} + {{ audioState.validationPassed ? '✅ 通过' : '❌ 不通过(需至少2秒重合)' }}
@@ -186,14 +165,14 @@