From 97a7d4a2a256b9171bca05e69d154996645b4722 Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期二, 16 三月 2021 10:29:58 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/master' into master --- src/components/table/summarySheets.vue | 78 +------- src/components/table/components/tabHandover.vue | 41 ++++ src/components/table/components/WasteWater.vue | 65 ++++--- src/components/table/components/componented/ChemicalWastewater.vue | 26 +- src/components/table/components/WasteGas.vue | 43 ++++ src/components/panel/topicSearch/SewersSearch.vue | 4 src/components/table/components/componented/MissingAlarm.vue | 142 +++++++++++++++ src/components/LayerController/LayerController.vue | 2 src/components/table/components/componented/refinery.vue | 69 +++++++ src/components/table/components/SolidWaste.vue | 40 +++- 10 files changed, 386 insertions(+), 124 deletions(-) diff --git a/src/components/LayerController/LayerController.vue b/src/components/LayerController/LayerController.vue index 1219e4b..8f24ad7 100644 --- a/src/components/LayerController/LayerController.vue +++ b/src/components/LayerController/LayerController.vue @@ -93,7 +93,7 @@ .float-panel { position: absolute; - top: 80px; + top: 120px; height: auto; font-size: 11px; z-index: 1000; diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue index 9012ad0..f6ff0f2 100644 --- a/src/components/panel/topicSearch/SewersSearch.vue +++ b/src/components/panel/topicSearch/SewersSearch.vue @@ -3,7 +3,7 @@ <div class="search-panel "> <el-form ref="form" :model="form" label-width="90px" class="search-form"> <el-form-item label="璁炬柦绫诲瀷锛�" size="mini" class="search-panel-item"> - <el-select style="width: 100%" :popper-append-to-body="false" v-model="form.pipelineType" @change="handlePipelineType" :popper-class="'select-down'"> + <el-select style="width: 100%" v-model="form.pipelineType" @change="handlePipelineType" :popper-class="'select-down'"> <el-option v-for="item in pipelineTypeOptions" :key="item.value" @@ -13,7 +13,7 @@ </el-select> </el-form-item> <el-form-item :label="form.pipelineType+'锛�'" size="mini"> - <el-select style="width: 100%" :popper-append-to-body="false" v-model="form.dataType" @change="handleDataType" :popper-class="'select-down'"> + <el-select style="width: 100%" v-model="form.dataType" @change="handleDataType" :popper-class="'select-down'"> <el-option v-for="item in dataTypeOptions" :key="item.value" diff --git a/src/components/table/components/SolidWaste.vue b/src/components/table/components/SolidWaste.vue index 14a9020..c90311a 100644 --- a/src/components/table/components/SolidWaste.vue +++ b/src/components/table/components/SolidWaste.vue @@ -5,6 +5,7 @@ :data="tableData" :header-cell-style="tableHeaderColor" :cell-style="rowClass" + @cell-click="handle" > <el-table-column width="30px" @@ -24,11 +25,11 @@ prop="UserName" label="浼佷笟鍚嶇О" width="120px"> - </el-table-column> - <el-table-column - prop="WasteWaters" - label="宸ヤ笟澶栨帓搴熸按閲忥紙m鲁锛�" - width="200px"> + <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 label="浜х敓閲� 锛堝惃锛�"> <el-table-column @@ -47,6 +48,18 @@ prop="normal" label="姝e父" width="100px"> + <template slot-scope="{row,$index}"> + <u v-if="$index!=1" >{{row.normal}}</u> + <el-popover v-else + placement="bottom-end" + width="200" + trigger="click" + title="鐩戞祴鐐规帓鏀炬槑缁�" + > + <ChemicalWastewater></ChemicalWastewater> + <u slot="reference" style="color: #00ffff">{{row.normal}}</u> + </el-popover> + </template> </el-table-column> <el-table-column prop="warning" @@ -59,17 +72,20 @@ </template> <script> +import ChemicalWastewater from '@components/table/components/componented/ChemicalWastewater' export default { name: 'SolidWaste', + components: { + ChemicalWastewater + }, data () { return { tableData: [{ UserName: '闆嗗洟鍚嶇О', - WasteWaters: '', - AddOutPut: '', - MonthOutPut: '', - normal: '', - warning: '' + AddOutPut: '580', + MonthOutPut: '250', + normal: '10', + warning: '9' }, { UserName: '澶╂触鐭冲寲', WasteWaters: '116.6', @@ -100,6 +116,10 @@ // 琛ㄥご鏍峰紡璁剧疆 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) } } } diff --git a/src/components/table/components/WasteGas.vue b/src/components/table/components/WasteGas.vue index 5014038..4ebce10 100644 --- a/src/components/table/components/WasteGas.vue +++ b/src/components/table/components/WasteGas.vue @@ -5,6 +5,7 @@ :data="tableData" :header-cell-style="tableHeaderColor" :cell-style="rowClass" + @cell-click="handle" > <el-table-column width="30px" @@ -24,6 +25,11 @@ 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="WasteWaters" @@ -71,6 +77,18 @@ prop="normal" label="姝e父" width="60px"> + <template slot-scope="{row,$index}"> + <u v-if="$index!=1" >{{row.normal}}</u> + <el-popover v-else + placement="bottom-end" + width="200" + trigger="click" + title="鐩戞祴鐐规帓鏀炬槑缁�" + > + <refinery></refinery> + <u slot="reference" style="color: #00ffff">{{row.normal}}</u> + </el-popover> + </template> </el-table-column> <el-table-column prop="overProof" @@ -91,6 +109,18 @@ prop="deficiency" label="缂哄け" width="60px"> + <template slot-scope="{row,$index}"> + <u v-if="$index!=1" >{{row.deficiency}}</u> + <el-popover v-else + placement="bottom-end" + width="200" + trigger="click" + title="鐩戞祴鐐规帓鏀炬槑缁�" + > + <MissingAlarm></MissingAlarm> + <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u> + </el-popover> + </template> </el-table-column> </el-table-column> </el-table> @@ -98,9 +128,16 @@ </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' export default { name: 'WasteGas', + components: { + MissingAlarm, + Refinery + // ChemicalWastewater + }, data () { return { tableData: [{ @@ -161,6 +198,10 @@ // 琛ㄥご鏍峰紡璁剧疆 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) } } } diff --git a/src/components/table/components/WasteWater.vue b/src/components/table/components/WasteWater.vue index 346934f..8cbdc0e 100644 --- a/src/components/table/components/WasteWater.vue +++ b/src/components/table/components/WasteWater.vue @@ -1,27 +1,26 @@ <template> <div class="waste-water"> -<!-- <el-row>--> -<!-- <el-col>--> <el-table class="tableBox" :data="tableData" - :cell-style="rowClass" + style="width: 100%" :header-cell-style="tableHeaderColor" + :cell-style="rowClass" + @cell-click="handle" > <el-table-column width="30px" label="" > - <template > - <el-popover :value= "show" + <template> + <el-popover 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> + <ChemicalWastewater></ChemicalWastewater> + <i class="el-icon-caret-right" slot="reference" v-if="!isShowIcon" @click="doIcon"></i> +<!-- <i class="el-icon-caret-bottom" slot="reference" v-else-if="isShowIcon&&$index===1"></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>--> @@ -85,8 +84,10 @@ placement="bottom-end" width="200" trigger="click" + popper-class="popovers" + title="XXX1鏄庣粏琛�" > - <ChemicalWastewater></ChemicalWastewater> + <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>--> @@ -113,6 +114,19 @@ prop="deficiency" label="缂哄け" width="60px"> + <template slot-scope="{row,$index}"> + <u v-if="$index!=1" >{{row.deficiency}}</u> + <el-popover v-else + placement="bottom-end" + width="200" + 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,9 +138,13 @@ <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 () { @@ -192,31 +210,22 @@ rowClass () { 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 () { + console.log(1) + this.isShowIcon = !this.isShowIcon } } } </script> -<style > +<style scoped> .popovers{ width: auto !important; + background-color: gray !important; } .popovers.el-popover{ padding:0; diff --git a/src/components/table/components/componented/ChemicalWastewater.vue b/src/components/table/components/componented/ChemicalWastewater.vue index 4bdfdd7..75c7d30 100644 --- a/src/components/table/components/componented/ChemicalWastewater.vue +++ b/src/components/table/components/componented/ChemicalWastewater.vue @@ -2,11 +2,11 @@ <div class="Chemical-Waste-water" id="Chemical-Waste-water"> <el-row type="flex" class="head-area" align="middle"> <el-col> - <span>浼佷笟鎸囨爣鍒嗙被缁熻</span> + <span>鐩戞祴鐐规帓鏀炬槑缁�</span> </el-col> - <el-col class="head-area-button"> - <el-button style="float: right; padding: 3px 0" icon="el-icon-close" type="info" @click="closebtns"></el-button> - </el-col> +<!-- <el-col class="head-area-button">--> +<!-- <el-button style="float: right; padding: 3px 0" icon="el-icon-close" type="info" @click="closeBtns"></el-button>--> +<!-- </el-col>--> </el-row> <el-table class="tableBox" @@ -83,17 +83,14 @@ } }, methods: { - closebtns () { - // const summary = document.getElementById('Chemical-Waste-water') - // summary.style.display = 'none' - // console.log(1) - this.$emit('isshow') - } + // closeBtns () { + // this.$emit('isShow') + // } } } </script> <style scoped> - /*.Chemical-Waste-water {*/ + .Chemical-Waste-water { /* position:fixed;*/ /* top: 330px;*/ /* left: 65px;*/ @@ -101,9 +98,10 @@ /* !*height: 265px;*!*/ /* border: #90c8e0 1px solid;*/ /* z-index:3000;*/ - /* background-color: rgba(26, 73, 81, 0.901960784313726);*/ - /* !*color: #fff;*!*/ - /*}*/ + text-align: center; + background-color: rgba(26, 73, 81, 0.901960784313726); + color: #fff; + } /*.head-area{*/ /* color: #fff;*/ /* width: 100%;*/ diff --git a/src/components/table/components/componented/MissingAlarm.vue b/src/components/table/components/componented/MissingAlarm.vue new file mode 100644 index 0000000..bebabea --- /dev/null +++ b/src/components/table/components/componented/MissingAlarm.vue @@ -0,0 +1,142 @@ +<template> +<div class="MissingAlarm"> + <el-tabs v-model="activeName"> + <el-tab-pane label="灏忔椂鏁版嵁" name="first"> + <el-table + :data="tableData" + border + style="width: 100%" + > + <el-table-column + prop="date" + label="鎺掓斁鐐�" + width="150"> + </el-table-column> + <el-table-column + prop="name" + label="鎺掓斁绫诲瀷" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鎶ヨ鏃堕棿" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鎭㈠鏃堕棿" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="缂哄け灏忔椂鏁�" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="缂哄け鍘熷洜绫诲瀷" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鍘熷洜鎻忚堪" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鏁存敼鎺柦" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="闄愬畾鏁存敼缁撴潫鏃堕棿" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="瀹為檯鏁存敼缁撴潫鏃堕棿" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鑱旂綉鏃堕棿" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鍑瘉" + width="120"> + </el-table-column> + </el-table> + </el-tab-pane> + <el-tab-pane label="鏃ユ暟鎹�" name="second"> + <el-table + :data="tableData" + border + style="width: 100%"> + <el-table-column + prop="date" + label="鎺掓斁鐐�" + width="150"> + </el-table-column> + <el-table-column + prop="name" + label="鎺掓斁绫诲瀷" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="妫�娴嬫椂闂�" + width="120"> + </el-table-column> + <el-table-column + prop="name" + label="鐘舵��" + width="120"> + </el-table-column> + </el-table> + </el-tab-pane> + </el-tabs> +</div> +</template> + +<script> +export default { + name: 'MissingAlarm', + data () { + return { + activeName: 'first', + tableData: [{ + date: '2016-05-03', + name: '鐜嬪皬铏�', + province: '涓婃捣', + city: '鏅檧鍖�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�', + zip: 200333 + }, { + date: '2016-05-02', + name: '鐜嬪皬铏�', + province: '涓婃捣', + city: '鏅檧鍖�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�', + zip: 200333 + }, { + date: '2016-05-04', + name: '鐜嬪皬铏�', + province: '涓婃捣', + city: '鏅檧鍖�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�', + zip: 200333 + }] + } + } +} +</script> + +<style scoped> +.MissingAlarm { + background-color: #0E3565; + color: #fff; + text-align: center; +} +</style> diff --git a/src/components/table/components/componented/refinery.vue b/src/components/table/components/componented/refinery.vue new file mode 100644 index 0000000..c530888 --- /dev/null +++ b/src/components/table/components/componented/refinery.vue @@ -0,0 +1,69 @@ +<template> + <div class="refinery"> + <el-table + :data="tableData" + border + style="width: 100%"> + <el-table-column + label="搴忓彿" + width="45px" + type="index"> + </el-table-column> + <el-table-column + prop="date" + label="鎺掓斁鐐�" + width="180"> + </el-table-column> + <el-table-column + prop="name" + label="鍗曚綅閮ㄩ棬" + width="180"> + </el-table-column> + <el-table-column + prop="address" + label="搴熸按浜х敓閲忥紙m3锛�"> + </el-table-column> + <el-table-column + prop="address" + label="COD (t)"> + </el-table-column> + <el-table-column + prop="address" + label="姘ㄦ爱(t)"> + </el-table-column> + </el-table> + </div> +</template> + +<script> +export default { + name: 'refinery', + data () { + return { + tableData: [{ + date: '2016-05-02', + name: '鐜嬪皬铏�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�' + }, { + date: '2016-05-04', + name: '鐜嬪皬铏�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1517 寮�' + }, { + date: '2016-05-01', + name: '鐜嬪皬铏�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�' + }, { + date: '2016-05-03', + name: '鐜嬪皬铏�', + address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�' + }] + } + } +} +</script> + +<style scoped lang="less"> +.refinery { + background-color: #0E3565; +} +</style> diff --git a/src/components/table/components/tabHandover.vue b/src/components/table/components/tabHandover.vue new file mode 100644 index 0000000..ed43d60 --- /dev/null +++ b/src/components/table/components/tabHandover.vue @@ -0,0 +1,41 @@ +<template> + <el-tabs v-model="activeName" type="border-card"> + <el-tab-pane label="搴熸按" name="first"> + <waste-water></waste-water> + </el-tab-pane> + <el-tab-pane label="搴熸皵" name="second"> + <waste-gas></waste-gas> + </el-tab-pane> + <el-tab-pane label="鍥哄簾" name="third"> + <solid-waste></solid-waste> + </el-tab-pane> + <el-tab-pane label="绌烘皵璐ㄩ噺" name="fourth"> + <AirQuality></AirQuality> + </el-tab-pane> + </el-tabs> +</template> + +<script> +import WasteWater from '@components/table/components/WasteWater' +import WasteGas from '@components/table/components/WasteGas' +import SolidWaste from '@components/table/components/SolidWaste' +import AirQuality from '@components/table/components/AirQuality' +export default { + name: 'tabHandover', + components: { + WasteWater, + WasteGas, + SolidWaste, + AirQuality + }, + data () { + return { + activeName: 'first' + } + } +} +</script> + +<style scoped> + +</style> diff --git a/src/components/table/summarySheets.vue b/src/components/table/summarySheets.vue index 1bb0dc4..a66a556 100644 --- a/src/components/table/summarySheets.vue +++ b/src/components/table/summarySheets.vue @@ -1,73 +1,29 @@ <template> <div class="summary-sheets"> -<!-- <div id="summary">--> -<!-- <el-row type="flex" class="head-area" align="middle">--> -<!-- <el-col>--> -<!-- <span>浼佷笟鎸囨爣鍒嗙被缁熻</span>--> -<!-- </el-col>--> -<!-- <el-col class="head-area-button">--> -<!-- <el-button style="float: right; padding: 3px 0" icon="el-icon-close" type="info" @click="closeBtn"></el-button>--> -<!-- </el-col>--> -<!-- </el-row>--> -<!-- <el-tabs class="tabs-text">--> <div> <i class="el-icon-c-scale-to-original" @click="closeBtn"></i> </div> <Dialog ref="summarySheets" title="浼佷笟鎸囨爣鍒嗙被缁熻"> -<!-- <el-row :gutter="20" >--> -<!-- <el-col>--> - <el-tabs v-model="activeName" type="border-card"> - <el-tab-pane label="搴熸按" name="first"> - <waste-water></waste-water> - </el-tab-pane> - <el-tab-pane label="搴熸皵" name="second"> - <waste-gas></waste-gas> - </el-tab-pane> - <el-tab-pane label="鍥哄簾" name="third"> - <solid-waste></solid-waste> - </el-tab-pane> - <el-tab-pane label="绌烘皵璐ㄩ噺" name="fourth"> - <AirQuality></AirQuality> - </el-tab-pane> - </el-tabs> -<!-- </el-col>--> -<!-- </el-row>--> + <tab-handover></tab-handover> </Dialog > </div> </template> <script> -import WasteWater from '@/components/table/components/WasteWater.vue' -import WasteGas from './components/WasteGas' -import SolidWaste from './components/SolidWaste' -import AirQuality from './components/AirQuality' +import tabHandover from '@components/table/components/tabHandover' import Dialog from '@views/popup/Dialog' export default { name: 'summary-sheet.vue', components: { - Dialog, - WasteWater, - WasteGas, - SolidWaste, - AirQuality + tabHandover, + Dialog }, - data () { - return { - activeName: 'first' - } - }, + methods: { closeBtn () { // const summary = document.getElementById('summary') // summary.style.display = 'none' this.$refs.summarySheets.show() - }, - 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' } } } @@ -76,10 +32,8 @@ <style scoped lang="less"> .summary-sheets { position: absolute; - top: 450px; - left: 200px; - width: 40px; - height: 40px; + top: 70px; + left: 1px; /*width: 850px;*/ /*height: 265px;*/ border: #90c8e0 1px solid; @@ -87,21 +41,9 @@ background-color: rgba(26, 73, 81, 0.901960784313726); /*color: #fff;*/ .el-icon-c-scale-to-original { - width: 100%; - height: 100%; + width: 30px; + height: 30px; + font-size: 30px; } } - /*.head-area{*/ - /* color: #fff;*/ - /* width: 100%;*/ - /* height: 40px;*/ - /* background-color: #002433;*/ - /* font-size: 16px;*/ - /* border-bottom: #90c8e0 2px solid;*/ - /* padding-left: 16px;*/ - /* !*line-height: 40px;*!*/ - /*}*/ - /*.head-area-button{*/ - /* margin-right: 5px;*/ - /*}*/ </style> -- Gitblit v1.8.0