This commit is contained in:
liqi
parent
e8d30616a2
commit
5222704c0e
|
|
@ -1,5 +1,3 @@
|
|||
NODE_ENV = 'development'
|
||||
# VUE_APP_API_URL = 'http://192.168.0.74:5002'
|
||||
# VUE_APP_API_URL = 'http://111.198.19.33:5002'
|
||||
VUE_APP_API_URL = 'http://114.66.57.139:5001/'
|
||||
VUE_APP_API_URL = 'http://114.66.57.139:8088'
|
||||
VUE_APP_MESSAGE_SDK_DEBUG = true
|
||||
|
|
@ -38,14 +38,20 @@
|
|||
<div class="left-contract" @click="handleContractClick">
|
||||
<img :src="isContracted ? rightContract : leftContract" alt="" />
|
||||
</div>
|
||||
<video
|
||||
<audio
|
||||
controls
|
||||
loop
|
||||
ref="uavAudio"
|
||||
v-show="iswarning"
|
||||
title="Advertisement"
|
||||
src="@/assets/img/wargin.mp3"
|
||||
autoplay="true"
|
||||
muted="muted"
|
||||
ref="nativeElement"
|
||||
></video>
|
||||
style="display: none"
|
||||
>
|
||||
<source src="@/assets/img/wargin.mp3" type="audio/mpeg" />
|
||||
</audio>
|
||||
<div class="audio-prompt" v-if="showAudioPrompt" @click="enableAudio">
|
||||
<div class="prompt-content">
|
||||
<p>因浏览器限制，点击打开声音</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -97,6 +103,7 @@ export default {
|
|||
iswarning: false
|
||||
};
|
||||
},
|
||||
mounted() {},
|
||||
watch: {
|
||||
homeData: {
|
||||
handler(newVal) {
|
||||
|
|
@ -142,14 +149,31 @@ export default {
|
|||
mapUavFiex(this.drones);
|
||||
}
|
||||
let alarm = this.drones.find((d) => d.alarmLevel === 1);
|
||||
const media = this.$refs.uavAudio; // 修正 ref 名称为 "uavAudio"
|
||||
if (alarm) {
|
||||
this.iswarning = true;
|
||||
const media = this.$refs.nativeElement;
|
||||
media.muted = true;
|
||||
media.play();
|
||||
this.$nextTick(() => {
|
||||
if (media) {
|
||||
media.muted = true; // 初始静音
|
||||
media
|
||||
.play()
|
||||
.then(() => {
|
||||
console.log("播放成功，取消静音");
|
||||
media.muted = false; // 播放成功后取消静音
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log("播放失败:", error);
|
||||
this.showAudioPrompt = true; // 播放失败时显示提示框
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
console.log(222);
|
||||
console.log("无告警");
|
||||
this.iswarning = false;
|
||||
if (media) {
|
||||
media.pause(); // 无告警时停止播放
|
||||
media.currentTime = 0; // 重置到开始
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
@ -157,6 +181,26 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
enableAudio() {
|
||||
this.iswarning = true;
|
||||
const media = this.$refs.uavAudio;
|
||||
let time = setInterval(() => {
|
||||
console.log("用户手动启用音频", media);
|
||||
if (media !== undefined) {
|
||||
clearInterval(time);
|
||||
media.muted = false; // 取消静音
|
||||
media
|
||||
.play()
|
||||
.then(() => {
|
||||
console.log("用户手动启用音频成功");
|
||||
this.showAudioPrompt = false; // 关闭提示框
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("手动播放失败:", error);
|
||||
});
|
||||
}
|
||||
}, 500);
|
||||
},
|
||||
startTimer(item) {
|
||||
return setInterval(() => {
|
||||
if (item.currTime > 0) {
|
||||
|
|
@ -260,4 +304,19 @@ export default {
|
|||
.left-sidebar.contracted {
|
||||
transform: translateX(-90%);
|
||||
}
|
||||
.audio-prompt {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
width: 15%;
|
||||
height: 10%;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
z-index: 1000;
|
||||
color: #fff;
|
||||
border-radius: 5px;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -44,11 +44,6 @@
|
|||
alt=""
|
||||
/>
|
||||
</template>
|
||||
<template #enabled="{ data }">
|
||||
<span :style="getStatusStyle(data.onlineStatus)">
|
||||
{{ data.onlineStatus == 0 ? "正常" : "离线" }}
|
||||
</span>
|
||||
</template>
|
||||
<template #operate="{ data }">
|
||||
<el-link
|
||||
type="primary"
|
||||
|
|
@ -146,11 +141,6 @@ export default {
|
|||
type: "img",
|
||||
model: "img"
|
||||
},
|
||||
{
|
||||
label: "是否启用",
|
||||
type: "switch",
|
||||
model: "enabled"
|
||||
},
|
||||
{
|
||||
label: "备注",
|
||||
type: "textarea",
|
||||
|
|
@ -160,298 +150,7 @@ export default {
|
|||
model: "remarks"
|
||||
}
|
||||
],
|
||||
tableData: [
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
},
|
||||
{
|
||||
id: 1,
|
||||
code: "123",
|
||||
name: "测试防区",
|
||||
area: [
|
||||
{
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
city: "北京市",
|
||||
address: "北京市海淀区西二旗",
|
||||
ownerUnit: "北京市海淀区西二旗",
|
||||
createTime: "2021-01-01 12:00:00",
|
||||
enabled: true,
|
||||
devices: [
|
||||
{
|
||||
id: 1,
|
||||
name: "设备1"
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: "设备2"
|
||||
}
|
||||
],
|
||||
img: "https://www.baidu.com/img/bd_logo1.png"
|
||||
}
|
||||
],
|
||||
tableData: [],
|
||||
coloumData: [
|
||||
{
|
||||
slot: "img",
|
||||
|
|
@ -469,13 +168,9 @@ export default {
|
|||
},
|
||||
{
|
||||
type: "text",
|
||||
label: "启用时间",
|
||||
label: "创建时间",
|
||||
prop: "createTime"
|
||||
},
|
||||
{
|
||||
slot: "enabled",
|
||||
label: "状态"
|
||||
},
|
||||
{
|
||||
slot: "operate",
|
||||
label: "操作",
|
||||
|
|
|
|||
Loading…
Reference in New Issue