This commit is contained in:
liqi
parent
e8d30616a2
commit
5222704c0e
|
|
@ -1,5 +1,3 @@
|
||||||
NODE_ENV = 'development'
|
NODE_ENV = 'development'
|
||||||
# VUE_APP_API_URL = 'http://192.168.0.74:5002'
|
VUE_APP_API_URL = 'http://114.66.57.139:8088'
|
||||||
# VUE_APP_API_URL = 'http://111.198.19.33:5002'
|
|
||||||
VUE_APP_API_URL = 'http://114.66.57.139:5001/'
|
|
||||||
VUE_APP_MESSAGE_SDK_DEBUG = true
|
VUE_APP_MESSAGE_SDK_DEBUG = true
|
||||||
|
|
@ -38,14 +38,20 @@
|
||||||
<div class="left-contract" @click="handleContractClick">
|
<div class="left-contract" @click="handleContractClick">
|
||||||
<img :src="isContracted ? rightContract : leftContract" alt="" />
|
<img :src="isContracted ? rightContract : leftContract" alt="" />
|
||||||
</div>
|
</div>
|
||||||
<video
|
<audio
|
||||||
|
controls
|
||||||
|
loop
|
||||||
|
ref="uavAudio"
|
||||||
v-show="iswarning"
|
v-show="iswarning"
|
||||||
title="Advertisement"
|
style="display: none"
|
||||||
src="@/assets/img/wargin.mp3"
|
>
|
||||||
autoplay="true"
|
<source src="@/assets/img/wargin.mp3" type="audio/mpeg" />
|
||||||
muted="muted"
|
</audio>
|
||||||
ref="nativeElement"
|
<div class="audio-prompt" v-if="showAudioPrompt" @click="enableAudio">
|
||||||
></video>
|
<div class="prompt-content">
|
||||||
|
<p>因浏览器限制，点击打开声音</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -97,6 +103,7 @@ export default {
|
||||||
iswarning: false
|
iswarning: false
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
mounted() {},
|
||||||
watch: {
|
watch: {
|
||||||
homeData: {
|
homeData: {
|
||||||
handler(newVal) {
|
handler(newVal) {
|
||||||
|
|
@ -142,14 +149,31 @@ export default {
|
||||||
mapUavFiex(this.drones);
|
mapUavFiex(this.drones);
|
||||||
}
|
}
|
||||||
let alarm = this.drones.find((d) => d.alarmLevel === 1);
|
let alarm = this.drones.find((d) => d.alarmLevel === 1);
|
||||||
|
const media = this.$refs.uavAudio; // 修正 ref 名称为 "uavAudio"
|
||||||
if (alarm) {
|
if (alarm) {
|
||||||
this.iswarning = true;
|
this.iswarning = true;
|
||||||
const media = this.$refs.nativeElement;
|
this.$nextTick(() => {
|
||||||
media.muted = true;
|
if (media) {
|
||||||
media.play();
|
media.muted = true; // 初始静音
|
||||||
|
media
|
||||||
|
.play()
|
||||||
|
.then(() => {
|
||||||
|
console.log("播放成功，取消静音");
|
||||||
|
media.muted = false; // 播放成功后取消静音
|
||||||
|
})
|
||||||
|
.catch((error) => {
|
||||||
|
console.log("播放失败:", error);
|
||||||
|
this.showAudioPrompt = true; // 播放失败时显示提示框
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
} else {
|
} else {
|
||||||
console.log(222);
|
console.log("无告警");
|
||||||
this.iswarning = false;
|
this.iswarning = false;
|
||||||
|
if (media) {
|
||||||
|
media.pause(); // 无告警时停止播放
|
||||||
|
media.currentTime = 0; // 重置到开始
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -157,6 +181,26 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
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) {
|
startTimer(item) {
|
||||||
return setInterval(() => {
|
return setInterval(() => {
|
||||||
if (item.currTime > 0) {
|
if (item.currTime > 0) {
|
||||||
|
|
@ -260,4 +304,19 @@ export default {
|
||||||
.left-sidebar.contracted {
|
.left-sidebar.contracted {
|
||||||
transform: translateX(-90%);
|
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>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -44,11 +44,6 @@
|
||||||
alt=""
|
alt=""
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<template #enabled="{ data }">
|
|
||||||
<span :style="getStatusStyle(data.onlineStatus)">
|
|
||||||
{{ data.onlineStatus == 0 ? "正常" : "离线" }}
|
|
||||||
</span>
|
|
||||||
</template>
|
|
||||||
<template #operate="{ data }">
|
<template #operate="{ data }">
|
||||||
<el-link
|
<el-link
|
||||||
type="primary"
|
type="primary"
|
||||||
|
|
@ -146,11 +141,6 @@ export default {
|
||||||
type: "img",
|
type: "img",
|
||||||
model: "img"
|
model: "img"
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: "是否启用",
|
|
||||||
type: "switch",
|
|
||||||
model: "enabled"
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "备注",
|
label: "备注",
|
||||||
type: "textarea",
|
type: "textarea",
|
||||||
|
|
@ -160,298 +150,7 @@ export default {
|
||||||
model: "remarks"
|
model: "remarks"
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
tableData: [
|
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"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
coloumData: [
|
coloumData: [
|
||||||
{
|
{
|
||||||
slot: "img",
|
slot: "img",
|
||||||
|
|
@ -469,13 +168,9 @@ export default {
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
type: "text",
|
type: "text",
|
||||||
label: "启用时间",
|
label: "创建时间",
|
||||||
prop: "createTime"
|
prop: "createTime"
|
||||||
},
|
},
|
||||||
{
|
|
||||||
slot: "enabled",
|
|
||||||
label: "状态"
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
slot: "operate",
|
slot: "operate",
|
||||||
label: "操作",
|
label: "操作",
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue