[feat][ai聊天][语音合成]

src/views/xjc-integratedmachine/common/ai/chat.vue

@@ -51,7 +51,7 @@
                                     {{expandIndexList.includes(index)?'折叠':'展开'}}
                                 </el-button>
                             </div>
-                            <el-button @click="ttsStartPlay(item.content)">播放</el-button>
+                            <el-button @click="ttsStartPlay(item.content, index)">{{playActiveIndex === index ?'停止':'播放'}}</el-button>
                         </div>
                     </div>
                 </div>
@@ -121,9 +121,9 @@
     let isSending = ref(false)
     // 选中的消息，用于展开折叠
     let expandIndexList = ref([])
-    // 展开状态
-    let activeIndex = ref(0);
-
+    // 播放按钮状态
+    let playActiveIndex = ref(0)
+    let playButtonFlag = ref(false)
     // 查看所有聊天记录
     function list() {
         loadingHistoryRecord.value = true
@@ -258,7 +258,6 @@
     }
 
     function foldOrExpandMessage(index, flag){
-        activeIndex.value = index;
         if(flag){
             expandIndexList.value = expandIndexList.value.filter((item)=>{
                 return item !== index;
@@ -538,7 +537,8 @@
         };
         audioPlayer.onStop = (audioDatas) => {
             console.log('停止播放');
-            btnStatus === "PLAY" && changeBtnStatus("STOP");
+            // 修改为undefined，下次播放重头开始
+            btnStatus === "PLAY" && changeBtnStatus("UNDEFINED");
         };
     }
 
@@ -561,18 +561,18 @@
             message.error('语音合成配置未生效');
             return null;
         }
-        var url = "wss://tts-api.xfyun.cn/v2/tts";
-        var host = location.host;
+        let url = "wss://tts-api.xfyun.cn/v2/tts";
+        let host = "tts-api.xfyun.cn";
         const apiKey = APIKey;
         const apiSecret = APISecret;
-        var date = new Date().toGMTString();
-        var algorithm = "hmac-sha256";
-        var headers = "host date request-line";
-        var signatureOrigin = `host: ${host}\ndate: ${date}\nGET /v2/tts HTTP/1.1`;
-        var signatureSha = CryptoJS.HmacSHA256(signatureOrigin, apiSecret);
-        var signature = CryptoJS.enc.Base64.stringify(signatureSha);
-        var authorizationOrigin = `api_key="${apiKey}", algorithm="${algorithm}", headers="${headers}", signature="${signature}"`;
-        var authorization = btoa(authorizationOrigin);
+        let date = new Date().toGMTString();
+        let algorithm = "hmac-sha256";
+        let headers = "host date request-line";
+        let signatureOrigin = `host: ${host}\ndate: ${date}\nGET /v2/tts HTTP/1.1`;
+        let signatureSha = CryptoJS.HmacSHA256(signatureOrigin, apiSecret);
+        let signature = CryptoJS.enc.Base64.stringify(signatureSha);
+        let authorizationOrigin = `api_key="${apiKey}", algorithm="${algorithm}", headers="${headers}", signature="${signature}"`;
+        let authorization = btoa(authorizationOrigin);
         url = `${url}?authorization=${authorization}&date=${date}&host=${host}`;
         return url;
     }
@@ -596,7 +596,8 @@
         }
     }
 
-    function ttsStartPlay(text) {
+    function ttsStartPlay(text, index) {
+        playActiveIndex.value = index
         if (btnStatus === "UNDEFINED") {
             // 开始合成
             connectWebSocket(text.replace(/<\/?.+?\/?>/g,''));
@@ -632,8 +633,8 @@
                 resumePlayDuration: 1000
             });
             changeBtnStatus("PLAY");
-            var tte = "UTF8";
-            var params = {
+            let tte = "UTF8";
+            let params = {
                 common: {
                     app_id: xfIatKeys.APPID,
                 },