diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3 new file mode 100644 index 0000000..6ec901f --- /dev/null +++ b/src/assets/audio/other.mp3 Binary files differ diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3 new file mode 100644 index 0000000..6ec901f --- /dev/null +++ b/src/assets/audio/other.mp3 Binary files differ diff --git a/src/components.d.ts b/src/components.d.ts index da3c131..2f92ca1 100644 --- a/src/components.d.ts +++ b/src/components.d.ts @@ -53,7 +53,6 @@ NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default'] NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default'] NormalTable: typeof import('./components/NormalTable/index.vue')['default'] - offline: typeof import('./components/map/index offline.vue')['default'] PageHeader: typeof import('./components/PageHeader/index.vue')['default'] PageMain: typeof import('./components/PageMain/index.vue')['default'] PcasCascader: typeof import('./components/PcasCascader/index.vue')['default'] diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3 new file mode 100644 index 0000000..6ec901f --- /dev/null +++ b/src/assets/audio/other.mp3 Binary files differ diff --git a/src/components.d.ts b/src/components.d.ts index da3c131..2f92ca1 100644 --- a/src/components.d.ts +++ b/src/components.d.ts @@ -53,7 +53,6 @@ NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default'] NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default'] NormalTable: typeof import('./components/NormalTable/index.vue')['default'] - offline: typeof import('./components/map/index offline.vue')['default'] PageHeader: typeof import('./components/PageHeader/index.vue')['default'] PageMain: typeof import('./components/PageMain/index.vue')['default'] PcasCascader: typeof import('./components/PcasCascader/index.vue')['default'] diff --git a/src/main.ts b/src/main.ts index 513faee..3c85f1e 100644 --- a/src/main.ts +++ b/src/main.ts @@ -11,6 +11,8 @@ import request from '@/api/index' import indexDB from '@/utils/indexDB' import '@/utils/getLocation' +// 引入音频文件 +import alarmAudio from '@/assets/audio/alarm.mp3' // 自定义指令 import { dragHeight } from '@/directives/drag-height/index' import { dragWidth } from '@/directives/drag-width/index' @@ -29,7 +31,10 @@ if (useSettingsStore().app.iconifyOfflineUse) { downloadAndInstall() } - +// 引入音频文件 +const audio = new Audio(alarmAudio) +// 设置音频循环播放 +audio.loop = false axios .get('./config/config.json', { headers: { @@ -77,37 +82,18 @@ }) // ============================音频=========================== - // 方法1：注册播放音频事件到Vue实例上 - // app.config.globalProperties.playAudio = () => { - // const audio = document.getElementById('eventAudio') as HTMLAudioElement - // audio.setAttribute('src', alarmAudio) - // audio.loop = true - // if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素 - // audio.load() - // } - // else { // 否则 - // // audio.pause() - // setTimeout(() => { - // // audio.play() - // const playPromise = audio.load() - // if (playPromise) { - // playPromise.then(() => { - // // 音频加载成功 - // console.log('音频加载成功') - // }).catch((e) => { - // // 音频加载失败 - // console.error(e.message) - // }) - // } - // }, 10) - // } - // } - // app.config.globalProperties.pauseAudio = () => { - // const audio = document.getElementById('eventAudio') as HTMLAudioElement - // if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素 - // audio.pause() - // } - // } + // 注册全局播放音频事件 + app.config.globalProperties.$playAudio = () => { + audio.play().catch((error) => { + console.error('播放音频时出错:', error) + }) + } + + // 注册全局停止播放音频事件 + app.config.globalProperties.$stopAudio = () => { + audio.pause() + audio.currentTime = 0 + } // ============================音频=========================== // app.use(print) app.use(ElementPlus) diff --git a/src/assets/audio/other.mp3 b/src/assets/audio/other.mp3 new file mode 100644 index 0000000..6ec901f --- /dev/null +++ b/src/assets/audio/other.mp3 Binary files differ diff --git a/src/components.d.ts b/src/components.d.ts index da3c131..2f92ca1 100644 --- a/src/components.d.ts +++ b/src/components.d.ts @@ -53,7 +53,6 @@ NodeWrap: typeof import('./components/workFlow/nodeWrap.vue')['default'] NodeWrapBan: typeof import('./components/workFlow/nodeWrapBan.vue')['default'] NormalTable: typeof import('./components/NormalTable/index.vue')['default'] - offline: typeof import('./components/map/index offline.vue')['default'] PageHeader: typeof import('./components/PageHeader/index.vue')['default'] PageMain: typeof import('./components/PageMain/index.vue')['default'] PcasCascader: typeof import('./components/PcasCascader/index.vue')['default'] diff --git a/src/main.ts b/src/main.ts index 513faee..3c85f1e 100644 --- a/src/main.ts +++ b/src/main.ts @@ -11,6 +11,8 @@ import request from '@/api/index' import indexDB from '@/utils/indexDB' import '@/utils/getLocation' +// 引入音频文件 +import alarmAudio from '@/assets/audio/alarm.mp3' // 自定义指令 import { dragHeight } from '@/directives/drag-height/index' import { dragWidth } from '@/directives/drag-width/index' @@ -29,7 +31,10 @@ if (useSettingsStore().app.iconifyOfflineUse) { downloadAndInstall() } - +// 引入音频文件 +const audio = new Audio(alarmAudio) +// 设置音频循环播放 +audio.loop = false axios .get('./config/config.json', { headers: { @@ -77,37 +82,18 @@ }) // ============================音频=========================== - // 方法1：注册播放音频事件到Vue实例上 - // app.config.globalProperties.playAudio = () => { - // const audio = document.getElementById('eventAudio') as HTMLAudioElement - // audio.setAttribute('src', alarmAudio) - // audio.loop = true - // if (audio.paused === true) { // 判断音频是否暂停,暂停重新加载音频元素 - // audio.load() - // } - // else { // 否则 - // // audio.pause() - // setTimeout(() => { - // // audio.play() - // const playPromise = audio.load() - // if (playPromise) { - // playPromise.then(() => { - // // 音频加载成功 - // console.log('音频加载成功') - // }).catch((e) => { - // // 音频加载失败 - // console.error(e.message) - // }) - // } - // }, 10) - // } - // } - // app.config.globalProperties.pauseAudio = () => { - // const audio = document.getElementById('eventAudio') as HTMLAudioElement - // if (!audio.paused) { // 判断音频是否暂停,暂停重新加载音频元素 - // audio.pause() - // } - // } + // 注册全局播放音频事件 + app.config.globalProperties.$playAudio = () => { + audio.play().catch((error) => { + console.error('播放音频时出错:', error) + }) + } + + // 注册全局停止播放音频事件 + app.config.globalProperties.$stopAudio = () => { + audio.pause() + audio.currentTime = 0 + } // ============================音频=========================== // app.use(print) app.use(ElementPlus) diff --git a/src/views/patrol/manage/index.vue b/src/views/patrol/manage/index.vue index bfbb5d3..d991a56 100644 --- a/src/views/patrol/manage/index.vue +++ b/src/views/patrol/manage/index.vue @@ -12,6 +12,7 @@ import useSocket from '@/store/modules/websocket' import { getDeviceList, getRouteLog } from '@/api/patrol/manage' import { controlDevice, delRoute, getRouteByDog, getRouteList } from '@/api/patrol/navigation' +const { proxy } = getCurrentInstance() as any const socket = useSocket() const mapRef = ref() // 地图组件 const currentDevice: any = ref({ @@ -284,11 +285,13 @@ if (newVal.patrolType === '10011') { if (newVal.isAlarm === '0') { console.log('执行消警') + proxy.$stopAudio() mapRef.value.closeAlarmInfoWindow() mapRef.value.removeAlarmLayer() } else if (newVal.isAlarm === '1') { console.log('执行报警') + proxy.$playAudio() const url = `${window.localStorage.getItem('BaseUrl')}/static/${newVal.picture}` const routeInfo = routePointsList.value.length ? routePointsList.value[0] : {} // 巡检路线信息 const params = { @@ -428,6 +431,14 @@ }) }) +function handle(type: string) { + if (type === '1') { + proxy.$playAudio() + } + else if (type === '0') { + proxy.$stopAudio() + } +} onBeforeUnmount(() => { destroyVideo() // 销毁实时视频 }) @@ -437,6 +448,12 @@ +