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