| | |
| | | <div class="info-active-top"> |
| | | <div class="active-list"> |
| | | <div> |
| | | <span @click.stop="StartEquipment({dxtype:2})" class="dashboard_alarm ng-binding">预警</span> |
| | | <span |
| | | @click.stop="StartEquipment({ dxtype: 2 })" |
| | | class="dashboard_alarm ng-binding" |
| | | >预警</span |
| | | > |
| | | </div> |
| | | <div> |
| | | <span class="ng-binding">{{ yj }}</span> |
| | |
| | | </div> |
| | | <div class="active-list"> |
| | | <div> |
| | | <span @click.stop="StartEquipment({dxtype:3})" class="dashboard_malfunction ng-binding">故障</span> |
| | | <span |
| | | @click.stop="StartEquipment({ dxtype: 3 })" |
| | | class="dashboard_malfunction ng-binding" |
| | | >故障</span |
| | | > |
| | | </div> |
| | | <div> |
| | | <span class="ng-binding">{{ gz }}</span> |
| | |
| | | <div class="info-active-bottom"> |
| | | <div class="active-list"> |
| | | <div> |
| | | <span @click.stop="StartEquipment({dxtype:1})" class="dashboard_normal ng-binding">正常</span> |
| | | <span |
| | | @click.stop="StartEquipment({ dxtype: 1 })" |
| | | class="dashboard_normal ng-binding" |
| | | >正常</span |
| | | > |
| | | </div> |
| | | <div> |
| | | <span class="ng-binding">{{ zx }}</span> |
| | |
| | | </div> |
| | | <div class="active-list"> |
| | | <div> |
| | | <span @click.stop="StartEquipment({dxtype:0})" class="dashboard_inactive ng-binding">掉线</span> |
| | | <span |
| | | @click.stop="StartEquipment({ dxtype: 0 })" |
| | | class="dashboard_inactive ng-binding" |
| | | >掉线</span |
| | | > |
| | | </div> |
| | | <div> |
| | | <span class="ng-binding">{{ dx }}</span> |
| | |
| | | class="info-content-table" |
| | | :data="tableData" |
| | | stripe |
| | | style="width: 100%; margin: 0 10px" |
| | | style="width: 100%; margin: 0 15px" |
| | | max-height="380px" |
| | | :resizable="false" |
| | | > |
| | | <el-table-column prop="waringType" label="警情类型" width="100"> |
| | | <el-table-column prop="waringType" label="警情类型" width="120"> |
| | | <template scope="scope"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >{{ scope.row.waringType }}</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >{{ scope.row.waringType }}</span |
| | | > |
| | | <span v-else>{{ scope.row.waringType }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="alarmTime" label="报警时间" width="180"> |
| | | <template scope="scope"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >{{ scope.row.alarmTime }}</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >{{ scope.row.alarmTime }}</span |
| | | > |
| | | <span v-else>{{ scope.row.alarmTime }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="oneContacts" label="主要负责人" width="160"> |
| | | <template scope="scope"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >{{ scope.row.oneContacts }}</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >{{ scope.row.oneContacts }}</span |
| | | > |
| | | <span v-else>{{ scope.row.oneContacts }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="onePhone" label="负责人电话" width="180"> |
| | | <template scope="scope"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >{{ scope.row.onePhone }}</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >{{ scope.row.onePhone }}</span |
| | | > |
| | | <span v-else>{{ scope.row.onePhone }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="galarmPeople" label="报警人" width="160"> |
| | | <template scope="scope"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >{{ scope.row.galarmPeople }}</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >{{ scope.row.galarmPeople }}</span |
| | | > |
| | | <span v-else>{{ scope.row.galarmPeople }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="alarmPeople" label="接警人" width="160"> |
| | | <template scope="scope"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >{{ scope.row.alarmPeople }}</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >{{ scope.row.alarmPeople }}</span |
| | | > |
| | | <span v-else>{{ scope.row.alarmPeople }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="jtype" label="警情状态" width=""> |
| | | <template scope="scope"> |
| | | <el-button size="mini" @click.stop="stateHandling(scope.row)"> |
| | | <span |
| | | v-if="scope.row.jtype == 0" |
| | | style="color: rgb(255, 39, 39)" |
| | | >未处理</span |
| | | > |
| | | <span |
| | | v-else-if="scope.row.jtype == 1" |
| | | style="color: rgb(21, 162, 254)" |
| | | >处理中</span |
| | | > |
| | | <span v-else>已处理</span> |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </div> |
| | | <real-popup ref="realPopupView"> </real-popup> |
| | | </el-col> |
| | | <el-col class="super-data-box" :span="8"> |
| | | <div class="container-box week-alarm"> |
| | |
| | | <div class="alarm-bar"> |
| | | <div class="alarm-bar-title"> |
| | | <div class="title-left ng-binding">日累计预警事件数</div> |
| | | <!-- <div class="title-right week">--> |
| | | <!-- <span class="ng-binding">0</span--> |
| | | <!-- ><span class="ng-binding">1.00</span>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-right week">--> |
| | | <!-- <span class="ng-binding">0</span--> |
| | | <!-- ><span class="ng-binding">1.00</span>--> |
| | | <!-- </div>--> |
| | | </div> |
| | | <div class="week-alarm-bar" id="day_warn_echarts"></div> |
| | | </div> |
| | |
| | | <div class="title-left change-flex-alarm ng-binding"> |
| | | 日累计预警设备数 |
| | | </div> |
| | | <!-- <div class="title-right week">--> |
| | | <!-- <span class="ng-binding">0</span--> |
| | | <!-- ><span class="ng-binding">1.00</span>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="title-right week">--> |
| | | <!-- <span class="ng-binding">0</span--> |
| | | <!-- ><span class="ng-binding">1.00</span>--> |
| | | <!-- </div>--> |
| | | </div> |
| | | <div class="week-device-line" id="day_equipment_echarts"></div> |
| | | </div> |
| | |
| | | getList().then((res) => { |
| | | res.data.data.forEach((item) => { |
| | | if (item.waringType == "紧急求救") { |
| | | that.tableData.push({ |
| | | waringType: |
| | | item.waringType == "紧急求救" ? "一键求助" : item.waringType, |
| | | alarmTime: item.alarmTime, |
| | | oneContacts: item.oneContacts, |
| | | onePhone: item.onePhone, |
| | | galarmPeople: item.galarmPeople, |
| | | jtype: |
| | | item.jtype == 0 |
| | | ? "未处理" |
| | | : item.jtype == 1 |
| | | ? "处理中" |
| | | : "已处理", |
| | | alarmPeople: item.alarmPeople, |
| | | }); |
| | | that.tableData.push(item); |
| | | } |
| | | }); |
| | | }); |
| | |
| | | ], |
| | | }; |
| | | myChart.setOption(option); |
| | | myChart.on('click', function (params) { |
| | | if (params.name == "正常"){ |
| | | myChart.on("click", function (params) { |
| | | if (params.name == "正常") { |
| | | //跳转在线设备 |
| | | that.StartEquipment({dxtype:1}); |
| | | }else if(params.name == "掉线"){ |
| | | that.StartEquipment({ dxtype: 1 }); |
| | | } else if (params.name == "掉线") { |
| | | //跳转离线设备 |
| | | that.StartEquipment({dxtype:0}); |
| | | }else if(params.name == "故障"){ |
| | | that.StartEquipment({ dxtype: 0 }); |
| | | } else if (params.name == "故障") { |
| | | //跳转故障设备 |
| | | that.StartEquipment({dxtype:3}); |
| | | that.StartEquipment({ dxtype: 3 }); |
| | | } |
| | | |
| | | }); |
| | | }, |
| | | |
| | |
| | | ], |
| | | }; |
| | | myChart.setOption(option); |
| | | myChart.on('click', function (params) { |
| | | myChart.on("click", function (params) { |
| | | var data = []; |
| | | var date=new Date; |
| | | var y = date.getFullYear() |
| | | var date = new Date(); |
| | | var y = date.getFullYear(); |
| | | data.push({ |
| | | startTime: y + "-" + params.name+" 00:00:00", |
| | | endTime:y + "-" + params.name+" 23:59:59", |
| | | waringType:'紧急求救', |
| | | }) |
| | | startTime: y + "-" + params.name + " 00:00:00", |
| | | endTime: y + "-" + params.name + " 23:59:59", |
| | | waringType: "紧急求救", |
| | | }); |
| | | that.handleStartAlarm(data); |
| | | }); |
| | | |
| | | |
| | | }, |
| | | //在线设备分页数据 |
| | | StartEquipment(data) { |
| | |
| | | query: data[0], |
| | | }); |
| | | }, |
| | | // 点击状态的处理事件 |
| | | stateHandling(row) { |
| | | console.log(row); |
| | | if (row.jtype == 0) { |
| | | this.$refs.realPopupView.onItemGetParentData(row); |
| | | } else { |
| | | this.$router.push({ path: "/policeTracking/track", query: row }); |
| | | } |
| | | }, |
| | | }, |
| | | |
| | | }; |
| | | </script> |
| | | |