@@ -26,11 +26,11 @@ const abilityApi = { | |||
getPushInfo(params: any) { | |||
return http.get("getWarnPushSetting", params); | |||
}, | |||
/** 获取告警分组 */ | |||
/** 获取预警分组 */ | |||
warnGroup(params: ReqId) { | |||
return http.get("getWarnGroup", params); | |||
}, | |||
/** 关联摄像头和告警分组 */ | |||
/** 关联摄像头和预警分组 */ | |||
setWarnGroup(params: setWarn) { | |||
return http.post("setWarnGroupDevice", params); | |||
}, | |||
@@ -34,15 +34,15 @@ const warnZJRQApi = { | |||
delete(params: ReqId[]) { | |||
return http.post("deleteInfoD", params); | |||
}, | |||
/** 获取告警分组 */ | |||
/** 获取预警分组 */ | |||
warnGroup(params: ReqId) { | |||
return http.get("getInfo", params); | |||
}, | |||
/** 获取告警分组 */ | |||
/** 获取预警分组 */ | |||
warnType(params: ReqId) { | |||
return http.get("getAlarmType", params); | |||
}, | |||
/** 处理告警 */ | |||
/** 处理预警 */ | |||
handWarn(params: ReqId) { | |||
return http.post("handWarn", params); | |||
} | |||
@@ -1,81 +1,82 @@ | |||
<!-- | |||
* @Description: 告警管理 | |||
* @Description: 预警管理 | |||
* @Author: huguodong | |||
* @Date: 2023-12-15 15:44:05 | |||
!--> | |||
<template> | |||
<div class="video-box"> | |||
<videoPlay v-if="options.src" ref="aplayVideo" v-bind="options" @play="onPlay"/> | |||
</div> | |||
</template> | |||
<div class="video-box"> | |||
<videoPlay v-if="options.src" ref="aplayVideo" v-bind="options" @play="onPlay" /> | |||
</div> | |||
</template> | |||
<script setup lang="tsx" name="sysSpa"> | |||
import "vue3-video-play/dist/style.css"; | |||
import {videoPlay} from "vue3-video-play"; | |||
const onPlay = (ev) => { | |||
import "vue3-video-play/dist/style.css"; | |||
import { videoPlay } from "vue3-video-play"; | |||
const onPlay = ev => { | |||
console.log("播放"); | |||
}; | |||
const props = defineProps({ | |||
videoUrl: String, | |||
videoType: String, | |||
videoType: String | |||
}); | |||
// 视频播放组件 | |||
const options = reactive({ | |||
type: '', | |||
width: '100%', //播放器高度 | |||
height: '100%', //播放器高度 | |||
color: "#409eff", //主题色 | |||
title: "", //视频名称 | |||
webFullScreen:false,//网页全屏 | |||
speed:true,//是否支持快进快退 | |||
currentTime:0,//跳转到固定播放时间(s) | |||
muted:false,//静音 | |||
autoPlay: true, //自动播放 | |||
loop:false,//循环播放 | |||
mirror:false,//镜像画面 | |||
control: true, //是否显示控制器 | |||
ligthOff:false,//关灯模式 | |||
volume:0.3,//默认音量0-1 | |||
src: '', //视频源 | |||
poster: '', //封面 | |||
speedRate: [1.0,1.25,1.5,2.0], // 可选的播放速度 | |||
controlBtns: [ | |||
"audioTrack",//音轨切换按钮 | |||
"quality",//视频质量切换按钮 | |||
"speedRate",//速率切换按钮 | |||
"volume",//音量 | |||
"setting",//设置 | |||
"pip",//画中画按钮 | |||
"pageFullScreen",//网页全屏按钮 | |||
"fullScreen",//全屏按钮 | |||
], //显示所有按钮, | |||
}) | |||
type: "", | |||
width: "100%", //播放器高度 | |||
height: "100%", //播放器高度 | |||
color: "#409eff", //主题色 | |||
title: "", //视频名称 | |||
webFullScreen: false, //网页全屏 | |||
speed: true, //是否支持快进快退 | |||
currentTime: 0, //跳转到固定播放时间(s) | |||
muted: false, //静音 | |||
autoPlay: true, //自动播放 | |||
loop: false, //循环播放 | |||
mirror: false, //镜像画面 | |||
control: true, //是否显示控制器 | |||
ligthOff: false, //关灯模式 | |||
volume: 0.3, //默认音量0-1 | |||
src: "", //视频源 | |||
poster: "", //封面 | |||
speedRate: [1.0, 1.25, 1.5, 2.0], // 可选的播放速度 | |||
controlBtns: [ | |||
"audioTrack", //音轨切换按钮 | |||
"quality", //视频质量切换按钮 | |||
"speedRate", //速率切换按钮 | |||
"volume", //音量 | |||
"setting", //设置 | |||
"pip", //画中画按钮 | |||
"pageFullScreen", //网页全屏按钮 | |||
"fullScreen" //全屏按钮 | |||
] //显示所有按钮, | |||
}); | |||
// 监视props.msg的变化 | |||
watch(() => props.videoType, (newValue) => { | |||
if(newValue) { | |||
options.type = newValue; | |||
console.log(options.type) | |||
watch( | |||
() => props.videoType, | |||
newValue => { | |||
if (newValue) { | |||
options.type = newValue; | |||
console.log(options.type); | |||
} else { | |||
options.type = 'video/mp4'; | |||
options.type = "video/mp4"; | |||
} | |||
},{ deep: true, immediate: true }); | |||
watch(() => props.videoUrl, (newValue) => { | |||
}, | |||
{ deep: true, immediate: true } | |||
); | |||
watch( | |||
() => props.videoUrl, | |||
newValue => { | |||
options.src = newValue; | |||
},{ deep: true, immediate: true }); | |||
}, | |||
{ deep: true, immediate: true } | |||
); | |||
onMounted(() => { | |||
// 在这里执行其他需要在组件挂载后运行的代码 | |||
}); | |||
</script> | |||
// 在这里执行其他需要在组件挂载后运行的代码 | |||
}); | |||
</script> | |||
<style lang="scss" scoped> | |||
</style> | |||
</style> | |||
@@ -1,16 +1,16 @@ | |||
<template> | |||
<div class="tool-bar-ri"> | |||
<div class="header-icon"> | |||
<el-icon @click="opens" color="#ccc" :size="25" style="margin-right: 5px; cursor: pointer"> | |||
<!-- <el-icon @click="opens" color="#ccc" :size="25" style="margin-right: 5px; cursor: pointer"> | |||
<Box /> | |||
</el-icon> | |||
</el-icon> --> | |||
<el-icon @click="open" color="#ccc" :size="29" style="margin-right: 20px; cursor: pointer"> | |||
<VideoCamera /> | |||
</el-icon> | |||
<AssemblySize id="assemblySize" /> | |||
<SearchMenu id="searchMenu" /> | |||
<ThemeSetting id="themeSetting" /> | |||
<Message id="message" /> | |||
<!-- <Message id="message" /> --> | |||
<Fullscreen id="fullscreen" /> | |||
<ChangeModule id="changeModule" /> | |||
</div> | |||
@@ -26,7 +26,7 @@ | |||
<img src="@/assets/images/home/warn.png" alt="" /> | |||
</div> | |||
<div class="home-bg-content-item-content"> | |||
<div class="home-bg-content-item-title">告警信息总量</div> | |||
<div class="home-bg-content-item-title">预警信息总量</div> | |||
<div class="home-bg-content-item-value">1972</div> | |||
</div> | |||
</div></el-col | |||
@@ -61,7 +61,7 @@ | |||
<div class="home-bg card"> | |||
<div class="home-bg-title"> | |||
<div></div> | |||
<div>今日告警情况</div> | |||
<div>今日预警情况</div> | |||
</div> | |||
<div class="home-bg-content"> | |||
<div ref="chart1" style="width: 100%; height: 100%"></div> | |||
@@ -175,7 +175,7 @@ function getCharts1(data: any) { | |||
}, | |||
series: [ | |||
{ | |||
name: "今日告警情况", | |||
name: "今日预警情况", | |||
type: "pie", | |||
radius: ["60%", "90%"], | |||
avoidLabelOverlap: false, | |||
@@ -333,7 +333,7 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [ | |||
}, | |||
{ | |||
prop: "warntotal", | |||
label: "告警总量" | |||
label: "预警总量" | |||
// render: () => { | |||
// return "楼道"; | |||
// } | |||
@@ -1,11 +1,11 @@ | |||
<!-- | |||
* @Description: 告警管理 | |||
* @Description: 预警管理 | |||
* @Author: huguodong | |||
* @Date: 2023-12-15 15:44:05 | |||
!--> | |||
<template> | |||
<div class="table-box"> | |||
<ProTable ref="proTable" title="告警列表" :columns="columns" :data="tableData"> | |||
<ProTable ref="proTable" title="预警列表" :columns="columns" :data="tableData"> | |||
<!-- 表格 header 按钮 --> | |||
<!-- 表格 菜单类型 按钮 --> | |||
@@ -2,15 +2,15 @@ | |||
<div style="width: 100%; height: 100%"> | |||
<div class="commontitle"> | |||
<div class="left"> | |||
<span>学员课堂告警情况</span> | |||
<span>学员课堂预警情况</span> | |||
<img src="/static/screen/img/titleIcon.png" alt="" /> | |||
</div> | |||
<div class="right"> | |||
<img src="/static/screen/img/redLight.png" alt="" /> | |||
<span>告警数量({{ alarmList.length }})</span> | |||
<span>预警数量({{ alarmList.length }})</span> | |||
</div> | |||
</div> | |||
<div style="height: 568px; overflow: auto; margin-top: 4px"> | |||
<div style="height: 568px; margin-top: 4px; overflow: auto"> | |||
<ul> | |||
<li v-for="item in alarmList" :key="item.id"> | |||
<div class="name">{{ item.personName || "未知" }}</div> | |||
@@ -20,7 +20,7 @@ | |||
<div class="title">{{ item.alarmTypeDesc }}</div> | |||
</li> | |||
</ul> | |||
<div v-if="alarmList.length == 0" style="text-align: center; margin-top: 160px; color: #78dfff; font-size: 14px">暂无告警</div> | |||
<div v-if="alarmList.length == 0" style="margin-top: 160px; font-size: 14px; color: #78dfff; text-align: center">暂无预警</div> | |||
</div> | |||
</div> | |||
</template> | |||
@@ -36,13 +36,13 @@ onMounted(() => { | |||
<style scoped lang="scss"> | |||
.commontitle { | |||
.right { | |||
color: #ffa1a1; | |||
font-size: 14px; | |||
color: #ffa1a1; | |||
img { | |||
width: 18px; | |||
position: relative; | |||
top: 4px; | |||
right: 6px; | |||
width: 18px; | |||
} | |||
} | |||
} | |||
@@ -50,43 +50,43 @@ ul { | |||
display: flex; | |||
flex-wrap: wrap; | |||
li { | |||
box-sizing: border-box; | |||
width: 129.366px; | |||
height: 173.506px; | |||
background: #182665; | |||
padding: 0 10px; | |||
box-sizing: border-box; | |||
padding-top: 6px; | |||
margin-top: 7.8px; | |||
margin-right: 16px; | |||
margin-bottom: 7.8px; | |||
margin-top: 7.8px; | |||
background: #182665; | |||
&:nth-child(7n) { | |||
margin-right: 0px; | |||
margin-right: 0; | |||
} | |||
.name { | |||
color: #fff; | |||
text-align: center; | |||
font-size: 14px; | |||
color: #ffffff; | |||
text-align: center; | |||
} | |||
.imgbox { | |||
margin-top: 5px; | |||
width: 109.702px; | |||
height: 112.44px; | |||
object-fit: cover; | |||
margin-top: 5px; | |||
text-align: center; | |||
object-fit: cover; | |||
.el-image { | |||
height: 100%; | |||
width: 100%; | |||
height: 100%; | |||
} | |||
} | |||
.title { | |||
background: #0c4dcf; | |||
width: 109.702px; | |||
height: 23px; | |||
color: #fff; | |||
text-align: center; | |||
font-size: 14px; | |||
line-height: 23px; | |||
color: #ffffff; | |||
text-align: center; | |||
background: #0c4dcf; | |||
} | |||
} | |||
} | |||
</style> | |||
</style> |
@@ -2,7 +2,7 @@ | |||
<div style="width: 100%; height: 100%"> | |||
<div class="commontitle"> | |||
<div class="left"> | |||
<span>今日告警信息</span> | |||
<span>今日预警信息</span> | |||
<img src="/static/screen/img/titleIcon.png" alt="" /> | |||
</div> | |||
<div class="right"> | |||
@@ -22,14 +22,14 @@ | |||
<div class="todayBoticeTotal myborder1"> | |||
<div | |||
style=" | |||
position: relative; | |||
bottom: 3px; | |||
width: 40px; | |||
height: 40px; | |||
margin-right: 14px; | |||
text-align: center; | |||
border: 1px solid #ab2626; | |||
border-radius: 50%; | |||
text-align: center; | |||
position: relative; | |||
bottom: 3px; | |||
margin-right: 14px; | |||
" | |||
> | |||
<img src="/static/screen/img/redLight.png" alt="" style="width: 22px; margin-top: 5px" /> | |||
@@ -38,7 +38,7 @@ | |||
今日<span>7</span>个场景预警总计:<span class="total">{{ count }}</span> 起 | |||
</div> | |||
</div> | |||
<div style="width: 100%; height: calc(100% - 136px); overflow: auto; margin-top: 29px"> | |||
<div style="width: 100%; height: calc(100% - 136px); margin-top: 29px; overflow: auto"> | |||
<ul> | |||
<template v-for="item in warnList" :key="item.id"> | |||
<li> | |||
@@ -61,7 +61,7 @@ | |||
</li> | |||
</template> | |||
<template v-if="!warnList.length"> | |||
<div style="color: #10cefe; text-align: center; margin-top: 18px; font-size: 14px">暂无数据</div> | |||
<div style="margin-top: 18px; font-size: 14px; color: #10cefe; text-align: center">暂无数据</div> | |||
</template> | |||
</ul> | |||
</div> | |||
@@ -104,36 +104,36 @@ onMounted(() => { | |||
<style scoped lang="scss"> | |||
.todayBoticeTotal { | |||
box-sizing: border-box; | |||
display: flex; | |||
align-content: center; | |||
width: 588px; | |||
height: 59px; | |||
background: #0f1e5e; | |||
color: #78dfff; | |||
padding-top: 13px; | |||
padding-left: 25px; | |||
margin-top: 22px; | |||
font-family: "Microsoft YaHei UI"; | |||
font-size: 16px; | |||
margin-top: 22px; | |||
padding-left: 25px; | |||
padding-top: 13px; | |||
box-sizing: border-box; | |||
display: flex; | |||
align-content: center; | |||
color: #78dfff; | |||
background: #0f1e5e; | |||
span.total { | |||
color: #ff483a; | |||
font-family: "Microsoft YaHei UI"; | |||
font-size: 22px; | |||
position: relative; | |||
top: 3px; | |||
font-family: "Microsoft YaHei UI"; | |||
font-size: 22px; | |||
color: #ff483a; | |||
} | |||
} | |||
ul:not(.el-scrollbar__view) { | |||
li:first-child { | |||
margin-top: 0px; | |||
margin-top: 0; | |||
} | |||
li { | |||
box-sizing: border-box; | |||
display: flex; | |||
padding-right: 20px; | |||
margin-top: 18px; | |||
background: #182665; | |||
padding-right: 20px; | |||
box-sizing: border-box; | |||
.left { | |||
width: 195px; | |||
height: 114px; | |||
@@ -144,72 +144,73 @@ ul:not(.el-scrollbar__view) { | |||
} | |||
} | |||
.right { | |||
position: relative; | |||
flex: 1; | |||
padding-left: 20px; | |||
position: relative; | |||
.status { | |||
position: absolute; | |||
top: 16px; | |||
right: 0; | |||
box-sizing: border-box; | |||
display: flex; | |||
place-content: center space-between; | |||
width: 82px; | |||
height: 22px; | |||
color: #fff; | |||
padding-right: 16px; | |||
padding-left: 9px; | |||
font-size: 12px; | |||
display: flex; | |||
justify-content: space-between; | |||
line-height: 20px; | |||
align-content: center; | |||
padding-left: 9px; | |||
padding-right: 16px; | |||
box-sizing: border-box; | |||
position: absolute; | |||
top: 16px; | |||
right: 0px; | |||
color: #ffffff; | |||
} | |||
.time { | |||
color: #78dfff; | |||
font-size: 14px; | |||
margin-top: 13px; | |||
font-size: 14px; | |||
color: #78dfff; | |||
} | |||
.title { | |||
color: #fff; | |||
font-size: 16px; | |||
margin-top: 13px; | |||
font-size: 16px; | |||
color: #ffffff; | |||
} | |||
.des { | |||
display: flex; | |||
justify-content: space-between; | |||
color: #78dfff; | |||
font-size: 12px; | |||
margin-top: 16px; | |||
font-size: 12px; | |||
color: #78dfff; | |||
} | |||
} | |||
} | |||
} | |||
.header-select { | |||
:deep(.el-select__wrapper) { | |||
border: 1px solid #35c9f0; | |||
background: unset; | |||
width: 100%; | |||
height: 40px; | |||
background: unset; | |||
border: 1px solid #35c9f0; | |||
outline: none; | |||
} | |||
// :deep(.el-popper) { | |||
// position: absolute !important; | |||
// top: 58px !important; | |||
// left: 0px !important; | |||
// } | |||
:deep(.el-select-dropdown__item) { | |||
color: #0c4dcf; | |||
font-size: 20px; | |||
height: 55px; | |||
font-size: 20px; | |||
line-height: 55px; | |||
color: #0c4dcf; | |||
} | |||
:deep(.el-select__placeholder) { | |||
background: linear-gradient(9deg, #10cefe 7.44%, #fff 79.62%); | |||
font-size: 16px; | |||
background: linear-gradient(9deg, #10cefe 7.44%, #ffffff 79.62%); | |||
background-clip: text; | |||
background-clip: text; | |||
-webkit-background-clip: text; | |||
-webkit-text-fill-color: transparent; | |||
font-size: 16px; | |||
} | |||
} | |||
// .header-select.nobg { | |||
// :deep(.el-select__wrapper) { | |||
// background-color: unset; | |||
@@ -231,4 +232,4 @@ ul:not(.el-scrollbar__view) { | |||
// font-size: 16px; | |||
// } | |||
// } | |||
</style> | |||
</style> |
@@ -2,7 +2,7 @@ | |||
<div style="width: 100%; height: 100%"> | |||
<div class="commontitle"> | |||
<div class="left"> | |||
<span>今日场景告警次数</span> | |||
<span>今日场景预警次数</span> | |||
<img src="/static/screen/img/titleIcon.png" alt="" /> | |||
</div> | |||
<div class="right"></div> | |||
@@ -12,10 +12,10 @@ | |||
<div class="commonTitle1"> | |||
<span class="left">校园安全</span> | |||
<span class="right" | |||
>告警次数:<span class="num">{{ typeStatistiCount }}</span></span | |||
>预警次数:<span class="num">{{ typeStatistiCount }}</span></span | |||
> | |||
</div> | |||
<div style="height: 410px; overflow-y: auto; margin-top: 18px"> | |||
<div style="height: 410px; margin-top: 18px; overflow-y: auto"> | |||
<ul> | |||
<template v-for="(item, index) in typeStatisti" :key="index"> | |||
<li> | |||
@@ -51,10 +51,10 @@ | |||
<div class="commonTitle1"> | |||
<span class="left">{{ item.name }}</span> | |||
<span class="right" | |||
>告警次数:<span class="num">{{ item.value }}</span></span | |||
>预警次数:<span class="num">{{ item.value }}</span></span | |||
> | |||
</div> | |||
<div style="height: 146px; overflow: auto; margin-top: 24px"> | |||
<div style="height: 146px; margin-top: 24px; overflow: auto"> | |||
<ul> | |||
<template v-for="(item1, index1) in item.subset" :key="index1"> | |||
<li> | |||
@@ -121,36 +121,36 @@ const setBoder1 = () => { | |||
margin-bottom: 22px; | |||
} | |||
.safe { | |||
padding: 24px 29px 0px 29px; | |||
box-sizing: border-box; | |||
width: 456px; | |||
height: 494px; | |||
padding: 24px 29px 0; | |||
ul { | |||
padding-right: 10px; | |||
li { | |||
display: flex; | |||
margin-top: 18.6px; | |||
&:first-child { | |||
margin-top: 0px; | |||
margin-top: 0; | |||
} | |||
.title { | |||
display: flex; | |||
color: #e3e9f3; | |||
font-size: 12px; | |||
color: #e3e9f3; | |||
.top { | |||
box-sizing: border-box; | |||
display: inline-block; | |||
width: 60px; | |||
height: 20px; | |||
border-radius: 10px; | |||
background: linear-gradient(to left, rgba(55, 116, 237, 0.01), rgba(55, 116, 237, 1)); | |||
box-sizing: border-box; | |||
padding-left: 10px; | |||
background: linear-gradient(to left, rgb(55 116 237 / 1%), rgb(55 116 237 / 100%)); | |||
border-radius: 10px; | |||
} | |||
.title_ { | |||
display: block; | |||
width: 76px; | |||
position: relative; | |||
right: 10px; | |||
display: block; | |||
width: 76px; | |||
} | |||
} | |||
.progressBox { | |||
@@ -158,23 +158,23 @@ const setBoder1 = () => { | |||
padding-top: 6px; | |||
} | |||
.num { | |||
color: #fff; | |||
text-align: right; | |||
font-size: 14px; | |||
display: block; | |||
width: 42px; | |||
font-size: 14px; | |||
color: #ffffff; | |||
text-align: right; | |||
} | |||
&:nth-child(1) { | |||
.title { | |||
.top { | |||
background: linear-gradient(to right, rgba(226, 74, 59, 1), rgba(226, 74, 59, 0.01)); | |||
background: linear-gradient(to right, rgb(226 74 59 / 100%), rgb(226 74 59 / 1%)); | |||
} | |||
} | |||
} | |||
&:nth-child(2) { | |||
.title { | |||
.top { | |||
background: linear-gradient(to left, rgba(246, 152, 14, 0.01), rgba(246, 152, 14, 1)); | |||
background: linear-gradient(to left, rgb(246 152 14 / 1%), rgb(246 152 14 / 100%)); | |||
} | |||
} | |||
} | |||
@@ -182,10 +182,10 @@ const setBoder1 = () => { | |||
} | |||
} | |||
.cate { | |||
width: calc(100% - 200px); | |||
margin-left: 22px; | |||
box-sizing: border-box; | |||
width: calc(100% - 200px); | |||
height: 494px; | |||
margin-left: 22px; | |||
overflow-y: auto; | |||
> ul { | |||
display: flex; | |||
@@ -193,33 +193,33 @@ const setBoder1 = () => { | |||
justify-content: space-between; | |||
padding-right: 10px; | |||
> li { | |||
margin-right: 16px; | |||
box-sizing: border-box; | |||
width: 383.228px; | |||
height: 235.65px; | |||
margin-bottom: 22px; | |||
padding: 22px; | |||
box-sizing: border-box; | |||
margin-right: 16px; | |||
margin-bottom: 22px; | |||
} | |||
> li:nth-child(3n) { | |||
margin-right: 0px; | |||
margin-right: 0; | |||
} | |||
ul { | |||
display: flex; | |||
flex-wrap: wrap; | |||
justify-content: space-between; | |||
li { | |||
box-sizing: border-box; | |||
display: flex; | |||
justify-content: space-between; | |||
color: #fff; | |||
font-size: 12px; | |||
width: 48%; | |||
height: 40.92px; | |||
box-shadow: 0px 0px 10px 0px #3877f2 inset; | |||
background: #0e298b; | |||
box-sizing: border-box; | |||
padding: 0 8px; | |||
line-height: 40.92px; | |||
margin-bottom: 7.7px; | |||
font-size: 12px; | |||
line-height: 40.92px; | |||
color: #ffffff; | |||
background: #0e298b; | |||
box-shadow: 0 0 10px 0 #3877f2 inset; | |||
} | |||
} | |||
} | |||
@@ -227,4 +227,4 @@ const setBoder1 = () => { | |||
:deep(.el-progress-bar__outer) { | |||
background: #404c80; | |||
} | |||
</style> | |||
</style> |
@@ -1,5 +1,5 @@ | |||
<!-- | |||
* @Description: 告警管理 | |||
* @Description: 预警管理 | |||
* @Author: huguodong | |||
* @Date: 2023-12-15 15:44:05 | |||
!--> | |||
@@ -1,5 +1,5 @@ | |||
<!-- | |||
* @Description: 告警管理 | |||
* @Description: 预警管理 | |||
* @Author: huguodong | |||
* @Date: 2023-12-15 15:44:05 | |||
!--> | |||
@@ -72,7 +72,7 @@ function getCharts1(data: any) { | |||
const chart = echarts.init(chart1.value); | |||
const option = { | |||
title: { | |||
text: "今日告警情况", | |||
text: "今日预警情况", | |||
// subtext: "Fake Data", | |||
left: "center" | |||
}, | |||
@@ -85,7 +85,7 @@ function getCharts1(data: any) { | |||
}, | |||
series: [ | |||
{ | |||
name: "今日告警情况", | |||
name: "今日预警情况", | |||
type: "pie", | |||
radius: "50%", | |||
data, | |||
@@ -1,18 +1,18 @@ | |||
<!-- | |||
* @Description: 告警管理 | |||
* @Description: 预警管理 | |||
* @Author: huguodong | |||
* @Date: 2023-12-15 15:44:05 | |||
!--> | |||
<template> | |||
<div class="table-box"> | |||
<ProTable ref="proTable" title="告警列表" :columns="columns" :request-api="warnZJRQApi.page"> | |||
<ProTable ref="proTable" title="预警列表" :columns="columns" :request-api="warnZJRQApi.page"> | |||
<!-- 表格 header 按钮 --> | |||
<template #tableHeader="scope"> | |||
<!-- <s-button suffix="告警" @click="onOpen(FormOptEnum.ADD)" /> --> | |||
<!-- <s-button suffix="预警" @click="onOpen(FormOptEnum.ADD)" /> --> | |||
<s-button | |||
type="danger" | |||
plain | |||
suffix="告警" | |||
suffix="预警" | |||
:opt="FormOptEnum.DELETE" | |||
:disabled="!scope.isSelected" | |||
@click="onDelete(scope.selectedListIds, '删除所选数据')" | |||
@@ -52,13 +52,13 @@ | |||
<div class="linebox">姓名:{{ detailData.personName ? detailData.personName : "暂无数据" }}</div> | |||
</el-col> | |||
<el-col :span="12"> | |||
<div class="linebox">告警摄像头:{{ detailData.cameraName }}</div> | |||
<div class="linebox">预警摄像头:{{ detailData.cameraName }}</div> | |||
</el-col> | |||
<el-col :span="12"> | |||
<div class="linebox">告警类型:{{ detailData.alarmTypeDesc }}</div> | |||
<div class="linebox">预警类型:{{ detailData.alarmTypeDesc }}</div> | |||
</el-col> | |||
<el-col :span="12"> | |||
<div class="linebox">告警时间:{{ detailData.tick }}</div> | |||
<div class="linebox">预警时间:{{ detailData.tick }}</div> | |||
</el-col> | |||
<el-col :span="12"> | |||
@@ -121,7 +121,7 @@ | |||
<img class="detailpic" :src="faceUrl" alt="" /> | |||
</div> | |||
</el-dialog> | |||
<!-- 处理告警 --> | |||
<!-- 处理预警 --> | |||
<handleForm ref="formRefH" /> | |||
</div> | |||
</template> | |||
@@ -181,7 +181,7 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [ | |||
{ type: "selection", fixed: "left", width: 80 }, | |||
// { prop: "searchKey", label: "关键字", search: { el: "input" }, isShow: false }, | |||
// { prop: "cameraId", label: "所属摄像头", search: { el: "input" }, isShow: false }, | |||
// { prop: "alarmTypeDesc", label: "告警类型", search: { el: "input" }, isShow: false }, | |||
// { prop: "alarmTypeDesc", label: "预警类型", search: { el: "input" }, isShow: false }, | |||
{ | |||
prop: "poiId", | |||
label: "所属学校", | |||
@@ -199,14 +199,14 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [ | |||
}, | |||
{ | |||
prop: "cameraName", | |||
label: "告警摄像头", | |||
label: "预警摄像头", | |||
// render: () => { | |||
// return "楼道"; | |||
// } | |||
}, | |||
{ | |||
prop: "snapshotUrl", | |||
label: "告警快照", | |||
label: "预警快照", | |||
render: scope => { | |||
return ( | |||
<img src={scope.row.snapshotUrl ? scope.row.snapshotUrl : ''} onClick={() => viewHeadImage(scope)} style='width:50px;height:50px;' alt=''/> | |||
@@ -223,7 +223,7 @@ const columns: ColumnProps<ZJRQ.WarnInfo>[] = [ | |||
{ | |||
prop: "alarmType", | |||
label: "告警类型", | |||
label: "预警类型", | |||
enum: warnOptions, | |||
search: { | |||
el: "tree-select", | |||