|
|
|
|
<template>
|
|
|
|
|
<!-- 空开 -->
|
|
|
|
|
<div class="light">
|
|
|
|
|
<!-- 各楼栋楼层切换 -->
|
|
|
|
|
<clickCp :bimModel="bimModel" sbType="空开" ref="clickcp"></clickCp>
|
|
|
|
|
<!-- 返回主视角 -->
|
|
|
|
|
<backHome :bimModel="bimModel" type="照明" dom=".mapDom"></backHome>
|
|
|
|
|
<div class="mapDom" style="
|
|
|
|
|
position: absolute;
|
|
|
|
|
left: 105px;
|
|
|
|
|
top: 210px;
|
|
|
|
|
width: 250px;
|
|
|
|
|
height: 180px;
|
|
|
|
|
margin: 45px auto;
|
|
|
|
|
" v-if="bimModel == 1"></div>
|
|
|
|
|
|
|
|
|
|
<div class="box2">
|
|
|
|
|
<div class="title flex-center">
|
|
|
|
|
<img class="icon" src="../../../public/img/monitoring/electricity/sbIcon.png" />
|
|
|
|
|
<span>设备概况</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="state flex-center-center">
|
|
|
|
|
<div class="zc flex-center" style="font-family: fantasy">
|
|
|
|
|
<span style="margin-left: 72px">{{ tableData.openCount }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="lx flex-center" style="font-family: fantasy">
|
|
|
|
|
<span style="margin-left: 72px">{{ tableData.closeCount }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="stateName flex-center-center">
|
|
|
|
|
<span class="zc">开灯</span>
|
|
|
|
|
<span class="lx">关灯</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tab_box">
|
|
|
|
|
<div class="tab_one" @click="clickAlarm(1)" :style="{ color: activeTab == 1 ? '#07E6ED' : '#fff' }">
|
|
|
|
|
<el-badge :is-dot="isAlarm" class="item">设备告警</el-badge><span
|
|
|
|
|
style="margin-left: 5px; vertical-align: bottom">({{ listData.warnEquipWarnNumber }})</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="tab_one tab_two" @click="clickAlarm(2)" :style="{ color: activeTab == 2 ? '#07E6ED' : '#fff' }">
|
|
|
|
|
<el-badge :is-dot="isSafe" class="item">告警事件</el-badge><span
|
|
|
|
|
style="margin-left: 5px; vertical-align: bottom">({{ listData.warnEventWarnMumber }})</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="flex-center tit" :class="bimModel == 2 ? 'tataitit' : ''">
|
|
|
|
|
<p>设备名称</p>
|
|
|
|
|
<span>|</span>
|
|
|
|
|
<p>报警信息</p>
|
|
|
|
|
<span>|</span>
|
|
|
|
|
<p>报警时间</p>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div v-if="listData.length == 0" class="noBjxx">暂无报警信息</div> -->
|
|
|
|
|
<div v-if="
|
|
|
|
|
JSON.stringify(listData) != '{}' &&
|
|
|
|
|
listData.warnEquipList &&
|
|
|
|
|
listData.warnEquipList.length == 0 &&
|
|
|
|
|
activeTab == 1
|
|
|
|
|
" class="noBjxx">
|
|
|
|
|
暂无故障报警信息
|
|
|
|
|
</div>
|
|
|
|
|
<div v-else-if="
|
|
|
|
|
JSON.stringify(listData) != '{}' &&
|
|
|
|
|
listData.warnEventList &&
|
|
|
|
|
listData.warnEventList.length == 0 &&
|
|
|
|
|
activeTab == 2
|
|
|
|
|
" class="noBjxx">
|
|
|
|
|
暂无安全报警信息
|
|
|
|
|
</div>
|
|
|
|
|
<div v-else class="warp">
|
|
|
|
|
<div class="item flex-center" v-for="(item, index) in listData.warnEquipList" :key="index" v-if="activeTab == 1"
|
|
|
|
|
style="position: relative" @mouseenter="showAlarkAlert(item, index, 0)"
|
|
|
|
|
@mouseleave="closeAlarkAlert(item, index, 0)">
|
|
|
|
|
<div :style="{ display: item.showAlert ? 'flex' : 'none' }" class="alark-alert">
|
|
|
|
|
<p @click="bjclick(item)" v-if="item.modelId != ''">
|
|
|
|
|
<img src="../../../public/img/monitoring/electricity/alark-detail-icon.png" alt="" />
|
|
|
|
|
<span>查看详情</span>
|
|
|
|
|
</p>
|
|
|
|
|
<span v-if="item.confirmStatus == '0' && item.modelId != ''">|</span>
|
|
|
|
|
<p v-if="item.confirmStatus == '0'" @click="doCancelWarn(item)">
|
|
|
|
|
<img src="../../../public/img/monitoring/electricity/close-alark-icon.png" alt="" />
|
|
|
|
|
<span>确认告警</span>
|
|
|
|
|
</p>
|
|
|
|
|
<span v-if="item.warnStatus == 1 && (item.modelId != '' || item.confirmStatus == '0')">|</span>
|
|
|
|
|
<p v-if="item.warnStatus == 1" @click="doRecoveryWarn(item)">
|
|
|
|
|
<i class="el-icon-refresh-right" style="margin-right:10px;"></i>
|
|
|
|
|
<span>告警恢复</span>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box flex-center" style="justify-content: space-around" :class="bimModel == 2 ? 'tataicon' : ''">
|
|
|
|
|
<div class="left flex-center-center">
|
|
|
|
|
<img class="icon" src="../../../public/img/monitoring/electricity/lx.png" v-if="item.status == '2'" />
|
|
|
|
|
<img class="icon" src="../../../public/img/monitoring/electricity/bj.png" v-else />
|
|
|
|
|
<span class="message" v-text="item.name" :style="{
|
|
|
|
|
color: item.warnStatus == 2 ? 'white' : item.warnStatus == 1 ? '#ff0000' : 'white',
|
|
|
|
|
}" :title="item.name"></span>
|
|
|
|
|
</div>
|
|
|
|
|
<span></span>
|
|
|
|
|
<span class="data" :style="{
|
|
|
|
|
color: item.warnStatus == 2 ? 'white' : item.warnStatus == 1 ? '#ff0000' : 'white',
|
|
|
|
|
}" :title="item.warnContent">{{ item.warnContent }}</span>
|
|
|
|
|
<span class=""></span>
|
|
|
|
|
<span class="time" :style="{
|
|
|
|
|
color: item.warnStatus == 2 ? 'white' : item.warnStatus == 1 ? '#ff0000' : 'white',
|
|
|
|
|
}">{{ item.warnDate.substring(5, 16) }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="item flex-center" v-for="(item, index) in listData.warnEventList" :key="'warnEvent' + index" v-if="activeTab == 2"
|
|
|
|
|
@mouseenter="showAlarkAlert(item, index, 1)" style="position: relative"
|
|
|
|
|
@mouseleave="closeAlarkAlert(item, index, 1)">
|
|
|
|
|
<div :style="{ display: item.showAlert ? 'flex' : 'none' }" class="alark-alert">
|
|
|
|
|
<p @click="bjClick(item)" v-if="item.modelId != ''">
|
|
|
|
|
<img src="../../../public/img/monitoring/electricity/alark-detail-icon.png" alt="" />
|
|
|
|
|
<span>查看详情</span>
|
|
|
|
|
</p>
|
|
|
|
|
<span v-if="item.confirmStatus == '0' && item.modelId != ''">|</span>
|
|
|
|
|
<p v-if="item.confirmStatus == '0'" @click="doCancelWarn(item)">
|
|
|
|
|
<img src="../../../public/img/monitoring/electricity/close-alark-icon.png" alt="" />
|
|
|
|
|
<span>确认告警</span>
|
|
|
|
|
</p>
|
|
|
|
|
<span v-if="item.warnStatus == 1 && (item.modelId != '' || item.confirmStatus == '0')">|</span>
|
|
|
|
|
<p v-if="item.warnStatus == 1" @click="doRecoveryWarn(item)">
|
|
|
|
|
<i class="el-icon-refresh-right" style="margin-right:10px;"></i>
|
|
|
|
|
<span>告警恢复</span>
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="box flex-center">
|
|
|
|
|
<div class="left flex-center-center">
|
|
|
|
|
<img class="icon" src="../../../public/img/monitoring/electricity/lx.png" v-if="item.status == 2" />
|
|
|
|
|
<img class="icon" src="../../../public/img/monitoring/electricity/bj.png" v-else />
|
|
|
|
|
<span class="message" v-text="item.name" :title="item.name" :style="{
|
|
|
|
|
color: item.warnStatus == 2 ? 'white' : item.warnStatus == 1 ? '#ff0000' : 'white',
|
|
|
|
|
}"></span>
|
|
|
|
|
</div>
|
|
|
|
|
<span class="data" title="item.warnContent" :style="{
|
|
|
|
|
color: item.warnStatus == 2 ? 'white' : item.warnStatus == 1 ? '#ff0000' : 'white',
|
|
|
|
|
}">{{ item.warnContent }}</span>
|
|
|
|
|
<span class=""></span>
|
|
|
|
|
<span class="time" :style="{
|
|
|
|
|
color: item.warnStatus == 2 ? 'white' : item.warnStatus == 1 ? '#ff0000' : 'white',
|
|
|
|
|
}">{{ item.warnDate.substring(5, 16) }}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style=" position: absolute; bottom: 10px; right: 10px; width: 345px; text-align: right; color: rgb(7, 230, 237); font-size: 14px;cursor: pointer;">
|
|
|
|
|
<span @click="goMoreWarnList">查看报警详情</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-if="bimModel == 1" class="switch">
|
|
|
|
|
<div class="title flex-center">
|
|
|
|
|
<!-- <img
|
|
|
|
|
class="icon"
|
|
|
|
|
src="../../../public/img/monitoring/electricity/sbIcon.png"
|
|
|
|
|
/> -->
|
|
|
|
|
<img src="../../../public/img/monitoring/electricity/listIcon3.png" />
|
|
|
|
|
<span id="light_box">开关列表</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="main-switch" v-if="floored == null">
|
|
|
|
|
<div>
|
|
|
|
|
<img class="switch_icon" src="../../../public/img/monitoring/switch/all-on.png"
|
|
|
|
|
v-if="tableData.buildStatus == 1" alt="" @click="closeTotal" />
|
|
|
|
|
<img class="switch_icon" src="../../../public/img/monitoring/switch/all-off.png" v-else alt=""
|
|
|
|
|
@click="openTotal" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="right_main">
|
|
|
|
|
<img src="../../../public/img/monitoring/switch/beijing.png" alt="" />
|
|
|
|
|
<div class="main_title">
|
|
|
|
|
<div style="color: #00eeff; margin: 12px 0 0 20px">
|
|
|
|
|
{{ tableData.buildCode | buildValue }}
|
|
|
|
|
</div>
|
|
|
|
|
<div style="color: #a5bbe5; margin: 10px 0 0 20px">
|
|
|
|
|
<span>当前状态</span><span style="color: #fff; margin-left: 10px">{{
|
|
|
|
|
tableData.buildStatus == 1 ? "ON" : "OFF"
|
|
|
|
|
}}</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="overflow: auto" v-if="tableData.floorData && tableData.floorData.length > 0">
|
|
|
|
|
<div v-for="(item, index) in tableData.floorData" :key="index">
|
|
|
|
|
<div>
|
|
|
|
|
<img src="../../../public/img/monitoring/switch/xian.png" alt="" />
|
|
|
|
|
</div>
|
|
|
|
|
<div style="display: flex">
|
|
|
|
|
<div style="margin-left: 1.562rem">
|
|
|
|
|
<div style="text-align: center; color: white">
|
|
|
|
|
<img class="switch_icon" src="../../../public/img/monitoring/switch/on.png"
|
|
|
|
|
v-show="item.floorStatus == 1" alt="" style="width: 3.437rem; height: 3.437rem"
|
|
|
|
|
@click="closeAllSwitch(item)" />
|
|
|
|
|
<img class="switch_icon" src="../../../public/img/monitoring/switch/off.png"
|
|
|
|
|
v-show="item.floorStatus == 2" alt="" style="width: 3.437rem; height: 3.437rem"
|
|
|
|
|
@click="openAllSwitch(item)" />
|
|
|
|
|
<p style="
|
|
|
|
|
margin-top: -3px;
|
|
|
|
|
width: 3.437rem;
|
|
|
|
|
background-color: rgb(26, 197, 191);
|
|
|
|
|
border-radius: 0.187rem;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
">
|
|
|
|
|
{{ item.floorName }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="first_switch">
|
|
|
|
|
<div class="switch_item" v-for="(item1, index1) in item.lightList" :key="index1" @contextmenu="clickLight(item1,$event)">
|
|
|
|
|
<div>
|
|
|
|
|
<img class="switch_icon" src="../../../public/img/monitoring/switch/on_lit.png"
|
|
|
|
|
v-show="item1.openStatus == 1" alt="" @click="controlFun(item1)" />
|
|
|
|
|
<img class="switch_icon" src="../../../public/img/monitoring/switch/off_lit.png"
|
|
|
|
|
v-show="item1.openStatus == 2" alt="" @click="controlFun(item1)" />
|
|
|
|
|
<p style="
|
|
|
|
|
margin-top: -3px;
|
|
|
|
|
width: 2.312rem;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
background-color: rgb(14, 49, 139);
|
|
|
|
|
padding: 5px;
|
|
|
|
|
border-radius: 2px;
|
|
|
|
|
" :title="item1.shortName"
|
|
|
|
|
@click="clickShortName(item1)">
|
|
|
|
|
{{ item1.shortName }}
|
|
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div v-else style="color: white; margin: 30px auto; width: 100%; text-align: center">
|
|
|
|
|
暂无开关列表
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import * as bfHelper from "../../util/bfHelper";
|
|
|
|
|
import * as commonValue from "../../util/commonValue";
|
|
|
|
|
import clickCp from "./clickCp";
|
|
|
|
|
import {
|
|
|
|
|
getEquipInfo,
|
|
|
|
|
getLightSblb, //设备列表
|
|
|
|
|
lightControl, //开控制
|
|
|
|
|
lightControl2, //关控制
|
|
|
|
|
lightOpenBuild,
|
|
|
|
|
lightCloseBuild,
|
|
|
|
|
getLightWarnList, //告警列表
|
|
|
|
|
getCancelWarn, //关闭报警
|
|
|
|
|
recoveryWarn,//恢复告警
|
|
|
|
|
} from "@/api/garden/monitoring";
|
|
|
|
|
import backHome from "./backHome";
|
|
|
|
|
export default {
|
|
|
|
|
props: {
|
|
|
|
|
bimModel: {
|
|
|
|
|
type: Number,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
components: {
|
|
|
|
|
clickCp,
|
|
|
|
|
backHome,
|
|
|
|
|
},
|
|
|
|
|
filters: {
|
|
|
|
|
buildValue(data) {
|
|
|
|
|
switch (data) {
|
|
|
|
|
case "00":
|
|
|
|
|
return "室外总开关";
|
|
|
|
|
case "01":
|
|
|
|
|
return "1#总开关";
|
|
|
|
|
case "02":
|
|
|
|
|
return "2#总开关";
|
|
|
|
|
case "03":
|
|
|
|
|
return "3#总开关";
|
|
|
|
|
case "04":
|
|
|
|
|
return "4#总开关";
|
|
|
|
|
case "05":
|
|
|
|
|
return "5#总开关";
|
|
|
|
|
case "06":
|
|
|
|
|
return "6#总开关";
|
|
|
|
|
case "07":
|
|
|
|
|
return "地下室总开关";
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
path:'ws://10.90.100.204/blade-websocket/ws?light_kk',//socket地址
|
|
|
|
|
// path:'ws://192.168.1.3/blade-websocket/ws?light_kk',//socket地址
|
|
|
|
|
build: "00", //楼
|
|
|
|
|
floored: null, //楼层
|
|
|
|
|
controlAll: 2, //批量控制开关
|
|
|
|
|
current: 1, //当前页
|
|
|
|
|
size: 6, //每页数量
|
|
|
|
|
total: 0, //总条目数
|
|
|
|
|
chooseId: [], //多选
|
|
|
|
|
tableData: [], //设备列表
|
|
|
|
|
setInterval: null,
|
|
|
|
|
|
|
|
|
|
mainSwitch: 1,
|
|
|
|
|
arr: [], //照明信息
|
|
|
|
|
activeTab: 1,
|
|
|
|
|
listData: {
|
|
|
|
|
systemWarnEquipList: [],
|
|
|
|
|
safeWarnEquipList: [],
|
|
|
|
|
}, //告警列表
|
|
|
|
|
|
|
|
|
|
intervalCheckLight: 0,//轮询获取空开状态
|
|
|
|
|
dialogItem: {},
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
bimModel: {
|
|
|
|
|
handler(newVal, oldVal) {
|
|
|
|
|
this.getLifLists(); //设备信息和告警信息
|
|
|
|
|
this.current = 1; //当前页
|
|
|
|
|
this.total = 0; //总条目数
|
|
|
|
|
if (this.setInterval) {
|
|
|
|
|
clearInterval(this.setInterval);
|
|
|
|
|
}
|
|
|
|
|
if (this.intervalCheckLight) {
|
|
|
|
|
clearInterval(this.intervalCheckLight);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.setInterval = setInterval(() => {
|
|
|
|
|
// this.getSblb(); //获取设备列表
|
|
|
|
|
this.getLightWarnList(); //告警列表
|
|
|
|
|
}, 3600000);
|
|
|
|
|
|
|
|
|
|
this.getSblb(); //获取设备列表
|
|
|
|
|
this.getLightWarnList(); //告警列表
|
|
|
|
|
if (newVal == 1) {
|
|
|
|
|
} else {
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
//模型是否加载完成监听
|
|
|
|
|
"$store.state.bfHelperState.bfState": {
|
|
|
|
|
immediate: true,
|
|
|
|
|
handler(newval, olval) {
|
|
|
|
|
console.log('bfState',newval)
|
|
|
|
|
if (newval) {
|
|
|
|
|
// 模型恢复全部状态
|
|
|
|
|
// bfHelper.resetStatus(2);
|
|
|
|
|
bfHelper.clearDrawableContainer();
|
|
|
|
|
bfHelper.clearTags();
|
|
|
|
|
if (newval == 1) {
|
|
|
|
|
window.sessionStorage.setItem(
|
|
|
|
|
"camera",
|
|
|
|
|
JSON.stringify(bfHelper.getCameraStatus())
|
|
|
|
|
);
|
|
|
|
|
let build = sessionStorage.getItem("build");
|
|
|
|
|
let floor = sessionStorage.getItem("floor");
|
|
|
|
|
let type = sessionStorage.getItem('type') ? sessionStorage.getItem('type') : 'build'
|
|
|
|
|
if (build) {
|
|
|
|
|
if (build == 10) {
|
|
|
|
|
//如果点击的是地下室
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.setTowerLight("07");
|
|
|
|
|
this.$refs.clickcp.active = 26;
|
|
|
|
|
this.$refs.clickcp.area = 1;
|
|
|
|
|
this.$refs.clickcp.type = 'build';
|
|
|
|
|
this.$refs.clickcp.tower = 9;
|
|
|
|
|
}, 300);
|
|
|
|
|
bfHelper.lookPipeline2(
|
|
|
|
|
null,
|
|
|
|
|
null,
|
|
|
|
|
build - 1,
|
|
|
|
|
null,
|
|
|
|
|
"空开",
|
|
|
|
|
bfHelper.equipmentCondition2[2]
|
|
|
|
|
);
|
|
|
|
|
} else if (build == 26) {
|
|
|
|
|
//如果点击的是园区
|
|
|
|
|
bfHelper.resetStatus(2, null, "照明");
|
|
|
|
|
bfHelper.lookEquipmentCop("照明");
|
|
|
|
|
this.$refs.clickcp.active = 26;
|
|
|
|
|
this.$refs.clickcp.type = 'build';
|
|
|
|
|
this.$refs.clickcp.area = 1;
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.setTowerLight("00");
|
|
|
|
|
}, 300);
|
|
|
|
|
} else {
|
|
|
|
|
if (floor.indexOf("null") == -1) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.setTowerLight("0" + build, "0" + floor);
|
|
|
|
|
this.$refs.clickcp.active = commonValue.activeValue(
|
|
|
|
|
Number(build),
|
|
|
|
|
Number(floor)
|
|
|
|
|
);
|
|
|
|
|
this.$refs.clickcp.area = 1;
|
|
|
|
|
this.$refs.clickcp.type = 'floor';
|
|
|
|
|
this.$refs.clickcp.tower = commonValue.towerValue(build);
|
|
|
|
|
}, 300);
|
|
|
|
|
bfHelper.lookPipeline2(
|
|
|
|
|
null,
|
|
|
|
|
null,
|
|
|
|
|
build - 1,
|
|
|
|
|
floor,
|
|
|
|
|
"空开",
|
|
|
|
|
bfHelper.equipmentCondition2[2]
|
|
|
|
|
);
|
|
|
|
|
} else {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.setTowerLight("0" + build);
|
|
|
|
|
this.$refs.clickcp.active = commonValue.activeValue(
|
|
|
|
|
Number(build),
|
|
|
|
|
null
|
|
|
|
|
);
|
|
|
|
|
this.$refs.clickcp.area = 1;
|
|
|
|
|
this.$refs.clickcp.type = 'build';
|
|
|
|
|
this.$refs.clickcp.tower = commonValue.towerValue(build);
|
|
|
|
|
}, 300);
|
|
|
|
|
bfHelper.lookPipeline2(
|
|
|
|
|
null,
|
|
|
|
|
null,
|
|
|
|
|
build - 1,
|
|
|
|
|
null,
|
|
|
|
|
"空开",
|
|
|
|
|
bfHelper.equipmentCondition2[2]
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
bfHelper.lookEquipmentCop("照明");
|
|
|
|
|
bfHelper.setOpacityFun();
|
|
|
|
|
setTimeout(() =>{
|
|
|
|
|
this.$refs.clickcp.area = 1;
|
|
|
|
|
this.$refs.clickcp.type = 'build';
|
|
|
|
|
this.$refs.clickcp.active = 25;
|
|
|
|
|
this.$refs.clickcp.getTypeList('build')
|
|
|
|
|
},300)
|
|
|
|
|
this.getNavigationMap();
|
|
|
|
|
}
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.comeBim(floor, build)
|
|
|
|
|
}, 1000);
|
|
|
|
|
// this.$nextTick(() => {
|
|
|
|
|
// this.comeBim()
|
|
|
|
|
// })
|
|
|
|
|
} else {
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.getSblb(); //获取设备列表
|
|
|
|
|
// this.setLight(); // 获取开启状态的空开
|
|
|
|
|
this.getLightWarnList(); //告警列表
|
|
|
|
|
this.setInterval = setInterval(() => {
|
|
|
|
|
// this.getSblb(); //获取设备列表
|
|
|
|
|
this.getLightWarnList(); //告警列表
|
|
|
|
|
// this.setLight(); // 获取开启状态的空开
|
|
|
|
|
}, 3600000);
|
|
|
|
|
window["handleDetail"] = () => {
|
|
|
|
|
this.handleDetail()
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
let dom = document.getElementById('light_box');
|
|
|
|
|
dom.addEventListener('contextmenu', (event)=> {
|
|
|
|
|
event.preventDefault(); // 阻止默认菜单
|
|
|
|
|
const routerUrl = this.$router.resolve({ path: '/equipment/index', query: { classCode: '0500' } });
|
|
|
|
|
window.open(routerUrl.href, "_blank");
|
|
|
|
|
});
|
|
|
|
|
this.getNavigationMap();
|
|
|
|
|
this.initSocket();
|
|
|
|
|
},
|
|
|
|
|
beforeDestroy() {
|
|
|
|
|
if (this.socket) {
|
|
|
|
|
console.log('close scoket');
|
|
|
|
|
this.socket.close();
|
|
|
|
|
this.socket = "";
|
|
|
|
|
}
|
|
|
|
|
if (this.setInterval) {
|
|
|
|
|
clearInterval(this.setInterval);
|
|
|
|
|
}
|
|
|
|
|
if (this.intervalCheckLight) {
|
|
|
|
|
clearInterval(this.intervalCheckLight);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
comeBim(floor, build) {
|
|
|
|
|
console.log('调用comeBim')
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
if (this.$route.query.code && this.$route.query.type == '照明') {
|
|
|
|
|
getEquipInfo(this.$route.query.code).then(res => {
|
|
|
|
|
this.floored = floor
|
|
|
|
|
this.build = build
|
|
|
|
|
// this.getSblb()
|
|
|
|
|
this.bjClick(res.data.data)
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
// 获取当前路由的路径（不含查询参数）
|
|
|
|
|
const path = this.$route.path;
|
|
|
|
|
|
|
|
|
|
// 替换当前路由，清除查询参数
|
|
|
|
|
this.$router.replace({ path });
|
|
|
|
|
}, 1000)
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
handleDetail() {
|
|
|
|
|
// this.$router.push(`/equipment/operationDetails?code=${this.dialogItem.code}&type=照明&area=${this.bimModel}`)
|
|
|
|
|
const routerUrl = this.$router.resolve({ path: '/equipment/operationDetails', query: { code: this.dialogItem.code,type:'照明',area: this.bimModel} });
|
|
|
|
|
window.open(routerUrl.href, "_blank");
|
|
|
|
|
},
|
|
|
|
|
clickShortName(data) {
|
|
|
|
|
// this.dialogItem = data
|
|
|
|
|
// console.log('gxh查看this.dialogItem', this.dialogItem)
|
|
|
|
|
this.bjClick(data)
|
|
|
|
|
},
|
|
|
|
|
bjClick(item) {
|
|
|
|
|
this.dialogItem = item
|
|
|
|
|
console.log('item',item)
|
|
|
|
|
if(item.modelId == ''){
|
|
|
|
|
this.$message.error('对不起，暂无该设备模型，请稍后点击')
|
|
|
|
|
}else{
|
|
|
|
|
// console.log('gxh', bfHelper.getBoxMessage('10000752850689.1089992'))
|
|
|
|
|
// 如果当前点击的是电箱 先清除所以标签
|
|
|
|
|
bfHelper.clearDrawableContainer();
|
|
|
|
|
let id = bfHelper.disposeId(item.area, item.build, item.modelId);
|
|
|
|
|
// console.log('gxh2', item.area, item.build, item.modelId, id)
|
|
|
|
|
let boundingBox = bfHelper.getBoxMessage(id);
|
|
|
|
|
// console.log('gxh2', boundingBox)
|
|
|
|
|
this.addLabel(
|
|
|
|
|
id,
|
|
|
|
|
item.name,
|
|
|
|
|
item.status,
|
|
|
|
|
item.location,
|
|
|
|
|
);
|
|
|
|
|
if(item.build != '00') {
|
|
|
|
|
this.$refs.clickcp.active = commonValue.activeValue(
|
|
|
|
|
Number(item.build),
|
|
|
|
|
Number(item.floored)
|
|
|
|
|
);
|
|
|
|
|
this.$refs.clickcp.tower = commonValue.towerValue(item.build);
|
|
|
|
|
let camera = bfHelper.cameraPosition[Number(item.build) - 1];
|
|
|
|
|
window.sessionStorage.setItem("camera", JSON.stringify(camera));
|
|
|
|
|
bfHelper.mapUpdate(
|
|
|
|
|
require("../../../public/img/monitoring/mapviewer/electricity" +
|
|
|
|
|
Number(item.build) +
|
|
|
|
|
"b" +
|
|
|
|
|
Number(item.floored) +
|
|
|
|
|
"f.png"),
|
|
|
|
|
bfHelper.mapViewerCamera[Number(item.build) - 1][Number(item.floored) - 1]
|
|
|
|
|
.mapAnchors,
|
|
|
|
|
bfHelper.mapViewerCamera[Number(item.build) - 1][Number(item.floored) - 1]
|
|
|
|
|
.modelAnchors
|
|
|
|
|
);
|
|
|
|
|
bfHelper.lookPipeline2(
|
|
|
|
|
null,
|
|
|
|
|
null,
|
|
|
|
|
Number(item.build) - 1,
|
|
|
|
|
Number(item.floored),
|
|
|
|
|
"空开",
|
|
|
|
|
bfHelper.equipmentCondition2[2]
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
bfHelper.zoomToBoundingBox(boundingBox, 40);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
// 添加标签
|
|
|
|
|
addLabel(objectId, name, type, location, dataNum,inventarNummer,maintainTime,maintainUser,maintainPhone,maintainDesc, code) {
|
|
|
|
|
console.log(objectId, name, type, location)
|
|
|
|
|
// 构件id/设备名称/设备状态/设备位置/累计电量
|
|
|
|
|
// 获取当前点击坐标
|
|
|
|
|
let zb = bfHelper.getBoxMessage(objectId, true);
|
|
|
|
|
// //引线标签的顶点
|
|
|
|
|
console.log('zb', zb)
|
|
|
|
|
|
|
|
|
|
let position = zb.max;
|
|
|
|
|
console.log('position', position)
|
|
|
|
|
let content = `<div class="leadTips" style="transform: translateY(-72px);">
|
|
|
|
|
<div style="display: flex;width:max-content">
|
|
|
|
|
<img src="${require(type == 90000
|
|
|
|
|
? "../../../public/img/monitoring/electricity/customTag1.png"
|
|
|
|
|
: "../../../public/img/monitoring/electricity/offline2_2.png")}" style="width:87px;height:53px;"/>
|
|
|
|
|
<div style="margin-top: -42px;">
|
|
|
|
|
<div style="width: 185px;height: 46px;background: url('${require(type == 90000
|
|
|
|
|
? "../../../public/img/monitoring/electricity/customTag1-1.png"
|
|
|
|
|
: "../../../public/img/monitoring/electricity/offline2.png")}');background-repeat: no-repeat;background-size: cover;
|
|
|
|
|
display: flex;align-items: center;">
|
|
|
|
|
<span style="padding-left: 36px;font-size: 15px;color: white;">${name}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="margin-top: 5px;box-sizing: border-box;color: #ffffff;width: 185px;padding: 0 15px;background-color: ${type == 90000
|
|
|
|
|
? "rgba(30, 57, 102, 0.8)"
|
|
|
|
|
: "rgba(96, 96, 96, 0.8)"
|
|
|
|
|
};">
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">设备状态:</span>
|
|
|
|
|
<span style="font-size: 15px;">${type == 90000 ? "正常" : "离线"}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">所在位置:</span>
|
|
|
|
|
<span style="font-size: 15px;">${location}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">固定资产编号:</span>
|
|
|
|
|
<span style="font-size: 15px;">${inventarNummer ? inventarNummer : ''}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">维保人:</span>
|
|
|
|
|
<span style="font-size: 15px;">${maintainUser ? maintainUser : ''}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">维保人电话:</span>
|
|
|
|
|
<span style="font-size: 15px;">${maintainPhone ? maintainPhone.substring(0, 10) : ''}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">维保时间:</span>
|
|
|
|
|
<span style="font-size: 15px;">${maintainTime ? maintainTime : ''}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div style="padding: 5px 0;display: flex;align-items: center;justify-content: space-between;">
|
|
|
|
|
<span style="opacity: 0.5;font-size: 12px;">维保内容:</span>
|
|
|
|
|
<span style="font-size: 15px;">${maintainDesc ? maintainDesc : ''}</span>
|
|
|
|
|
</div>
|
|
|
|
|
<button style="padding: 5px 0;font-size: 12px;" onclick="handleDetail()">操作明细</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>`;
|
|
|
|
|
bfHelper.customTag(position, null, content);
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
//socket 接收空开状态
|
|
|
|
|
initSocket() {
|
|
|
|
|
if (typeof (WebSocket) === "undefined") {
|
|
|
|
|
alert("您的浏览器不支持socket");
|
|
|
|
|
} else {
|
|
|
|
|
this.socket = new WebSocket(this.path);
|
|
|
|
|
// 监听socket连接
|
|
|
|
|
this.socket.onopen = this.open;
|
|
|
|
|
// 监听socket错误信息
|
|
|
|
|
this.socket.onerror = this.error;
|
|
|
|
|
// 监听socket消息
|
|
|
|
|
this.socket.onmessage = this.getMessage;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
open() {
|
|
|
|
|
console.log("socket连接成功")
|
|
|
|
|
},
|
|
|
|
|
error() {
|
|
|
|
|
console.log("socket连接错误")
|
|
|
|
|
},
|
|
|
|
|
getMessage(msg) {
|
|
|
|
|
// console.log('scoket 模拟',msg)
|
|
|
|
|
let retData = JSON.parse(msg.data);
|
|
|
|
|
if (this.tableData.floorData && this.tableData.floorData.length > 0) {
|
|
|
|
|
this.tableData.floorData.map((item1,index) => {
|
|
|
|
|
let lightObjIndex = item1.lightList.findIndex(item2 => item2.code == retData.code);
|
|
|
|
|
if(lightObjIndex > -1 && item1.lightList[lightObjIndex].openStatus != retData.openStatus){
|
|
|
|
|
item1.lightList[lightObjIndex].openStatus = retData.openStatus;
|
|
|
|
|
if(retData.openStatus == 1){
|
|
|
|
|
//开灯
|
|
|
|
|
console.log(item1.lightList[lightObjIndex].name,'开灯')
|
|
|
|
|
//验证是否全开
|
|
|
|
|
let checkOpenStatus = item1.lightList.filter(item2 => item2.openStatus == 1);
|
|
|
|
|
console.log('全开',checkOpenStatus)
|
|
|
|
|
if(checkOpenStatus != undefined && checkOpenStatus.length == item1.lightList.length){
|
|
|
|
|
item1.floorStatus = 1;
|
|
|
|
|
}
|
|
|
|
|
this.getLight([{arr: item1.lightList[lightObjIndex].ctrlList.split(','),build: item1.lightList[lightObjIndex].build}]);
|
|
|
|
|
}else{
|
|
|
|
|
//关灯
|
|
|
|
|
console.log(item1.lightList[lightObjIndex].name,'关灯')
|
|
|
|
|
this.cleanLight([{arr: item1.lightList[lightObjIndex].ctrlList.split(','),build: item1.lightList[lightObjIndex].build}]);
|
|
|
|
|
//验证是否全关
|
|
|
|
|
let checkOpenStatus = item1.lightList.filter(item2 => item2.openStatus == 2);
|
|
|
|
|
console.log('全关',checkOpenStatus)
|
|
|
|
|
if(checkOpenStatus != undefined && checkOpenStatus.length == item1.lightList.length){
|
|
|
|
|
item1.floorStatus = 2;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//确认告警 - 重新查询告警列表
|
|
|
|
|
doCancelWarn(item) {
|
|
|
|
|
getCancelWarn(item.id).then((res) => {
|
|
|
|
|
// this.getLightWarnList();
|
|
|
|
|
item.confirmStatus = 1;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
//恢复告警
|
|
|
|
|
doRecoveryWarn(item) {
|
|
|
|
|
recoveryWarn(item.id).then((res) => {
|
|
|
|
|
item.warnStatus = 2;
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
//跳转历史告警列表
|
|
|
|
|
goMoreWarnList() {
|
|
|
|
|
// this.$router.push({ path: '/equipment/warnHistory' });
|
|
|
|
|
const routerUrl = this.$router.resolve({
|
|
|
|
|
path: "/equipment/warnHistory",
|
|
|
|
|
query: { classCode: "0500", area: this.bimModel },
|
|
|
|
|
});
|
|
|
|
|
window.open(routerUrl.href, "_blank");
|
|
|
|
|
},
|
|
|
|
|
// 报警记录-20221031改版
|
|
|
|
|
getLightWarnList() {
|
|
|
|
|
getLightWarnList({
|
|
|
|
|
area: this.bimModel,
|
|
|
|
|
build: this.tower ? this.tower : "",
|
|
|
|
|
floor: this.layer ? this.layer : "",
|
|
|
|
|
}).then((res) => {
|
|
|
|
|
this.listData = res.data.data;
|
|
|
|
|
for (let i = 0; i < this.listData.warnEquipList.length; i++) {
|
|
|
|
|
this.listData.warnEquipList[i].showAlert = false;
|
|
|
|
|
}
|
|
|
|
|
for (let i = 0; i < this.listData.warnEventList.length; i++) {
|
|
|
|
|
this.listData.warnEventList[i].showAlert = false;
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
// 设备告警、告警事件
|
|
|
|
|
showAlarkAlert(item, index, key) {
|
|
|
|
|
//鼠标悬停在设备概况列表里出现查看详情和确认告警
|
|
|
|
|
item.showAlert = true;
|
|
|
|
|
if (key == 0) {
|
|
|
|
|
this.listData.warnEquipList.splice(index, 1, item);
|
|
|
|
|
} else {
|
|
|
|
|
this.listData.warnEventList.splice(index, 1, item);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
closeAlarkAlert(item, index, key) {
|
|
|
|
|
item.showAlert = false;
|
|
|
|
|
if (key == 0) {
|
|
|
|
|
this.listData.warnEquipList.splice(index, 1, item);
|
|
|
|
|
} else {
|
|
|
|
|
this.listData.warnEventList.splice(index, 1, item);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
getFightWarnList() {
|
|
|
|
|
getFightWarn(
|
|
|
|
|
this.bimModel,
|
|
|
|
|
this.towers ? this.towers : "",
|
|
|
|
|
this.layer ? this.layer : ""
|
|
|
|
|
).then((res) => {
|
|
|
|
|
this.alarmLists = res.data.data;
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
clickAlarm(item) {
|
|
|
|
|
this.activeTab = item;
|
|
|
|
|
},
|
|
|
|
|
// 设备信息、告警信息
|
|
|
|
|
getLifLists() {
|
|
|
|
|
getLifList(this.bimModel).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.arr = res.data.data;
|
|
|
|
|
this.setLiftColor(this.arr);
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
setLiftColor(arr) {
|
|
|
|
|
let arrs = [];
|
|
|
|
|
for (let i = 0; i < arr.length; i++) {
|
|
|
|
|
if (arr[i].status != 90000) {
|
|
|
|
|
arrs.push(arr[i]);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
this.listData = arrs;
|
|
|
|
|
|
|
|
|
|
for (let j = 0; j < this.listData.length; j++) {
|
|
|
|
|
this.listData[j].showAlert = false;
|
|
|
|
|
}
|
|
|
|
|
let offList = [];
|
|
|
|
|
let bjList = [];
|
|
|
|
|
let normalList = [];
|
|
|
|
|
for (let i = 0; i < arr.length; i++) {
|
|
|
|
|
let objectId = bfHelper.getExternalComponentId(arr[i].modelId);
|
|
|
|
|
if (arr[i].status == 90000) {
|
|
|
|
|
normalList.push(objectId);
|
|
|
|
|
} else if (arr[i].status == 90001) {
|
|
|
|
|
offList.push(objectId);
|
|
|
|
|
} else {
|
|
|
|
|
bjList.push(objectId);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
bfHelper.restoreColor(normalList);
|
|
|
|
|
bfHelper.setFlicker(bjList, "#ff0000", 100);
|
|
|
|
|
bfHelper.cancelFlicker(normalList);
|
|
|
|
|
bfHelper.setColor("#a5bbe5", offList);
|
|
|
|
|
},
|
|
|
|
|
getNavigationMap() {
|
|
|
|
|
commonValue.getNavigationMap("water");
|
|
|
|
|
},
|
|
|
|
|
// 接收子组件当前点击楼号
|
|
|
|
|
setTowerLight(i, j) {
|
|
|
|
|
this.current = 1; //当前页
|
|
|
|
|
this.total = 0; //总条目数
|
|
|
|
|
this.build = i;
|
|
|
|
|
this.floored = j;
|
|
|
|
|
this.getSblb();
|
|
|
|
|
if (this.bimModel == 1) {
|
|
|
|
|
commonValue.getUpdateMap("water", i, j);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 获取开启状态的空开
|
|
|
|
|
// setLight() {
|
|
|
|
|
// if (this.setInterval) {
|
|
|
|
|
// clearInterval(this.setInterval);
|
|
|
|
|
// }
|
|
|
|
|
// this.getLight();
|
|
|
|
|
// this.setInterval = setInterval(() => {
|
|
|
|
|
// this.getLight();
|
|
|
|
|
// }, 30000);
|
|
|
|
|
// },
|
|
|
|
|
getLight(data) {
|
|
|
|
|
// console.log(data)
|
|
|
|
|
// if (data.length > ) {
|
|
|
|
|
if (data) {
|
|
|
|
|
let arr = [];
|
|
|
|
|
for (let i = 0; i < data.length; i++) {
|
|
|
|
|
for (let j = 0; j < data[i].arr.length; j++) {
|
|
|
|
|
if (data[i].arr[j] != "") {
|
|
|
|
|
let id = bfHelper.disposeId(1, data[i].build, data[i].arr[j]);
|
|
|
|
|
arr.push(id);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (arr.length > 0) {
|
|
|
|
|
// console.log('arr', arr)
|
|
|
|
|
bfHelper.setGlowEffectById(arr); //根据构件ID设置发光效果
|
|
|
|
|
bfHelper.setColor("#fff99a", arr);
|
|
|
|
|
bfHelper.restoreComponentsOpacityById(arr);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
cleanLight(data) {
|
|
|
|
|
bfHelper.clearAllLight();
|
|
|
|
|
let arr = [];
|
|
|
|
|
for (let i = 0; i < data.length; i++) {
|
|
|
|
|
for (let j = 0; j < data[i].arr.length; j++) {
|
|
|
|
|
if (data[i].arr[j] != "") {
|
|
|
|
|
let id = bfHelper.disposeId(1, data[i].build, data[i].arr[j]);
|
|
|
|
|
arr.push(id);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
if (arr.length > 0) {
|
|
|
|
|
bfHelper.removeGlowEffectById(arr); //根据构件ID删除发光效果
|
|
|
|
|
bfHelper.restoreColor(arr);
|
|
|
|
|
// bfHelper.overrideComponentsOpacityById(arr, 0.5)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//获取设备列表
|
|
|
|
|
getSblb() {
|
|
|
|
|
getLightSblb(
|
|
|
|
|
1,
|
|
|
|
|
this.build ? this.build : "",
|
|
|
|
|
this.floored ? this.floored : ""
|
|
|
|
|
).then((res) => {
|
|
|
|
|
this.tableData = res.data.data;
|
|
|
|
|
if (this.tableData.floorData && this.tableData.floorData.length > 0) {
|
|
|
|
|
let data = [];
|
|
|
|
|
let data1 = [];
|
|
|
|
|
for (let i = 0; i < this.tableData.floorData.length; i++) {
|
|
|
|
|
for (
|
|
|
|
|
let j = 0;
|
|
|
|
|
j < this.tableData.floorData[i].lightList.length;
|
|
|
|
|
j++
|
|
|
|
|
) {
|
|
|
|
|
if (this.tableData.floorData[i].lightList[j].openStatus == 1) {
|
|
|
|
|
data.push({
|
|
|
|
|
arr: this.tableData.floorData[i].lightList[j].ctrlList.split(
|
|
|
|
|
","
|
|
|
|
|
),
|
|
|
|
|
build: this.tableData.floorData[i].lightList[j].build,
|
|
|
|
|
});
|
|
|
|
|
this.getLight(data);
|
|
|
|
|
} else {
|
|
|
|
|
data1.push({
|
|
|
|
|
arr: this.tableData.floorData[i].lightList[j].ctrlList.split(
|
|
|
|
|
","
|
|
|
|
|
),
|
|
|
|
|
build: this.tableData.floorData[i].lightList[j].build,
|
|
|
|
|
});
|
|
|
|
|
this.cleanLight(data1);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
// 页码改变时触发
|
|
|
|
|
handleCurrentChange(val) {
|
|
|
|
|
this.current = val;
|
|
|
|
|
this.getSblb();
|
|
|
|
|
},
|
|
|
|
|
clickLight(row,event){
|
|
|
|
|
event.preventDefault(); // 阻止默认菜单
|
|
|
|
|
const routerUrl = this.$router.resolve({ path: '/equipment/index', query: {code: row.code } });
|
|
|
|
|
window.open(routerUrl.href, "_blank");
|
|
|
|
|
},
|
|
|
|
|
// 单个开关
|
|
|
|
|
controlFun(row) {
|
|
|
|
|
this.chooseId = [];
|
|
|
|
|
if (row.agentCtrl == 0) {
|
|
|
|
|
this.$message.error("暂无控制权限！");
|
|
|
|
|
} else if (row.agentCtrl == 1) {
|
|
|
|
|
let arr = row.ctrlList.split(",");
|
|
|
|
|
let build = row.build;
|
|
|
|
|
let data = [
|
|
|
|
|
{
|
|
|
|
|
arr: arr,
|
|
|
|
|
build: build,
|
|
|
|
|
},
|
|
|
|
|
];
|
|
|
|
|
if (row.openStatus == 2) {
|
|
|
|
|
lightControl(row.code).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.$message.success("指令发送成功");
|
|
|
|
|
if (res.data.data[0].status == 1) {
|
|
|
|
|
// this.getSblb();
|
|
|
|
|
// this.checkLight();
|
|
|
|
|
//模拟
|
|
|
|
|
// setTimeout(() => {
|
|
|
|
|
// this.getMessage({code: row.code, openStatus: 1, ctrlList: row.ctrlList, build: row.build});
|
|
|
|
|
// },10*1000)
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning(res.data.data[0].msg);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
lightControl2(row.code).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.$message.success("指令发送成功");
|
|
|
|
|
if (res.data.data[0].status == 1) {
|
|
|
|
|
// this.getSblb();
|
|
|
|
|
// this.checkLight();
|
|
|
|
|
//模拟
|
|
|
|
|
// setTimeout(() => {
|
|
|
|
|
// this.getMessage({code: row.code, openStatus: 2, ctrlList: row.ctrlList, build: row.build});
|
|
|
|
|
// },10*1000)
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning(res.data.data[0].msg);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//批量操作 开
|
|
|
|
|
openAllSwitch(row) {
|
|
|
|
|
let tmp = row.agentCtrl;
|
|
|
|
|
if (tmp) {
|
|
|
|
|
let codes = [];
|
|
|
|
|
for (let i = 0; i < row.lightList.length; i++) {
|
|
|
|
|
codes.push(row.lightList[i].code);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
lightControl(codes.toString()).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.$message.success("指令发送成功");
|
|
|
|
|
for (let i = 0; i < res.data.data.length; i++) {
|
|
|
|
|
if (res.data.data[i].status == 0) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.$message.warning(res.data.data[i].msg);
|
|
|
|
|
}, 200 * i);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// this.getSblb();
|
|
|
|
|
// this.checkLight();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning("您没有控制权限");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//批量操作 关
|
|
|
|
|
closeAllSwitch(row) {
|
|
|
|
|
let tmp = row.agentCtrl;
|
|
|
|
|
if (tmp) {
|
|
|
|
|
let codes = [];
|
|
|
|
|
for (let i = 0; i < row.lightList.length; i++) {
|
|
|
|
|
codes.push(row.lightList[i].code);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
lightControl2(codes.toString()).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.$message.success("指令发送成功");
|
|
|
|
|
for (let i = 0; i < res.data.data.length; i++) {
|
|
|
|
|
if (res.data.data[i].status == 0) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.$message.warning(res.data.data[i].msg);
|
|
|
|
|
}, 200 * i);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// this.getSblb();
|
|
|
|
|
// this.checkLight();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning("您没有控制权限");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
openTotal() {
|
|
|
|
|
for (let i = 0; i < this.tableData.floorData.length; i++) {
|
|
|
|
|
if (this.tableData.floorData[i].agentCtrl) {
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning("第" + (i + 1) + "层没有控制权限");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
lightOpenBuild(this.tableData.buildCode).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.$message.success("指令发送成功");
|
|
|
|
|
for (let i = 0; i < res.data.data.length; i++) {
|
|
|
|
|
if (res.data.data[i].status == 0) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.$message.warning(res.data.data[i].msg);
|
|
|
|
|
}, 200 * i);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// this.getSblb();
|
|
|
|
|
// this.checkLight();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
closeTotal() {
|
|
|
|
|
for (let i = 0; i < this.tableData.floorData.length; i++) {
|
|
|
|
|
if (this.tableData.floorData[i].agentCtrl) {
|
|
|
|
|
} else {
|
|
|
|
|
this.$message.warning("第" + (i + 1) + "层没有控制权限");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
lightCloseBuild(this.tableData.buildCode).then((res) => {
|
|
|
|
|
if (res.data.code == 200) {
|
|
|
|
|
this.$message.success("指令发送成功");
|
|
|
|
|
for (let i = 0; i < res.data.data.length; i++) {
|
|
|
|
|
if (res.data.data[i].status == 0) {
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.$message.warning(res.data.data[i].msg);
|
|
|
|
|
}, 200 * i);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// this.getSblb();
|
|
|
|
|
// this.checkLight();
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
/**
|
|
|
|
|
* 定时轮询空开状态
|
|
|
|
|
* 15秒执行一次，执行5次
|
|
|
|
|
* 废弃 - 变更使用socket 20230313
|
|
|
|
|
*/
|
|
|
|
|
checkLight() {
|
|
|
|
|
if (this.intervalCheckLight == 0) {
|
|
|
|
|
let count = 5;
|
|
|
|
|
this.intervalCheckLight = setInterval(() => {
|
|
|
|
|
if (count == 0) {
|
|
|
|
|
clearInterval(this.intervalCheckLight);
|
|
|
|
|
this.intervalCheckLight = 0;
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
this.getSblb();
|
|
|
|
|
count--;
|
|
|
|
|
}, 1000 * 15);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.switch {
|
|
|
|
|
z-index: 99;
|
|
|
|
|
position: absolute;
|
|
|
|
|
right: 40px;
|
|
|
|
|
bottom: 41px;
|
|
|
|
|
// background: url(../../../public/img/monitoring/switch/switchbac.png) no-repeat;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
width: 402px;
|
|
|
|
|
height: 342px;
|
|
|
|
|
background: url(../../../public/img/monitoring/electricity/newbg.png) no-repeat;
|
|
|
|
|
background-size: cover;
|
|
|
|
|
|
|
|
|
|
.switch_icon {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
|
margin: 1rem 0 2rem 1.25rem;
|
|
|
|
|
color: #fff;
|
|
|
|
|
font-size: 15px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
display: block;
|
|
|
|
|
width: 16px;
|
|
|
|
|
margin-right: 10px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.main-switch {
|
|
|
|
|
margin: 1rem 1.2rem 1.5rem 1.25rem;
|
|
|
|
|
display: flex;
|
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
|
|
.right_main {
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
.main_title {
|
|
|
|
|
width: 158px;
|
|
|
|
|
height: 68px;
|
|
|
|
|
background: url(../../../public/img/monitoring/switch/little_bac.png) no-repeat;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.first_switch {
|
|
|
|
|
margin: 0rem 1.2rem 0rem 0rem;
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-wrap: wrap;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
margin: 0 1px 0 1px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.switch_item {
|
|
|
|
|
display: flex;
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
align-items: center;
|
|
|
|
|
font-size: 12px;
|
|
|
|
|
color: #fff;
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
|
|
|
|
// &:nth-child(8){
|
|
|
|
|
// margin-left: 65px;
|
|
|
|
|
// }
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.controlAll {
|
|
|
|
|
padding-right: 42px;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
margin: auto;
|
|
|
|
|
border: 1px solid #07a7ff;
|
|
|
|
|
border-top: none;
|
|
|
|
|
width: 347px;
|
|
|
|
|
height: 36px;
|
|
|
|
|
justify-content: flex-end;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.box2 {
|
|
|
|
|
z-index: 99;
|
|
|
|
|
background: url(../../../public/img/monitoring/electricity/genbag.png) no-repeat;
|
|
|
|
|
background-size: 100% 100%;
|
|
|
|
|
width: 402px;
|
|
|
|
|
height: 450px;
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 150px;
|
|
|
|
|
right: 40px;
|
|
|
|
|
transition: all 0.5s;
|
|
|
|
|
|
|
|
|
|
.title {
|
|
|
|
|
margin: 17px 0 0 17px;
|
|
|
|
|
font-size: 15px;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
margin-right: 5px;
|
|
|
|
|
width: 20px;
|
|
|
|
|
height: 19px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.state {
|
|
|
|
|
margin-top: 30px;
|
|
|
|
|
font-size: 28px;
|
|
|
|
|
line-height: 17px;
|
|
|
|
|
color: #ffffff;
|
|
|
|
|
|
|
|
|
|
.zc {
|
|
|
|
|
// padding-right: 36px;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
// justify-content: flex-end;
|
|
|
|
|
background: url(../../../public/img/monitoring/electricity/lighton.png) no-repeat;
|
|
|
|
|
background-size: cover;
|
|
|
|
|
width: 176px;
|
|
|
|
|
height: 78px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.lx {
|
|
|
|
|
// padding-right: 36px;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
// justify-content: flex-end;
|
|
|
|
|
background: url(../../../public/img/monitoring/electricity/lightoff.png) no-repeat;
|
|
|
|
|
background-size: cover;
|
|
|
|
|
width: 176px;
|
|
|
|
|
height: 78px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.stateName {
|
|
|
|
|
margin: 5px 0 20px;
|
|
|
|
|
color: #2cd52c;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
|
|
|
|
|
.lx {
|
|
|
|
|
padding-left: 146px;
|
|
|
|
|
color: #cfcfcf;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 设备告警
|
|
|
|
|
.tab_box {
|
|
|
|
|
width: 80%;
|
|
|
|
|
display: flex;
|
|
|
|
|
margin-top: 25px;
|
|
|
|
|
margin-bottom: 30px;
|
|
|
|
|
margin-left: 23px;
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
|
|
|
|
.tab_one {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tab_two {
|
|
|
|
|
margin-left: 20px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
/deep/ .item .is-dot {
|
|
|
|
|
background: red;
|
|
|
|
|
border: none;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tit {
|
|
|
|
|
margin: 0 auto 6px;
|
|
|
|
|
width: 345px;
|
|
|
|
|
height: 34px;
|
|
|
|
|
line-height: 34px;
|
|
|
|
|
background-color: #07a7ff;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: white;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
|
|
|
|
|
&.tataitit {
|
|
|
|
|
background: rgb(34, 110, 196);
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
color: #1851ab;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
width: 33.3%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
color: silver;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.noBjxx {
|
|
|
|
|
color: white;
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
margin: 2.5rem 0 0;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.warp {
|
|
|
|
|
height: 120px;
|
|
|
|
|
width: 345px;
|
|
|
|
|
margin: auto;
|
|
|
|
|
overflow-y: auto;
|
|
|
|
|
|
|
|
|
|
.item {
|
|
|
|
|
height: 40px;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #9d9d9d;
|
|
|
|
|
|
|
|
|
|
.alark-alert {
|
|
|
|
|
position: absolute;
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
background: rgba(11, 34, 74, 0.8);
|
|
|
|
|
// display: flex;
|
|
|
|
|
justify-content: space-around;
|
|
|
|
|
align-items: center;
|
|
|
|
|
color: #07e6ed;
|
|
|
|
|
|
|
|
|
|
p {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
margin-right: 7px;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.box {
|
|
|
|
|
width: 100%;
|
|
|
|
|
height: 34px;
|
|
|
|
|
background-color: rgba($color: #0d318b, $alpha: 0.6);
|
|
|
|
|
|
|
|
|
|
&.tataicon {
|
|
|
|
|
background-color: rgba($color: #1f355c, $alpha: 1);
|
|
|
|
|
|
|
|
|
|
span {
|
|
|
|
|
color: #1851ab;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.left {
|
|
|
|
|
width: 33.3%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
|
|
img {
|
|
|
|
|
width: 16px;
|
|
|
|
|
height: auto;
|
|
|
|
|
margin: 0 5px 0 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.message {
|
|
|
|
|
flex: 1;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.data {
|
|
|
|
|
width: 33.3%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.time {
|
|
|
|
|
width: 33.3%;
|
|
|
|
|
text-align: center;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item:hover {
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
