feat: 支持上传mp3文件
This commit is contained in:
parent
28a2c9897d
commit
5c64d630a0
@ -6,7 +6,7 @@
|
|||||||
<div
|
<div
|
||||||
class="p-8-12"
|
class="p-8-12"
|
||||||
v-loading="localLoading"
|
v-loading="localLoading"
|
||||||
v-if="uploadDocumentList.length || uploadImageList.length"
|
v-if="uploadDocumentList.length || uploadImageList.length || uploadAudioList.length || uploadVideoList.length"
|
||||||
>
|
>
|
||||||
<el-space wrap>
|
<el-space wrap>
|
||||||
<template v-for="(item, index) in uploadDocumentList" :key="index">
|
<template v-for="(item, index) in uploadDocumentList" :key="index">
|
||||||
@ -53,6 +53,27 @@
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
<template v-for="(item, index) in uploadAudioList" :key="index">
|
||||||
|
<el-card shadow="never" style="--el-card-padding: 8px" class="file cursor">
|
||||||
|
<div
|
||||||
|
class="flex align-center"
|
||||||
|
@mouseenter.stop="mouseenter(item)"
|
||||||
|
@mouseleave.stop="mouseleave()"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
@click="deleteFile(index, 'audio')"
|
||||||
|
class="delete-icon color-secondary"
|
||||||
|
v-if="showDelete === item.url"
|
||||||
|
>
|
||||||
|
<el-icon><CircleCloseFilled /></el-icon>
|
||||||
|
</div>
|
||||||
|
<img :src="getImgUrl(item && item?.name)" alt="" width="24" />
|
||||||
|
<div class="ml-4 ellipsis" style="max-width: 160px" :title="item && item?.name">
|
||||||
|
{{ item && item?.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</template>
|
||||||
</el-space>
|
</el-space>
|
||||||
</div>
|
</div>
|
||||||
</el-scrollbar>
|
</el-scrollbar>
|
||||||
@ -200,7 +221,7 @@ const localLoading = computed({
|
|||||||
const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp']
|
const imageExtensions = ['jpg', 'jpeg', 'png', 'gif', 'bmp']
|
||||||
const documentExtensions = ['pdf', 'docx', 'txt', 'xls', 'xlsx', 'md', 'html', 'csv']
|
const documentExtensions = ['pdf', 'docx', 'txt', 'xls', 'xlsx', 'md', 'html', 'csv']
|
||||||
const videoExtensions = ['mp4', 'avi', 'mov', 'mkv', 'flv']
|
const videoExtensions = ['mp4', 'avi', 'mov', 'mkv', 'flv']
|
||||||
const audioExtensions = ['mp3', 'wav', 'aac', 'flac']
|
const audioExtensions = ['mp3']
|
||||||
|
|
||||||
const getAcceptList = () => {
|
const getAcceptList = () => {
|
||||||
const { image, document, audio, video } = props.applicationDetails.file_upload_setting
|
const { image, document, audio, video } = props.applicationDetails.file_upload_setting
|
||||||
@ -227,14 +248,14 @@ const getAcceptList = () => {
|
|||||||
const checkMaxFilesLimit = () => {
|
const checkMaxFilesLimit = () => {
|
||||||
return (
|
return (
|
||||||
props.applicationDetails.file_upload_setting.maxFiles <=
|
props.applicationDetails.file_upload_setting.maxFiles <=
|
||||||
uploadImageList.value.length + uploadDocumentList.value.length
|
uploadImageList.value.length + uploadDocumentList.value.length + uploadAudioList.value.length + uploadVideoList.value.length
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
const uploadFile = async (file: any, fileList: any) => {
|
const uploadFile = async (file: any, fileList: any) => {
|
||||||
const { maxFiles, fileLimit } = props.applicationDetails.file_upload_setting
|
const { maxFiles, fileLimit } = props.applicationDetails.file_upload_setting
|
||||||
// 单次上传文件数量限制
|
// 单次上传文件数量限制
|
||||||
const file_limit_once = uploadImageList.value.length + uploadDocumentList.value.length
|
const file_limit_once = uploadImageList.value.length + uploadDocumentList.value.length + uploadAudioList.value.length + uploadVideoList.value.length
|
||||||
if (file_limit_once >= maxFiles) {
|
if (file_limit_once >= maxFiles) {
|
||||||
MsgWarning('最多上传' + maxFiles + '个文件')
|
MsgWarning('最多上传' + maxFiles + '个文件')
|
||||||
fileList.splice(0, fileList.length)
|
fileList.splice(0, fileList.length)
|
||||||
@ -257,9 +278,9 @@ const uploadFile = async (file: any, fileList: any) => {
|
|||||||
} else if (documentExtensions.includes(extension)) {
|
} else if (documentExtensions.includes(extension)) {
|
||||||
uploadDocumentList.value.push(file)
|
uploadDocumentList.value.push(file)
|
||||||
} else if (videoExtensions.includes(extension)) {
|
} else if (videoExtensions.includes(extension)) {
|
||||||
// videos.push(file)
|
uploadVideoList.value.push(file)
|
||||||
} else if (audioExtensions.includes(extension)) {
|
} else if (audioExtensions.includes(extension)) {
|
||||||
// audios.push(file)
|
uploadAudioList.value.push(file)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@ -297,7 +318,20 @@ const uploadFile = async (file: any, fileList: any) => {
|
|||||||
file.file_id = f[0].file_id
|
file.file_id = f[0].file_id
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
console.log(uploadDocumentList.value, uploadImageList.value)
|
uploadAudioList.value.forEach((file: any) => {
|
||||||
|
const f = response.data.filter((f: any) => f.name === file.name)
|
||||||
|
if (f.length > 0) {
|
||||||
|
file.url = f[0].url
|
||||||
|
file.file_id = f[0].file_id
|
||||||
|
}
|
||||||
|
})
|
||||||
|
uploadVideoList.value.forEach((file: any) => {
|
||||||
|
const f = response.data.filter((f: any) => f.name === file.name)
|
||||||
|
if (f.length > 0) {
|
||||||
|
file.url = f[0].url
|
||||||
|
file.file_id = f[0].file_id
|
||||||
|
}
|
||||||
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
const recorderTime = ref(0)
|
const recorderTime = ref(0)
|
||||||
@ -306,6 +340,8 @@ const recorderLoading = ref(false)
|
|||||||
const inputValue = ref<string>('')
|
const inputValue = ref<string>('')
|
||||||
const uploadImageList = ref<Array<any>>([])
|
const uploadImageList = ref<Array<any>>([])
|
||||||
const uploadDocumentList = ref<Array<any>>([])
|
const uploadDocumentList = ref<Array<any>>([])
|
||||||
|
const uploadVideoList = ref<Array<any>>([])
|
||||||
|
const uploadAudioList = ref<Array<any>>([])
|
||||||
const mediaRecorderStatus = ref(true)
|
const mediaRecorderStatus = ref(true)
|
||||||
const showDelete = ref('')
|
const showDelete = ref('')
|
||||||
|
|
||||||
@ -433,11 +469,15 @@ function sendChatHandle(event: any) {
|
|||||||
if (inputValue.value.trim()) {
|
if (inputValue.value.trim()) {
|
||||||
props.sendMessage(inputValue.value, {
|
props.sendMessage(inputValue.value, {
|
||||||
image_list: uploadImageList.value,
|
image_list: uploadImageList.value,
|
||||||
document_list: uploadDocumentList.value
|
document_list: uploadDocumentList.value,
|
||||||
|
audio_list: uploadAudioList.value,
|
||||||
|
video_list: uploadVideoList.value,
|
||||||
})
|
})
|
||||||
inputValue.value = ''
|
inputValue.value = ''
|
||||||
uploadImageList.value = []
|
uploadImageList.value = []
|
||||||
uploadDocumentList.value = []
|
uploadDocumentList.value = []
|
||||||
|
uploadAudioList.value = []
|
||||||
|
uploadVideoList.value = []
|
||||||
quickInputRef.value.textareaStyle.height = '45px'
|
quickInputRef.value.textareaStyle.height = '45px'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -452,6 +492,10 @@ function deleteFile(index: number, val: string) {
|
|||||||
uploadImageList.value.splice(index, 1)
|
uploadImageList.value.splice(index, 1)
|
||||||
} else if (val === 'document') {
|
} else if (val === 'document') {
|
||||||
uploadDocumentList.value.splice(index, 1)
|
uploadDocumentList.value.splice(index, 1)
|
||||||
|
} else if (val === 'video') {
|
||||||
|
uploadVideoList.value.splice(index, 1)
|
||||||
|
} else if (val === 'audio') {
|
||||||
|
uploadAudioList.value.splice(index, 1)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function mouseenter(row: any) {
|
function mouseenter(row: any) {
|
||||||
|
|||||||
@ -68,6 +68,23 @@
|
|||||||
<el-checkbox v-model="form_data.image" />
|
<el-checkbox v-model="form_data.image" />
|
||||||
</div>
|
</div>
|
||||||
</el-card>
|
</el-card>
|
||||||
|
<el-card
|
||||||
|
shadow="hover"
|
||||||
|
class="card-checkbox cursor w-full mb-8"
|
||||||
|
:class="form_data.audio ? 'active' : ''"
|
||||||
|
style="--el-card-padding: 8px 16px"
|
||||||
|
>
|
||||||
|
<div class="flex-between">
|
||||||
|
<div class="flex align-center">
|
||||||
|
<img class="mr-12" src="@/assets/icon_file-image.svg" alt="" />
|
||||||
|
<div>
|
||||||
|
<p class="line-height-22 mt-4">音频(MP3)</p>
|
||||||
|
<el-text class="color-secondary">所选模型支持接收音频或与语音转文本节点配合使用</el-text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<el-checkbox v-model="form_data.audio" />
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
</el-form>
|
</el-form>
|
||||||
<template #footer>
|
<template #footer>
|
||||||
|
|||||||
@ -82,6 +82,12 @@ const refreshFileUploadConfig = () => {
|
|||||||
if (form_data[0].image) {
|
if (form_data[0].image) {
|
||||||
fileUploadFields.push({ label: '图片', value: 'image' })
|
fileUploadFields.push({ label: '图片', value: 'image' })
|
||||||
}
|
}
|
||||||
|
if (form_data[0].audio) {
|
||||||
|
fileUploadFields.push({ label: '音频', value: 'audio' })
|
||||||
|
}
|
||||||
|
if (form_data[0].video) {
|
||||||
|
fileUploadFields.push({ label: '视频', value: 'video' })
|
||||||
|
}
|
||||||
|
|
||||||
set(props.nodeModel.properties.config, 'fields', [...fields, ...fileUploadFields])
|
set(props.nodeModel.properties.config, 'fields', [...fields, ...fileUploadFields])
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user