From 8cab6cefd30a4cf20e57237d721e1dd13cfda407 Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期二, 16 七月 2024 16:16:54 +0800 Subject: [PATCH] Merge branch 'master' of http://47.103.154.90:83/r/WI/Web.V1.0 --- src/components/chat/components/playBar/PlayBar.vue | 78 +++++++++++++++++++++++++++++++++++---- 1 files changed, 70 insertions(+), 8 deletions(-) diff --git a/src/components/chat/components/playBar/PlayBar.vue b/src/components/chat/components/playBar/PlayBar.vue index ca50d83..1175fa8 100644 --- a/src/components/chat/components/playBar/PlayBar.vue +++ b/src/components/chat/components/playBar/PlayBar.vue @@ -6,7 +6,16 @@ </el-button> </div> <div class="set-input"> - <el-input v-elInputFocus @keydown.enter="isTalking || emits('sendClick')" v-model="inputValue" placeholder="鍦ㄨ繖閲岃緭鍏ユ偍鐨勯棶棰樺紑濮嬪拰AI瀵硅瘽" class="set-inputAnswer" /> + <el-input + class="relative align-bottom set-inputAnswer" + type="textarea" + resize="none" + :autosize="{ minRows: 1, maxRows: 8 }" + v-elInputFocus + @keydown="enterInput" + v-model="inputValue" + placeholder="鍦ㄨ繖閲岃緭鍏ユ偍鐨勯棶棰樺紑濮嬪拰AI瀵硅瘽" + /> </div> <div class="h100 flex items-center"> <div class="upload_img space-y"> @@ -14,7 +23,7 @@ <el-button title="AI鐪嬪浘" class="cursor-pointer" link style="margin-left: unset"> <img src="/static/images/wave/LookImg.png" class="set-img-icon box-border" /> </el-button> - <el-button title="AI璇煶瀵硅瘽" class="cursor-pointer" link style="margin-left: unset"> + <el-button title="AI璇煶瀵硅瘽" class="cursor-pointer" link style="margin-left: unset" @click="audioChangeWord"> <img src="/static/images/wave/HeadImg.png" class="set-img-icon box-border" /> </el-button> @@ -30,15 +39,66 @@ </template> <script setup lang="ts"> -import { reactive } from 'vue'; +import { ElMessage } from 'element-plus'; +import { ref } from 'vue'; const emits = defineEmits(['sendClick']); -defineProps(['isTalking']) +const props = defineProps(['isTalking']); const inputValue = defineModel({ - type:String -}) + type: String, +}); + +const isListening = ref(false); + +const enterInput = (e) => { + if (props.isTalking) return; + if (!e.shiftKey && e.keyCode == 13) { + e.cancelBubble = true; //ie闃绘鍐掓场琛屼负 + e.stopPropagation(); //Firefox闃绘鍐掓场琛屼负 + e.preventDefault(); //鍙栨秷浜嬩欢鐨勯粯璁ゅ姩浣�*鎹㈣ + //浠ヤ笅澶勭悊鍙戦�佹秷鎭唬鐮� + emits('sendClick'); + } +}; +const audioChangeWord = () => { + inputValue.value = ''; + // 鍒涘缓SpeechRecognition瀵硅薄 + // eslint-disable-next-line no-undef + var recognition = new webkitSpeechRecognition(); + if (!recognition) { + // eslint-disable-next-line no-undef + recognition = new SpeechRecognition(); + } + console.log('recognition2', recognition); + console.log(11); + // 璁剧疆璇█ + recognition.lang = 'zh-CN'; + console.log(22); + // 寮�濮嬭闊宠瘑鍒� + recognition.start(); + isListening.value = true; + console.log(33); + // 鐩戝惉璇嗗埆缁撴灉 + recognition.onresult = function (event) { + var result = event.results[0][0].transcript; + console.log('鐩戝惉缁撴灉:', result); + inputValue.value = result; + }; + + // 鐩戝惉閿欒浜嬩欢 + recognition.onerror = function (event) { + isListening.value = false; + ElMessage.error('鐩戝惉璇煶澶辫触'); + console.error(event.error); + }; + // 鐩戝惉缁撴潫浜嬩欢锛堝寘鎷瘑鍒垚鍔熴�佽瘑鍒敊璇拰鐢ㄦ埛鍋滄锛� + recognition.onend = function () { + isListening.value = false; + console.log('璇煶璇嗗埆鍋滄'); + }; +}; </script> <style scoped lang="scss"> .set-waterTitle { @@ -127,14 +187,16 @@ display: inline-block; width: 100%; .set-inputAnswer { - min-height: 36px; - height: 36px; padding: 3px 0; line-height: 20px; border: none; background-color: transparent; color: #333; font-size: 15px; + :deep(.el-textarea__inner) { + // 鍘婚櫎绾� + box-shadow: none; + } } :deep(.el-input__wrapper) { box-shadow: unset; -- Gitblit v1.9.3