parent
c892e31e27
commit
01efeed0e7
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="renyuan">
|
||||
<div class="block1">
|
||||
<layout-title title="重点工程统计"/>
|
||||
<layout-title title="边界入侵统计"/>
|
||||
<div class="options">
|
||||
<div v-for="(item,index) in block1OptionsList" :key="index" class="option">
|
||||
<div class="imger">
|
||||
|
|
@ -10,25 +10,26 @@
|
|||
<div class="info">
|
||||
<div class="label">{{ item.title }}</div>
|
||||
<div class="text">{{ item.count }}</div>
|
||||
<!-- <div class="text"><count-to :start-val="0" :end-val="item.count" :duration="3600"/></div>-->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block2">
|
||||
<div v-if="false" class="block2">
|
||||
<layout-title title="区域报警数"/>
|
||||
<div class="options">
|
||||
<div v-for="(item,index) in block2OptionsList" :key="index" class="option">
|
||||
<div class="circular"><img :src="item.img" alt=""></div>
|
||||
<div class="info">
|
||||
<div class="title">{{ item.label }}</div>
|
||||
<div class="count"> <count-to :start-val="0" :end-val="+item.count" :duration="3600"/></div>
|
||||
<div class="count">
|
||||
<count-to :start-val="0" :end-val="+item.count" :duration="3600"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="block3">
|
||||
<div v-if="false" class="block3">
|
||||
<layout-title title="安全管理记录"/>
|
||||
<div class="content">
|
||||
<div class="table">
|
||||
|
|
@ -47,6 +48,23 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="block4">
|
||||
<layout-title title="报警列表"/>
|
||||
<div class="content">
|
||||
<div class="table">
|
||||
<div class="tr">
|
||||
<div class="td">区域名称</div>
|
||||
<div class="td">报警设备编号</div>
|
||||
<div class="td">状态告警</div>
|
||||
</div>
|
||||
<div v-for="(item,index) in block4List" :key="index" class="tr">
|
||||
<div class="td">{{ item.alarmName }}</div>
|
||||
<div class="td">{{ item.equipmentName }}</div>
|
||||
<div class="td">{{ item.statusName }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -78,26 +96,15 @@ export default {
|
|||
return {
|
||||
block1OptionsList: [
|
||||
{
|
||||
title: '开工数量',
|
||||
title: '监控数量',
|
||||
img: require('../../../assets/map/zhongdian/ico1.png'),
|
||||
count: '-'
|
||||
},
|
||||
{
|
||||
title: '视频数量',
|
||||
title: '监控数量',
|
||||
img: require('../../../assets/map/zhongdian/ico2.png'),
|
||||
count: '-'
|
||||
},
|
||||
{
|
||||
title: '检查次数',
|
||||
img: require('../../../assets/map/zhongdian/ico3.png'),
|
||||
count: '-'
|
||||
},
|
||||
{
|
||||
title: '发现隐患数量',
|
||||
img: require('../../../assets/map/zhongdian/ico4.png'),
|
||||
count: '-'
|
||||
}
|
||||
|
||||
],
|
||||
block2OptionsList: [
|
||||
{
|
||||
|
|
@ -120,11 +127,12 @@ export default {
|
|||
CHECK_COUNT: '-',
|
||||
HIDDEN_COUNT: '-'
|
||||
}
|
||||
]
|
||||
],
|
||||
block4List: []
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.getCount()
|
||||
this.initNum()
|
||||
this.initgetTable()
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -147,6 +155,21 @@ export default {
|
|||
this.block2OptionsList[1].count = data.pd.AMOUT_SUM
|
||||
})
|
||||
},
|
||||
initNum() {
|
||||
requestFN('/map/getAllDwMessage', { corpId: this.corpInfoId }
|
||||
).then((data) => {
|
||||
this.block1OptionsList[0].count = data.alarmList.total
|
||||
requestFN('/map/mapPlatformelectronic/listAllLocatio', { corpId: this.corpInfoId, TYPE: 'bianjieruqin' }
|
||||
).then((data) => {
|
||||
this.block4List = data.alarmList.list
|
||||
this.block1OptionsList[0].count = data.alarmList.total
|
||||
}).catch((e) => {
|
||||
this.$message.error(e)
|
||||
})
|
||||
}).catch((e) => {
|
||||
this.$message.error(e)
|
||||
})
|
||||
},
|
||||
initgetTable() {
|
||||
requestFN(
|
||||
'/map/keyProject/list?showCount=10¤tPage=1',
|
||||
|
|
@ -243,6 +266,7 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.block2 {
|
||||
width: 410px;
|
||||
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
|
||||
|
|
@ -260,12 +284,13 @@ export default {
|
|||
position: relative;
|
||||
height: 150px;
|
||||
|
||||
.option{
|
||||
.option {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
justify-content: space-around;
|
||||
|
||||
.circular {
|
||||
margin-top: 5px;
|
||||
background-image: url("../../../assets/map/anquan/icobg.png");
|
||||
|
|
@ -283,11 +308,11 @@ export default {
|
|||
}
|
||||
}
|
||||
|
||||
.info{
|
||||
.info {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
|
||||
.title{
|
||||
.title {
|
||||
background-image: url("../../../assets/map/anquan/label.png");
|
||||
background-size: 100% 100%;
|
||||
background-repeat: no-repeat;
|
||||
|
|
@ -299,7 +324,8 @@ export default {
|
|||
text-align: center;
|
||||
color: #fff;
|
||||
}
|
||||
.count{
|
||||
|
||||
.count {
|
||||
margin-top: 10px;
|
||||
font-size: 24px;
|
||||
background: linear-gradient(to top, #48bbf0, #ffffff);
|
||||
|
|
@ -357,6 +383,48 @@ export default {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.block4 {
|
||||
margin-top: 10px;
|
||||
width: 410px;
|
||||
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8));
|
||||
|
||||
.content {
|
||||
border: 1px solid;
|
||||
border-image: linear-gradient(to bottom, rgba(58, 122, 149, 0), rgba(58, 122, 149, 1)) 1;
|
||||
border-top: none;
|
||||
padding: 10px;
|
||||
|
||||
.options {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.title {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.table {
|
||||
margin-top: 5px;
|
||||
|
||||
.tr {
|
||||
display: flex;
|
||||
|
||||
&:nth-child(odd) {
|
||||
background-color: rgba(42, 86, 158, 0.53);
|
||||
}
|
||||
|
||||
.td {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #fff;
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes scale {
|
||||
|
|
@ -370,6 +438,7 @@ export default {
|
|||
transform: scale(0.9);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideY {
|
||||
0% {
|
||||
transform: translateY(0);
|
||||
|
|
|
|||
|
|
@ -0,0 +1,240 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<el-form ref="searchForm" :model="searchForm" label-width="80px">
|
||||
<el-row>
|
||||
<el-col :span="4">
|
||||
<el-form-item label="报警状态" prop="status">
|
||||
<el-select v-model="searchForm.status" style="width: 100%;">
|
||||
<el-option v-for="item in alarmStatusList" :key="item.value" :value="item.value" :label="item.name"/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="4" label-width="10px" style="margin-left: 20px">
|
||||
<el-button v-waves class="filter-item" type="primary" icon="el-icon-search" @click="getList">
|
||||
搜索
|
||||
</el-button>
|
||||
<el-button v-waves class="filter-item" type="success" icon="el-icon-refresh" @click="resetSearchForm">
|
||||
重置
|
||||
</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<el-table v-loading="listLoading" ref="multipleTable" :data="varList" :row-key="getRowKey" :header-cell-style="{'font-weight': 'bold','color': '#000'}" height="600px" tooltip-effect="dark" border fit highlight-current-row>
|
||||
<el-table-column :reserve-selection="true" type="selection" width="55" align="center" />
|
||||
<el-table-column fixed="left" type="index" label="序号" width="50" align="center" />
|
||||
<el-table-column prop="alarmName" label="报警名称" width="100"/>
|
||||
<el-table-column v-if="false" prop="alarmMessage" label="报警信息" />
|
||||
<el-table-column v-if="false" prop="relatedFunctions" label="相关功能" />
|
||||
<el-table-column v-if="false" prop="typeName" label="类型名称" />
|
||||
<el-table-column prop="message" label="报警信息" width="200"/>
|
||||
<el-table-column v-if="false" prop="idRemak" label="其他系统备注" />
|
||||
<el-table-column v-if="false" prop="remark" label="备注" />
|
||||
<el-table-column prop="corpName" label="企业名称" width="150"/>
|
||||
<el-table-column v-if="false" prop="departmentName" label="部门名称" />
|
||||
<el-table-column prop="equipmentName" label="报警来源" width="100"/>
|
||||
<el-table-column prop="createdTime" label="创建时间" width="150"/>
|
||||
<el-table-column prop="level" label="报警等级" />
|
||||
<el-table-column prop="address" label="报警地址" />
|
||||
<el-table-column prop="statusName" label="状态名称" />
|
||||
<el-table-column prop="opinion" label="处理意见" width="200"/>
|
||||
<el-table-column fixed="right" label="操作" align="center" width="200">
|
||||
<template slot-scope="{row}">
|
||||
<el-button v-if="row.status == null || row.status == '0'" icon="el-icon-view" type="danger" size="mini" @click="goInfo(row.dwAlarmId,'ignore')">忽略</el-button>
|
||||
<el-button v-if="row.status == null || row.status == '0'" icon="el-icon-view" type="primary" size="mini" @click="goInfo(row.dwAlarmId,'confirm')">确认</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="page-btn-group">
|
||||
<div>
|
||||
<!-- <el-button v-show="add" type="primary" icon="el-icon-plus" @click="handleAdd">新增</el-button>-->
|
||||
<!-- <el-button v-show="del" type="danger" icon="el-icon-delete" plain @click="batchDel">删除</el-button>-->
|
||||
</div>
|
||||
<pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
|
||||
</div>
|
||||
<el-dialog :visible.sync="dialogManageAlarm" :title="dialogType === 'ignore' ? '忽略报警' : '确认报警'" width="650px">
|
||||
<el-form ref="form" :model="manageAlarmForm" :rules="manageAlarmRules" label-width="110px" style="width: 500px;">
|
||||
<el-form-item label="处理意见" prop="opinion">
|
||||
<el-input v-model="manageAlarmForm.opinion" :rows="4" type="textarea" placeholder="这里输入处理意见..." />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="closeManageAlarm()">取 消</el-button>
|
||||
<el-button type="primary" @click="manageAlarm()">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import Pagination from '@/components/Pagination' // 通过 el-pagination二次打包
|
||||
import { requestFN } from '@/utils/request'
|
||||
import waves from '@/directive/waves' // waves directive
|
||||
import SelectTree from '@/components/SelectTree'
|
||||
|
||||
export default {
|
||||
components: { Pagination, SelectTree },
|
||||
directives: { waves },
|
||||
data() {
|
||||
return {
|
||||
listLoading: true,
|
||||
add: false,
|
||||
del: false,
|
||||
edit: false,
|
||||
listQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
},
|
||||
total: 0,
|
||||
KEYWORDS: '',
|
||||
varList: [],
|
||||
pd: [],
|
||||
|
||||
multipleSelectionAll: [], // 所有选中的数据包含跨页数据
|
||||
multipleSelection: [], // 当前页选中的数据
|
||||
treeData: [], // 动火前管辖单位
|
||||
dialogType: 'ignore',
|
||||
replyListQuery: {
|
||||
page: 1,
|
||||
limit: 20
|
||||
},
|
||||
defaultProps: {
|
||||
value: 'id',
|
||||
children: 'nodes',
|
||||
label: 'name'
|
||||
},
|
||||
loginUserID: '',
|
||||
loginRoleNumber: JSON.parse(sessionStorage.getItem('user')).RNUMBER,
|
||||
dialogManageAlarm: false,
|
||||
manageAlarmForm: {
|
||||
opinion: '', // 处理意见
|
||||
DW_ALARM_ID: '',
|
||||
status: ''
|
||||
},
|
||||
manageAlarmRules: {
|
||||
opinion: [{ required: true, message: '处理意见不能为空', trigger: 'blur' }]
|
||||
},
|
||||
searchForm: {
|
||||
status: ''
|
||||
},
|
||||
alarmStatusList: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.getEditMyInfo()
|
||||
this.getDictTreeData()
|
||||
this.getDictionary()
|
||||
},
|
||||
methods: {
|
||||
getRowKey(row) {
|
||||
return row.dwAlarmId
|
||||
},
|
||||
// 搜索
|
||||
getQuery() {
|
||||
this.$refs.multipleTable.clearSelection()
|
||||
this.getList()
|
||||
},
|
||||
// 获取登录人信息
|
||||
getEditMyInfo() {
|
||||
requestFN(
|
||||
'/user/goEditMyInfo',
|
||||
{}
|
||||
).then((data) => {
|
||||
this.loginUserID = data.pd.USER_ID // 主职角色ID
|
||||
}).catch((e) => {
|
||||
})
|
||||
},
|
||||
resetSearchForm() {
|
||||
this.searchForm = {
|
||||
status: ''
|
||||
}
|
||||
this.getList()
|
||||
},
|
||||
// 获取列表
|
||||
getList() {
|
||||
this.listLoading = true
|
||||
requestFN(
|
||||
'/dingWei/getAlarmList?showCount=' + this.listQuery.limit + '¤tPage=' + this.listQuery.page,
|
||||
{
|
||||
status: this.searchForm.status,
|
||||
sourceNum: '1'
|
||||
}
|
||||
).then((data) => {
|
||||
this.listLoading = false
|
||||
this.varList = data.list
|
||||
this.total = data.page.total
|
||||
}).catch((e) => {
|
||||
this.listLoading = false
|
||||
})
|
||||
},
|
||||
getDictionary() {
|
||||
requestFN(
|
||||
'/dingWei/getDictionary',
|
||||
{}
|
||||
).then((data) => {
|
||||
if (data.code === 200) {
|
||||
var alarmStatusList = JSON.parse(data.AlarmStatus)
|
||||
this.alarmStatusList = alarmStatusList
|
||||
}
|
||||
}).catch((e) => {
|
||||
|
||||
})
|
||||
},
|
||||
goInfo(id, type) {
|
||||
this.dialogManageAlarm = true
|
||||
this.dialogType = type
|
||||
this.manageAlarmForm.DW_ALARM_ID = id
|
||||
if (type === 'ignore') {
|
||||
this.manageAlarmForm.status = '2'
|
||||
} else {
|
||||
this.manageAlarmForm.status = '1'
|
||||
}
|
||||
},
|
||||
manageAlarm() {
|
||||
this.$refs.form.validate(valid => {
|
||||
if (valid) {
|
||||
this.listLoading = true
|
||||
requestFN(
|
||||
'/dingWei/manageAlarm',
|
||||
this.manageAlarmForm
|
||||
).then((data) => {
|
||||
if (data.code === 200) {
|
||||
this.closeManageAlarm()
|
||||
this.getList()
|
||||
this.$message({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
})
|
||||
} else {
|
||||
this.$message.error(data.message)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
closeManageAlarm() {
|
||||
this.dialogManageAlarm = false
|
||||
this.resetForm()
|
||||
},
|
||||
resetForm() {
|
||||
this.manageAlarmForm = {
|
||||
opinion: '', // 处理意见
|
||||
DW_ALARM_ID: '',
|
||||
status: ''
|
||||
}
|
||||
},
|
||||
getDictTreeData() {
|
||||
return new Promise((resolve) => {
|
||||
requestFN(
|
||||
'/department/listTreeCorpDept',
|
||||
{}
|
||||
).then((data) => {
|
||||
this.treeData = this.listTransTree(JSON.parse(data.zTreeNodes), 'id', 'pId', 'nodes')
|
||||
resolve('ok')
|
||||
}).catch((e) => {
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
<template>
|
||||
<div>
|
||||
<List v-show="activeName=='List'" ref="list" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import List from './components/list'
|
||||
export default {
|
||||
components: {
|
||||
List: List
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
activeName: 'List'
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
activeName(val) {
|
||||
if (val == 'List') {
|
||||
this.$refs.list.getList()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
Loading…
Reference in New Issue