语音助手

src/components/classRoomHelper/component/levitatedSphere.vue

@@ -27,7 +27,7 @@
       }"
     >
       <div class="ls_t_ai" v-if="[0, 2].includes(showTextIndex)">
-        <span v-if="[0].includes(showTextIndex)">{{ aiText }}</span>
+        <span v-if="[0].includes(showTextIndex)" v-html="htmlContent(aiText)"></span>
         <span v-if="[2].includes(showTextIndex)">正在组织语言...</span>
       </div>
       <div class="ls_t_user" v-if="[1].includes(showTextIndex)">
@@ -40,11 +40,21 @@
       src="https://beta.cloud.cocorobo.cn/browser/public/index.html"
       ref="iiframe"
       v-show="false"
+    ></iframe>
+
+		<!-- 文字转语音-->
+    <iframe
+      allow="camera *; microphone *;display-capture;midi;encrypted-media;"
+      src="https://beta.cloud.cocorobo.cn/browser/public/index1.html"
+      ref="iiframe2"
+      v-show="false"
     ></iframe>
   </div>
 </template>
 
 <script>
+import { v4 as uuidv4 } from "uuid";
+import MarkdownIt from "markdown-it";
 export default {
   data() {
     return {
@@ -56,21 +66,21 @@ export default {
       showTextIndex: 0, //0：ai,1：用户, 2：组织语言
       timer: null,
 			isOpen:false,
+			userId:this.$route.query.userid,
+			chatLoading:false,
+			talkLoading:false,
+			source:null,
+			talkTextList:[],
+
     };
   },
   computed: {
-    textLeft() {
-      let _result = 0;
-      if (this.showTextIndex == 0) {
-        _result = this.aiText.length * 18;
-      } else if (this.showTextIndex == 1) {
-        _result = this.userText.length * 20;
-      } else if (this.showTextIndex == 2) {
-        _result = 9 * 18;
-      }
-      if (_result > 350) _result = 380;
-      return _result;
-    }
+		htmlContent() {
+      const md = new MarkdownIt();
+      return _md => {
+        return md.render(_md);
+      };
+    },
   },
   methods: {
     recordStart(_text) {
@@ -90,8 +100,8 @@ export default {
 					
           let _msg = e.privText;
           // let _msg = _text;
-          // console.log("👇");
-          // console.log(_msg);
+          console.log("👇");
+          console.log(_msg);
           if (_msg.indexOf("可可同学") != -1 && !this.show) {
             this.aiText = "您好，我是小可，有什么可以帮助您的？";
             this.aiStatus = 0;
@@ -99,7 +109,7 @@ export default {
             this.show = true;
             console.log("已唤醒");
           } else if (this.show == true) {
-            if (this.showTextIndex == 2) {
+            if (this.showTextIndex == 2 || this.chatLoading || this.talkLoading) {
               console.log("组织语言中");
             } else {
               this.showTextIndex = 1;
@@ -112,13 +122,14 @@ export default {
               }
               this.timer = setTimeout(() => {
 								if(this.userText.indexOf("关闭语音助手") != -1){
-									return setTimeout(()=>{
+									// return setTimeout(()=>{
 										this.show = false,
 										this.showTextIndex = 3;
                     this.aiStatus = 2;
                     this.aiText = "";
                     this.userText = "";
-									},2000)
+										return;
+									// },1000)
 								}
                 this.showTextIndex = 2;
                 this.aiText = "";
@@ -127,10 +138,7 @@ export default {
 										let _number = this.userText.match(/计时(.+)分钟/)[1]
 										let _time = 0;
 										if(!/^\d+$/.test(_number)){
-											console.log("👇")
-											console.log(_number)
 											_time = this.chineseToNumber(_number)*60;
-											console.log(this.chineseToNumber(_number))
 										}else{
 											_time = parseInt(_numberList[1])*60
 										}
@@ -147,17 +155,41 @@ export default {
 										}, 2000);
                   }, 2000);
 								} else {
-                  setTimeout(() => {
-                    this.aiStatus = 0;
+									this.chatLoading = true;
+									const _uuid = uuidv4();
+									let params = {
+      						  assistant_id: 'f8e1ebb2-2e0d-11ef-8bf4-12e77c4cb76b',
+      						  userId: this.userId,
+      						  message: this.userText,
+      						  session_name: _uuid,
+										uid:_uuid,
+      						  file_ids: [],
+      						};
+									this.ajax
+        					// .post("https://claude3.cocorobo.cn/chat", params)
+        					// .post("https://gpt4.cocorobo.cn/chat", params)
+									.post("https://gpt4.cocorobo.cn/ai_agent_park_chat_new", params)
+        					.then(res => {
+        					  if (res.data.FunctionResponse.result == "发送成功") {
+        					  } else {
+        					    this.$message.warning(res.data.FunctionResponse.result);
+        					  }
+        					})
+        					.catch(e => {
+        					  console.log(e);
+        					  this.chatLoading = false;
+										this.aiStatus = 0;
                     this.showTextIndex = 0;
-                    this.aiText = "不知道,请您稍后再问...。";
+                    this.aiText = "对不起，我无法理解您的问题，请重新提问";
                     this.timer = setTimeout(() => {
                       this.showTextIndex = 3;
                       this.aiStatus = 2;
                       this.aiText = "";
                       this.userText = "";
-                    }, 5000);
-                  }, 3000);
+                    }, 3000);
+        					});
+									// 通过流获取ai对话数据
+									this.getAtAuContent(_uuid)
                 }
               }, 5000);
             }
@@ -186,7 +218,14 @@ export default {
 					this.isOpen = false;
 					this.$parent.changeRecordType(0);
 					this.$message.success("已关闭语音助手")
+					if(this.talkLoading){
+						this.talkLoading = false;
+						this.$refs.iiframe2.closesynthesizer();
+					}
+					this.userText = "";
+					this.aiText = "";
 				};
+				
 		},
     chineseToNumber(chinese) {
       const chineseNumbers = {
@@ -242,44 +281,97 @@ export default {
 
       result += sectionNum + tempNum;
       return result;
-    }
+    },
+		getAtAuContent(_uid) {
+      this.source = new EventSource(`https://gpt4.cocorobo.cn/question/${_uid}`); 
+			//http://gpt4.cocorobo.cn:8011/question/   https://gpt4.cocorobo.cn/question/
+      let _allText = "";
+      let _mdText = "";
+			let _talkText = "";
+			let _talkIndex = 0;
+      // const md = new MarkdownIt();
+      this.source.onmessage = _e => {
+        let _eData = JSON.parse(_e.data);
+        if (_eData.content.replace("'", "").replace("'", "") == "[DONE]") {
+          let _result = [];
+          if ("result" in _eData) {
+            _result = _eData.result;
+            for (let i = 0; i < _result.length; i++) {
+              _mdText = _mdText.replace(_result[i].text, _result[i].fileName);
+            }
+          }
+          _mdText = _mdText.replace("_", "");
+					this.aiText = _mdText;
+					_talkIndex = 0;
+					if(_talkText!=''){
+						this.talkTextList.push(_talkText)
+					}
+					this.chatLoading = false;
+          this.source.close();
+        } else {
+					_talkIndex+=1;
+          let _text = _eData.content.replace("'", "").replace("'", "");
+          if (_allText == "") {
+            _allText = _text.replace(/^\n+/, ""); //去掉回复消息中偶尔开头就存在的连续换行符
+						_talkText+=_text.replace(/^\n+/, "");
+          } else {
+            _allText += _text;
+						_talkText+=_text;
+          }
+          _mdText = _allText + "_";
+          _mdText = _mdText.replace(/\\n/g, "\n");
+          _mdText = _mdText.replace(/\\/g, "");
+          if (_allText.split("```").length % 2 == 0) _mdText += "\n```\n";
+					this.aiText = _mdText;
+					this.showTextIndex = 0;
+					if(_talkIndex==10){
+						_talkIndex = 0;
+						this.talkTextList.push(_talkText)
+						_talkText = "";
+						if(!this.talkLoading)this.talkText();
+					}
+					
+        }
+      };
+    },
+		talkText(){
+			let _text = this.talkTextList.shift();
+			let _talkTextIiframe2 = this.$refs.iiframe2;
+
+			if(_text){
+				this.talkLoading = true;
+				// console.log(`👉转语音：${_text}`)
+				// setTimeout(()=>{
+				// 	this.talkText();
+				// },2000)
+				_talkTextIiframe2.texttospeech(_text,this.talkText);
+			}else{
+				console.log("👉转语音结束👈")
+				_talkTextIiframe2.closesynthesizer()
+				this.chatLoading = false;
+				this.talkLoading = false;
+				this.talkTextList = [];
+				this.timer = setTimeout(() => {
+          this.showTextIndex = 3;
+          this.aiStatus = 2;
+          this.aiText = "";
+          this.userText = "";
+        }, 3000);
+				return
+			}
+		},
   },
   mounted() {
-    // this.recordStart();
-    // setTimeout(() => {
-    //   this.recordStart("嘿哟黑");
-    //   setTimeout(() => {
-    //     this.recordStart("可可同学。");
-    //     setTimeout(() => {
-    //       setTimeout(() => {
-    //         this.recordStart("您好可可，");
-    //         setTimeout(() => {
-    //           this.recordStart("帮我计时一分钟的闹钟");
-		// 					setTimeout(()=>{
-		// 						this.recordStart("您好可可，关闭语音助手");
-		// 						setTimeout(() => {
-    // 						  this.recordStart("嘿哟黑");
-    // 						  setTimeout(() => {
-    // 						    this.recordStart("可可同学。");
-    // 						    setTimeout(() => {
-    // 						      setTimeout(() => {
-    // 						        this.recordStart("您好可可，");
-    // 						        setTimeout(() => {
-    // 						          this.recordStart("帮我计时一分钟的闹钟");
-		// 											setTimeout(()=>{
-		// 												this.recordStart("您好可可，关闭语音助手");
-		// 											},20000)
-    // 						        }, 1000);
-    // 						      }, 1000);
-    // 						    }, 1000);
-    // 						  }, 1000);
-    // 						},20000);
-		// 					},20000)
-    //         }, 1000);
-    //       }, 1000);
-    //     }, 1000);
-    //   }, 1000);
-    // },1000);
+		// // this.recordStart()
+		// setTimeout(()=>{
+		// 	this.recordStart("可可同学。")
+		// 	setTimeout(()=>{
+		// 		this.recordStart("世界上最大的山是什么山。")
+		// 		setTimeout(()=>{
+		// 			this.recordStart("位于哪里。")
+		// 		},2000)
+		// 	},2000)
+		// },2000)
   }
 };
 </script>