|
@@ -73,6 +73,13 @@
|
|
|
:key="item.id"
|
|
|
:label="item.name"
|
|
|
:value="item.id">
|
|
|
+ <div style="display: flex" v-if="item.planType">
|
|
|
+ <img src="@/assets/ZDimages/bigData3_2/icon_lc_yc.png" style="margin:11px 10px 0 0;width:14px;height:12px;">
|
|
|
+ <p style="margin-right:24px;">{{ item.name }}</p>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex" v-else>
|
|
|
+ <p style="margin:0 24px;">{{ item.name }}</p>
|
|
|
+ </div>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
@@ -86,6 +93,13 @@
|
|
|
:key="item.id"
|
|
|
:label="item.name"
|
|
|
:value="item.id">
|
|
|
+ <div style="display: flex" v-if="item.planType">
|
|
|
+ <img src="@/assets/ZDimages/bigData3_2/icon_lc_yc.png" style="margin:11px 10px 0 0;width:14px;height:12px;">
|
|
|
+ <p style="margin-right:24px;">{{ item.name }}</p>
|
|
|
+ </div>
|
|
|
+ <div style="display: flex" v-else>
|
|
|
+ <p style="margin:0 24px;">{{ item.name }}</p>
|
|
|
+ </div>
|
|
|
</el-option>
|
|
|
</el-select>
|
|
|
</div>
|
|
@@ -100,9 +114,9 @@
|
|
|
<div class="newEvacuation-map-big-box"
|
|
|
:style="'width:'+mapData.width+'px;height:'+mapData.height+'px;'">
|
|
|
<div class="newEvacuation-map-for-box for-map-box-one"
|
|
|
- :class="!item.policeType && checkSubId ==item.subId ? 'room-type-one':(
|
|
|
- item.policeType && checkSubId !=item.subId ? 'room-type-two':(
|
|
|
- item.policeType && checkSubId ==item.subId ? 'room-type-three':(
|
|
|
+ :class="!item.planType && checkSubId ==item.subId ? 'room-type-one':(
|
|
|
+ item.planType && checkSubId !=item.subId ? 'room-type-two':(
|
|
|
+ item.planType && checkSubId ==item.subId ? 'room-type-three':(
|
|
|
!item.loginAdmin ? 'room-type-noe':''
|
|
|
)))"
|
|
|
@click="checkSubClick(item)"
|
|
@@ -151,6 +165,18 @@
|
|
|
:style="'top:'+item.y+'px;left:'+item.x+'px;width:'+item.w+'px;height:'+item.h+'px;'">
|
|
|
<div class="newEvacuation-map-for-min-box"></div>
|
|
|
</div>
|
|
|
+ <div class="plan-map-for-box" :class="checkPlanId == item.subId?'check-plan-map-for-box':''"
|
|
|
+ :style="'width:'+item.width+'px;height:'+item.height+'px;left:'+item.left+'px;top:'+item.top+'px;'"
|
|
|
+ v-for="(item,index) in planMapList" :key="index" v-if="item.planType">
|
|
|
+ <div class="plan-top-button-box">
|
|
|
+ <p></p>
|
|
|
+ <p class="el-icon-close" @click="offPlanShade(index)"></p>
|
|
|
+ </div>
|
|
|
+ <div class="plan-time-box">
|
|
|
+ <img src="@/assets/ZDimages/bigData3_2/icon_dp_bjsj.png">
|
|
|
+ <p>2022年12月12日 17:34:03</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<p class="null-mapList" v-if="!mapList[0]">暂无数据</p>
|
|
@@ -332,9 +358,9 @@
|
|
|
<div class="evacuation-shade-map-box"
|
|
|
:style="'width:'+mapData.width+'px;height:'+mapData.height+'px;'">
|
|
|
<div class="evacuation-shade-map-for-box for-map-box-one"
|
|
|
- :class="!item.policeType && checkSubId ==item.subId ? 'room-type-one':(
|
|
|
- item.policeType && checkSubId !=item.subId ? 'room-type-two':(
|
|
|
- item.policeType && checkSubId ==item.subId ? 'room-type-three':(
|
|
|
+ :class="!item.planType && checkSubId ==item.subId ? 'room-type-one':(
|
|
|
+ item.planType && checkSubId !=item.subId ? 'room-type-two':(
|
|
|
+ item.planType && checkSubId ==item.subId ? 'room-type-three':(
|
|
|
!item.loginAdmin ? 'room-type-noe':''
|
|
|
)))"
|
|
|
v-for="(item,index) in shadeMapList" :key="index" v-if="item.type == 1"
|
|
@@ -393,12 +419,24 @@
|
|
|
import { getDeviceList,addHxpChemical,getHornLastMess, subOnlineUser,
|
|
|
exitHazardTotal,getFireStatus,getFloorData,getBuildOrFloorList,
|
|
|
executeEvacuation,endEvacuation,openLight,closeLight,getRedisEvacuation,
|
|
|
- outfirepc,isCancelOutFile} from '@/api/evacuationBigData/index.js'
|
|
|
+ outfirepc,isCancelOutFile,selectTriggerInfo} from '@/api/evacuationBigData/index.js'
|
|
|
export default {
|
|
|
name: 'newEvacuationBigData',
|
|
|
props:{
|
|
|
propsBigData:{},
|
|
|
},
|
|
|
+ computed:{
|
|
|
+ Obj(){
|
|
|
+ return this.$store.state.settings.planData
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch:{
|
|
|
+ Obj(newVal,oldVal){
|
|
|
+ //可以对数据执行相应的操作
|
|
|
+ console.log(newVal,oldVal)
|
|
|
+ this.selectTriggerInfo();
|
|
|
+ }
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
//当前路由状态
|
|
@@ -490,6 +528,8 @@
|
|
|
mapData:{},
|
|
|
mapList:[],
|
|
|
zoomData:null,
|
|
|
+ //预案发生实验室弹层数据
|
|
|
+ planMapList:[],
|
|
|
//遮罩层
|
|
|
shadeType:0,
|
|
|
shadeText:'',
|
|
@@ -523,20 +563,18 @@
|
|
|
},
|
|
|
mounted(){
|
|
|
//全局类MQTT
|
|
|
- this.onAllMQTT();
|
|
|
+ // this.onAllMQTT('on');
|
|
|
//初始化
|
|
|
this.initialization();
|
|
|
},
|
|
|
methods:{
|
|
|
//初始化
|
|
|
initialization(){
|
|
|
- //判断是否有报警
|
|
|
- //判断是否有疏散进行
|
|
|
- // if(){
|
|
|
- // }else{
|
|
|
- // }
|
|
|
getBuildOrFloorList({type:2,parentId:''}).then(response => {
|
|
|
if(response.data[0]){
|
|
|
+ for(let i=0;i<response.data.length;i++){
|
|
|
+ response.data[i].planType = false
|
|
|
+ }
|
|
|
this.$set(this,'buildingOptions',response.data);
|
|
|
//处理实验室数量多的楼栋优先选择
|
|
|
let num = 0;
|
|
@@ -567,6 +605,7 @@
|
|
|
/*********************************** 点击操作事件-相关接口 *********************************/
|
|
|
//选中实验室
|
|
|
checkSubClick(item){
|
|
|
+ let self = this;
|
|
|
if(item.roomType != '-99'){
|
|
|
if(item.loginAdmin){
|
|
|
if(this.checkSubId != item.subId){
|
|
@@ -576,11 +615,23 @@
|
|
|
this.$set(this,'subText',subText);
|
|
|
this.buttonSubject();
|
|
|
}
|
|
|
+
|
|
|
+ for(let i=0;i<self.planMapList.length;i++){
|
|
|
+ if(self.planMapList[i].subId == item.subId){
|
|
|
+ this.$set(self.planMapList[i],'planType',true)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(item.planType){
|
|
|
+ }
|
|
|
}else{
|
|
|
this.msgError('操作失败,您不是该实验室的管理人员。')
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
+ //关闭实验室预案弹窗
|
|
|
+ offPlanShade(index){
|
|
|
+ this.$set(this.planMapList[index],'planType',false)
|
|
|
+ },
|
|
|
//设备switch开关
|
|
|
changeIsNeedCaptcha(item){
|
|
|
let self = this;
|
|
@@ -1433,7 +1484,7 @@
|
|
|
list[i].subId = response.data.buildFloorLayoutVoList[o].subId;
|
|
|
list[i].online = response.data.buildFloorLayoutVoList[o].online;
|
|
|
list[i].loginAdmin = response.data.buildFloorLayoutVoList[o].loginAdmin;
|
|
|
- list[i].policeType = false;
|
|
|
+ list[i].planType = false;
|
|
|
}
|
|
|
}
|
|
|
}else if(list[i].type == 3){
|
|
@@ -1469,8 +1520,46 @@
|
|
|
break
|
|
|
}
|
|
|
}
|
|
|
+ //处理实验室弹窗数据
|
|
|
+ let roomList = [];
|
|
|
+ for(let i=0;i<list.length;i++){
|
|
|
+ if(list[i].type == 1 && list[i].subId){
|
|
|
+ let roomObj = {
|
|
|
+ subId:list[i].subId
|
|
|
+ };
|
|
|
+ if(list[i].doorList[0].toward == 'top'){
|
|
|
+ roomObj.width = 266;
|
|
|
+ roomObj.height = 111;
|
|
|
+ roomObj.left = (list[i].w/2) + (list[i].x) - 133;
|
|
|
+ roomObj.top = list[i].y - 111;
|
|
|
+ roomObj.planType = false;
|
|
|
+ }else if(list[i].doorList[0].toward == 'bottom'){
|
|
|
+ roomObj.width = 266;
|
|
|
+ roomObj.height = 111;
|
|
|
+ roomObj.left = (list[i].w/2) + (list[i].x) - 133;
|
|
|
+ roomObj.top = list[i].y + list[i].h;
|
|
|
+ roomObj.planType = false;
|
|
|
+ }else if(list[i].doorList[0].toward == 'left'){
|
|
|
+ roomObj.width = 266;
|
|
|
+ roomObj.height = 111;
|
|
|
+ roomObj.left = list[i].x - 133;
|
|
|
+ roomObj.top = (list[i].h/2) + (list[i].y) - 56;
|
|
|
+ roomObj.planType = false;
|
|
|
+ }else if(list[i].doorList[0].toward == 'fight'){
|
|
|
+ roomObj.width = 266;
|
|
|
+ roomObj.height = 111;
|
|
|
+ roomObj.left = list[i].x + list[i].w + 133;
|
|
|
+ roomObj.top = (list[i].h/2) + (list[i].y) - 56;
|
|
|
+ roomObj.planType = false;
|
|
|
+ }
|
|
|
+ roomList.push(roomObj);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$set(this,'planMapList',roomList);
|
|
|
this.buttonSubject();
|
|
|
this.getRedisEvacuation();
|
|
|
+ //测试查询预案
|
|
|
+ this.selectTriggerInfo();
|
|
|
}
|
|
|
})
|
|
|
},
|
|
@@ -1533,6 +1622,9 @@
|
|
|
}
|
|
|
getBuildOrFloorList(obj).then(response => {
|
|
|
if(response.data[0]){
|
|
|
+ for(let i=0;i<response.data.length;i++){
|
|
|
+ response.data[i].planType = false
|
|
|
+ }
|
|
|
this.$set(this,'floorOptions',response.data);
|
|
|
if(type == 'automatic'){
|
|
|
//处理实验室数量多的楼层优先选择
|
|
@@ -1563,6 +1655,57 @@
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
+ //查询当前用户下的预案触发数据
|
|
|
+ selectTriggerInfo(){
|
|
|
+ let self = this;
|
|
|
+ selectTriggerInfo().then(response => {
|
|
|
+ //楼栋预案标记
|
|
|
+ for(let o=0;o<self.buildingOptions.length;o++){
|
|
|
+ let num = 0;
|
|
|
+ for(let i=0;i<response.data.length;i++){
|
|
|
+ if(response.data[i].buildId == self.buildingOptions[o].id){
|
|
|
+ num++
|
|
|
+ }
|
|
|
+ }
|
|
|
+ self.buildingOptions[o].planType = num != 0;
|
|
|
+ }
|
|
|
+ //楼层预案标记
|
|
|
+ for(let o=0;o<self.floorOptions.length;o++){
|
|
|
+ let num = 0;
|
|
|
+ for(let i=0;i<response.data.length;i++){
|
|
|
+ if(response.data[i].floorId == self.floorOptions[o].id){
|
|
|
+ num++
|
|
|
+ }
|
|
|
+ }
|
|
|
+ self.floorOptions[o].planType = num != 0;
|
|
|
+ }
|
|
|
+ //实验室预案标记
|
|
|
+ for(let o=0;o<self.mapList.length;o++){
|
|
|
+ if(self.mapList[o].type == 1){
|
|
|
+ let num = 0;
|
|
|
+ for(let i=0;i<response.data.length;i++){
|
|
|
+ if(response.data[i].subId == self.mapList[o].subId){
|
|
|
+ num++
|
|
|
+ }
|
|
|
+ }
|
|
|
+ self.mapList[o].planType = num != 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //浮层实验室预案标记
|
|
|
+ for(let o=0;o<self.shadeMapList.length;o++){
|
|
|
+ if(self.shadeMapList[o].type == 1){
|
|
|
+ let num = 0;
|
|
|
+ for(let i=0;i<response.data.length;i++){
|
|
|
+ if(response.data[i].subId == self.shadeMapList[o].subId){
|
|
|
+ num++
|
|
|
+ }
|
|
|
+ }
|
|
|
+ self.shadeMapList[o].planType = num != 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.$forceUpdate();
|
|
|
+ })
|
|
|
+ },
|
|
|
/*********************************** MQTT相关-相关接口 *********************************/
|
|
|
//全局-MQTT订阅
|
|
|
onAllMQTT(){
|
|
@@ -1970,7 +2113,7 @@
|
|
|
beforeDestroy() {
|
|
|
//清除定时器
|
|
|
let self = this;
|
|
|
- self.offAllMQTT();
|
|
|
+ // self.offAllMQTT();
|
|
|
self.offFloorMQTT();
|
|
|
self.offSubMQTT();
|
|
|
if(self.fireListType){
|
|
@@ -2363,6 +2506,40 @@
|
|
|
/*color:#666!important;*/
|
|
|
}
|
|
|
}
|
|
|
+ .plan-map-for-box{
|
|
|
+ position:absolute;
|
|
|
+ z-index:100;
|
|
|
+ background: url("../assets/ZDimages/bigData3_2/img_zhpt_bg.png");
|
|
|
+ .plan-top-button-box{
|
|
|
+ display: flex;
|
|
|
+ p:nth-child(1){
|
|
|
+ flex:1;
|
|
|
+ }
|
|
|
+ p:nth-child(2){
|
|
|
+ font-size:14px;
|
|
|
+ color:#fff;
|
|
|
+ cursor: pointer;
|
|
|
+ margin:9px 12px 0 0 ;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .plan-time-box{
|
|
|
+ display: flex;
|
|
|
+ img{
|
|
|
+ width:24px;
|
|
|
+ height:24px;
|
|
|
+ margin-left:19px;
|
|
|
+ margin-right:8px;
|
|
|
+ }
|
|
|
+ p{
|
|
|
+ line-height:24px;
|
|
|
+ color:#fff;
|
|
|
+ font-size:14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .check-plan-map-for-box{
|
|
|
+ z-index:1000!important;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.null-mapList{
|
|
@@ -3128,7 +3305,7 @@
|
|
|
}
|
|
|
}
|
|
|
.el-select-dropdown{
|
|
|
- background:rgba(17,110,142,0.5);
|
|
|
+ background:#01294d;
|
|
|
border:1px solid #24D1F9;
|
|
|
.el-select-dropdown__item{
|
|
|
background: rgba(0,0,0,0);
|