diff --git a/main/manager-web/src/components/VoicePrintDialog.vue b/main/manager-web/src/components/VoicePrintDialog.vue index a9f861db..b549f6e2 100644 --- a/main/manager-web/src/components/VoicePrintDialog.vue +++ b/main/manager-web/src/components/VoicePrintDialog.vue @@ -14,8 +14,13 @@ - + + {{ item.content }} + + + + @@ -71,6 +76,8 @@ export default { return { dialogKey: Date.now(), saving: false, + playingAudioId: null, + audioElement: null, valueTypeOptions: [ { audioId: '', content: '' } ], @@ -88,6 +95,45 @@ export default { }; }, methods: { + getAudioIconClass(audioId) { + if (this.playingAudioId === audioId) { + return 'el-icon-loading'; + } + return 'el-icon-video-play'; + }, + playAudio(audioId) { + if (this.playingAudioId === audioId) { + // 如果正在播放当前音频,则停止播放 + if (this.audioElement) { + this.audioElement.pause(); + this.audioElement = null; + } + this.playingAudioId = null; + return; + } + + // 停止当前正在播放的音频 + if (this.audioElement) { + this.audioElement.pause(); + this.audioElement = null; + } + + // 先获取音频下载ID + this.playingAudioId = audioId; + api.agent.getAudioId(audioId, (res) => { + if (res.data && res.data.data) { + // 使用获取到的下载ID播放音频 + this.audioElement = new Audio(api.getServiceUrl() + `/agent/play/${res.data.data}`); + + this.audioElement.onended = () => { + this.playingAudioId = null; + this.audioElement = null; + }; + + this.audioElement.play(); + } + }); + }, submit() { this.$refs.form.validate((valid) => { if (valid) { @@ -148,6 +194,13 @@ export default {