You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
809 lines
27 KiB
809 lines
27 KiB
<template> |
|
<div> |
|
<div v-if="sbType != '水' && sbType != '电子围界'"> |
|
<div class="clickBox" v-if="bimModel == 1"> |
|
<div class="btnBox flex-center-center"> |
|
<div :class="[active == 1 ? 'active' : '', tower == 0 ? 'active2' : '']" class="btn tower" |
|
@click="clickBtn(1, 0)">1# |
|
</div> |
|
<div :class="[active == 2 ? 'active' : '', tower == 1 ? 'active2' : '']" class="btn tower" |
|
@click="clickBtn(2, 1)">2# |
|
</div> |
|
<div :class="[active == 3 ? 'active' : '', tower == 2 ? 'active2' : '']" class="btn tower" |
|
@click="clickBtn(3, 2)">3# |
|
</div> |
|
<div :class="[active == 4 ? 'active' : '', tower == 3 ? 'active2' : '']" class="btn tower" |
|
@click="clickBtn(4, 3)">4# |
|
</div> |
|
<div :class="[active == 5 ? 'active' : '', tower == 4 ? 'active2' : '']" class="btn tower" |
|
@click="clickBtn(5, 4)">5# |
|
</div> |
|
<div :class="[active == 6 ? 'active' : '', tower == 5 ? 'active2' : '']" class="btn tower" |
|
@click="clickBtn(6, 5)">6# |
|
</div> |
|
|
|
<div :class="[active == 7 ? 'active' : '', tower == 0 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(7, 0, 1)">1F |
|
</div> |
|
<div :class="[active == 8 ? 'active' : '', tower == 1 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(8, 1, 1)">1F |
|
</div> |
|
<div :class="[active == 9 ? 'active' : '', tower == 2 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(9, 2, 1)">1F |
|
</div> |
|
<div :class="[active == 10 ? 'active' : '', tower == 3 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(10, 3, 1)">1F |
|
</div> |
|
<div :class="[active == 11 ? 'active' : '', tower == 4 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(11, 4, 1)">1F |
|
</div> |
|
<div :class="[active == 12 ? 'active' : '', tower == 5 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(12, 5, 1)">1F |
|
</div> |
|
|
|
<div :class="[active == 13 ? 'active' : '', tower == 0 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(13, 0, 2)">2F |
|
</div> |
|
<div :class="[active == 14 ? 'active' : '', tower == 1 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(14, 1, 2)">2F |
|
</div> |
|
<div :class="[active == 15 ? 'active' : '', tower == 2 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(15, 2, 2)">2F |
|
</div> |
|
<div :class="[active == 16 ? 'active' : '', tower == 3 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(16, 3, 2)">2F |
|
</div> |
|
<div :class="[active == 17 ? 'active' : '', tower == 4 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(17, 4, 2)">2F |
|
</div> |
|
<div :class="[active == 18 ? 'active' : '', tower == 5 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(18, 5, 2)">2F |
|
</div> |
|
|
|
<div :class="[active == 19 ? 'active' : '', tower == 0 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(19, 0, 3)">3F |
|
</div> |
|
<div :class="[active == 20 ? 'active' : '', tower == 1 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(20, 1, 3)">3F |
|
</div> |
|
<div :class="[active == 21 ? 'active' : '', tower == 2 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(21, 2, 3)">3F |
|
</div> |
|
<div :class="[active == 22 ? 'active' : '', tower == 3 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(22, 3, 3)">3F |
|
</div> |
|
<div :class="[active == 23 ? 'active' : '', tower == 4 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(23, 4, 3)">3F |
|
</div> |
|
<div :class="[active == 24 ? 'active' : '', tower == 5 ? 'active2' : '']" class="btn" |
|
@click="clickBtn(24, 5, 3)">3F |
|
</div> |
|
</div> |
|
<div style="margin-top: 3px;" class="btnBox flex-center-center"> |
|
<div :class="[active == 25 ? 'active' : '']" class="btn2 flex-center-center" @click="clickBtn(25)"> |
|
<img src="/img/monitoring/clickBtn1.png"> |
|
<span>园区</span> |
|
</div> |
|
<div :class="[active == 26 ? 'active' : '']" class="btn2 flex-center-center" @click="clickBtn(26, 9)"> |
|
<img src="/img/monitoring/clickBtn2.png"> |
|
<span>地下室</span> |
|
</div> |
|
</div> |
|
</div> |
|
<div v-else class="clickBox1"> |
|
<!-- <img src="../../../public/img/monitoring/ktborder.png" class="kt-border kt-border1"> |
|
<img src="../../../public/img/monitoring/ktborder.png" class="kt-border kt-border2"> |
|
<img src="../../../public/img/monitoring/ktborder.png" class="kt-border kt-border3"> |
|
<img src="../../../public/img/monitoring/ktborder.png" class="kt-border kt-border4"> --> |
|
<!-- <span :class="ttActive == 20?'active1':''" @click="clickTt(20)">塔台</span> --> |
|
<span :class="ttActive == 3 ? 'active1' : ''" @click="clickTt(3)">辅楼</span> |
|
<span :class="ttActive == 1 ? 'active1' : ''" @click="clickTt(1)">1F</span> |
|
<span :class="ttActive == 2 ? 'active1' : ''" @click="clickTt(2)">2F</span> |
|
|
|
<div :class="ttActive == 0 ? 'active1' : ''" style="display: flex;align-items: center;justify-content: center;"> |
|
<img src="../../../public/img/monitoring/tower-build.png" alt=""> |
|
<span @click="clickTt(0)">塔楼</span> |
|
</div> |
|
<div :class="ttActive == 20 ? 'active1' : ''" |
|
style="display: flex;align-items: center;justify-content: center;"> |
|
<img src="../../../public/img/monitoring/clickBtn1.png" alt="" style="width: 22px;"> |
|
<span @click="clickTt(20)">园区</span> |
|
</div> |
|
|
|
|
|
</div> |
|
</div> |
|
<!-- <div class="mapDom" :style="{opacity:isMapViewer}" style="position: absolute;left: 105px;top: 250px;width: 250px;height: 180px;"></div> --> |
|
<div v-if="active == 25" style="position:absolute;left:367px; top:40px;display: flex; flex-direction: column;"> |
|
<el-button style=" |
|
background-color: rgb(1, 238, 255); |
|
color: rgb(23, 72, 167); |
|
border: 0; |
|
width: 100px; |
|
" size="small" @click="openPreview('peidian')">配电系统图</el-button> |
|
<el-button style=" |
|
background-color: white; |
|
color: rgb(23, 72, 167); |
|
border: 0; |
|
width: 100px;margin: 10px 0 0 0; |
|
" size="small" @click="openPreview('peidianxiang')">配电系统图</el-button> |
|
<el-button style=" |
|
background-color: rgb(1, 238, 255); |
|
color: rgb(23, 72, 167); |
|
border: 0; |
|
width: 100px;margin: 10px 0 0 0; |
|
" size="small" @click="openPreview('wuding')">屋顶平面图</el-button> |
|
<el-button style=" |
|
background-color: white; |
|
color: rgb(23, 72, 167); |
|
border: 0; |
|
width: 100px;margin: 10px 0 0 0; |
|
" size="small" @click="openPreview('qita')">其他图纸</el-button> |
|
</div> |
|
<div v-else style="position:absolute;left:367px; top:40px;display: flex; flex-direction: column;"> |
|
<el-button style=" |
|
background-color: rgb(1, 238, 255); |
|
color: rgb(23, 72, 167); |
|
border: 0; |
|
width: 100px; |
|
" size="small" @click="openPreview(active)">平面图纸</el-button> |
|
</div> |
|
<!-- 图片预览 --> |
|
<el-image style="width: 0; height: 0;opacity: 0;" ref="preview" :src="url" :preview-src-list="srcList"></el-image> |
|
<el-image-viewer |
|
v-if="showViewer" |
|
:on-close="closeViewer" |
|
:url-list="srcList" style="width: 1000px;height:800px;left:50%;top:50%;margin-left:-500px;margin-top:-400px;overflow: hidden;" /> |
|
</div> |
|
</template> |
|
|
|
<script> |
|
import * as bfHelper from '../../util/bfHelper'; |
|
import ElImageViewer from 'element-ui/packages/image/src/image-viewer' |
|
export default { |
|
components: { ElImageViewer }, |
|
props: { |
|
sbType: { |
|
type: String |
|
}, |
|
bimModel: { |
|
type: Number |
|
}, |
|
checkList: { |
|
type: Array |
|
}, |
|
clickTower: { |
|
type: Number |
|
}, |
|
clickLayer: { |
|
type: Number |
|
}, |
|
conditions: { |
|
type: Array |
|
}, |
|
|
|
}, |
|
data() { |
|
return { |
|
//图纸 |
|
//使用el-image图纸路径写法 |
|
cardImg: { |
|
peidian: ['../../../img/cad/peidian/4DS001.png','../../../img/cad/peidian/4DS002.png','../../../img/cad/peidian/4DS003.png','../../../img/cad/peidian/4DS004.png','../../../img/cad/peidian/4DS005.png'], |
|
peidianxiang: ['../../../img/cad/peidianxiang/6BS001.png','../../../img/cad/peidianxiang/6BS002.png','../../../img/cad/peidianxiang/6BS003.png','../../../img/cad/peidianxiang/6BS004.png','../../../img/cad/peidianxiang/6BS005.png','../../../img/cad/peidianxiang/6BS006.png','../../../img/cad/peidianxiang/6BS007.png','../../../img/cad/peidianxiang/6BS008.png','../../../img/cad/peidianxiang/6BS009.png','../../../img/cad/peidianxiang/6BS010.png'], |
|
26: ['../../../img/cad/7Q/7QP001.png','../../../img/cad/7Q/7QP002.png'], |
|
1: ['../../../img/cad/7Q/7QP003.png','../../../img/cad/7Q/7QP004.png','../../../img/cad/7Q/7QP005.png','../../../img/cad/7Q/7QP013.png','../../../img/cad/7Q/7QP014.png'], |
|
2: ['../../../img/cad/7Q/7QP006.png','../../../img/cad/7Q/7QP007.png'], |
|
3: ['../../../img/cad/7Q/7QP008.png','../../../img/cad/7Q/7QP009.png'], |
|
wuding: ['../../../img/cad/7Q/7QP010.png','../../../img/cad/7Q/7QP011.png','../../../img/cad/7Q/7QP012.png'], |
|
qita: ['../../../img/cad/5C/5CS001.png','../../../img/cad/5C/5CS002.png','../../../img/cad/5C/5CS003.png','../../../img/cad/5C/5CS004.png','../../../img/cad/5C/5CS005.png','../../../img/cad/peidianxaing/8LS001.png','../../../img/cad/peidianxaing/qiangdian.png','../../../img/cad/7Q/7QP012.png'], |
|
}, |
|
//使用el-image-viewer图纸路径写法 |
|
// cardImg: { |
|
// peidian: ['/img/cad/peidian/4DS001.png','/img/cad/peidian/4DS002.png','/img/cad/peidian/4DS003.png','/img/cad/peidian/4DS004.png','/img/cad/peidian/4DS005.png'], |
|
// peidianxiang: ['/img/cad/peidianxiang/6BS001.png','/img/cad/peidianxiang/6BS002.png','/img/cad/peidianxiang/6BS003.png','/img/cad/peidianxiang/6BS004.png','/img/cad/peidianxiang/6BS005.png','/img/cad/peidianxiang/6BS006.png','/img/cad/peidianxiang/6BS007.png','/img/cad/peidianxiang/6BS008.png','/img/cad/peidianxiang/6BS009.png','/img/cad/peidianxiang/6BS010.png'], |
|
// 26: ['/img/cad/7Q/7QP001.png','/img/cad/7Q/7QP002.png'], |
|
// 1: ['/img/cad/7Q/7QP003.png','/img/cad/7Q/7QP004.png','/img/cad/7Q/7QP005.png','/img/cad/7Q/7QP013.png','/img/cad/7Q/7QP014.png'], |
|
// 2: ['/img/cad/7Q/7QP006.png','/img/cad/7Q/7QP007.png'], |
|
// 3: ['/img/cad/7Q/7QP008.png','/img/cad/7Q/7QP009.png'], |
|
// wuding: ['/img/cad/7Q/7QP010.png','/img/cad/7Q/7QP011.png','/img/cad/7Q/7QP012.png'], |
|
// qita: ['/img/cad/5C/5CS001.png','/img/cad/5C/5CS002.png','/img/cad/5C/5CS003.png','/img/cad/5C/5CS004.png','/img/cad/5C/5CS005.png','/img/cad/peidianxaing/8LS001.png','/img/cad/peidianxaing/qiangdian.png','/img/cad/7Q/7QP012.png'], |
|
// }, |
|
showViewer: false, |
|
url: '', |
|
srcList: [], |
|
active: 25, |
|
tower: null, |
|
layer: null, |
|
ttActive: 20, |
|
num: 0, |
|
cameraPosition: bfHelper.cameraPosition, |
|
ttCameraPosition: [ |
|
{ //塔楼 |
|
aspect: 1.889763779527559, |
|
coordinateSystem: "world", |
|
far: 225478.3771290507, |
|
fov: 45, |
|
name: "persp", |
|
near: 157181.37268758888, |
|
position: { x: -49498.46305050083, y: -574230.7737734186, z: 28307.30237260928 }, |
|
target: { x: -30503.524627876046, y: 323597.1720401245, z: -2129.6955875545914 }, |
|
up: { x: 0.0007164904031823316, y: 0.03386608905113038, z: 0.9994261226593404 }, |
|
version: 1, |
|
zoom: 1 |
|
}, |
|
{ //辅楼1层 |
|
aspect: 1.889763779527559, |
|
coordinateSystem: "world", |
|
far: 161858.92065369213, |
|
fov: 45, |
|
name: "persp", |
|
near: 56084.91798277034, |
|
position: { x: -46235.02662605554, y: -381791.6369351938, z: 150721.91934432092 }, |
|
target: { x: -46235.02662605554, y: -381791.6314446702, z: 25113.387888794732 }, |
|
up: { x: 0, y: 0.9999999999999991, z: 4.371131519744309e-8 }, |
|
version: 1, |
|
zoom: 1 |
|
}, |
|
{ //辅楼2层 |
|
aspect: 1.889763779527559, |
|
coordinateSystem: "world", |
|
far: 154171.46624459384, |
|
fov: 45, |
|
name: "persp", |
|
near: 48397.46357367393, |
|
position: { x: -48808.18460139516, y: -382127.722899189, z: 143034.46492053213 }, |
|
target: { x: -48808.18460139516, y: -382127.7174086654, z: 17425.93346500593 }, |
|
up: { x: 0, y: 0.9999999999999991, z: 4.371131519746762e-8 }, |
|
version: 1, |
|
zoom: 1 |
|
}, |
|
{ //辅楼整体 |
|
aspect: 1.889763779527559, |
|
coordinateSystem: "world", |
|
far: 355012.46216021536, |
|
fov: 45, |
|
name: "persp", |
|
near: 58.40582502402108, |
|
position: { x: -63446.55106076958, y: -482967.5561481098, z: 69329.26713475322 }, |
|
target: { x: -36083.781389396434, y: 276835.6063647483, z: -409557.64215140726 }, |
|
up: { x: 0.019180985919174137, y: 0.5326132011849499, z: 0.8461413993551482 }, |
|
version: 1, |
|
zoom: 1 |
|
} |
|
] |
|
// isMapViewer:0 |
|
} |
|
}, |
|
methods: { |
|
//图纸 |
|
openPreview(key) { |
|
if([7,8,9,10,11,12].indexOf(key) > -1) { |
|
//1F |
|
this.url = this.cardImg[1][0]; |
|
this.srcList = this.cardImg[1]; |
|
} else if([13,14,15,16,17,18].indexOf(key) > -1) { |
|
//2F |
|
this.url = this.cardImg[2][0]; |
|
this.srcList = this.cardImg[2]; |
|
} else if([19,20,21,22,23,24].indexOf(key) > -1) { |
|
//3F |
|
this.url = this.cardImg[1][0]; |
|
this.srcList = this.cardImg[1]; |
|
} else if([1,2,3,4,5,6].indexOf(key) > -1) { |
|
//整栋楼 |
|
this.url = this.cardImg[1][0]; |
|
this.srcList = this.srcList.concat(this.cardImg[1]).concat(this.cardImg[2]).concat(this.cardImg[3]); |
|
} |
|
else{ |
|
this.url = this.cardImg[key][0]; |
|
this.srcList = this.cardImg[key]; |
|
} |
|
// this.showViewer = true;//使用el-image-viewer |
|
// 使用el-image |
|
setTimeout(() => { |
|
this.$refs.preview.clickHandler(); |
|
}, 500) |
|
}, |
|
closeViewer() { |
|
this.showViewer = false; |
|
}, |
|
clickBtn(activeNum, tower, layer) { |
|
if (this.sbType == '空调' && activeNum <= 6) { |
|
return false; |
|
} |
|
this.num++; |
|
let build = window.sessionStorage.getItem('build'); |
|
let floor = window.sessionStorage.getItem('floor'); |
|
// if(build){ |
|
// // window.sessionStorage.setItem('camera',JSON.stringify(bfHelper.getCameraStatus())); |
|
// }else{ |
|
let camera = this.cameraPosition[tower] |
|
|
|
window.sessionStorage.setItem('camera', JSON.stringify(camera)); |
|
// } |
|
window.sessionStorage.setItem('build', tower != null ? tower + 1 : '26'); |
|
window.sessionStorage.setItem('floor', layer); |
|
|
|
bfHelper.setOpacityFun(); |
|
this.$parent.isControl = false; |
|
this.clickLayer = null; |
|
this.clickTower = null; |
|
this.$emit('storeTower', { |
|
activeNum: activeNum, |
|
tower: tower, |
|
layer: layer |
|
}) |
|
// 先清除所以标签 |
|
bfHelper.clearDrawableContainer(); |
|
|
|
this.active = activeNum; |
|
this.tower = tower; |
|
if (this.sbType == '空开' && activeNum != 25) { |
|
|
|
bfHelper.lookPipeline2(null, null, tower, |
|
layer, this.sbType, bfHelper.equipmentCondition2[2]); |
|
this.$parent.getLight(); |
|
|
|
if (layer) { |
|
this.$parent.setTowerLight('0' + (tower + 1), '0' + layer); |
|
} else { |
|
// this.isMapViewer = 0 |
|
// this.$parent.setTowerLight('0' + (tower + 1)); |
|
if (tower == 9) { |
|
bfHelper.setCameraStatus(bfHelper.lightCamera[6]) |
|
this.$parent.setTowerLight('07') |
|
} else { |
|
bfHelper.setCameraStatus(bfHelper.lightCamera[tower]) |
|
this.$parent.setTowerLight('0' + (tower + 1)); |
|
} |
|
} |
|
|
|
|
|
// bfHelper.lookPipeline3(tower, layer); |
|
return |
|
} |
|
if (this.sbType == '空开' && activeNum == 25) { |
|
|
|
bfHelper.resetStatus(2, null, '照明'); |
|
bfHelper.lookEquipmentCop('照明'); |
|
// this.$parent.openTotal(); |
|
this.$parent.setTowerLight('00'); |
|
bfHelper.setCameraStatus({ |
|
aspect: 1.889763779527559, |
|
coordinateSystem: "world", |
|
far: 960464.7787185954, |
|
fov: 45, |
|
name: "persp", |
|
near: 105041.57557288553, |
|
position: { |
|
x: 114923.08877241895, |
|
y: -391542.9803033385, |
|
z: 219845.7809478254 |
|
}, |
|
target: { |
|
x: -8729.420142852026, |
|
y: 863922.0428858905, |
|
z: -496665.6824418152 |
|
}, |
|
up: { |
|
x: -0.048407478040169157, |
|
y: 0.4914893345691443, |
|
z: 0.8695372045373162 |
|
}, |
|
version: 1, |
|
zoom: 1 |
|
}); |
|
return |
|
} |
|
// 切换到滚轮效果 |
|
if (activeNum == 25) { |
|
bfHelper.resetStatus(2); |
|
bfHelper.lookEquipmentCop(this.sbType, this.checkList); |
|
if (this.bimModel == 1) { |
|
bfHelper.setOpacityFun(); |
|
if (this.sbType == '电') { |
|
this.$parent.setTower(); |
|
} else if (this.sbType == '水') { |
|
this.$parent.setTowerWater(); |
|
} else if (this.sbType == '暖') { |
|
this.$parent.setTowerWarm(); |
|
} else if (this.sbType == '监控') { |
|
this.$parent.$refs.backHome.clickBack(); |
|
} else if (this.sbType == '空调') { |
|
bfHelper.extObjMngClear(); //清除外部构件 |
|
bfHelper.clearDrawableContainer(); //清除外部标签 |
|
bfHelper.clearTags(); |
|
this.$parent.setTowerKT(); |
|
this.$parent.removeEvent(); |
|
this.$parent.initial(); |
|
this.$parent.isControl = false; |
|
|
|
// this.$parent.setTowerKT(); |
|
} else if (this.sbType == '消防') { |
|
this.$parent.setTowerFire(); |
|
} |
|
else if (this.sbType == '电子门禁') { |
|
this.$parent.setTowerDoor(); |
|
bfHelper.lookPipeline(null, null, this.conditions, '电子门禁'); |
|
} |
|
//20221205-园区点击回主视角 |
|
// if(this.sbType == '电' || this.sbType == '暖' || this.sbType == '监控' || this.sbType == '空调'){ |
|
bfHelper.setCameraStatus({ |
|
aspect: 1.889763779527559, |
|
coordinateSystem: "world", |
|
far: 960464.7787185954, |
|
fov: 45, |
|
name: "persp", |
|
near: 105041.57557288553, |
|
position: { |
|
x: 114923.08877241895, |
|
y: -391542.9803033385, |
|
z: 219845.7809478254 |
|
}, |
|
target: { |
|
x: -8729.420142852026, |
|
y: 863922.0428858905, |
|
z: -496665.6824418152 |
|
}, |
|
up: { |
|
x: -0.048407478040169157, |
|
y: 0.4914893345691443, |
|
z: 0.8695372045373162 |
|
}, |
|
version: 1, |
|
zoom: 1 |
|
}); |
|
// } |
|
} else { |
|
if (this.sbType == '监控') { |
|
bfHelper.TtLookEquipmentCop('监控', null, this.conditions); |
|
} |
|
} |
|
return |
|
} |
|
// 查看单栋楼或单栋楼某层管道 |
|
let index = 0; |
|
if (this.sbType != '空开') { |
|
if (this.sbType == '电') { |
|
if (tower == 9) { |
|
this.$parent.setTower('07') |
|
} else { |
|
if (layer) { |
|
this.$parent.setTower('0' + (tower + 1), '0' + layer); |
|
} else { |
|
this.$parent.setTower('0' + (tower + 1)); |
|
} |
|
|
|
} |
|
index = 0; |
|
} else if (this.sbType == '水') { |
|
// if (tower == 9) { |
|
// this.$parent.setTowerWater('07') |
|
// } else { |
|
// if (latower == 9yer) { |
|
// this.$parent.setTowerWater('0' + (tower + 1), '0' + layer); |
|
// // bfHelper.navigationMap('.mapDom',require('../../../public/img/monitoring/mapviewer/water' + (tower + 1) + 'b' + layer + 'f.png')); |
|
// // this.isMapViewer = 1 |
|
// } else { |
|
// this.$parent.setTowerWater('0' + (tower + 1)); |
|
// // this.isMapViewer = 0 |
|
// } |
|
|
|
// } |
|
this.$parent.setTowerWater(); |
|
index = 1; |
|
} else if (this.sbType == '空调') { |
|
// if(activeNum > 6){ |
|
if (tower == 9) { |
|
this.$parent.setTowerKT('07') |
|
} else { |
|
if (layer) { |
|
this.$parent.setTowerKT('0' + (tower + 1), '0' + layer); |
|
// bfHelper.navigationMap('.mapDom',require('../../../public/img/monitoring/mapviewer/water' + (tower + 1) + 'b' + layer + 'f.png')); |
|
// this.isMapViewer = 1 |
|
} else { |
|
this.$parent.setTowerKT('0' + (tower + 1)); |
|
// this.isMapViewer = 0 |
|
} |
|
} |
|
// } |
|
|
|
|
|
|
|
} else if (this.sbType == '暖') { |
|
index = 2 |
|
if (tower == 9) { |
|
this.$parent.setTowerWarm('07') |
|
} else { |
|
if (layer) { |
|
this.$parent.setTowerWarm('0' + (tower + 1), '0' + layer); |
|
// bfHelper.navigationMap('.mapDom',require('../../../public/img/monitoring/mapviewer/water' + (tower + 1) + 'b' + layer + 'f.png')); |
|
// this.isMapViewer = 1 |
|
} else { |
|
this.$parent.setTowerWarm('0' + (tower + 1)); |
|
// this.isMapViewer = 0 |
|
} |
|
} |
|
|
|
|
|
} else if (this.sbType == '监控') { |
|
if (tower == 9) { |
|
this.$parent.setTowerMonitor('07') |
|
} else { |
|
if (layer) { |
|
this.$parent.setTowerMonitor('0' + (tower + 1), '0' + layer); |
|
} else { |
|
this.$parent.setTowerMonitor('0' + (tower + 1)); |
|
} |
|
|
|
} |
|
index = 0; |
|
} else if (this.sbType == '消防') { |
|
index = 3; |
|
if (tower == 9) { |
|
this.$parent.setTowerFire('07') |
|
} else { |
|
if (layer) { |
|
this.$parent.setTowerFire('0' + (tower + 1), '0' + layer); |
|
// bfHelper.navigationMap('.mapDom',require('../../../public/img/monitoring/mapviewer/water' + (tower + 1) + 'b' + layer + 'f.png')); |
|
// this.isMapViewer = 1 |
|
} else { |
|
this.$parent.setTowerFire('0' + (tower + 1)); |
|
// this.isMapViewer = 0 |
|
} |
|
|
|
} |
|
} else if (this.sbType == '排烟') { |
|
index = 4; |
|
} else if (this.sbType == '喷淋') { |
|
index = 5; |
|
} else if (this.sbType == '烟感和报警') { |
|
index = 6; |
|
} else if (this.sbType == '消防栓水管') { |
|
index = 7; |
|
} else if (this.sbType == '电子门禁') { |
|
index = 8; |
|
if (tower == 9) { |
|
this.$parent.setTowerDoor('07') |
|
} else { |
|
if (layer) { |
|
this.$parent.setTowerDoor('0' + (tower + 1), '0' + layer); |
|
// bfHelper.navigationMap('.mapDom',require('../../../public/img/monitoring/mapviewer/door' + (tower + 1) + 'b' + layer + 'f.png')); |
|
// this.isMapViewer = 1 |
|
} else { |
|
this.$parent.setTowerDoor('0' + (tower + 1)); |
|
// this.isMapViewer = 0 |
|
} |
|
} |
|
} |
|
|
|
if (this.sbType == '消防') { |
|
bfHelper.lookPipeline2(null, null, tower, layer, '消防', bfHelper.equipmentCondition2[1], this.checkList); |
|
return; |
|
} |
|
|
|
if (this.sbType == '电子门禁') { |
|
bfHelper.lookPipeline2(this.conditions, bfHelper.equipmentCopColors[8], tower, |
|
layer, '电子门禁'); |
|
} else if (this.sbType == '空调') { |
|
// if(activeNum > 6){ |
|
bfHelper.lookPipeline2(null, null, tower, |
|
layer, '空调'); |
|
// } |
|
|
|
} else if (this.sbType == '暖') { |
|
bfHelper.lookPipeline2(bfHelper.equipmentCondition[index], bfHelper.equipmentCopColors[index], |
|
tower, layer, '暖', bfHelper.equipmentCondition2[4]); |
|
} else { |
|
|
|
bfHelper.lookPipeline2(bfHelper.equipmentCondition[index], bfHelper.equipmentCopColors[index], |
|
tower, layer, this.sbType, bfHelper.equipmentCondition2[index]); |
|
} |
|
} |
|
|
|
|
|
}, |
|
clickTt(num) { |
|
this.ttActive = num; |
|
let camera = this.ttCameraPosition[num] |
|
window.sessionStorage.setItem('ttcamera', JSON.stringify(camera)); |
|
window.sessionStorage.setItem('ttbuild', num); |
|
if (num == 20) { |
|
bfHelper.resetStatus(2); |
|
bfHelper.TtLookEquipmentCop(this.sbType, this.checkList); |
|
if (this.sbType == '电') { |
|
this.$parent.setTower(); |
|
} else if (this.sbType == '水') { |
|
this.$parent.setTowerWater(); |
|
} else if (this.sbType == '监控') { |
|
this.$parent.$refs.backHome.clickBack(); |
|
} else if (this.sbType == '消防') { |
|
this.$parent.setTowerFire(); |
|
} else if (this.sbType == '电子门禁') { |
|
this.$parent.setTowerDoor(); |
|
} |
|
|
|
return; |
|
|
|
} |
|
let ttBuild; |
|
let layer; |
|
if (num == 3) { //辅楼 |
|
ttBuild = '09' |
|
layer = null |
|
} else if (num == 0) { //塔楼 |
|
ttBuild = '08' |
|
layer = null |
|
} else if (num == 1) { //辅楼1楼 |
|
ttBuild = '09' |
|
layer = '01' |
|
} else if (num == 2) { //辅楼2楼 |
|
ttBuild = '09' |
|
layer = '02' |
|
} |
|
let index = 0; |
|
if (this.sbType == '电') { |
|
index = 0; |
|
this.$parent.setTower(ttBuild, layer); |
|
bfHelper.ttLookPipeline2(bfHelper.ttequipmentCondition[index], bfHelper.equipmentCopColors[index], num, |
|
this.sbType, bfHelper.ttequipmentCondition2[index]); |
|
} else if (this.sbType == '水') { |
|
index = 1; |
|
this.$parent.setTowerWater(ttBuild, layer); |
|
bfHelper.ttLookPipeline2(bfHelper.ttequipmentCondition[index], bfHelper.equipmentCopColors[index], |
|
num, this.sbType, null); |
|
} else if (this.sbType == '监控') { |
|
index = 2; |
|
this.$parent.setTowerMonitor(ttBuild); |
|
bfHelper.ttLookPipeline2(bfHelper.ttequipmentCondition[index], bfHelper.equipmentCopColors[index], |
|
num, this.sbType, null); |
|
} else if (this.sbType == '消防') { |
|
index = 3; |
|
this.$parent.setTowerFire(ttBuild, layer); |
|
bfHelper.ttLookPipeline2(null, null, num, '消防', bfHelper.equipmentCondition2[1], this.checkList); |
|
} else if (this.sbType == '电子门禁') { |
|
index = 6; |
|
bfHelper.ttLookPipeline2(null, null, num, this.sbType, bfHelper.equipmentCondition2[index]); |
|
this.$parent.setTowerDoor(ttBuild, layer); |
|
} |
|
// else if (this.sbType == '电梯') { |
|
// bfHelper.ttLookPipeline2(null, null,3,'电梯', null); |
|
// this.$parent.setTowerLift(ttBuild,layer); |
|
// } |
|
|
|
|
|
|
|
// } |
|
|
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
.clickBox { |
|
width: 242px; |
|
height: 167px; |
|
background: url(../../../public/img/monitoring/clickBg.jpg) no-repeat; |
|
background-size: cover; |
|
position: absolute; |
|
left: 105px; |
|
top: 40px; |
|
box-sizing: border-box; |
|
padding: 1px; |
|
|
|
.btnBox { |
|
color: white; |
|
flex-wrap: wrap; |
|
|
|
.active { |
|
background-color: #00BFB7 !important; |
|
} |
|
|
|
.active2::before { |
|
content: ""; |
|
position: absolute; |
|
width: 100%; |
|
height: 100%; |
|
left: 0; |
|
top: 0; |
|
background-color: white; |
|
opacity: 0.1; |
|
} |
|
|
|
.tower { |
|
font-weight: bold; |
|
font-size: 16px; |
|
background-color: #093588; |
|
} |
|
|
|
.btn { |
|
position: relative; |
|
cursor: pointer; |
|
font-size: 14px; |
|
height: 33px; |
|
line-height: 33px; |
|
width: 40px; |
|
text-align: center; |
|
} |
|
|
|
.btn2 { |
|
cursor: pointer; |
|
width: 50%; |
|
font-size: 14px; |
|
line-height: 30px; |
|
|
|
img { |
|
margin-right: 5px; |
|
width: 20px; |
|
} |
|
} |
|
} |
|
} |
|
|
|
.clickBox1 { |
|
background-color: transparent; |
|
position: absolute; |
|
left: 105px; |
|
top: 40px; |
|
display: flex; |
|
justify-content: space-around; |
|
align-items: center; |
|
background-image: url(../../../public/img/monitoring/towerbg.png); |
|
background-size: 100% 100%; |
|
width: 96px; |
|
height: 196px; |
|
flex-direction: column; |
|
|
|
.kt-border { |
|
position: absolute; |
|
width: 8px; |
|
height: 8px; |
|
} |
|
|
|
.kt-border1 { |
|
position: absolute; |
|
top: 0; |
|
right: 0; |
|
} |
|
|
|
.kt-border2 { |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
transform: rotateZ(270deg); |
|
|
|
} |
|
|
|
.kt-border3 { |
|
position: absolute; |
|
bottom: 0; |
|
left: 0; |
|
transform: rotateZ(180deg); |
|
} |
|
|
|
.kt-border4 { |
|
position: absolute; |
|
bottom: 0; |
|
right: 0; |
|
transform: rotateZ(90deg); |
|
} |
|
|
|
span { |
|
color: white; |
|
font-size: 15px; |
|
cursor: pointer; |
|
display: inline-block; |
|
width: 43px; |
|
text-align: center; |
|
height: 30px; |
|
line-height: 30px; |
|
} |
|
|
|
.active1 { |
|
background-color: #00BFB7; |
|
width: 100%; |
|
height: 32px; |
|
} |
|
} |
|
</style>
|
|
|