From 4f5bbd0d4c9fd95d8065db8e3a3fb10e0ab4f5df Mon Sep 17 00:00:00 2001 From: wangqi <magical1908@outlook.com> Date: 星期二, 06 四月 2021 18:26:14 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue | 15 +-- src/assets/css/map/map-panel-style.less | 21 +++++ src/conf/MapConfig.js | 2 src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue | 31 ++++++- src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue | 113 ++++++++++++++++++--------- src/components/BaseNav/PublicBounced/PublicBounced.vue | 13 ++- 6 files changed, 135 insertions(+), 60 deletions(-) diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less index b806be3..b76016e 100644 --- a/src/assets/css/map/map-panel-style.less +++ b/src/assets/css/map/map-panel-style.less @@ -250,4 +250,23 @@ .el-table .cell, .el-table--border td:first-child .cell, .el-table--border th:first-child .cell { /* padding-left: 10px; */ text-align: center; -} \ No newline at end of file +} +.el-table th>.cell { + color: #00fff6; +} +.el-table__row>td{ + border: none; +} +.el-table::before {//鍘绘帀鏈�涓嬮潰鐨勯偅涓�鏉$嚎 + height: 0; +} +.el-table td, .el-table th.is-leaf { + border: none; +} +.el-table .warning-row { + background: #28304d; +} + +.el-table .success-row { + background: #30455f; +} diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue index 3781da2..4e750c7 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue @@ -6,18 +6,20 @@ <div class="border_corner border_corner_left_bottom"></div> <div class="border_corner border_corner_right_bottom"></div> <div class="main"> - <div class="main-video"> + <div class="main-table"> <el-table - border + stripe='stripe' + :height="300" tooltip-effect="dark" :data="displayContentTableData" + :row-class-name="tableRowClassName" > <el-table-column prop="StoragePlaceId" label="搴忓彿"></el-table-column> <el-table-column prop="StoragePlaceTypeName" label="绫诲埆"></el-table-column> <el-table-column prop="StoragePlaceName" label="鍥哄簾鍚嶇О"></el-table-column> <el-table-column prop="StorageZDMJ" label="浠g爜"></el-table-column> - <el-table-column prop="StorageZCNL" label="浜х敓閲�"></el-table-column> - <el-table-column prop="StorageZCL" label="鍌ㄥ瓨閲�"></el-table-column> + <el-table-column prop="StorageZCNL" label="浜х敓閲�(t)"></el-table-column> + <el-table-column prop="StorageZCL" label="鍌ㄥ瓨閲�(t)"></el-table-column> <el-table-column prop="StorageType" label="浜х敓瑁呯疆"></el-table-column> </el-table> </div> @@ -38,26 +40,41 @@ this.$nextTick(() => { this.displayContentTable.forEach(item => { this.displayContentTableData = item - // console.log(item[0]) }) }) + }, + methods: { + tableRowClassName ({ + row, + rowIndex + }) { + if (rowIndex % 2 === 0) { + return 'warning-row' + } else if (rowIndex % 2 === 1) { + return 'success-row' + } + return '' + } } } </script> <style lang="less" scoped> + .win { position: relative; background-color: rgba(33, 41, 69, 0.9); + min-height: 300px; } .main { width: 100%; height: 100%; - .main-video { + .main-table { width: 100%; min-height: 195px; + //border: 1px @color solid; video { width: 100%; @@ -73,7 +90,7 @@ width: 14px; height: 14px; background: rgba(0, 0, 0, 0); - border: 1.5px solid #47d5ea; + border: 1px solid #47d5ea; } .border_corner_left_top { diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue index 29723b3..6c039cd 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue @@ -16,22 +16,20 @@ </el-row> <el-row type="flex" class="row-bg" justify="space-around"> <el-col :span="8">鎺掓斁鍘诲悜:{{ setWasteGasdata.EmissDirecti }}</el-col> - <el-col :span="8">鎺у埗绾у埆鍚嶇О:{{ setWasteGasdata.ContrLevelShowName }}</el-col> - <el-col :span="8">鍐�/澶栨帓鍙�:{{ setWasteGasdata.OrOutPortName }}</el-col> + <el-col :span="18">鎺у埗绾у埆鍚嶇О:{{ setWasteGasdata.ContrLevelShowName }}</el-col> + <el-col :span="18">鍐�/澶栨帓鍙�:{{ setWasteGasdata.OrOutPortName }}</el-col> </el-row> </div> - <div v-else-if="value === 'gufei'"> - <el-row type="flex" class="row-bg row-item-one" justify="space-around"> - <el-col :span="8">鐩戞祴鐐瑰悕绉�:{{ displayContentTab2.StoragePlaceName }}</el-col> - <el-col :span="8">鐢熶骇鍗曚綅:{{ displayContentTab2.StoragePlaceName }}</el-col> - <el-col :span="8">鎺掓斁绫诲瀷鍔犺浇:{{ displayContentTab2.DesignFloorArea }}</el-col> - </el-row> - <el-row type="flex" class="row-bg" justify="space-around"> - <el-col :span="8">鎺掓斁鍘诲悜:{{ displayContentTab2.StorageQty }}</el-col> - <el-col :span="8">鎺у埗绾у埆鍚嶇О:{{ displayContentTab2.SurplusFloorArea }}</el-col> - <el-col :span="8">鍐�/澶栨帓鍙�:{{ displayContentTab2.StorageDate }}</el-col> - </el-row> - </div> + <div v-else-if="value === 'gufei'"> + <ul> + <li>鍦烘墍鍚嶇О:{{ tabData.StoragePlaceName }}</li> + <li>璐瓨鑳藉姏:{{ tabData.StorageQty }}(鍚�)</li> + <li>鍓╀綑璐瓨鑳藉姏:{{ tabData.SurplusFloorArea }}(鍚�)</li> + <li>鍗犲湴闈㈢Н(銕�):{{ tabData.DesignFloorArea }}(銕�)</li> + <li>鏈�杩戣串瀛樻棩鏈�:{{ tabData.StorageDate }}</li> + <li></li> + </ul> + </div> <div v-else-if="value === 'feishui'"> <el-row type="flex" class="row-bg row-item-one" justify="space-around"> <el-col :span="8">鐩戞祴鐐瑰悕绉�:{{ setWasteGasdata.Name }}</el-col> @@ -55,16 +53,19 @@ props: ['displayContentTab', 'value', 'setWasteGasdata'], data () { return { - displayContentTab2: [] + tabData: [] } }, mounted () { - this.$nextTick(() => { - this.displayContentTab.forEach(item => { - this.displayContentTab2 = item - // console.log(item) - }) - }) + this.processingData() + }, + methods: { + processingData () { + for (var i = 0; i < this.displayContentTab.length; i++) { + console.log(this.displayContentTab[i]) + this.tabData = this.displayContentTab[i] + } + } } } </script> @@ -73,67 +74,103 @@ .win { position: relative; - margin-bottom: 13px; - background-color: rgba(33, 41, 69,0.9); + margin-bottom: 10px; + background-color: rgba(33, 41, 69, 0.9); } + .main { width: 100%; height: 100%; - .main-matter{ + + .main-matter { font-size: 13px; font-weight: normal; - padding: 10px 6px; + //padding: 10px 6px; + min-height: 70px; border: 1px solid #396d83; - .row-item-one{ + + .row-item-one { margin-bottom: 7px; } + .el-row { width: 100%; color: #00d0f9; display: flex; font-size: 12px !important; - .el-col{ + + .el-col { flex: 1; width: 100%; - background-color: #243a55;; + background-color: #243a55; text-align: center; line-height: 28px; margin-left: 6px; border-radius: 4px; - &:nth-child(1){ - margin-left:0; + + &:nth-child(1) { + margin-left: 0; } + } + } + + ul { + width: 100%; + height: 100%; + display: flex; + align-items: center; + justify-content: space-around; + flex-wrap: wrap; + line-height: 35px; + + li { + text-align: center; + width: 32%; + height: 30px; + margin: 5px auto; + background-color: #243a55; + color: #00d0f9; + border-radius: 4px; + } + + li:last-child { + visibility: hidden } } } } -.border_corner{ + +.border_corner { z-index: 999; position: absolute; width: 10px; - height: 10px; - background: rgba(0,0,0,0); - border: 1.5px solid #47d5ea; + //height: 10px; + background: rgba(0, 0, 0, 0); + border: 1px solid #47d5ea; } -.border_corner_left_top{ + +.border_corner_left_top { top: 0; left: 0; border-right: none; border-bottom: none; } -.border_corner_right_top{ + +.border_corner_right_top { top: 0; right: 0; border-left: none; border-bottom: none; } -.border_corner_left_bottom{ + +.border_corner_left_bottom { bottom: 0; left: 0; border-right: none; border-top: none; } -.border_corner_right_bottom{ + +.border_corner_right_bottom { bottom: 0; right: 0; border-left: none; diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue index 9519388..9c29b81 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue @@ -6,12 +6,12 @@ <div class="border_corner border_corner_left_bottom"></div> <div class="border_corner border_corner_right_bottom"></div> <div class="main"> - <div class="main-video"> +<!-- <div class="main-video">--> <video controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> </video> - </div> +<!-- </div>--> </div> </div> </template> @@ -30,15 +30,14 @@ .main { border: 1px solid #396d83; padding: 6px; - .main-video { - width: 100%; - height: 100%; + //.main-video { + height: 378px; video { width: 100%; - height: 100%; + height: 378px; outline: none; } - } + //} } .border_corner{ z-index: 999; @@ -46,7 +45,7 @@ width: 14px; height: 14px; background: rgba(0,0,0,0); - border: 1.5px solid #47d5ea; + border: 1px solid #47d5ea; } .border_corner_left_top{ top: 0; diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue index 501d120..d908a07 100644 --- a/src/components/BaseNav/PublicBounced/PublicBounced.vue +++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue @@ -6,15 +6,16 @@ </div> <div class="public-bounced-content"> <div class="public-bounced-content-left"> - <PublicTabs :displayContentTab="displayContentTab" :value="value" - :setWasteGasdata="setWasteGasdata"></PublicTabs> + <public-tabs :displayContentTab="displayContentTab" :value="value" + :setWasteGasdata="setWasteGasdata"></public-tabs> <div class="public-bounced-content-left-bottom"> - <PublicTable v-if="value === 'gufei'" :displayContentTable="displayContentTable"></PublicTable> - <PublicChart :getWasteGasDetails="getWasteGasDetails" v-else></PublicChart> + <public-table v-if="value === 'gufei'" + :displayContentTable="displayContentTable"></public-table> + <public-chart v-else></public-chart> </div> </div> <div class="public-bounced-content-right"> - <PublicVideo></PublicVideo> + <public-video></public-video> </div> </div> </div> @@ -49,6 +50,8 @@ }, methods: { setData (dataBasic, dataDetailed, value) { + this.flag = true + this.value = value dataBasic.forEach(item => { this.displayContentTitle = item.StoragePlaceName }) diff --git a/src/conf/MapConfig.js b/src/conf/MapConfig.js index 9620d76..8f95cd8 100644 --- a/src/conf/MapConfig.js +++ b/src/conf/MapConfig.js @@ -26,7 +26,7 @@ // center: [26, 104], center: [38.828558921813965, 117.41676807403564], // center: [29.454345703125, 113.40362548828125], - zoom: 14, + zoom: 5, worldCopyJump: true, inertia: true, zoomControl: false, -- Gitblit v1.8.0