~xingchuan/SewerAndRainNetwork.git

			@@ -1,22 +1,20 @@
			<template>
			<div class="waste-water">
			<el-table class="tableBox" :data="tableData" style="width: 100%" @cell-click="handle">
			<el-table class="tableBox" :data="tableData" style="width: 100%" :cell-style="rowClass" @cell-click="handle">
			<el-table-column width="30px" label="">
			<template slot-scope="{row,$index}">
			<!-- <i class="el-icon-caret-right" v-if="$index ===1"></i>-->
			<el-popover placement="bottom" trigger="click" :disabled="!isShowIcon" popper-class="popovers">
			<ChemicalWastewater v-show="$index ===1"></ChemicalWastewater>
			<i class="el-icon-caret-right" :class="{active: isActive === $index}" slot="reference" @click="doIcon($index)"></i>
			<ChemicalWastewater v-show="$index ===2"></ChemicalWastewater>
			<i class="el-icon-caret-right showBottomTableBtn" @click="showBottomTable" slot="reference"></i>
			<!-- <i class="el-icon-caret-bottom" slot="reference" v-else @click="doIcon($index)"></i>-->
			</el-popover>
			</template>
			</el-table-column>
			<el-table-column label="序号" width="45px" type="index"></el-table-column>
			<el-table-column prop="UserName" label="企业名称" >
			<template slot-scope="scope">
			<div v-if="scope.row.UserName==='集团名称'" style="color: #00ffff">{{scope.row.UserName}}</div>
			<div v-else-if="scope.row.UserName==='天津石化'" style="color: #00ffff">{{scope.row.UserName}}</div>
			<div v-else >{{scope.row.UserName}}</div>
			<template slot-scope="{row}">
			<u @click="searchNameToPosition" style="cursor: pointer">{{row.UserName}}</u>
			</template>
			</el-table-column>
			<el-table-column prop="WasteWaters" width="80">
			@@ -85,6 +83,11 @@
			tableData: null
			}
			},
			props: {
			searchNameToPosition: {
			type: Function
			}
			},
			async mounted () {
			this.tableData = await mapApi.getWasteWaterStatistics()
			},
			@@ -94,29 +97,48 @@
			},
			// 表头样式设置
			rowClass () {
			// return 'text-align: center;background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;width:64px'
			return 'height:.3rem'
			},
			// 获取点击的表格
			handle (row, column, event, cell) {
			console.log(row.UserName)
			},
			doIcon (index) {
			if (index !== 1) {
			this.isShowIcon = false
			this.isActive = ''
			return
			showBottomTable (e) {
			if (e.path[0].classList.contains('go') === true) {
			e.path[0].classList.remove('go')
			e.path[0].classList.add('aa')
			} else {
			const newList = document.querySelectorAll('i.showBottomTableBtn')
			for (let i = 0; i < newList.length; i++) {
			newList[i].classList.remove('go')
			}
			e.path[0].classList.remove('aa')
			e.path[0].classList.add('go')
			}
			this.isShowIcon = !this.isShowIcon
			if (index === this.isActive) {
			this.isActive = ''
			return
			}
			this.isActive = index
			}
			}
			}
			</script>

			<style>

			<style scoped lang="less">
			/deep/ .el-tabs__item:focus.is-active.is-focus:not(:active) {
			-webkit-box-shadow: none !important;
			box-shadow: none !important;
			}
			.waste-water{
			.el-icon-caret-right{
			position: absolute;
			top: .11rem;
			left: .04rem;
			font-size: .14rem;
			cursor: pointer;
			}
			}
			.aa{
			transition: all .2s;
			}
			.go{
			transform:rotate(90deg);
			transition: all .2s;
			}
			</style>