<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>
