From 79028970d73bb6fcb3fb6522589affda312dcabe Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期三, 31 三月 2021 19:06:21 +0800
Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop

---
 src/assets/css/map/map-panel-style.less                           |   11 ++
 src/components/BaseNav/PublicBounced/GasComponents/GasECharts.vue |   46 ++++++++--
 src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue    |   85 +++++++++++++++++---
 src/components/BaseNav/PublicBounced/GasComponents/EchartsTab.vue |   63 ++++-----------
 src/components/BaseNav/PublicBounced/PublicBounced.vue            |    6 +
 5 files changed, 138 insertions(+), 73 deletions(-)

diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less
index 0f1628e..2a9b8ee 100644
--- a/src/assets/css/map/map-panel-style.less
+++ b/src/assets/css/map/map-panel-style.less
@@ -191,3 +191,14 @@
 .popper__arrow {
   display: none !important;
 }
+
+.el-tabs--card>.el-tabs__header .el-tabs__nav{
+  border: none;
+}
+
+.el-tabs--card>.el-tabs__header .el-tabs__item{
+  border: none;
+  margin-left: 10px;
+}
+
+
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EchartsTab.vue b/src/components/BaseNav/PublicBounced/GasComponents/EchartsTab.vue
index 1016531..1ab150f 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/EchartsTab.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/EchartsTab.vue
@@ -1,17 +1,10 @@
 <template>
-  <!-- 妗� -->
-  <div class="win">
-    <div class="main">
-      <div class="main-matter">
-        <el-row type="flex" class="row-bg row-item-one" justify="space-around">
-          <el-col :span="6">姘哀鍖栫墿:{{ displayContent.Name }} 鏍囧噯: 100</el-col>
-          <el-col :span="6">浜屾哀鍖栫~:{{ displayContent.DeptSname }} 鏍囧噯: 50</el-col>
-          <el-col :span="6">鐑熷皹:{{ displayContent.EmissTypeName }} 鏍囧噯: 30</el-col>
-          <el-col :span="6">搴熸皵娴侀噺:{{ displayContent.EmissTypeName }}</el-col>
-        </el-row>
-      </div>
-    </div>
-  </div>
+        <div class="Infomation">
+            <el-tag>姘哀鍖栫墿: 29.93 鏍囧噯: 100</el-tag>
+            <el-tag>浜屾哀鍖栫~: 17.34鏍囧噯: 50</el-tag>
+            <el-tag>鐑熷皹: 6.93鏍囧噯: 30</el-tag>
+            <el-tag>搴熸皵娴侀噺: 120343.18</el-tag>
+        </div>
 </template>
 
 <script>
@@ -25,40 +18,16 @@
 </script>
 
 <style scoped lang="less">
-
-.win {
-  position: relative;
-  margin-bottom: 13px;
-  background-color: rgba(33, 41, 69,0.9);
-}
-.main {
-  width: 100%;
-  height: 100%;
-  .main-matter{
-    font-size: 13px;
-    font-weight: normal;
-    border: 1px solid #396d83;
-    .row-item-one{
-      margin-bottom: 7px;
+    .Infomation{
+        margin-left: 10px;
     }
-    .el-row {
-      width: 100%;
-      color: #00d0f9;
-      display: flex;
-      font-size: 12px !important;
-      .el-col{
-        flex: 1;
-        width: 100%;
-        background-color: #243a55;;
-        text-align: center;
-        line-height: 28px;
-        margin-left: 6px;
-        border-radius: 4px;
-        &:nth-child(1){
-          margin-left:0;
-        }
-      }
+    .el-tag{
+        height: 25px;
+        line-height: 25px;
+        margin-right: 10px;
+        font-size: 10px;
+        background-color: rgba(0, 255, 246, 0.14);
+        color: #00d0f9;
+        border: none;
     }
-  }
-}
 </style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/GasECharts.vue b/src/components/BaseNav/PublicBounced/GasComponents/GasECharts.vue
index 65a7885..8f66ec0 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/GasECharts.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/GasECharts.vue
@@ -1,7 +1,6 @@
 <template>
-    <div class="main">
-        <div id="echarts" ref="main"></div>
-      </div>
+        <div id="echarts" ref="main">
+        </div>
 </template>
 
 <script>
@@ -25,7 +24,32 @@
           }
         },
         legend: {
-          data: ['姘哀鍖栫墿', '浜屾哀鍖栫~', '鐑熷皹', '搴熸皵娴侀噺']
+          x: '200px',
+          y: '30px',
+          data: [{
+            name: '姘哀鍖栫墿',
+            textStyle: {
+              color: '#00d0f9'
+            }
+          },
+          {
+            name: '浜屾哀鍖栫~',
+            textStyle: {
+              color: '#00d0f9'
+            }
+          },
+          {
+            name: '鐑熷皹',
+            textStyle: {
+              color: '#00d0f9'
+            }
+          },
+          {
+            name: '搴熸皵娴侀噺',
+            textStyle: {
+              color: '#00d0f9'
+            }
+          }]
           // pageTextStyle: {
           //   color: '#fff'
           // }
@@ -34,7 +58,7 @@
           left: '3%',
           right: '1%',
           bottom: '3%',
-          top: '10%',
+          // top: '1%',
           containLabel: true
         },
         toolbox: {
@@ -92,6 +116,7 @@
         // Y 杞寸殑璁剧疆
         yAxis: [{
           type: 'value',
+          // position: 'left', // 澶� Y 杞翠娇鐢�
           // name: yname, // 鍚庢湡鍥炬爣Y杞存樉绀哄崟浣�
           name: '娴撳害(mg/m鲁)',
           axisLabel: {
@@ -150,15 +175,14 @@
 </script>
 
 <style scoped lang="less">
-    .main{
-        background: rgba(255, 255, 255, 0.1);
-    }
     #echarts{
-        width: 600px;
-        //height: 260px;
-        height: 100%;
+        width: 670px;
+        height: 260px;
         position: relative;
         margin: 0;
         padding: 0;
+        /*background-color: rgba(0, 0, 0, 0.6);*/
+            border: 1px solid #396d83;
+            margin: 10px 10px 10px 10px;
     }
 </style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue b/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue
index cb65c0c..44f8842 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/GasTabs.vue
@@ -1,25 +1,82 @@
 <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>
-<!--  <EchartsTab></EchartsTab>-->
-<!--  <GasECharts></GasECharts>>-->
-</div>
+    <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>
+        <el-tabs type="card" v-model="activeName">
+            <el-tab-pane label="瀹炶瘯鏁版嵁" name="first">
+                <EchartsTab></EchartsTab>
+                <GasECharts></GasECharts>
+            </el-tab-pane>
+            <el-tab-pane label="鏃ユ暟鎹�" name="second"><EchartsTab></EchartsTab><GasECharts></GasECharts></el-tab-pane>
+            <el-tab-pane label="鏈堟暟鎹�" name="third"><EchartsTab></EchartsTab><GasECharts></GasECharts></el-tab-pane>
+            <el-tab-pane label="浜哄伐鏁版嵁" name="fourth"><EchartsTab></EchartsTab><GasECharts></GasECharts></el-tab-pane>
+        </el-tabs>
+    </div>
 </template>
 
 <script>
-// import GasECharts from '@components/BaseNav/PublicBounced/GasComponents/GasECharts'
+import GasECharts from './GasECharts'
+import EchartsTab from './EchartsTab'
+
 export default {
   name: 'GasTabs',
-  components: {}
-  // GasECharts
+  components: {
+    GasECharts,
+    EchartsTab
+  },
+  data () {
+    return {
+      activeName: 'first'
+    }
+  },
+  methods: {
+    handleClick (tab, event) {
+      console.log(tab, event)
+    }
+  }
 }
+
 </script>
 
 <style scoped>
-
+    .win {
+        position: relative;
+        margin-bottom: 13px;
+        background-color: rgba(33, 41, 69,0.9);
+        border: 0.8px solid #396d83;
+    }
+    .border_corner{
+        z-index: 999;
+        position: absolute;
+        width: 10px;
+        height: 10px;
+        background: rgba(0,0,0,0);
+        border: 1.5px 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_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 e0df2bb..c766b58 100644
--- a/src/components/BaseNav/PublicBounced/PublicBounced.vue
+++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue
@@ -7,6 +7,7 @@
     <div class="public-bounced-content">
       <div class="public-bounced-content-left">
         <GasTab :displayContent="displayContent"></GasTab>
+        <GasTabs></GasTabs>
         <div class="public-bounced-content-left-bottom">
           <PublicTable v-if="value === 'gufei'" :requestSolidWasteData="displayContent.StoragePlaceId"></PublicTable>
           <GasECharts v-else></GasECharts>
@@ -26,14 +27,17 @@
 import PublicTable from '@components/BaseNav/PublicBounced/GasComponents/PublicTable'
 import GasECharts from '@components/BaseNav/PublicBounced/GasComponents/GasECharts'
 import GasVideo from '@components/BaseNav/PublicBounced/GasComponents/GasVideo'
-// import GasTabs from './GasComponents/GasTabs'
+import GasTabs from './GasComponents/GasTabs'
 
 export default {
   name: 'PublicBounced',
   components: {
+    GasTabs,
     GasTab,
     PublicTable,
     GasECharts,
+    // PublicTable,
+    // GasECharts,
     GasVideo
   },
   data () {

--
Gitblit v1.8.0