diff --git a/ui/src/components/ai-chat/index.vue b/ui/src/components/ai-chat/index.vue
index ce3c5d0f5..9e62a4b4c 100644
--- a/ui/src/components/ai-chat/index.vue
+++ b/ui/src/components/ai-chat/index.vue
@@ -168,7 +168,13 @@
-
-
-
-
-
-
+
+ 00:{{ recorderTime < 10 ? `0${recorderTime}` : recorderTime }}
+
+
+
+
+
+
+
('')
const chartOpenId = ref('')
const chatList = ref([])
const inputFieldList = ref([])
@@ -279,6 +291,9 @@ const form_data = ref({})
const api_form_data = ref({})
const showUserInput = ref(true)
+const recorderTime = ref(0)
+const startRecorderTime = ref(false)
+const recorderLoading = ref(false)
const isDisabledChart = computed(
() => !(inputValue.value.trim() && (props.appId || props.data?.name))
@@ -793,6 +808,7 @@ const mediaRecorderStatus = ref(true)
const startRecording = async () => {
try {
mediaRecorderStatus.value = false
+ handleTimeChange()
mediaRecorder.value = new Recorder({
type: 'mp3',
bitRate: 128,
@@ -814,6 +830,8 @@ const startRecording = async () => {
// 停止录音
const stopRecording = () => {
+ startRecorderTime.value = false
+ recorderTime.value = 0
if (mediaRecorder.value) {
mediaRecorderStatus.value = true
mediaRecorder.value.stop(
@@ -823,7 +841,6 @@ const stopRecording = () => {
// link.href = window.URL.createObjectURL(blob)
// link.download = 'abc.mp3'
// link.click()
-
uploadRecording(blob) // 上传录音文件
},
(err: any) => {
@@ -836,18 +853,39 @@ const stopRecording = () => {
// 上传录音文件
const uploadRecording = async (audioBlob: Blob) => {
try {
+ recorderLoading.value = true
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
+ recorderLoading.value = false
+ mediaRecorder.value.close()
+ inputValue.value = typeof response.data === 'string' ? response.data : ''
// chatMessage(null, res.data)
})
} catch (error) {
+ recorderLoading.value = false
console.error('上传失败:', error)
}
}
+const handleTimeChange = () => {
+ startRecorderTime.value = true
+
+ setTimeout(() => {
+ if (recorderTime.value === 60) {
+ recorderTime.value = 0
+ stopRecording()
+ startRecorderTime.value = false
+ }
+ if (!startRecorderTime.value) {
+ return
+ }
+ recorderTime.value++
+ handleTimeChange()
+ }, 1000)
+}
+
onMounted(() => {
handleInputFieldList()
})
diff --git a/ui/src/views/application-workflow/index.vue b/ui/src/views/application-workflow/index.vue
index 193ad29f2..8a591df9c 100644
--- a/ui/src/views/application-workflow/index.vue
+++ b/ui/src/views/application-workflow/index.vue
@@ -409,7 +409,7 @@ onBeforeUnmount(() => {
bottom: 16px;
right: 16px;
overflow: hidden;
- width: 420px;
+ width: 450px;
height: 600px;
.workflow-debug-header {
background: var(--app-header-bg-color);