Commit 74f59da1 authored by co_dengxiongwen's avatar co_dengxiongwen

报警类型维护,报警中心

parent 0a4c0665
...@@ -13,10 +13,10 @@ ...@@ -13,10 +13,10 @@
<title>城市轨道交通安防系统</title> <title>城市轨道交通安防系统</title>
<script> <script>
//禁用所有控制台输出 //禁用所有控制台输出
var console={}; // var console={};
console.log=function(){}; // console.log=function(){};
console.warn=function(){}; // console.warn=function(){};
console.error=function(){}; // console.error=function(){};
</script> </script>
<script src="./config.js"></script> <script src="./config.js"></script>
<style> <style>
......
This diff is collapsed.
<template> <template>
<el-menu-item v-if="menu.name != '报警中心'" :index="menu.path || uniqueId" @click="handleMenuClick" > <el-menu-item
v-if="menu.name != '报警中心'"
:index="menu.path || uniqueId"
@click="handleMenuClick"
>
<!-- <i v-if="menu.icon" :class="`fa fa-${menu.icon}`"></i> --> <!-- <i v-if="menu.icon" :class="`fa fa-${menu.icon}`"></i> -->
<span :class="menu.icon" class="menu_icon"></span> <span :class="menu.icon" class="menu_icon"></span>
<!-- <d2-icon-svg v-else-if="menu.iconSvg" :name="menu.iconSvg"/> --> <!-- <d2-icon-svg v-else-if="menu.iconSvg" :name="menu.iconSvg"/> -->
<!-- <i v-else class="fa fa-file-o"></i> --> <!-- <i v-else class="fa fa-file-o"></i> -->
<span class="zMenu_item" slot="title">{{menu.title || '未命名菜单'}}</span> <span class="zMenu_item" slot="title">{{
menu.title || '未命名菜单'
}}</span>
</el-menu-item> </el-menu-item>
</template> </template>
...@@ -17,23 +23,23 @@ export default { ...@@ -17,23 +23,23 @@ export default {
menu: { menu: {
type: Object, type: Object,
required: false, required: false,
default: () => {} default: () => {},
} },
}, },
data() { data() {
return { return {
uniqueId: uniqueId('d2-menu-empty-') uniqueId: uniqueId('d2-menu-empty-'),
} }
}, },
methods: { methods: {
handleMenuClick () { handleMenuClick() {
//点击菜单时重新刷新页面 //点击菜单时重新刷新页面
//this.reload() //this.reload()
} },
} },
} }
</script> </script>
<style > <style>
.menu_icon { .menu_icon {
width: 22px; width: 22px;
height: 22px; height: 22px;
...@@ -43,7 +49,7 @@ export default { ...@@ -43,7 +49,7 @@ export default {
background: url(../../../imgs/iconImg/sys.png); background: url(../../../imgs/iconImg/sys.png);
background-size: 100% 100%; background-size: 100% 100%;
} }
.em { .scene {
background: url(../../../imgs/iconImg/em.png); background: url(../../../imgs/iconImg/em.png);
background-size: 100% 100%; background-size: 100% 100%;
} }
...@@ -55,7 +61,7 @@ export default { ...@@ -55,7 +61,7 @@ export default {
background: url(../../../imgs/iconImg/plan.png); background: url(../../../imgs/iconImg/plan.png);
background-size: 100% 100%; background-size: 100% 100%;
} }
.linkage { .stats {
background: url(../../../imgs/iconImg/linkage.png); background: url(../../../imgs/iconImg/linkage.png);
background-size: 100% 100%; background-size: 100% 100%;
} }
...@@ -63,7 +69,7 @@ export default { ...@@ -63,7 +69,7 @@ export default {
background: url(../../../imgs/iconImg/monitor.png); background: url(../../../imgs/iconImg/monitor.png);
background-size: 100% 100%; background-size: 100% 100%;
} }
.access { .fire {
background: url(../../../imgs/iconImg/access.png); background: url(../../../imgs/iconImg/access.png);
background-size: 100% 100%; background-size: 100% 100%;
} }
......
This diff is collapsed.
<template lang="pug">
el-dialog.my_dialog(:close-on-click-modal='false' :visible.sync='visible' append-to-body width='60%' :before-close='handleClose' :destroy-on-close='true')
div.title-bold(slot='title') 历史视频
el-row()
div(v-if='videoList.length === 0' style='height:500px;display:flex')
font(style='margin:auto;font-size:27px') 暂无视频
el-col(v-else :span="(index === 0 && videoList.length === 1) || index ===2 ? 24 : 12" v-for="(item, index) in videoList" :key="index")
el-card(:body-style="{ padding: '0px' }")
div(slot="header" align='center' class='my_dialog_header')
font() {{item.name}}
video( style="width:100%" :src="item.path" :id="item.id" autoplay loop controls muted="true")
</template>
<script>
export default {
name: 'history-video-info',
data() {
return {
visible: false,
videoList: [
// {
// id: 1,
// src: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4',
// name: 'ceshi1'
// },
// {
// id: 2,
// src: 'http://mirror.aarnet.edu.au/pub/TED-talks/911Mothers_2010W-480p.mp4',
// name: 'ceshi2'
// },
// {
// id: 3,
// src: 'https://media.w3.org/2010/05/sintel/trailer.mp4',
// name: 'ceshi3'
// }
]
}
},
methods: {
init(row) {
this.visible = true
// console.log(row)
this.initData(row.id)
},
initData(id) {
console.log(id)
this.$http({
url: this.$http.adornUrlAlarm('/alarmsInfo/getHistoryVideInfo'),
method: 'get',
params: { id: id }
}).then(data => {
if (data && data.code === 0) {
this.videoList = data.list
}
})
},
//关闭页面前调用
handleClose() {
this.visible = false
//关闭视频
this.videoList.map(item => {
var vide = document.getElementById(item.id)
if (vide.paused) {
// vide.play()
} else if (vide.play()) {
vide.pause()
}
})
this.videoList = []
}
}
}
</script>
<style scoped>
.title-bold {
font-weight: bold;
font-size: 17px;
}
.my_dialog >>> .el-dialog__body {
padding: 0px;
}
.my_dialog >>> .el-card__header {
padding: 8px 0px;
}
</style>
<template lang='pug'>
el-container(style="height:77vh")
el-aside( width="18vw" v-loading="leftLoading" style="z-index:1000;")
div.left_aside(style="height:auto")
el-header.left_header 报警统计
el-main.left_main
div.left_main_body(v-for="item in eventList")
div.left_col_header {{item.systemName}}
el-row.row_style
el-col(:span="8")
div(style="color:#F56C6C;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{item.oneCount}}
div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 特别重大
el-col(:span="8")
div(style="color:#E6A23C;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{item.twoCount}}
div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 重大
el-col(:span="8")
div(style="color:#409EFF;font-size:18px;font-weight:400;font-family:Microsoft YaHei;") {{item.threeCount}}
div(style="font-size:12px;color:#656565;font-family:Microsoft YaHei;font-weight:400;") 一般
div.left_aside(style="height:auto;margin-bottom:0px;")
el-header.left_header 等级分布
div(id="myCharts" style="height:232px;background:#ffffff")
//ve-pie.untreated_canvas(:data="chartData" :extend="chartExtend" legend-position="bottom" width="260px" height="350px" )
el-main(style="padding:0px;z-index:1001;height:77vh" class="alarms-untreated-main")
el-tabs(v-model="activeName" type="border-card" @tab-click="handleClick")
el-tab-pane(label="全部" name="0")
query-list(v-if="activeName == 0" ref="queryList")
el-tab-pane(label="视频监控系统" name="438c30d3d7f241b573f22a1a36c60485")
query-list(v-if="activeName == '438c30d3d7f241b573f22a1a36c60485'" ref="queryList")
el-tab-pane(label="出入口控制系统" name="ed401f7d9291b508d411d8192b016c6e")
query-list(v-if="activeName == 'ed401f7d9291b508d411d8192b016c6e'" ref="queryList")
el-tab-pane(label="入侵报警系统" name="75c7c11716713edfd2ce3581f5e7c193")
query-list(v-if="activeName == '75c7c11716713edfd2ce3581f5e7c193'" ref="queryList")
el-tab-pane(label="安全检查及探测系统" name="3a64b86b1a5dead8ff9d2ad913744e50")
query-list(v-if="activeName == '3a64b86b1a5dead8ff9d2ad913744e50'" ref="queryList")
</template>
<script>
import QueryList from '../processed/query-list'
export default {
data() {
return {
leftLoading: false,
activeName: '0',
eventList: [],
chartData: null
}
},
components: {
QueryList
},
created() {
this.eventList = []
this.$nextTick(() => {
this.$refs.queryList.init('0')
})
this.getGroupList()
},
methods: {
groupInit() {
let dom = document.getElementById('myCharts')
if (!dom) return
let myCharts = this.$echarts.init(dom)
let option = {
tooltip: {
trigger: 'item',
formatter: '{b}: {c} ({d}%)'
},
legend: {
orient: 'horizontal',
bottom: 10,
data: ['特别重大', '重大', '一般']
},
series: [
{
bottom: 30,
type: 'pie',
radius: ['50%', '70%'],
avoidLabelOverlap: false,
label: {
formatter: (element) => {
//自定义文字
//return element.name + ':' + element.value + '(' + element.percent + '%)'
return element.percent + '%'
}
},
itemStyle: {
normal: {
color: function (params) {
//自定义颜色
let colorList = [
'#F56C6C', '#E6A23C', '#409EFF'
]
return colorList[params.dataIndex]
}
}
},
labelLine: {
show: true
},
data: this.chartData
}
]
}
myCharts.setOption(option)
},
//获取按报警等级统计信息
getGroupList() {
this.leftLoading = true
this.$http({
url: this.$http.adornUrlAlarm(`/alarmsInfo/queryGroupProcessed`),
method: 'get',
params: this.$http.adornParams({
stationId: localStorage.getItem('stationId')
})
}).then(data => {
this.leftLoading = false
if (data && data.code === 0) {
this.eventList = data.list
let oneCount, twoCount, threeCount
oneCount = twoCount = threeCount = 0
for (let i in this.eventList) {
oneCount += this.eventList[i].oneCount
twoCount += this.eventList[i].twoCount
threeCount += this.eventList[i].threeCount
}
this.chartData = [
{ value: oneCount, name: '特别重大' },
{ value: twoCount, name: '重大' },
{ value: threeCount, name: '一般' }
]
this.groupInit()
}
})
},
handleClick(tab, event) {
this.$nextTick(() => {
this.$refs.queryList.init(this.activeName)
})
}
}
}
</script>
<style lang='scss'>
.left_aside {
margin-bottom: 10px;
border: 1px #DCDFE6 solid;
background: #f4f4f4;
box-shadow: 2px 0px 8px 0px rgba(0, 0, 0, 0.2);
}
.left_header {
line-height: 40px;
height: 40px !important;
background-color: #E1EDF4;
border-bottom: 1px #E4E7ED solid;
font-size:16px;
font-family:Microsoft YaHei;
font-weight:bold;
}
.left_main {
padding: 0rem 1rem 1rem 1rem;
overflow: hidden;
background: #FFFFFF;
}
.left_main_char {
/*padding:0rem 1rem 1rem 1rem;*/
/*overflow: hidden;*/
background: #FFFFFF;
/*height: 300px;*/
.untreated_canvas {
margin: 0 auto;
/*transform: translateY(-80px);*/
top: -80px
}
}
.left_main_body {
margin-top: 1rem;
border: 1px #D1D1D1 solid;
/*height:120px;*/
background: #fff;
}
.left_col_header {
background-color: #E1EDF4;
height: 30px;
line-height: 30px;
color: #000000;
text-align: center;
font-size:15px;
font-family:Adobe Heiti Std;
font-weight:bold;
}
.row_style {
line-height: 24px;
text-align: center;
/*height:60px;*/
/*padding:3px;*/
}
.alarms-untreated-main > .el-tabs {
box-shadow: none;
border: none;
}
.alarms-untreated-main > .el-tabs > .el-tabs__content {
padding: 0 !important;
margin-top: 10px;
}
.el-tanle th {
background: #EEF8FF !important
}
.el-tabs__nav-scroll {
height: 42px;
/*padding-top: 10px;*/
/*padding-left: 10px;*/
line-height:42px;
background: #f4f4f4;
border-bottom: 1px solid rgba(196, 196, 196, 1);
.el-tabs__item {
border-top-color: #DCDFE6 !important;
}
}
</style>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
<template lang="pug">
el-dialog.my_dialog(:close-on-click-modal='false' :visible.sync='visible' append-to-body width='60%' :before-close='handleClose' :destroy-on-close='true')
div.title-bold(slot='title') 历史视频
el-row()
div(v-if='videoList.length === 0' style='height:500px;display:flex')
font(style='margin:auto;font-size:27px') 暂无视频
el-col(v-else :span="(index === 0 && videoList.length === 1) || index ===2 ? 24 : 12" v-for="(item, index) in videoList" :key="index")
el-card(:body-style="{ padding: '0px' }")
div(slot="header" align='center' class='my_dialog_header')
font() {{item.name}}
video( style="width:100%" :src="item.path" :id="item.id" autoplay loop controls muted="true")
</template>
<script>
export default {
name: 'history-video-info',
data() {
return {
visible: false,
videoList: [
// {
// id: 1,
// src: 'http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4',
// name: 'ceshi1'
// },
// {
// id: 2,
// src: 'http://mirror.aarnet.edu.au/pub/TED-talks/911Mothers_2010W-480p.mp4',
// name: 'ceshi2'
// },
// {
// id: 3,
// src: 'https://media.w3.org/2010/05/sintel/trailer.mp4',
// name: 'ceshi3'
// }
]
}
},
methods: {
init(row) {
this.visible = true
// console.log(row)
this.initData(row.id)
},
initData(id) {
console.log(id)
this.$http({
url: this.$http.adornUrlAlarm('/alarmsInfo/getHistoryVideInfo'),
method: 'get',
params: { id: id,
stationId: localStorage.getItem('stationId') }
}).then(data => {
if (data && data.code === 0) {
this.videoList = data.list
}
})
},
//关闭页面前调用
handleClose() {
this.visible = false
//关闭视频
this.videoList.map(item => {
var vide = document.getElementById(item.id)
if (vide.paused) {
// vide.play()
} else if (vide.play()) {
vide.pause()
}
})
this.videoList = []
}
}
}
</script>
<style scoped>
.title-bold {
font-weight: bold;
font-size: 17px;
}
.my_dialog >>> .el-dialog__body {
padding: 0px;
}
.my_dialog >>> .el-card__header {
padding: 8px 0px;
}
</style>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
...@@ -26,11 +26,7 @@ export default { ...@@ -26,11 +26,7 @@ export default {
data() { data() {
return { return {
visible: false, visible: false,
typeList: [ typeList: [],
{ id: 1, name: '压力' },
{ id: 2, name: '温度' },
{ id: 3, name: '水位' },
],
dataForm: {}, dataForm: {},
dataRule: { dataRule: {
type: [ type: [
...@@ -67,6 +63,9 @@ export default { ...@@ -67,6 +63,9 @@ export default {
deep: true, deep: true,
}, },
}, },
mounted() {
this.getAllType()
},
methods: { methods: {
init(row, typeId) { init(row, typeId) {
this.visible = true this.visible = true
...@@ -75,13 +74,31 @@ export default { ...@@ -75,13 +74,31 @@ export default {
} else { } else {
this.dataForm = { this.dataForm = {
id: '', id: '',
type: '',
code: '', code: '',
name: '', name: '',
remark: '',
dicId: typeId, dicId: typeId,
stationId: localStorage.getItem('stationId'), stationId: localStorage.getItem('stationId'),
} }
} }
}, },
//获取阈值类型字典信息
getAllType() {
this.$http({
url: this.$http.adornUrl('/sysDictionary/getThresholdDicList'),
method: 'get',
params: this.$http.adornParams({
stationId: localStorage.getItem('stationId'),
}),
}).then((data) => {
if (data && data.code === 0) {
this.typeList = data.list
} else {
this.$message.error(data.msg)
}
})
},
// 表单提交 // 表单提交
dataFormSubmit() { dataFormSubmit() {
this.$refs['dataForm'].validate((valid) => { this.$refs['dataForm'].validate((valid) => {
......
This diff is collapsed.
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment