From d5570af7062e30840bf198d0c67da644252db1ac Mon Sep 17 00:00:00 2001 From: chenzeping <ChenZeping02609@163.com> Date: 星期一, 29 三月 2021 18:15:25 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue | 63 +++++++++++++++++++- src/components/BaseNav/PublicBounced/GasComponents/GasTable.vue | 82 +++++++++++++++++++++------ src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue | 20 ++++++ src/components/BaseNav/PublicBounced/PublicBounced.vue | 3 + 4 files changed, 144 insertions(+), 24 deletions(-) diff --git a/src/components/BaseNav/PublicBounced/GasComponents/GasTable.vue b/src/components/BaseNav/PublicBounced/GasComponents/GasTable.vue index cfddb19..d309124 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/GasTable.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/GasTable.vue @@ -1,15 +1,23 @@ <template> - <div class="gas-tab"> - <el-row type="flex" class="row-bg" justify="space-around"> - <el-col :span="12">鐩戞祴鐐瑰悕绉�:{{ displayContent.Name }}</el-col> - <el-col :span="12">鐢熶骇鍗曚綅:{{ displayContent.DeptSname }}</el-col> - <el-col :span="12">鎺掓斁绫诲瀷鍔犺浇:{{ displayContent.EmissTypeName }}</el-col> - </el-row> - <el-row type="flex" class="row-bg" justify="space-around"> - <el-col :span="12">鎺掓斁鍘诲悜:{{ displayContent.EmissTypeDirectName }}</el-col> - <el-col :span="12">鎺у埗绾у埆鍚嶇О:{{ displayContent.ContrLevelShowName }}</el-col> - <el-col :span="12">鍐�/澶栨帓鍙�:{{ displayContent.OrOutPortName }}</el-col> - </el-row> + <!-- 妗� --> + <div class="win"> + <!-- 鍥涗釜瑙掔殑杈规鏁堟灉 --> + <div class="border_corner border_corner_left_top"></div> + <div class="border_corner border_corner_right_top"></div> + <div class="border_corner border_corner_left_bottom"></div> + <div class="border_corner border_corner_right_bottom"></div> + <div class="main"> + <el-row type="flex" class="row-bg" justify="space-around"> + <el-col :span="12">鐩戞祴鐐瑰悕绉�:{{ displayContent.Name }}</el-col> + <el-col :span="12">鐢熶骇鍗曚綅:{{ displayContent.DeptSname }}</el-col> + <el-col :span="12">鎺掓斁绫诲瀷鍔犺浇:{{ displayContent.EmissTypeName }}</el-col> + </el-row> + <el-row type="flex" class="row-bg" justify="space-around"> + <el-col :span="12">鎺掓斁鍘诲悜:{{ displayContent.EmissTypeDirectName }}</el-col> + <el-col :span="12">鎺у埗绾у埆鍚嶇О:{{ displayContent.ContrLevelShowName }}</el-col> + <el-col :span="12">鍐�/澶栨帓鍙�:{{ displayContent.OrOutPortName }}</el-col> + </el-row> + </div> </div> </template> @@ -24,19 +32,55 @@ </script> <style scoped lang="less"> -.gas-tab { - border: 1px #4c667d solid; -} +.win { + position: relative; + display: inline-block; + //border: 1px solid #396d83; +} +.main { + width: 100%; + height: 100%; +} +.border_corner{ + z-index: 2500; + position: absolute; + width: 14px; + height: 14px; + background: rgba(0,0,0,0); + border: 2px solid #47d5ea; +} +.border_corner_left_top{ + top: 0; + left: 0; + border-right: none; + border-bottom: none; +} +.border_corner_right_top{ + top: 0; + right: 0; + border-left: none; + border-bottom: none; +} +.border_corner_left_bottom{ + bottom: 0; + left: 0; + border-right: none; + border-top: none; + border-bottom-left-radius: 4px; +} +.border_corner_right_bottom{ + bottom: 0; + right: 0; + border-left: none; + border-top: none; +} .el-row { color: #00d0f9; - - .el-col { + .el-col{ width: 200px; height: 28px; - background-color: #243a55; - border-radius: 0.05rem; - margin: 5px 0; + background-color: #243a55;; text-align: center; line-height: 28px; } diff --git a/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue b/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue new file mode 100644 index 0000000..1df30fe --- /dev/null +++ b/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue @@ -0,0 +1,20 @@ +<template> +<div> + <el-tabs v-model="activeName"> + <el-tab-pane label="鐢ㄦ埛绠$悊" name="first">鐢ㄦ埛绠$悊</el-tab-pane> + <el-tab-pane label="閰嶇疆绠$悊" name="second">閰嶇疆绠$悊</el-tab-pane> + <el-tab-pane label="瑙掕壊绠$悊" name="third">瑙掕壊绠$悊</el-tab-pane> + <el-tab-pane label="瀹氭椂浠诲姟琛ュ伩" name="fourth">瀹氭椂浠诲姟琛ュ伩</el-tab-pane> + </el-tabs> +</div> +</template> + +<script> +export default { + name: 'GasTabs' +} +</script> + +<style scoped> + +</style> diff --git a/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue b/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue index 65d8a5b..eb83145 100644 --- a/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue +++ b/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue @@ -1,9 +1,18 @@ <template> - <div class="gas-video"> - <video width="100%" height="100%" controls> - <source src="movie.mp4" type="video/mp4"> - <source src="movie.ogg" type="video/ogg"> - </video> + <div class="win"> + <!-- 鍥涗釜瑙掔殑杈规鏁堟灉 --> + <div class="border_corner border_corner_left_top"></div> + <div class="border_corner border_corner_right_top"></div> + <div class="border_corner border_corner_left_bottom"></div> + <div class="border_corner border_corner_right_bottom"></div> + <div class="main"> + <div> + <video width="100%" height="100%" controls> + <source src="movie.mp4" type="video/mp4"> + <source src="movie.ogg" type="video/ogg"> + </video> + </div> + </div> </div> </template> @@ -14,4 +23,48 @@ </script> <style scoped> +.win { + width: 100%; + /*height: 100%;*/ + position: relative; + display: inline-block; +//border: 1px solid #396d83; +} +.main { + width: 100%; + height: 100%; +} +.border_corner{ + z-index: 2500; + position: absolute; + width: 14px; + height: 14px; + background: rgba(0,0,0,0); + border: 2px solid #47d5ea; +} +.border_corner_left_top{ + top: 0; + left: 0; + border-right: none; + border-bottom: none; +} +.border_corner_right_top{ + top: 0; + right: 0; + border-left: none; + border-bottom: none; +} +.border_corner_left_bottom{ + bottom: 0; + left: 0; + border-right: none; + border-top: none; + border-bottom-left-radius: 4px; +} +.border_corner_right_bottom{ + bottom: 0; + right: 0; + border-left: none; + border-top: none; +} </style> diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue index 3f69b36..850980d 100644 --- a/src/components/BaseNav/PublicBounced/PublicBounced.vue +++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue @@ -8,6 +8,7 @@ <div class="public-bounced-content-left"> <GasTable :displayContent="displayContent"></GasTable> <GasECharts></GasECharts> +<!-- <GasTabs></GasTabs>--> </div> <div class="public-bounced-content-right"> <GasVideo></GasVideo> @@ -22,10 +23,12 @@ import GasTable from '@components/BaseNav/PublicBounced/GasComponents/GasTable' import GasECharts from '@components/BaseNav/PublicBounced/GasComponents/GasECharts' import GasVideo from '@components/BaseNav/PublicBounced/GasComponents/GasVideo' +// import GasTabs from '@components/BaseNav/PublicBounced/GasComponents/GasTabs' export default { name: 'PublicBounced', components: { + // GasTabs, GasTable, GasECharts, GasVideo -- Gitblit v1.8.0