|
@@ -37,16 +37,17 @@
|
|
|
<div class="input-section">
|
|
<div class="input-section">
|
|
|
<input
|
|
<input
|
|
|
type="text"
|
|
type="text"
|
|
|
- v-model="prompt"
|
|
|
|
|
|
|
+ v-model="displayedPrompt"
|
|
|
placeholder="问我任何问题..."
|
|
placeholder="问我任何问题..."
|
|
|
@keyup.enter="handleSendByKeydown"
|
|
@keyup.enter="handleSendByKeydown"
|
|
|
/>
|
|
/>
|
|
|
<!-- 语音输入按钮 -->
|
|
<!-- 语音输入按钮 -->
|
|
|
- <VoiceInput
|
|
|
|
|
- @voiceRecognized="handleVoiceRecognized"
|
|
|
|
|
- lang="zh-CN"
|
|
|
|
|
- maxDuration="10"
|
|
|
|
|
- />
|
|
|
|
|
|
|
+ <VoiceInput
|
|
|
|
|
+ @voiceRecognized="handleVoiceRecognized"
|
|
|
|
|
+ @recordingStatusChanged="handleRecordingStatusChanged"
|
|
|
|
|
+ lang="zh-CN"
|
|
|
|
|
+ maxDuration="10"
|
|
|
|
|
+ />
|
|
|
|
|
|
|
|
<!-- 终止问答按钮 -->
|
|
<!-- 终止问答按钮 -->
|
|
|
<div
|
|
<div
|
|
@@ -198,6 +199,26 @@ const receiveMessageFullText = ref("");
|
|
|
const receiveMessageDisplayedText = ref("");
|
|
const receiveMessageDisplayedText = ref("");
|
|
|
const messageListRef = ref(null);
|
|
const messageListRef = ref(null);
|
|
|
const userScrolled = ref(false)//是否用户手动滚动
|
|
const userScrolled = ref(false)//是否用户手动滚动
|
|
|
|
|
+// 语音输入状态跟踪
|
|
|
|
|
+const isVoiceRecording = ref(false); // 当前是否正在录音
|
|
|
|
|
+const voiceRecognizedText = ref(""); // 实时语音识别结果
|
|
|
|
|
+// 用于控制输入框显示的内容
|
|
|
|
|
+const displayedPrompt = computed({
|
|
|
|
|
+ get() {
|
|
|
|
|
+ // 录音时,显示prompt.value + 实时语音识别结果
|
|
|
|
|
+ if (isVoiceRecording.value) {
|
|
|
|
|
+ return prompt.value ? `${prompt.value} ${voiceRecognizedText.value}` : voiceRecognizedText.value;
|
|
|
|
|
+ }
|
|
|
|
|
+ // 不录音时,只显示prompt.value
|
|
|
|
|
+ return prompt.value;
|
|
|
|
|
+ },
|
|
|
|
|
+ set(newValue) {
|
|
|
|
|
+ // 只在用户手动输入时更新prompt.value
|
|
|
|
|
+ if (!isVoiceRecording.value) {
|
|
|
|
|
+ prompt.value = newValue;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+});
|
|
|
|
|
|
|
|
// =========== 【聊天对话】相关 ===========
|
|
// =========== 【聊天对话】相关 ===========
|
|
|
|
|
|
|
@@ -236,7 +257,30 @@ const getConversation = async (id) => {
|
|
|
|
|
|
|
|
// 语音输入识别结果处理
|
|
// 语音输入识别结果处理
|
|
|
const handleVoiceRecognized = (text) => {
|
|
const handleVoiceRecognized = (text) => {
|
|
|
- prompt.value = text;
|
|
|
|
|
|
|
+ if (isVoiceRecording.value) {
|
|
|
|
|
+ // 在同一次录音过程中,只更新临时变量,不修改prompt.value
|
|
|
|
|
+ voiceRecognizedText.value = text;
|
|
|
|
|
+ } else {
|
|
|
|
|
+ // 在录音结束时,将最终的语音内容追加到prompt.value
|
|
|
|
|
+ prompt.value = prompt.value ? `${prompt.value} ${text}` : text;
|
|
|
|
|
+ // 清空临时变量
|
|
|
|
|
+ voiceRecognizedText.value = "";
|
|
|
|
|
+ }
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 处理录音状态变化
|
|
|
|
|
+const handleRecordingStatusChanged = (isRecording) => {
|
|
|
|
|
+ const wasRecording = isVoiceRecording.value;
|
|
|
|
|
+ isVoiceRecording.value = isRecording;
|
|
|
|
|
+
|
|
|
|
|
+ // 如果是从录音状态切换到非录音状态,需要将临时的语音识别结果追加到prompt.value
|
|
|
|
|
+ if (wasRecording && !isRecording) {
|
|
|
|
|
+ if (voiceRecognizedText.value) {
|
|
|
|
|
+ prompt.value = prompt.value ? `${prompt.value} ${voiceRecognizedText.value}` : voiceRecognizedText.value;
|
|
|
|
|
+ // 清空临时变量
|
|
|
|
|
+ voiceRecognizedText.value = "";
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
// =========== 【聊天对话】相关 ===========
|
|
// =========== 【聊天对话】相关 ===========
|