zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

lcw

Browse Source
This commit is contained in:
lcw
2025-11-27 14:27:59 +08:00
parent 93c49dff27
commit 85f1f3a6f7
75 changed files with 1321 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
src/views/home/index.vue
View File

@ -51,17 +51,23 @@
<Yszs />
</div>
<div class="flex middle-bottom mt10">
<div
style="width: 30px;position: absolute;z-index: 100;left: 0;background-color: #07274d;height: 30px;text-align: center;line-height:30px;">
<el-icon :size="20" v-if="ispLayBack" @click="closeLayBack">
<Bell />
</el-icon>
<!-- -->
<el-icon :size="20" v-else @click="openLayBack">
<MuteNotification />
</el-icon>
</div>
<div style="width: 100%;border: 1px sienna;position: relative">
<GdMap></GdMap>
</div>
<div class="flex-1" style="width: 340px;position: absolute;z-index: 100;right: 0;">
<DeployControl />
</div>
<!-- <div class="flex-1" style="width: 340px;position: absolute;z-index: 100;left: 0;">
<div style="background-color: #07274d; height: 100px;">
生份证："xxxxxxxx"
</div>
</div> -->
<div class="flex-1" style="width: 340px;position: absolute;z-index: 100;left: 0;top: 30%;">
<GeneralWindow />
</div>
@ -79,6 +85,7 @@
<Bkcz></Bkcz>
</div>
</div>
</div>
<!-- 左边弹窗 -->
<LeftDialog></LeftDialog>
@ -86,7 +93,7 @@
</template>
<script setup>
import { ref, getCurrentInstance, reactive, onMounted, onUnmounted } from 'vue'
import { ref, onMounted, onUnmounted } from 'vue'
import LeftDialog from './dialog/leftDialog'
import GdMap from "@/components/GdMap/index.vue";
import Head from './layout/head.vue'
@ -98,7 +105,6 @@ import Bkcz from './model/bkcz.vue'
import WarningLevels from './model/warningLevels.vue'
import Yszs from './model/yszs.vue'
import DeployControl from './model/deployControl.vue';
import SituationAssessment from './model/situationAssessment.vue'
import Experience from './model/experience.vue'
import Calendar from './model/calendar.vue'
import KeyPpersonneltypes from './model/keyPpersonneltypes.vue'
@ -109,6 +115,11 @@ import { bm, centralPoint } from '@/views/backOfficeSystem/IntelligentControl/De
import Judgment from './model/judgment.vue'
import { tbYjxxGetList } from '@/api/zdr.js'
import GeneralWindow from './model/generalWindow.vue'
import WebSoketClass from '@/utils/webSocket.js'
import {timeValidate} from '@/utils/tools.js'
// 导入音频播放器工具类
import audioPlayer from '@/utils/audioPlayer'
const webSoket = new WebSoketClass()
const changeXzqh = (val, trg) => {
setTimeout(() => {
// 先移除已有的边界
@ -204,12 +215,89 @@ const makerCenter = () => {
})
emitter.emit("addPointArea", { coords, icon: dw, flag: "hm", size: '14px', showTitle: true, offset: [0, -25] });
}
//播放音频
const ispLayBack = ref(true)
// 打开播放
const openLayBack = () => {
ispLayBack.value = true
}
// 关闭播放
const closeLayBack = () => {
ispLayBack.value = false
audioPlayer.pause()
}
// 初始化音频播放器
const initAudioPlayer = () => {
// 使用工具类初始化音频播放器
audioPlayer.init(require('@/assets/images/yjsy.mp3'))
.then(() => {
console.log('音频播放器初始化成功');
// 只有当ispLayBack为true时才播放
if (ispLayBack.value) {
audioPlayer.muted = false
}
})
.catch(error => {
console.error('初始化音频播放器失败:', error);
})
}
// 组件挂载时初始化音频播放器
onMounted(() => {
getDepId()
makerCenter()
mouseLeave()
getTbYjxxGetList()
// 初始化音频播放器
initAudioPlayer()
webSoket.connect()
// 监听音频播放事件，获取WebSocket消息数据
emitter.on("openYp", (newsDate) => {
// 使用工具类播放音频，自动处理静音切换
if (ispLayBack.value) {
audioPlayer.play()
.then(() => {
console.log('WebSocket触发音频播放成功');
})
.catch(error => {
console.error('WebSocket触发音频播放失败:', error);
})
const coords = {
id: newsDate.id,
jd: newsDate.jd,
wd: newsDate.wd,
yjtp: newsDate.yjTp,
yjnr: newsDate.yjNr,
yjLx: newsDate.yjlx,
yjlx: '01',
yjsj: newsDate.yjSj,
rysfzh: newsDate.yjRysfzh,
ryxm: newsDate.yjRyxm,
}
const icons = require("@/assets/point/jq.png")
emitter.emit('addPointArea', { coords: [{ jd: coords.jd, wd: coords.wd }], icon: icons, flag: 'yjs' })
emitter.emit('yjDetail', coords)
}
})
emitter.on("closeYp", () => {
audioPlayer.pause()
})
})
const timeRef = ref('')
let bj=ref(0)
// 布控预警上图
const getTbYjxxGetList = () => {
tbYjxxGetList().then(res => {
// 设置为当天时间范围：00:00:00 到 23:59:59
const today = new Date();
const startTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 0, 0, 0).getTime();
const endTime = new Date(today.getFullYear(), today.getMonth(), today.getDate(), 23, 59, 59).getTime();
const promes = {
startTime:timeValidate(startTime),
endTime:timeValidate(endTime),
}
tbYjxxGetList(promes).then(res => {
const coords = res.map(item => {
return {
id: item.id,
@ -224,33 +312,12 @@ const getTbYjxxGetList = () => {
ryxm: item.yjRyxm,
}
})
if (timeRef.value != coords[0].yjsj&&bj.value==1) {
const icons = require("@/assets/point/jq.png")
emitter.emit('addPointArea', { coords: [{ jd: coords[0].jd, wd: coords[0].wd }], icon: icons, flag: 'yjs' })
emitter.emit('yjDetail', coords[0])
timeRef.value = coords[0].yjsj
}
bj.value=1
const icon = require("@/assets/point/yj.png")
emitter.emit('addPoint', { coords: coords, icon: icon, flag: 'yj', fontColor: '#FF0000' })
})
}
let timing = ref(true)
onMounted(() => {
getDepId()
makerCenter()
mouseLeave()
getTbYjxxGetList()
})
const timer = setInterval(() => {
getTbYjxxGetList()
}, 60000)
const reversalPushShow = ref(true)
const reversalPush = () => {
@ -272,7 +339,14 @@ const mouseLeave = () => {
}
onUnmounted(() => {
clearInterval(timing.value)
clearInterval(timer)
// 组件卸载时停止音频播放并释放资源
if (audioPlayer) {
audioPlayer.destroy()
}
// 组件卸载时关闭WebSocket连接
if (webSoket) {
webSoket.closeConnection()
}
})