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/WasteWater.vue | 237 ++++++++++++++++------------------------------------------ 1 files changed, 67 insertions(+), 170 deletions(-) diff --git a/src/components/table/components/WasteWater.vue b/src/components/table/components/WasteWater.vue index 346934f..6540b1a 100644 --- a/src/components/table/components/WasteWater.vue +++ b/src/components/table/components/WasteWater.vue @@ -1,92 +1,44 @@ <template> <div class="waste-water"> -<!-- <el-row>--> -<!-- <el-col>--> - <el-table - class="tableBox" - :data="tableData" - :cell-style="rowClass" - :header-cell-style="tableHeaderColor" - > - <el-table-column - width="30px" - label="" - > - <template > - <el-popover :value= "show" - placement="bottom" - width="200" - trigger="click" - popper-class="popovers" - > - <ChemicalWastewater @isshow= "show=false"></ChemicalWastewater> - <i class="el-icon-caret-right" slot="reference" v-if="!isShowIcon" ></i> - <i class="el-icon-caret-bottom" slot="reference" v-else-if="isShowIcon"></i> -<!-- <i class="el-icon-caret-bottom" v-else-if="isShowIcon&&scope.row.index===1"></i>--> -<!-- <i v-if="isShowIcon" class="el-icon-caret-bottom" slot="reference" @click="isbtn"></i>--> -<!-- <i v-else class="el-icon-caret-right" slot="reference" @click="isbtn"></i>--> - </el-popover> -<!-- <i class="el-icon-caret-right" v-if="!isShowIcon"></i>--> -<!-- <i class="el-icon-caret-bottom" v-else-if="isShowIcon&&scope.row.index===1"></i>--> + <el-table class="tableBox" :data="tableData" style="width: 100%" @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> - <el-table-column - prop="UserName" - label="浼佷笟鍚嶇О" - width="120px"> + <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>v- - <el-table-column - prop="WasteWaters" - label="澶栨帓搴熸按閲忥紙m鲁锛�" - width="100px"> </el-table-column> - <el-table-column label="COD (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 prop="WasteWaters" width="80"> + <div slot="header"> + <span>澶栨帓搴熸按閲�</span> + <div>锛坢鲁锛�</div> + </div> </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 label="COD (浜х敓閲�/t)"> + <el-table-column prop="AddOutPut" label="绱" width="70"></el-table-column> + <el-table-column prop="MonthOutPut" label="褰撴湀" width="70"></el-table-column> </el-table-column> - <el-table-column label="鎺掓斁鍙f娴嬬粺璁$姸鎬�"> - <el-table-column - prop="normal" - label="姝e父" - width="60px"> + <el-table-column label="姘ㄦ爱 (浜х敓閲�/t)"> + <el-table-column prop="NH4NPut" label="绱" width="70"></el-table-column> + <el-table-column prop="NH4NMonth" label="褰撴湀" width="70"></el-table-column> + </el-table-column> + <el-table-column label="鎺掓斁鍙f娴嬬粺璁$姸鎬� (涓�)"> + <el-table-column prop="normal" label="姝e父" width="60"> <template slot-scope="{row,$index}"> <u v-if="$index!=2" >{{row.normal}}</u> - <el-popover v-else - placement="bottom-end" - width="200" - trigger="click" - > - <ChemicalWastewater></ChemicalWastewater> + <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="鐩戞祴鐐规槑缁嗚〃"> + <refinery></refinery> <u slot="reference" style="color: #00ffff">{{row.normal}}</u> <!-- <i class="el-icon-caret-bottom" v-else-if="isShowIcon&&scope.row.index===1"></i>--> <!-- <i v-if="isShowIcon" class="el-icon-caret-bottom" slot="reference" @click="isbtn"></i>--> @@ -94,25 +46,17 @@ </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="60"></el-table-column> + <el-table-column prop="Abnormal" label="寮傚父" width="60"></el-table-column> + <el-table-column prop="StopProduction" label="鍋滀骇" width="60"></el-table-column> + <el-table-column prop="deficiency" label="缂哄け" width="60"> + <template slot-scope="{row,$index}"> + <u v-if="$index!=1" >{{row.deficiency}}</u> + <el-popover v-else placement="bottom-end" trigger="click" title="澶╂触鐭冲寲鐩戞祴鐐圭己澶辨姤璀︽槑缁�" popper-class="popovers"> + <MissingAlarm></MissingAlarm> + <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u> + </el-popover> + </template> </el-table-column> </el-table-column> </el-table> @@ -124,102 +68,55 @@ <script> import ChemicalWastewater from './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: 'WasteWater', components: { + MissingAlarm, + Refinery, ChemicalWastewater }, data () { return { - show: false, + 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' - - }] + tableData: null } + }, + async mounted () { + this.tableData = await mapApi.getWasteWaterStatistics() }, 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' + // 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' }, - // cellClick (row, column, cell, event) { - // console.log(row.index) - // if (row.index === 1) { - // this.isShowIcon = !this.isShowIcon - // } - // // console.log(column) - // // console.log(cell) - // // console.log(event) - // }, - // isbtn () { - // this.isShowIcon = !this.isShowIcon - // // this.isShowIcon = !this.isShowIcon - // // console.log(1) - // }, - tableCellClassName ({ row, column, rowIndex, columnIndex }) { - row.index = rowIndex - column.index = columnIndex + // 鑾峰彇鐐瑰嚮鐨勮〃鏍� + 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 > -.popovers{ - width: auto !important; -} -.popovers.el-popover{ -padding:0; -} +<style> </style> -- Gitblit v1.8.0