New file |
| | |
| | | <template> |
| | | <div class="waste-water"> |
| | | <el-table class="tableBox" :data="tableData" style="width: 100%" @cell-click="handle"> |
| | | <el-table-column width="30px" label=""> |
| | | <template slot-scope="{row,$index}"> |
| | | <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> |
| | | </el-popover> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="序号" width="45px" type="index"></el-table-column> |
| | | <el-table-column prop="UserName" label="企业名称" width="120px"> |
| | | <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> |
| | | </el-table-column> |
| | | <el-table-column prop="normal" > |
| | | <div slot="header"> |
| | | <span>一级风险地块(个)</span> |
| | | </div> |
| | | <template slot-scope="{row,$index}"> |
| | | <u v-if="$index!=2" >{{row.normal}}</u> |
| | | <el-popover v-else placement="bottom-end" width="200" trigger="click" popper-class="popovers" title="监测点明细表"> |
| | | <refinery></refinery> |
| | | <u slot="reference" style="color: #00ffff">{{row.normal}}</u> |
| | | </el-popover> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="normal" > |
| | | <div slot="header"> |
| | | <span>二级风险地块(个)</span> |
| | | </div> |
| | | <template slot-scope="{row,$index}"> |
| | | <u v-if="$index!=2" >{{row.normal}}</u> |
| | | <el-popover v-else placement="bottom-end" width="200" trigger="click" popper-class="popovers" title="监测点明细表"> |
| | | <refinery></refinery> |
| | | <u slot="reference" style="color: #00ffff">{{row.normal}}</u> |
| | | </el-popover> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="normal" > |
| | | <div slot="header"> |
| | | <span>三级风险地块(个)</span> |
| | | </div> |
| | | <template slot-scope="{row,$index}"> |
| | | <u v-if="$index!=2" >{{row.normal}}</u> |
| | | <el-popover v-else placement="bottom-end" width="200" trigger="click" popper-class="popovers" title="监测点明细表"> |
| | | <refinery></refinery> |
| | | <u slot="reference" style="color: #00ffff">{{row.normal}}</u> |
| | | </el-popover> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="normal" > |
| | | <div slot="header"> |
| | | <span>土壤采样点(个)</span> |
| | | </div> |
| | | <template slot-scope="{row,$index}"> |
| | | <u v-if="$index!=2" >{{row.normal}}</u> |
| | | <el-popover v-else placement="bottom-end" width="200" trigger="click" popper-class="popovers" title="监测点明细表"> |
| | | <refinery></refinery> |
| | | <u slot="reference" style="color: #00ffff">{{row.normal}}</u> |
| | | </el-popover> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="normal" > |
| | | <div slot="header"> |
| | | <span>地下水采样点(个)</span> |
| | | </div> |
| | | <template slot-scope="{row,$index}"> |
| | | <u v-if="$index!=2" >{{row.normal}}</u> |
| | | <el-popover v-else placement="bottom-end" width="200" trigger="click" popper-class="popovers" title="监测点明细表"> |
| | | <refinery></refinery> |
| | | <u slot="reference" style="color: #00ffff">{{row.normal}}</u> |
| | | </el-popover> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | // import ChemicalWastewater from './componented/ChemicalWastewater' |
| | | import Refinery from '@components/table/components/componented/refinery' |
| | | // import MissingAlarm from '@components/table/components/componented/MissingAlarm' |
| | | export default { |
| | | name: 'WasteWater', |
| | | components: { |
| | | // MissingAlarm, |
| | | Refinery |
| | | // ChemicalWastewater |
| | | }, |
| | | data () { |
| | | return { |
| | | isActive: '', |
| | | isShowIcon: false, |
| | | tableData: [{ |
| | | UserName: '集团名称', |
| | | WasteWaters: '', |
| | | AddOutPut: '', |
| | | MonthOutPut: '', |
| | | NH4NPut: '', |
| | | NH4NMonth: '', |
| | | normal: '', |
| | | overProof: '', |
| | | Abnormal: '', |
| | | StopProduction: '', |
| | | deficiency: '' |
| | | }, { |
| | | UserName: '天津石化', |
| | | WasteWaters: '116.6', |
| | | AddOutPut: '58.3', |
| | | MonthOutPut: '13.1', |
| | | NH4NPut: '58.3', |
| | | NH4NMonth: '13.1', |
| | | normal: '21', |
| | | overProof: '2', |
| | | Abnormal: '2', |
| | | StopProduction: '2', |
| | | deficiency: '2' |
| | | }, { |
| | | UserName: 'xxxx炼化3', |
| | | WasteWaters: '116.6', |
| | | MonthOutPut: '13.1', |
| | | NH4NPut: '58.3', |
| | | NH4NMonth: '13.1', |
| | | normal: '21', |
| | | overProof: '2', |
| | | Abnormal: '2', |
| | | StopProduction: '2', |
| | | deficiency: '2' |
| | | }, { |
| | | UserName: 'xxxx4', |
| | | WasteWaters: '116.6', |
| | | AddOutPut: '58.3', |
| | | MonthOutPut: '13.1', |
| | | NH4NPut: '58.3', |
| | | NH4NMonth: '13.1', |
| | | normal: '21', |
| | | overProof: '2', |
| | | Abnormal: '2', |
| | | StopProduction: '2', |
| | | deficiency: '2' |
| | | |
| | | }] |
| | | } |
| | | }, |
| | | methods: { |
| | | tableHeaderColor ({ row, column, owIndex, columnIndex }) { |
| | | // return 'background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;font-wight:500;font-size:12px;text-align:center;height:0px' |
| | | }, |
| | | // 表头样式设置 |
| | | rowClass () { |
| | | // return 'text-align: center;background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;width:64px' |
| | | }, |
| | | // 获取点击的表格 |
| | | handle (row, column, event, cell) { |
| | | console.log(row.UserName) |
| | | }, |
| | | doIcon (index) { |
| | | if (index !== 1) { |
| | | this.isShowIcon = false |
| | | this.isActive = '' |
| | | return |
| | | } |
| | | this.isShowIcon = !this.isShowIcon |
| | | if (index === this.isActive) { |
| | | this.isActive = '' |
| | | return |
| | | } |
| | | this.isActive = index |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style> |
| | | |
| | | </style> |
| | |
| | | |
| | | <script> |
| | | import WasteWater from '@components/table/components/WasteWater' |
| | | import ReportTable from '../../../components/BaseNav/SoilGroundwater/ReportTable' |
| | | |
| | | // import WasteGas from '@components/table/components/WasteGas' |
| | | import SolidWaste from '@components/table/components/WasteSolid' |
| | | import AirQuality from '@components/table/components/AirQuality' |
| | |
| | | this.gcComp = AirQuality |
| | | break |
| | | case '土壤及地下水': |
| | | this.gcComp = AirQuality |
| | | this.gcComp = ReportTable |
| | | break |
| | | case '管线': |
| | | this.gcComp = AirQuality |