From 3054bbce49457c82df9ad32523f3a0186e268d6f Mon Sep 17 00:00:00 2001 From: yangdelong <828900aaa> Date: 星期五, 28 五月 2021 21:17:08 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/develop' into develop --- src/components/table/components/WasteGas.vue | 235 ++++++++++++++++++++++++---------------------------------- 1 files changed, 97 insertions(+), 138 deletions(-) diff --git a/src/components/table/components/WasteGas.vue b/src/components/table/components/WasteGas.vue index 5014038..86a5779 100644 --- a/src/components/table/components/WasteGas.vue +++ b/src/components/table/components/WasteGas.vue @@ -1,96 +1,58 @@ <template> <div class="Waste-water"> - <el-table - class="tableBox" - :data="tableData" - :header-cell-style="tableHeaderColor" - :cell-style="rowClass" - > - <el-table-column - width="30px" - label="" - > - <template> - <i class="el-icon-caret-right"></i> - <span style="margin-left: 10px"></span> - </template> + <el-table class="tableBox" :data="tableData" :header-cell-style="tableHeaderColor" :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> + <!-- <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 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> </el-table-column> - <el-table-column - prop="UserName" - label="浼佷笟鍚嶇О" - width="120px"> + <el-table-column prop="WasteWaters" label="宸ヤ笟澶栨帓搴熸按閲忥紙m鲁锛�" width="100px"></el-table-column> + <el-table-column label="浜屾哀鍖栫~ (浜х敓閲�/t)"> + <el-table-column prop="AddOutPut" label="绱" width="70px"></el-table-column> + <el-table-column prop="MonthOutPut" label="褰撴湀" width="70px"></el-table-column> </el-table-column> - <el-table-column - prop="WasteWaters" - label="宸ヤ笟澶栨帓搴熸按閲忥紙m鲁锛�" - width="100px"> + <el-table-column label="姘ㄦ哀鍖栫墿 (浜х敓閲�/t)"> + <el-table-column prop="NH4NPut" label="绱" width="70px"></el-table-column> + <el-table-column prop="NH4NMonth" label="褰撴湀" width="70px"></el-table-column> </el-table-column> - <el-table-column label="浜屾哀鍖栫~ (t)"> - <el-table-column - prop="AddOutPut" - label="绱浜х敓閲�" - width="70px"> - </el-table-column> - <el-table-column - prop="MonthOutPut" - label="褰撴湀鐢熶骇閲�" - width="70px"> - </el-table-column> - </el-table-column> - <el-table-column label="姘ㄦ哀鍖栫墿 (t)"> - <el-table-column - prop="NH4NPut" - label="绱浜х敓閲�" - width="70px"> - </el-table-column> - <el-table-column - prop="NH4NMonth" - label="褰撴湀鐢熶骇閲�" - width="70px"> - </el-table-column> - </el-table-column> - <el-table-column label="VOCs (t)"> - <el-table-column - prop="NH4NPut" - label="绱浜х敓閲�" - width="70px"> - </el-table-column> - <el-table-column - prop="NH4NMonth" - label="褰撴湀鐢熶骇閲�" - width="70px"> - </el-table-column> + <el-table-column label="VOCs (浜х敓閲�/t)"> + <el-table-column prop="NH4NPut" label="绱" width="70px"></el-table-column> + <el-table-column prop="NH4NMonth" label="褰撴湀" width="70px"></el-table-column> </el-table-column> <el-table-column label="鎺掓斁鍙f娴嬬姸鎬�"> - <el-table-column - prop="normal" - label="姝e父" - width="60px"> + <el-table-column prop="normal" label="姝e父" width="40px"> + <template slot-scope="{row,$index}"> + <u v-if="$index!==1" >{{row.normal}}</u> + <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="鐩戞祴鐐规帓鏀炬槑缁�"> + <refinery :tableHeader="tableHeader1" :tableContent="tableContent1"></refinery> + <u slot="reference" style="color: #00ffff">{{row.normal}}</u> + </el-popover> + </template> </el-table-column> - <el-table-column - prop="overProof" - label="瓒呮爣" - width="60px"> - </el-table-column> - <el-table-column - prop="Abnormal" - label="寮傚父" - width="60px"> - </el-table-column> - <el-table-column - prop="StopProduction" - label="鍋滀骇" - width="60px"> - </el-table-column> - <el-table-column - prop="deficiency" - label="缂哄け" - width="60px"> + <el-table-column prop="overProof" label="瓒呮爣" width="40px"></el-table-column> + <el-table-column prop="Abnormal" label="寮傚父" width="40px"></el-table-column> + <el-table-column prop="StopProduction" label="鍋滀骇" width="40px"></el-table-column> + <el-table-column prop="deficiency" label="缂哄け" width="40px"> + <template slot-scope="{row,$index}"> + <u v-if="$index!==1" >{{row.deficiency}}</u> + <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="鐩戞祴鐐规帓鏀炬槑缁�"> + <MissingAlarm></MissingAlarm> + <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u> + </el-popover> + </template> </el-table-column> </el-table-column> </el-table> @@ -98,74 +60,71 @@ </template> <script> - +import ChemicalWastewater from '@components/table/components/componented/ChemicalWastewater' +import Refinery from '@components/table/components/componented/refinery' +import MissingAlarm from '@components/table/components/componented/MissingAlarm' +import mapApi from '@/api/mapApi' export default { name: 'WasteGas', + components: { + MissingAlarm, + Refinery, + ChemicalWastewater + }, data () { return { - 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' - - }] + isActive: '', + isShowIcon: false, + tableData: null, + tableHeader1: [ + { name: '鎺掓斁鐐�', width: '140', propS: 'value1' }, + { name: '鍗曚綅閮ㄩ棬', width: '80', propS: 'value2' }, + { name: '搴熸皵鎺掓斁閲忥紙m鲁锛�', width: '120', propS: 'value3' }, + { name: '浜屾哀鍖栫~锛坱锛�', width: '100', propS: 'value4' }, + { name: '姘哀鍖栫墿锛坱锛�', width: '100', propS: 'value5' }, + { name: 'VOCs锛坱锛�', width: '100', propS: 'value5' } + ], + tableContent1: [ + { value1: '1', value2: '2', value3: '3', value4: '4', value5: '5' }, + { value1: '1', value2: '2', value3: '3', value4: '4', value5: '5' } + ] } }, + async mounted () { + this.tableData = await mapApi.getWasteGasStatistics() + }, 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' + tableHeaderColor ({ 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' + // 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 scoped> - +.active { + /*color: red;*/ + transform:rotate(90deg); +} </style> -- Gitblit v1.8.0