From 24291493d6560539d82cbd21738234b648de386a Mon Sep 17 00:00:00 2001 From: shaohuzhang1 Date: Thu, 12 Sep 2024 11:02:03 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E5=89=8D=E7=AB=AF?= =?UTF-8?q?=E6=B2=A1=E6=9C=89input=5Ffield=5Flist=E6=8A=A5=E9=94=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ui/src/components/ai-chat/index.vue | 172 ++++++++++++++-------------- 1 file changed, 89 insertions(+), 83 deletions(-) diff --git a/ui/src/components/ai-chat/index.vue b/ui/src/components/ai-chat/index.vue index 185dafd29..01a4b01e6 100644 --- a/ui/src/components/ai-chat/index.vue +++ b/ui/src/components/ai-chat/index.vue @@ -118,13 +118,11 @@ v-if="item.is_stop && !item.write_ed" @click="startChat(item)" link - >继续 - + >继续 + 停止回答 - + >停止回答 +
@@ -137,7 +135,7 @@ />
-
+
@@ -162,18 +160,12 @@ @keydown.enter="sendChatHandle($event)" />
- + - + @@ -231,8 +223,7 @@ const { const props = defineProps({ data: { type: Object, - default: () => { - } + default: () => {} }, appId: String, // 仅分享链接有 log: Boolean, @@ -289,15 +280,15 @@ const prologueList = computed(() => { .reduce((pre_array: Array, current: string, index: number) => { const currentObj = isMdArray(current) ? { - type: 'question', - str: current.replace(/^-\s+/, ''), - index: index - } + type: 'question', + str: current.replace(/^-\s+/, ''), + index: index + } : { - type: 'md', - str: current, - index: index - } + type: 'md', + str: current, + index: index + } if (pre_array.length > 0) { const pre = pre_array[pre_array.length - 1] if (!isMdArray(current) && pre.type == 'md') { @@ -328,38 +319,46 @@ watch( ) function handleInputFieldList() { - props.data.work_flow?.nodes?.filter((v: any) => v.id === 'base-node') + props.data.work_flow?.nodes + ?.filter((v: any) => v.id === 'base-node') .map((v: any) => { - inputFieldList.value = v.properties.input_field_list.map((v: any) => { - switch (v.type) { - case 'input': - return { field: v.variable, input_type: 'TextInput', label: v.name, required: v.is_required } - case 'select': - return { - field: v.variable, - input_type: 'SingleSelect', - label: v.name, - required: v.is_required, - option_list: v.optionList.map((o: any) => { - return { key: o, value: o } - }) + inputFieldList.value = v.properties.input_field_list + ? v.properties.input_field_list.map((v: any) => { + switch (v.type) { + case 'input': + return { + field: v.variable, + input_type: 'TextInput', + label: v.name, + required: v.is_required + } + case 'select': + return { + field: v.variable, + input_type: 'SingleSelect', + label: v.name, + required: v.is_required, + option_list: v.optionList.map((o: any) => { + return { key: o, value: o } + }) + } + case 'date': + return { + field: v.variable, + input_type: 'DatePicker', + label: v.name, + required: v.is_required, + attrs: { + format: 'YYYY-MM-DD HH:mm:ss', + 'value-format': 'YYYY-MM-DD HH:mm:ss', + type: 'datetime' + } + } + default: + break } - case 'date': - return { - field: v.variable, - input_type: 'DatePicker', - label: v.name, - required: v.is_required, - attrs: { - 'format': 'YYYY-MM-DD HH:mm:ss', - 'value-format': 'YYYY-MM-DD HH:mm:ss', - 'type': 'datetime' - } - } - default: - break - } - }) + }) + : [] }) } @@ -712,7 +711,6 @@ const mediaRecorder = ref(null) const audioPlayer = ref(null) const mediaRecorderStatus = ref(true) - // 开始录音 const startRecording = async () => { try { @@ -723,11 +721,14 @@ const startRecording = async () => { sampleRate: 44100 }) - mediaRecorder.value.open(() => { - mediaRecorder.value.start() - }, (err: any) => { - console.error(err) - }) + mediaRecorder.value.open( + () => { + mediaRecorder.value.start() + }, + (err: any) => { + console.error(err) + } + ) } catch (error) { console.error('无法获取音频权限：', error) } @@ -737,17 +738,20 @@ const startRecording = async () => { const stopRecording = () => { if (mediaRecorder.value) { mediaRecorderStatus.value = true - mediaRecorder.value.stop((blob: Blob, duration: number) => { - // 测试blob是否能正常播放 - // const link = document.createElement('a') - // link.href = window.URL.createObjectURL(blob) - // link.download = 'abc.mp3' - // link.click() + mediaRecorder.value.stop( + (blob: Blob, duration: number) => { + // 测试blob是否能正常播放 + // const link = document.createElement('a') + // link.href = window.URL.createObjectURL(blob) + // link.download = 'abc.mp3' + // link.click() - uploadRecording(blob) // 上传录音文件 - }, (err: any) => { - console.error('录音失败:', err) - }) + uploadRecording(blob) // 上传录音文件 + }, + (err: any) => { + console.error('录音失败:', err) + } + ) } } @@ -756,30 +760,32 @@ const uploadRecording = async (audioBlob: Blob) => { try { const formData = new FormData() formData.append('file', audioBlob, 'recording.mp3') - applicationApi.postSpeechToText(props.data.id as string, formData, loading) - .then((response) => { - console.log('上传成功:', response.data) - inputValue.value = response.data - // chatMessage(null, res.data) - }) - + applicationApi.postSpeechToText(props.data.id as string, formData, loading).then((response) => { + console.log('上传成功:', response.data) + inputValue.value = response.data + // chatMessage(null, res.data) + }) } catch (error) { console.error('上传失败:', error) } } const playAnswerText = (text: string) => { - if (props.ttsModelOptions?.model_local_provider?.filter((v: any) => v.id === props.data.tts_model_id).length > 0) { + if ( + props.ttsModelOptions?.model_local_provider?.filter( + (v: any) => v.id === props.data.tts_model_id + ).length > 0 + ) { // 创建一个新的 SpeechSynthesisUtterance 实例 - const utterance = new SpeechSynthesisUtterance(text); + const utterance = new SpeechSynthesisUtterance(text) // 调用浏览器的朗读功能 - window.speechSynthesis.speak(utterance); + window.speechSynthesis.speak(utterance) return } - applicationApi.postTextToSpeech(props.data.id as string, { 'text': text }, loading) + applicationApi + .postTextToSpeech(props.data.id as string, { text: text }, loading) .then((res: any) => { - // 假设我们有一个 MP3 文件的字节数组 // 创建 Blob 对象 const blob = new Blob([res], { type: 'audio/mp3' })