From a1b82d3cf80ee59c8c5cb25c7232eff6a363b35c Mon Sep 17 00:00:00 2001 From: Lexcubia Date: Sun, 27 Apr 2025 20:26:30 +0800 Subject: [PATCH] =?UTF-8?q?feat(speak):=20=E5=AE=9E=E7=8E=B0=E8=AF=AD?= =?UTF-8?q?=E9=9F=B3=E6=92=AD=E6=8A=A5=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 新增 speak-tts 依赖库 - 创建 speak.js 工具类,实现语音合成和播报功能 - 在 ChatInterface 组件中添加 TextToVoiceButton 组件,用于触发语音播报 - 在 VoiceInputSettings 组件中添加语音播报相关设置选项 - 更新 chat.js 中的逻辑,支持自动语音播报 - 新增 speakStore 管理语音播报相关状态 --- .cursor/rules/.cursorrules | 1 + .cursor/rules/cursorrules.mdc | 87 +++++++++++++++++ package.json | 5 +- .../settings/VoiceInputSettings.vue | 51 +++++++--- src/store/chat.js | 21 ++++- src/store/speak.js | 33 +++++++ src/utils/speak.js | 62 +++++++++++++ src/views/chat/ChatInterface.vue | 21 +++-- .../chat/components/TextToVoiceButton.vue | 21 +++++ src/views/chat/components/VoiceInput.vue | 6 +- src/views/settings/SettingsPanel.vue | 17 ++-- yarn.lock | 93 +------------------ 12 files changed, 297 insertions(+), 121 deletions(-) create mode 100644 .cursor/rules/cursorrules.mdc create mode 100644 src/store/speak.js create mode 100644 src/utils/speak.js create mode 100644 src/views/chat/components/TextToVoiceButton.vue diff --git a/.cursor/rules/.cursorrules b/.cursor/rules/.cursorrules index 81a2262..be34a3e 100644 --- a/.cursor/rules/.cursorrules +++ b/.cursor/rules/.cursorrules @@ -50,6 +50,7 @@ alwaysApply: false - Props 必须定义类型和默认值 - 使用 defineEmits 定义事件 - 复杂组件需要添加注释说明 + - 高度组件化开发,细致到功能模块 4. 状态管理 - 使用 Pinia 进行状态管理 diff --git a/.cursor/rules/cursorrules.mdc b/.cursor/rules/cursorrules.mdc new file mode 100644 index 0000000..2ca86de --- /dev/null +++ b/.cursor/rules/cursorrules.mdc @@ -0,0 +1,87 @@ +--- +description: +globs: +alwaysApply: true +--- +--- +description: +globs: +alwaysApply: true +--- +### 技术栈 +- Javascript +- Vue3 +- vite +- axios +- element +- pinia +- mockjs +- sass + +### 包管理器 +- yarn + +### 文件目录 + +- src/ + - assets/ # 静态资源文件 + - components/ # 公共组件 + - views/ # 页面视图组件 + - router/ # 路由配置 + - store/ # Pinia状态管理 + - api/ # API接口封装 + - utils/ # 工具函数 + - styles/ # 全局样式 + - mock/ # Mock数据 + - App.vue # 根组件 + - main.js # 入口文件 + +### 开发规范 + +1. 命名规范 + - 组件名:大驼峰命名法,如 `UserProfile.vue` + - 变量名:小驼峰命名法,如 `userInfo` + - 常量名:全大写,下划线分隔,如 `API_BASE_URL` + - 文件夹名:小写,中划线分隔,如 `user-center` + +2. 代码风格 + - 使用 ESLint + Prettier 进行代码格式化 + - 组件内使用 `