Merge branch 'master' of http://47.103.154.90:83/r/WI/Web.V1.0

wujingjing

2024-07-16 8cab6cefd30a4cf20e57237d721e1dd13cfda407

 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;