From 82495c96ce9eee59d54ccdb4acbf38d9b129e5cd Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期二, 13 四月 2021 16:01:24 +0800
Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop

---
 src/components/panel/RightSearchPanel.vue                                       |  483 +++++++++-------
 src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue           |   82 ++
 src/assets/css/map/map-panel-style.less                                         |  251 ++++++--
 src/components/table/components/IndexStatistics.vue                             |  207 +-----
 src/components/LayerController/service/LayerFactory.js                          |   39 
 src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue                |   48 +
 src/views/popup/Dialog.vue                                                      |    1 
 src/components/BaseNav/PublicBounced/PublicBounced.vue                          |    3 
 src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue   |  105 +++
 src/components/table/components/SolidWaste.vue                                  |   75 --
 src/components/table/summarySheets.vue                                          |    6 
 src/components/table/components/AirQuality.vue                                  |   62 -
 src/components/table/components/tabHandover.vue                                 |    2 
 src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Flow.vue           |   75 ++
 src/styles/theme-dark/el-ui/tabs.less                                           |    7 
 src/components/table/components/WasteWater.vue                                  |   26 
 package.json                                                                    |    2 
 src/components/panel/topicSearch/SewersSelect/AnalysisChoose/CrossSectional.vue |   66 ++
 src/components/panel/topicSearch/SewersSearch.vue                               |  145 ++--
 src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue               |    2 
 src/components/LayerController/logic/SolidWaste.js                              |    4 
 21 files changed, 1,020 insertions(+), 671 deletions(-)

diff --git a/package.json b/package.json
index aa3ea33..10c11c1 100644
--- a/package.json
+++ b/package.json
@@ -13,7 +13,7 @@
   },
   "dependencies": {
     "@jiaminghi/data-view": "^2.10.0",
-    "axios": "^0.18.0",
+    "axios": "^0.21.1",
     "babel-polyfill": "^6.26.0",
     "core-js": "^3.6.5",
     "dayjs": "^1.10.4",
diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less
index 2f70562..e556ee1 100644
--- a/src/assets/css/map/map-panel-style.less
+++ b/src/assets/css/map/map-panel-style.less
@@ -1,9 +1,11 @@
 @import "_map-variable";
+
 .leaflet-container,
-html,body{
- // font-family: 'Microsoft YaHei';
+html, body {
+  // font-family: 'Microsoft YaHei';
   font: 12px/1.5 "Microsoft YaHei", Arial, Helvetica, sans-serif;
 }
+
 /*鍏ㄥ眬璁剧疆***********/
 h1, h2, h3, h4, h5, h6, ul, li, p {
   padding: 0;
@@ -11,7 +13,9 @@
   list-style: none;
 }
 
-i{font-style: normal}
+i {
+  font-style: normal
+}
 
 .el-button--primary {
   color: @color;
@@ -111,6 +115,7 @@
 
   thead.is-group th {
     background: transparent;
+    padding:0
   }
 
   .el-table__expanded-cell {
@@ -214,60 +219,75 @@
   margin-left: 10px;
 }
 
-.el-scrollbar__wrap{
+.el-scrollbar__wrap {
 
 }
+
 .el-scrollbar__wrap::-webkit-scrollbar {
   /*婊氬姩鏉℃暣浣撴牱寮�*/
-  width : 5px;  /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/
+  width: 5px; /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉$殑灏哄*/
   height: 1px;
 }
+
 .el-scrollbar__wrap::-webkit-scrollbar-thumb {
   /*婊氬姩鏉¢噷闈㈠皬鏂瑰潡*/
-  border-radius   : 10px;
+  border-radius: 10px;
   background: none;
 }
+
 .el-scrollbar__wrap::-webkit-scrollbar-track {
   /*婊氬姩鏉¢噷闈㈣建閬�*/
-  box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);
-  background   : none;
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+  background: none;
   border-radius: 10px;
 }
+
 #el-scrollbar__wrap::-webkit-scrollbar-button { /*婊氬姩鏉′袱绔殑鎸夐挳锛屽彲浠ョ敤display:none璁╁叾涓嶆樉绀猴紝涔熷彲浠ユ坊鍔犺儗鏅浘鐗囷紝棰滆壊鏀瑰彉鏄剧ず鏁堟灉锛堜綅缃�2锛�*/
   background: #74D334;
 }
+
 /*******************鎿嶄綔鎸夐挳鐐瑰嚮閫変腑鏁翠綋鏍峰紡******************************/
-.el-button{
+.el-button {
 
 }
+
 .hover-bottom:hover,
-.active-button{
+.active-button {
   border: 0.00521rem solid #fff700 !important;
   box-shadow: 0 0 0.03rem #fff700 !important;
-  color:#fff700 !important;
+  color: #fff700 !important;
 }
 
 /***************Company 鍥惧眰 鎮诞妗嗘牱寮忋��*********************************/
-.company-bindTooltip{
+.company-bindTooltip {
   position: absolute;
-  top:0;
+  top: 0;
   left: 0;
   display: flex;
   justify-content: center;
   justify-items: center;
-  img{display: block;width: 30px;height: 30px;margin-left: -15px;margin-top: -15px}
-  ul{
+
+  img {
+    display: block;
+    width: 30px;
+    height: 30px;
+    margin-left: -15px;
+    margin-top: -15px
+  }
+
+  ul {
     width: 120px;
     margin-left: -60px;
     text-align: center;
     display: flex;
     position: absolute;
-    top:20px;
-    left:0;
-    li{
+    top: 20px;
+    left: 0;
+
+    li {
       position: absolute;
-      top:0;
-      left:0;
+      top: 0;
+      left: 0;
       width: 100%;
       font-weight: 900;
       text-shadow: 0 0 4px #fff;
@@ -279,6 +299,7 @@
     }
   }
 }
+
 /*.company-bindTooltip {
   //background: @background-color-split;
   background: none;
@@ -308,7 +329,7 @@
     }
   }
 }*/
-.company-bindTooltip:before{
+.company-bindTooltip:before {
   display: none;
 }
 
@@ -336,16 +357,19 @@
 
 /*************** PublicTable 琛ㄦ牸鏍峰紡銆�*********************************/
 
-.el-table{
-  border-bottom: 1px solid #fff;
+.el-table {
+  border: 1px solid #396d83 !important;
+
   .el-table__body-wrapper::-webkit-scrollbar {
     width: 0;
     height: 0;
     background: none;
   }
-  .cell{
+
+  .cell {
     padding: 0 3px !important;
-    i{
+
+    i {
       display: block;
       font-style: normal;
       font-size: 10px;
@@ -353,25 +377,34 @@
     }
   }
 }
-.el-table--border th{
+
+.el-table--border th {
   border-right: none;
   border-left: 1px solid #ddd;
 }
-.el-table--border th.gutter{border-left: none}
+
+.el-table--border th.gutter {
+  border-left: none
+}
 
 .el-table .cell, .el-table--border td:first-child .cell, .el-table--border th:first-child .cell {
 
   text-align: center;
 }
-.el-table th>.cell {
+
+.el-table th > .cell {
+  border: 1px #396d83 solid;
   color: #00fff6;
 }
-.el-table__row>td{
+
+.el-table__row > td {
   border: none;
 }
-.el-table::before {//鍘绘帀鏈�涓嬮潰鐨勯偅涓�鏉$嚎
+
+.el-table::before { //鍘绘帀鏈�涓嬮潰鐨勯偅涓�鏉$嚎
   height: 0;
 }
+
 .el-table td, .el-table th.is-leaf {
   font-size: 0.08rem;
 }
@@ -383,21 +416,24 @@
 .el-table .success-row {
   background: #30455f;
 }
-.el-table tbody tr:hover>td {
-  background-color:#28304d !important;
+
+.el-table tbody tr:hover > td {
+  background-color: #28304d !important;
 }
+
 //淇敼琛ㄦ牸楂樺害
 .el-table td {
-  padding: 0!important;
+  padding: 0 !important;
   font-size: 0.01rem !important;
 }
 
 /***********************************************鍔ㄧ敾鏁堟灉************/
-.transition{
+.transition {
   transition: all .5s;
- /* transform-origin: top left;*/
+  /* transform-origin: top left;*/
   animation: bounce-in .2s;
 }
+
 @keyframes bounce-in {
   0% {
     transform: scale(0);
@@ -408,9 +444,10 @@
     opacity: 1;
   }
 }
+
 /**map 椤甸潰鍥炬爣鎸夐挳*/
 .iconBtn {
-  width:0.26rem;
+  width: 0.26rem;
   height: 0.26rem;
   text-align: center;
   background: rgba(0, 16, 30, 0.5);
@@ -423,14 +460,16 @@
   justify-content: center;
   justify-items: center;
   border-radius: 0.03rem;
-  .icon{
+
+  .icon {
     width: 20px;
     margin: 0 auto;
     font-size: 20px;
   }
 
 }
-.panel-title{
+
+.panel-title {
   color: @color-title;
   font-size: 18px;
   padding: 10px;
@@ -442,61 +481,123 @@
 
 }
 
-.el-picker-panel{
+.el-picker-panel {
   background: @background-color;
-  border-color:@color;
-  color:@color;
-  .el-picker-panel__body-wrapper{
+  border-color: @color;
+  color: @color;
+
+  .el-picker-panel__body-wrapper {
     background: @background-color;
   }
-  .el-input__inner{
-    background:@background-color;
-    border-color:@color;
-  }
-  .el-date-table td.today span{
-    color:@color-highlight;
-  }
-  .el-picker-panel__footer{
+
+  .el-input__inner {
     background: @background-color;
-    border-top-color:@color;
+    border-color: @color;
   }
-  .el-date-table th{
-    border-bottom-color:@color;
+
+  .el-date-table td.today span {
+    color: @color-highlight;
   }
-  .el-button{
+
+  .el-picker-panel__footer {
     background: @background-color;
-    color:@color;
-    border-color:@color;
+    border-top-color: @color;
   }
-  .el-button--text{
+
+  .el-date-table th {
+    border-bottom-color: @color;
+  }
+
+  .el-button {
+    background: @background-color;
+    color: @color;
+    border-color: @color;
+  }
+
+  .el-button--text {
     padding: 7px 15px;
   }
-  .el-button:hover{
+
+  .el-button:hover {
     background: @background-color;
-    color:@color-highlight;
-    border-color:@color-highlight;
+    color: @color-highlight;
+    border-color: @color-highlight;
   }
-  .el-input__inner{
-    color:#fff;
+
+  .el-input__inner {
+    color: #fff;
     text-align: center;
   }
-  .el-date-picker__time-header{
-    border-bottom-color:@background-color-split;
+
+  .el-date-picker__time-header {
+    border-bottom-color: @background-color-split;
   }
-  .el-date-picker__header-label{color:#fff}
+
+  .el-date-picker__header-label {
+    color: #fff
+  }
 }
-.el-select-dropdown{
+
+.el-select-dropdown {
   background: @background-color;
-  border-color:@color;
-  color:@color;
-  .el-select-dropdown__item{
-    color:#fff;
+  border-color: @color;
+  color: @color;
+
+  .el-select-dropdown__item {
+    color: #fff;
   }
-  .el-select-dropdown__item.hover{
+
+  .el-select-dropdown__item.hover {
     background: @background-color;
-    box-shadow:  0 0 5px @color-highlight inset;
+    box-shadow: 0 0 5px @color-highlight inset;
   }
-  .el-select-dropdown__item.selected{
-    color:@color-highlight;
+
+  .el-select-dropdown__item.selected {
+    color: @color-highlight;
   }
-  }
\ No newline at end of file
+}
+
+/***********************************************鍙充晶绠$嚎鐩稿叧************/
+.el-tabs__header {
+  background: none;
+}
+
+.el-tabs--top .el-tabs__item.is-top:nth-child(2) {
+  padding-left: 20px;
+}
+.el-tabs--border-card {
+  background: none;
+  border: none;
+  box-shadow: none;
+}
+.el-tabs--border-card>.el-tabs__header {
+  background: none;
+  border-bottom: none;
+  margin: 0;
+}
+.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active {
+  color: #409EFF;
+  background: none;
+  border: none;
+}
+.el-tabs--border-card>.el-tabs__header .el-tabs__item {
+  border: none;
+}
+.panel-right ::-webkit-scrollbar-thumb {
+  background: none;
+  border: none;
+}
+.el-card {
+  margin-top: 15px;
+  background: rgba(0, 16, 30, 0.5);
+  border: 0.00521rem solid @color;
+  box-shadow: 0 0 0.03rem @color;
+}
+.clearfix {
+  display: inline-block;
+  color: #ffffff;
+  margin: 15px 0;
+}
+.fixed-table {
+  background: rgba(0, 16, 30, 1);
+}
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue
index 967de8a..713354f 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue
@@ -58,7 +58,7 @@
   methods: {
     processingData () {
       for (var i = 0; i < this.displayContentTab.length; i++) {
-        console.log(this.displayContentTab[i])
+        // console.log(this.displayContentTab[i])
         this.tabData = this.displayContentTab[i]
       }
     }
diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue
index abfd8a6..d635356 100644
--- a/src/components/BaseNav/PublicBounced/PublicBounced.vue
+++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="public-bounced map-background" v-drag v-if="flag">
+  <div class="public-bounced map-background" v-drag v-show="flag">
     <div class="public-bounced-title panel-title" ref="publicBounced">
       <span>{{ displayContentTitle }}</span>
       <i class="el-icon-circle-close" @click="closePopup"></i>
@@ -39,7 +39,6 @@
 export default {
   name: 'PublicBounced',
   components: {
-    // Echarts,
     PublicTabs,
     PublicTable,
     PublicChart,
diff --git a/src/components/LayerController/logic/SolidWaste.js b/src/components/LayerController/logic/SolidWaste.js
index 8f9e12b..29f074a 100644
--- a/src/components/LayerController/logic/SolidWaste.js
+++ b/src/components/LayerController/logic/SolidWaste.js
@@ -82,9 +82,9 @@
 
     // 缁戝畾寮规瀹炰緥
     const PublicBounced = window.Vue.extend(publicBounced)
-    const instance = new PublicBounced()
-    instance.$mount()
+    const instance = new PublicBounced().$mount()
     document.body.appendChild(instance.$el)
+    // document.body.removeChild(instance.$el)
     // 閫氳繃鏂规硶 鍚戠粦瀹氬脊妗嗕紶閫掓暟鎹�
     instance.setData(resultBasic.Result.DataInfo, resultDetailed.Result.DataInfo, 'gufei')
     /* flyTo()寮瑰嚭妗嗗钩绉讳簨浠� */
diff --git a/src/components/LayerController/service/LayerFactory.js b/src/components/LayerController/service/LayerFactory.js
index 65f89e6..fef724f 100644
--- a/src/components/LayerController/service/LayerFactory.js
+++ b/src/components/LayerController/service/LayerFactory.js
@@ -21,6 +21,7 @@
 
         var checked = config.checked
         checked && this.load(config)
+        checked && this.toggleZoomByConfnig(config)
       }
     }
   }
@@ -30,27 +31,33 @@
    * @param layerConfig
    */
   initEvent (layerConfig) {
-    this.map.on('zoomend ', (e) => this.toggleByZoom(layerConfig))
+    this.map.on('zoomend ', (e) => this.toggleZoomByLayer(layerConfig))
   }
 
-  toggleByZoom (layerConfig) {
-    const zoom = this.map.getZoom()
-    if (layerConfig) {
+  toggleZoomByLayer (layerConfig) {
+    var config = layerConfig
+    if (Array.isArray(layerConfig)) {
       for (var i = 0, l = layerConfig.length; i < l; i++) {
-        var config = layerConfig[i]
+        config = layerConfig[i]
         var layers = config.layers
-        var checked = config.checked
         var childLayer = config.childLayer
-        layers && this.toggleByZoom(layers)
-        childLayer && this.toggleByZoom(childLayer)
-        if (checked && config.minZoom) {
-          if (zoom > config.minZoom) {
-            this.show(config)
-          } else {
-            console.log(config.name)
-            this.hide(config)
-          }
-        }
+        layers && this.toggleZoomByLayer(layers)
+        childLayer && this.toggleZoomByLayer(childLayer)
+        this.toggleZoomByConfnig(config)
+      }
+    } else {
+      this.toggleZoomByConfnig(layerConfig)
+    }
+  }
+
+  toggleZoomByConfnig (config) {
+    const zoom = this.map.getZoom()
+    var checked = config.checked
+    if (checked && config.minZoom) {
+      if (zoom > config.minZoom) {
+        this.show(config)
+      } else {
+        this.hide(config)
       }
     }
   }
diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue
index 11b4c9b..9195d47 100644
--- a/src/components/panel/RightSearchPanel.vue
+++ b/src/components/panel/RightSearchPanel.vue
@@ -1,47 +1,49 @@
 <template>
   <div class="panel-right" v-show="isShow">
-      <transition name="searchPanelChange">
-          <div style=" display: inline-flex;">
-              <div class="panel-tab">
-                  <div class="container">
-                      <!--  <ul>
-                          <li style="text-align: right">
-                              <div @click="setSearchPanelChange" type="button" class="el-button special-button el-button--default">
-                                  <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i>
-                                  <i class=" el-icon-d-arrow-left" v-else ></i>
-                              </div>
-                          </li>
-                      </ul> -->
-                      <ul  v-for="item in topicList" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" v-show="item.isShow" >
-                          <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left">
-                              <li>
-                                  <img src="../../assets/images/map-pages/icon/sl.png" class="icon">
-                              </li>
-                          </el-tooltip>
-                      </ul>
-                  </div>
-              </div>
-              <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] "  >
-                  <div class="panel-fold-btn" @click="toggleMonitorPanel">
-                      <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div>
-                  </div>
-                  <div :class="'search-container map-background'" v-show="selectGroup" >
-                      <div @click="setSearchPanelChange" class="el-button special-button el-button--default ">
-                          <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i>
-                          <i class=" el-icon-d-arrow-left" v-else ></i>
-                      </div>
-                      <div class="el-message-box__content" style="padding:0;font-size: 13px;">
-                          <component :title="title" :is="gcComp"></component>
-                      </div>
-                  </div>
-              </div>
+    <transition name="searchPanelChange">
+      <div style=" display: inline-flex;">
+        <div class="panel-tab">
+          <div class="container">
+            <!--  <ul>
+                <li style="text-align: right">
+                    <div @click="setSearchPanelChange" type="button" class="el-button special-button el-button--default">
+                        <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i>
+                        <i class=" el-icon-d-arrow-left" v-else ></i>
+                    </div>
+                </li>
+            </ul> -->
+            <ul v-for="item in topicList" :key="item.name"
+                :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'"
+                @click="()=>{selected(item)}" v-show="item.isShow">
+              <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left">
+                <li>
+                  <img src="../../assets/images/map-pages/icon/sl.png" class="icon">
+                </li>
+              </el-tooltip>
+            </ul>
           </div>
-       </transition>
-      <!-- <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鎼滅储" placement="left" v-show="!selectGroup">
-          <div :class="selectGroup === true ?'active-button':''" class="iconBtn"   @click="setSearchPanelChange" style="position: absolute;top:0;right: 0" >
-             <i class="el-icon-search icon"></i>
+        </div>
+        <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] ">
+          <div class="panel-fold-btn" @click="toggleMonitorPanel">
+            <div :class="[isCollapse? 'btn-stretch':'btn-shrink']"></div>
           </div>
-      </el-tooltip> -->
+          <div :class="'search-container map-background'" v-show="selectGroup">
+            <div @click="setSearchPanelChange" class="el-button special-button el-button--default ">
+              <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i>
+              <i class=" el-icon-d-arrow-left" v-else></i>
+            </div>
+            <div class="el-message-box__content" style="padding:0;font-size: 13px;">
+              <component :title="title" :is="gcComp"></component>
+            </div>
+          </div>
+        </div>
+      </div>
+    </transition>
+    <!-- <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鎼滅储" placement="left" v-show="!selectGroup">
+        <div :class="selectGroup === true ?'active-button':''" class="iconBtn"   @click="setSearchPanelChange" style="position: absolute;top:0;right: 0" >
+           <i class="el-icon-search icon"></i>
+        </div>
+    </el-tooltip> -->
   </div>
 </template>
 
@@ -56,9 +58,16 @@
 import SewersSearch from '@components/panel/topicSearch/SewersSearch'
 import SoilGroundWaterSearch from '@components/panel/topicSearch/SoilGroundWaterSearch.vue'
 import bus from '@/eventBus'
+
 export default {
   name: 'MonitorPanel',
-  components: { GasWasteSearch, WaterWasteSearch, SolidWasteSearch, EnvRiskSearch, DischargeSearch },
+  components: {
+    GasWasteSearch,
+    WaterWasteSearch,
+    SolidWasteSearch,
+    EnvRiskSearch,
+    DischargeSearch
+  },
   data () {
     return {
       isShow: true,
@@ -153,33 +162,33 @@
       // const right = rightControl.css('right')
       // const rightit = rightControl.ownerDocument.defaultView
       // const right = rightit.getComputedStyle(rightit, null).right
-    //   if (right === '10px') {
-    //     rightControl.animate({
-    //       right: '-322px'
-    //     })
-    //     el.css({
-    //       transform: 'rotateY(180deg)',
-    //       'transform-origin': '50% 50%',
-    //       transition: 'transform 1s linear'
-    //     })
-    //     el2.animate({
-    //       right: '320px',
-    //       speed: 1000
-    //     })
-    //   } else {
-    //     rightControl.animate({
-    //       right: '10px'
-    //     })
-    //     el.css({
-    //       transform: 'rotateY(0deg)',
-    //       'transform-origin': '50% 50%',
-    //       transition: 'transform 1s linear'
-    //     })
-    //     el2.animate({
-    //       right: '290px',
-    //       speed: 1000
-    //     })
-    //   }
+      //   if (right === '10px') {
+      //     rightControl.animate({
+      //       right: '-322px'
+      //     })
+      //     el.css({
+      //       transform: 'rotateY(180deg)',
+      //       'transform-origin': '50% 50%',
+      //       transition: 'transform 1s linear'
+      //     })
+      //     el2.animate({
+      //       right: '320px',
+      //       speed: 1000
+      //     })
+      //   } else {
+      //     rightControl.animate({
+      //       right: '10px'
+      //     })
+      //     el.css({
+      //       transform: 'rotateY(0deg)',
+      //       'transform-origin': '50% 50%',
+      //       transition: 'transform 1s linear'
+      //     })
+      //     el2.animate({
+      //       right: '290px',
+      //       speed: 1000
+      //     })
+      //   }
     },
     defaultLastOne () {
       let v = {}
@@ -211,28 +220,32 @@
 </script>
 
 <style lang="less">
-    .searchPanelChange-enter-active {
-        transform-origin: top right;
-        animation: bounce-in .2s;
-    }
-    .searchPanelChange-leave-active {
-        transform-origin: top right;
-        animation: bounce-in .2s reverse;
-    }
-.search-container {
-    position: relative;
-    width: 1.79167rem;
-  /*  height: 5.6475rem;*/
-    overflow: hidden;
+.searchPanelChange-enter-active {
+  transform-origin: top right;
+  animation: bounce-in .2s;
 }
-.module-wrap{
+
+.searchPanelChange-leave-active {
+  transform-origin: top right;
+  animation: bounce-in .2s reverse;
+}
+
+.search-container {
+  position: relative;
+  //width: 1.79167rem;
+  width: 2.79167rem;
+  /*  height: 5.6475rem;*/
+  overflow: hidden;
+}
+
+.module-wrap {
   width: 0.15rem;
   height: 0.15rem;
   padding: .04167rem;
   //padding: .00521rem;
-  background: rgba(0,16,30,.5);
+  background: rgba(0, 16, 30, .5);
   border-radius: .03125rem;
-  border: .00521rem solid rgba(255,247,0,.5);
+  border: .00521rem solid rgba(255, 247, 0, .5);
   margin: .04167rem 0;
   font-size: .08333rem;
   -webkit-transition: all .2s linear;
@@ -240,16 +253,19 @@
   cursor: pointer;
   position: relative;
   line-height: 0.15rem;
-  li{
+
+  li {
     margin: 0.00521rem 0;
     text-align: center;
-    img{
+
+    img {
       width: 0.1rem;
       height: 0.1rem;
 
     }
   }
 }
+
 .panel-right {
   display: inline-flex;
   //width: 322px;
@@ -285,28 +301,30 @@
   //  background-color: #061e51 !important;
   //  border: solid 1px #0e639e !important;
   //}
-    .el-button--default.special-button {
-        padding: 0;
-        background:@background-color4;
-        color:@color-tool;
-        position: absolute;
-        top:24px;
-        right:0.02rem;
-        border:none;//1px solid @color-tool;
-        width: 0.2rem;
-        height: 0.2rem;
-        text-align: center;
-        line-height: 0.2rem;
-        margin-top: -0.1rem;
-        border-radius: 50%;
-        z-index: 999;
-    }
-    .el-button--default.special-button:hover{
-        background:@background-color;
-        border:1px solid @color;
-        box-shadow: 0 0 2px @color;
-        color:@color;
-    }
+  .el-button--default.special-button {
+    padding: 0;
+    background: @background-color4;
+    color: @color-tool;
+    position: absolute;
+    top: 24px;
+    right: 0.02rem;
+    border: none; //1px solid @color-tool;
+    width: 0.2rem;
+    height: 0.2rem;
+    text-align: center;
+    line-height: 0.2rem;
+    margin-top: -0.1rem;
+    border-radius: 50%;
+    z-index: 999;
+  }
+
+  .el-button--default.special-button:hover {
+    background: @background-color;
+    border: 1px solid @color;
+    box-shadow: 0 0 2px @color;
+    color: @color;
+  }
+
   .el-form-item__label {
     color: rgb(52, 224, 255);
     color: @color;
@@ -400,18 +418,20 @@
     text-overflow: ellipsis;
     white-space: nowrap;
   }
-  .panel-fold-btn{
+
+  .panel-fold-btn {
     overflow: hidden;
     position: absolute;
-    top:45%;
+    top: 45%;
     left: -18px;
     /*left: 0px;*/
     //right: 320px;
     /*right: 290px;*/
     z-index: 1000;
     /*right: 0px;*/
-    background-color: rgba(5,24,66,.8);
+    background-color: rgba(5, 24, 66, .8);
     border-radius: 10px 0 0 10px;
+
     .btn-stretch {
       //width: 20px;
       //height: 40px;
@@ -421,8 +441,9 @@
       transform: rotateY(0deg);
       transform-origin: 50% 50%;
       transition: transform 1s linear;
-        /*transition: 3s linear;*/
+      /*transition: 3s linear;*/
     }
+
     .btn-shrink {
       width: 20px;
       height: 40px;
@@ -442,14 +463,17 @@
     font-size: 12px;
     background-color: #0B3B6D;
   }
-  .tab-item:hover{
+
+  .tab-item:hover {
     cursor: pointer;
   }
+
   .panel-tab {
     position: relative;
     z-index: 500;
     margin-right: .025rem;
-    .container{
+
+    .container {
       max-height: 3.125rem;
       overflow: hidden;
       position: relative;
@@ -469,10 +493,12 @@
     //background: url('../../assets/images/map-pages/icon/bgc.png') no-repeat;
     //background-size: 100% 98%;
   }
-  .a{
+
+  .a {
     transform: translateX(328px);
     transition: transform 3s linear;
-    }
+  }
+
   .panel_searchTotal {
     font-size: 12px;
     float: right;
@@ -504,71 +530,90 @@
     display: grid;
     font-size: 18px;
   }
-    /*input 鐐瑰嚮鎼滅储鏍峰紡*/
-    .rightButtonSearch{
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        .el-input{margin-right: 10px}
-        .el-icon-search{
-            width: 40px;
-            border:1px solid @color;
-            height: 28px;
-            line-height: 28px;
-            text-align: center;
-            color:#fff;
-            border-radius: 2px;
-            cursor:pointer;
-            background: rgba(0,16,30,.5);
-            padding:0;
-        }
-    }
-    /*鍗曢�夋寜閽牱寮�*/
-    .levelOfRisk{padding-left:20px}
-    .levelOfRisk .el-radio{padding-bottom:6px}
 
-    .levelOfRisk-type{
-        display: inline-block;
-        position: relative;
-        padding-right: 5px;
-        color:@color-shadow;
-        i{
-            display: block;
-            width: 15px;
-            height: 10px;
-            position: absolute;
-            top:50%;
-            right: -15px;
-            margin-top: -5px;
-        }
-    }
-    .el-radio.is-checked .levelOfRisk-type{color:#409EFF}
+  /*input 鐐瑰嚮鎼滅储鏍峰紡*/
 
-    .environmental-risk-list{
-        position: relative;
-        cursor: pointer;
-        padding-left:50px;
-        padding-top:5px;
-        padding-bottom:5px;
-        color: @color-shadow;
-        border-bottom:1px solid @background-color-split;
-        .state{
-            width: 30px;
-            height: 30px;
-            position: absolute;
-            top:50%;
-            left:10px;
-            margin-top: -15px;
-            border-radius: 50%;
-            box-shadow: 0 0 3px #000;
-            background: #0B3B6D;
-        }
+  .rightButtonSearch {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .el-input {
+      margin-right: 10px
     }
-    .environmental-risk-list.hover,
-    .environmental-risk-list:hover{
-        color:@color-over;
-        background: @background-color;
+
+    .el-icon-search {
+      width: 40px;
+      border: 1px solid @color;
+      height: 28px;
+      line-height: 28px;
+      text-align: center;
+      color: #fff;
+      border-radius: 2px;
+      cursor: pointer;
+      background: rgba(0, 16, 30, .5);
+      padding: 0;
     }
+  }
+
+  /*鍗曢�夋寜閽牱寮�*/
+
+  .levelOfRisk {
+    padding-left: 20px
+  }
+
+  .levelOfRisk .el-radio {
+    padding-bottom: 6px
+  }
+
+  .levelOfRisk-type {
+    display: inline-block;
+    position: relative;
+    padding-right: 5px;
+    color: @color-shadow;
+
+    i {
+      display: block;
+      width: 15px;
+      height: 10px;
+      position: absolute;
+      top: 50%;
+      right: -15px;
+      margin-top: -5px;
+    }
+  }
+
+  .el-radio.is-checked .levelOfRisk-type {
+    color: #409EFF
+  }
+
+  .environmental-risk-list {
+    position: relative;
+    cursor: pointer;
+    padding-left: 50px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    color: @color-shadow;
+    border-bottom: 1px solid @background-color-split;
+
+    .state {
+      width: 30px;
+      height: 30px;
+      position: absolute;
+      top: 50%;
+      left: 10px;
+      margin-top: -15px;
+      border-radius: 50%;
+      box-shadow: 0 0 3px #000;
+      background: #0B3B6D;
+    }
+  }
+
+  .environmental-risk-list.hover,
+  .environmental-risk-list:hover {
+    color: @color-over;
+    background: @background-color;
+  }
 
   input::-webkit-input-placeholder {
     color: #569ee1;
@@ -695,7 +740,7 @@
 
   ::-webkit-scrollbar-track {
     /*婊氬姩鏉¢噷闈㈣建閬�*/
-    box-shadow   : inset 0 0 5px rgba(0, 0, 0, 0.2);
+    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
     border-radius: 0px;
     background: #0E3565;
   }
@@ -724,48 +769,66 @@
       background-color: #061e51 !important;
     }
   }
+
   .unfold {
     transform: translateX(332px);
     transition: transform 0.5s linear;
   }
+
   .shrink {
     transform: translateX(0px);
     transition: transform 0.5s linear;
   }
-    /******************浠ヤ笅鍏叡閮ㄥ垎**********/
-    .sewers-search{
-        position: relative;
-        overflow: hidden;
-        .panel-title{}
-        .search-panel{
-            background-color: transparent;
-            padding: 10px;
-            border-bottom: 1px solid @background-color-split;
-            // .el-input{width:calc(100% - 40px);position: relative}
-            /deep/ input {
-                border-radius: 0;
-                background-color: @background-color-split ;
-                border: solid 1px @color ;
-                color: @color-gray;
-                font-size: 0.01rem;
-                padding:0 15px;
-                .el-select .el-input.is-focus .el-input__inner{
-                    border-color: @color;
-                }
-            }
-            .el-input__inner{background: none;color:#fff;font-size: 14px;border-radius: 0; border-color: @color;background: rgba(0,16,30,.5);}
-        }
-        .search-btn{
 
-        }
-        //location-btn{
-        //
-        //}
-        .location-btn:hover,.el-input__icon:hover{
-            color: @color;
-            cursor: pointer;
-        }
+  /******************浠ヤ笅鍏叡閮ㄥ垎**********/
+
+  .sewers-search {
+    position: relative;
+    overflow: hidden;
+
+    .panel-title {
     }
+
+    .search-panel {
+      background-color: transparent;
+      padding: 10px;
+      border-bottom: 1px solid @background-color-split;
+      // .el-input{width:calc(100% - 40px);position: relative}
+      /deep/ input {
+        border-radius: 0;
+        background-color: @background-color-split;
+        border: solid 1px @color;
+        color: @color-gray;
+        font-size: 0.01rem;
+        padding: 0 15px;
+
+        .el-select .el-input.is-focus .el-input__inner {
+          border-color: @color;
+        }
+      }
+
+      .el-input__inner {
+        background: none;
+        color: #fff;
+        font-size: 14px;
+        border-radius: 0;
+        border-color: @color;
+        background: rgba(0, 16, 30, .5);
+      }
+    }
+
+    .search-btn {
+
+    }
+
+    //location-btn{
+    //
+    //}
+    .location-btn:hover, .el-input__icon:hover {
+      color: @color;
+      cursor: pointer;
+    }
+  }
 }
 
 </style>
diff --git a/src/components/panel/topicSearch/SewersSearch.vue b/src/components/panel/topicSearch/SewersSearch.vue
index faf0832..4e7cb11 100644
--- a/src/components/panel/topicSearch/SewersSearch.vue
+++ b/src/components/panel/topicSearch/SewersSearch.vue
@@ -1,75 +1,71 @@
 <template>
-        <div class="sewers-search" v-if="gdVisible">
-          <div class="panel-title">{{title}}</div>
-          <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%"  v-model="form.pipelineType" @change="handlePipelineType"  :popper-class="'select-down'">
-                  <el-option
-                      v-for="item in pipelineTypeOptions"
-                      :key="item.value"
-                      :label="item.label"
-                      :value="item.value">
-                  </el-option>
-                </el-select>
-              </el-form-item>
-              <el-form-item :label="form.pipelineType+'锛�'" size="mini">
-                <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"
-                      :label="item.label"
-                      :value="item.value">
-                  </el-option>
-                </el-select>
-              </el-form-item>
-              <!--              <el-form-item >-->
-              <div class="rightButtonSearch">
-                <el-input  v-model="form.keyword" size="mini"  placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
-                  <!-- <el-button slot="append" icon="el-icon-search" size="mini"></el-button>-->
-                  <!-- <i slot="prefix" class="el-input__icon el-icon-search"></i>-->
-                  <!-- <i slot="suffix" class="search-btn el-input__icon el-icon-search" @click="handleSearch"></i> -->
-                </el-input>
-                <el-button class="el-icon-search" @click="handleSearch"></el-button>
-              </div>
-              <!--              </el-form-item>-->
-              <!--              <el-form-item>-->
-              <!--                <input type="button" class="btn-ok" @click="handleSearch" value="鏌ヨ">-->
-              <!--                <input type="button" class="btn-reset" @click="handleSearch" value="閲嶇疆">-->
-              <!--              </el-form-item>-->
-            </el-form>
-          </div>
-          <el-scrollbar style="height:380.44px;" >
-            <div class="environmental-risk-list" v-for="(item,index) in list" :key="index" >
-              <!--  <i class="state"></i> -->
-              <div @click="handleLocation(item)">
-                <h3  class="B-TMD-table-list-title-y" :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]" >{{ item.properties.pipename }}</h3>
-                <p v-for="itm in labelList" :key="itm.label">
-                  <span>{{ itm.label }}锛�</span>
-                  <span :title="item.properties[itm.key] ">{{ item.properties[itm.key] }}</span>
-                </p>
-              </div>
+  <div class="sewers-search" v-if="gdVisible">
+    <div class="panel-title">{{ title }}</div>
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="鏌ヨ" name="first">
+        <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%" v-model="form.pipelineType" @change="handlePipelineType"
+                         :popper-class="'select-down'">
+                <el-option
+                    v-for="item in pipelineTypeOptions"
+                    :key="item.value"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item :label="form.pipelineType+'锛�'" size="mini">
+              <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"
+                    :label="item.label"
+                    :value="item.value">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <div class="rightButtonSearch">
+              <el-input v-model="form.keyword" size="mini" placeholder="鍦ㄦ杈撳叆鍏抽敭瀛楁悳绱�">
+              </el-input>
+              <el-button class="el-icon-search" @click="handleSearch"></el-button>
             </div>
-          </el-scrollbar>
-          <el-card class="footer-page" v-if="total > 10">
-            <el-pagination
-                small
-                @current-change="handlePage"
-                :page-size=pageSize
-                layout="prev, pager, next"
-                :total=total
-                :current-page=current
-                class="warnPagination"
-            >
-            </el-pagination>
-          </el-card>
+          </el-form>
         </div>
-      <!--        <div class="monitor2" v-if="hbVisible">-->
-      <!--          <env-protect-search></env-protect-search>-->
-      <!--        </div>-->
-      <!--        <div class="monitor2" v-if="pkVisible">-->
-      <!--          <discharge-search></discharge-search>-->
-      <!--        </div>-->
+        <el-scrollbar style="height:380.44px;">
+          <div class="environmental-risk-list" v-for="(item,index) in list" :key="index">
+            <div @click="handleLocation(item)">
+              <h3 class="B-TMD-table-list-title-y"
+                  :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]">
+                {{ item.properties.pipename }}</h3>
+              <p v-for="itm in labelList" :key="itm.label">
+                <span>{{ itm.label }}锛�</span>
+                <span :title="item.properties[itm.key] ">{{ item.properties[itm.key] }}</span>
+              </p>
+            </div>
+          </div>
+        </el-scrollbar>
+        <el-card class="footer-page" v-if="total > 10">
+          <el-pagination
+              small
+              @current-change="handlePage"
+              :page-size=pageSize
+              layout="prev, pager, next"
+              :total=total
+              :current-page=current
+              class="warnPagination"
+          >
+          </el-pagination>
+        </el-card>
+      </el-tab-pane>
+      <el-tab-pane label="鍒嗘瀽" name="second">
+        <SewersAnalysis></SewersAnalysis>
+      </el-tab-pane>
+      <el-tab-pane label="鍘嗗彶" name="third">鍘嗗彶</el-tab-pane>
+    </el-tabs>
+  </div>
 </template>
 
 <script>
@@ -77,10 +73,18 @@
 
 import WfsHelper from '@components/helpers/WfsHelper'
 import AjaxUtils from '@utils/AjaxUtils'
+
+// 寮曞叆鍒嗘瀽缁勪欢鍐呭
+import SewersAnalysis from '@components/panel/topicSearch/SewersSelect/SewersAnalysis'
+
 export default {
   name: 'SewersSearch',
+  components: {
+    SewersAnalysis
+  },
   data () {
     return {
+      activeName: 'first',
       gdVisible: true,
       list: [],
       labelList: PipelineTypeOptions[0].labelList,
@@ -104,6 +108,9 @@
   },
   props: ['title'],
   methods: {
+    handleClick (tab, event) {
+      console.log(tab, event)
+    },
     handlePipelineType (val) {
       this.pipelineTypeOptions.forEach((itm) => {
         if (val === itm.value) {
diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue
new file mode 100644
index 0000000..43788da
--- /dev/null
+++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity.vue
@@ -0,0 +1,105 @@
+<template>
+  <div class="connectivity">
+    <el-row>
+      <el-button type="primary" size="mini">璧峰绠℃</el-button>
+      <el-button type="primary" size="mini">缁撴潫绠℃</el-button>
+      <el-button type="primary" size="mini">杩為�氭�у垎鏋�</el-button>
+      <el-button type="primary" size="mini">娓呴櫎</el-button>
+    </el-row>
+    <el-card class="box-card">
+      <span class="clearfix">璧峰绠℃</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+      <span class="clearfix">缁撴潫绠℃</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+      <span class="clearfix">鍒嗘瀽缁撴灉</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Connectivity',
+  data () {
+    return {
+      tableData: []
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>
diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/CrossSectional.vue b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/CrossSectional.vue
new file mode 100644
index 0000000..f6c0928
--- /dev/null
+++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/CrossSectional.vue
@@ -0,0 +1,66 @@
+<template>
+  <div class="connectivity">
+    <el-row>
+      <el-button type="primary" size="mini">缁樺埗绾挎</el-button>
+      <el-button type="primary" size="mini">鎴柇闈㈠垎鏋�</el-button>
+      <el-button type="primary" size="mini">娓呴櫎</el-button>
+    </el-row>
+    <el-card class="box-card">
+      <span class="clearfix">绠$嚎鏌ヨ缁撴灉</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+      <span class="clearfix">鏂潰鍥�</span>
+      <div class="cross-section">
+        <span>鏆傛棤鏁版嵁</span>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'CrossSectional',
+  data () {
+    return {
+      tableData: []
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.cross-section {
+  background: rgba(0, 16, 30, 0.5);
+  border: 0.00521rem solid @color;
+  box-shadow: 0 0 0.03rem @color;
+  color: #ffffff;
+  width: 100%;
+  height: 50px;
+  border-radius: 3px;
+  text-align: center;
+  line-height: 50px;
+}
+</style>
diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Flow.vue b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Flow.vue
new file mode 100644
index 0000000..c221866
--- /dev/null
+++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Flow.vue
@@ -0,0 +1,75 @@
+<template>
+  <div class="connectivity">
+    <el-row>
+      <el-button type="primary" size="mini">閫夋嫨绠℃</el-button>
+    </el-row>
+    <el-card class="box-card">
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+      <span class="clearfix">鍒嗘瀽缁撴灉</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Flow',
+  data () {
+    return {
+      tableData: []
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>
diff --git a/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue
new file mode 100644
index 0000000..f973a19
--- /dev/null
+++ b/src/components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube.vue
@@ -0,0 +1,82 @@
+<template>
+  <div class="connectivity">
+    <el-row>
+      <span class="tube-span">鐖嗙(鐩稿叧寮�鍏�)</span>
+      <el-button type="primary" size="mini">閫夋嫨绠$嚎</el-button>
+      <el-button type="primary" size="mini">娓呴櫎</el-button>
+    </el-row>
+    <el-card class="box-card">
+      <span class="clearfix">鍙戠敓鐖嗚鐨勭娈�</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+      <span class="clearfix">闇�瑕佸叧闂殑闃�闂�</span>
+      <el-table
+          :data="tableData"
+          style="width: 100%">
+        <el-table-column
+            prop="date"
+            label="绠$嚎绫诲瀷">
+        </el-table-column>
+        <el-table-column
+            prop="name"
+            label="绠$嚎鍚嶇О">
+        </el-table-column>
+        <el-table-column
+            prop="province"
+            label="璧风偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            prop="city"
+            label="缁堢偣缂栧彿">
+        </el-table-column>
+        <el-table-column
+            class-name="fixed-table"
+            fixed="right"
+            label="鎿嶄綔">
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Tube',
+  data () {
+    return {
+      tableData: []
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.tube-span {
+  color: #ffffff !important;
+  font-size: 14px;
+  margin: 0 15px;
+}
+</style>
diff --git a/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
new file mode 100644
index 0000000..3d3d000
--- /dev/null
+++ b/src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
@@ -0,0 +1,48 @@
+<template>
+  <div class="sewers-analysis-tab">
+    <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
+      <el-tab-pane label="杩為�氭��" name="first">
+        <Connectivity></Connectivity>
+      </el-tab-pane>
+      <el-tab-pane label="鐖嗙" name="second">
+        <Tube></Tube>
+      </el-tab-pane>
+      <el-tab-pane label="娴佸悜" name="third">
+        <Flow></Flow>
+      </el-tab-pane>
+      <el-tab-pane label="妯柇闈�" name="four">
+        <CrossSectional></CrossSectional>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+import Connectivity from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/Connectivity'
+import Tube from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/Tube'
+import Flow from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/Flow'
+import CrossSectional from '@components/panel/topicSearch/SewersSelect/AnalysisChoose/CrossSectional'
+
+export default {
+  name: 'SewersFirstTab',
+  components: {
+    Connectivity,
+    Tube,
+    Flow,
+    CrossSectional
+  },
+  data () {
+    return {
+      activeName: 'first'
+    }
+  },
+  methods: {
+    handleClick (tab, event) {
+      console.log(tab, event)
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+</style>
diff --git a/src/components/table/components/AirQuality.vue b/src/components/table/components/AirQuality.vue
index 7e52808..ddf7dab 100644
--- a/src/components/table/components/AirQuality.vue
+++ b/src/components/table/components/AirQuality.vue
@@ -1,55 +1,23 @@
 <template>
     <div class="AirQuality">
-        <el-table
-                class="tableBox"
-                :data="tableData"
-                :header-cell-style="tableHeaderColor"
-                :cell-style="rowClass"
-                border
-        >
-            <el-table-column
-                    width="30px"
-                    label=""
-            >
+        <el-table class="tableBox" :data="tableData" :header-cell-style="tableHeaderColor" :cell-style="rowClass" border>
+            <el-table-column width="30px" label="">
                 <template>
                     <i class="el-icon-caret-right"></i>
                     <span style="margin-left: 10px"></span>
                 </template>
             </el-table-column>
-            <el-table-column
-                    label="搴忓彿"
-                    width="60px"
-                    type="index">
-            </el-table-column>
-            <el-table-column
-                    prop="UserName"
-                    label="浼佷笟鍚嶇О"
-                    width="120px">
-            </el-table-column>
-            <el-table-column
-                    prop="AQI"
-                    label="AQI"
-                    width="200px">
-            </el-table-column>
-            <el-table-column
-                    prop="MajorPollutant"
-                    label="棣栬姹℃煋鐗� "
-                    width="200px">
-            </el-table-column>
-            <el-table-column
-                    prop="AirQualityCategory"
-                    label="绌烘皵璐ㄩ噺绫诲埆"
-                    width="200px">
-            </el-table-column>
-            <el-table-column
-                    prop="RegionalColor"
-                    label="鍖哄煙棰滆壊"
-                    width="200px">
-              <template slot-scope="scope">
-                <div v-if="scope.row.RegionalColor==='鍥涚骇绾㈣壊'" style="background-color: red">{{scope.row.RegionalColor}}</div>
-                <div v-else-if="scope.row.RegionalColor==='涓夌骇姗欒壊'" style="background-color: orange">{{scope.row.RegionalColor}}</div>
-                <div v-else style="background-color: green">{{scope.row.RegionalColor}}</div>
-              </template>
+            <el-table-column label="搴忓彿" width="60px" type="index"></el-table-column>
+            <el-table-column prop="UserName" label="浼佷笟鍚嶇О"></el-table-column>
+            <el-table-column prop="AQI" label="AQI"></el-table-column>
+            <el-table-column prop="MajorPollutant" label="棣栬姹℃煋鐗� "></el-table-column>
+            <el-table-column prop="AirQualityCategory" label="绌烘皵璐ㄩ噺绫诲埆"></el-table-column>
+            <el-table-column prop="RegionalColor" label="鍖哄煙棰滆壊">
+                  <template slot-scope="scope">
+                        <div v-if="scope.row.RegionalColor==='鍥涚骇绾㈣壊'" style="background-color: red">{{scope.row.RegionalColor}}</div>
+                        <div v-else-if="scope.row.RegionalColor==='涓夌骇姗欒壊'" style="background-color: orange">{{scope.row.RegionalColor}}</div>
+                        <div v-else style="background-color: green">{{scope.row.RegionalColor}}</div>
+                  </template>
             </el-table-column>
         </el-table>
     </div>
@@ -89,11 +57,11 @@
   },
   methods: {
     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'
+      // 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'
+      // return 'text-align: center;background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;width:64px'
     }
   }
 }
diff --git a/src/components/table/components/IndexStatistics.vue b/src/components/table/components/IndexStatistics.vue
index c82e142..04b1a37 100644
--- a/src/components/table/components/IndexStatistics.vue
+++ b/src/components/table/components/IndexStatistics.vue
@@ -1,171 +1,60 @@
 <template>
     <el-tabs v-model="activeName">
-        <el-tab-pane label="鎸囨爣缁熻" name="first"><el-table
-                :data="tableData">
-            <el-table-column
-                    type="index"
-                    label="搴忓彿">
-            </el-table-column>
-            <el-table-column
-                    prop="date"
-                    label="鍗曚綅鍚嶇О">
-            </el-table-column>
-            <el-table-column
-                    prop="province"
-                    label="宸ヤ笟鍙栨按閲�(m3)">
-            </el-table-column>
-            <el-table-column
-                    prop="province"
-                    label="澶栨帓搴熸按閲�(m3)">
-            </el-table-column>
-            <el-table-column
-                    prop="province"
-                    label="宸ヤ笟搴熸皵鎺掓斁閲�(m3)">
-            </el-table-column>
-            <el-table-column label="COD(t)">
-                    <el-table-column
-                            prop="province"
-                            label="绱浜х敓閲�">
-                    </el-table-column>
-                    <el-table-column
-                            prop="city"
-                            label="褰撴湀浜х敓閲�">
-                    </el-table-column>
-            </el-table-column>
-            <el-table-column label="姘ㄦ爱(t)">
-                <el-table-column
-                        prop="province"
-                        label="绱浜х敓閲�">
+        <el-tab-pane label="鎸囨爣缁熻" name="first">
+            <el-table :data="tableData" >
+                <el-table-column type="index" label="搴忓彿"></el-table-column>
+                <el-table-column prop="date" label="鍗曚綅鍚嶇О"></el-table-column>
+                <el-table-column prop="province" label="宸ヤ笟鍙栨按閲�(m3)"></el-table-column>
+                <el-table-column prop="province" label="澶栨帓搴熸按閲�(m3)"></el-table-column>
+                <el-table-column prop="province" label="宸ヤ笟搴熸皵鎺掓斁閲�(m3)"></el-table-column>
+                <el-table-column label="COD(t)">
+                    <el-table-column prop="province" label="绱浜х敓閲�"></el-table-column>
+                    <el-table-column prop="city" label="褰撴湀浜х敓閲�"></el-table-column>
                 </el-table-column>
-                <el-table-column
-                        prop="city"
-                        label="褰撴湀浜х敓閲�">
+                <el-table-column label="姘ㄦ爱(t)">
+                    <el-table-column prop="province" label="绱浜х敓閲�"></el-table-column>
+                    <el-table-column prop="city" label="褰撴湀浜х敓閲�"></el-table-column>
                 </el-table-column>
-            </el-table-column>
-            <el-table-column label="浜屾哀鍖栫~(t)">
-                <el-table-column
-                        prop="province"
-                        label="绱浜х敓閲�">
+                <el-table-column label="浜屾哀鍖栫~(t)">
+                    <el-table-column prop="province" label="绱浜х敓閲�"></el-table-column>
+                    <el-table-column prop="city" label="褰撴湀浜х敓閲�"></el-table-column>
                 </el-table-column>
-                <el-table-column
-                        prop="city"
-                        label="褰撴湀浜х敓閲�">
+                <el-table-column label="姘哀鍖栫墿(t)">
+                    <el-table-column prop="province" label="绱浜х敓閲�"></el-table-column>
+                    <el-table-column prop="city" label="褰撴湀浜х敓閲�"></el-table-column>
                 </el-table-column>
-            </el-table-column>
-            <el-table-column label="姘哀鍖栫墿(t)">
-                <el-table-column
-                        prop="province"
-                        label="绱浜х敓閲�">
+                <el-table-column label="VOCs(t)">
+                    <el-table-column prop="province" label="绱浜х敓閲�"></el-table-column>
+                    <el-table-column prop="city" label="褰撴湀浜х敓閲�"></el-table-column>
                 </el-table-column>
-                <el-table-column
-                        prop="city"
-                        label="褰撴湀浜х敓閲�">
+                <el-table-column label="鍥哄簾(t)">
+                    <el-table-column prop="province" label="绱浜х敓閲�"></el-table-column>
+                    <el-table-column prop="city" label="褰撴湀浜х敓閲�"></el-table-column>
                 </el-table-column>
-            </el-table-column>
-            <el-table-column label="VOCs(t)">
-                <el-table-column
-                        prop="province"
-                        label="绱浜х敓閲�">
-                </el-table-column>
-                <el-table-column
-                        prop="city"
-                        label="褰撴湀浜х敓閲�">
-                </el-table-column>
-            </el-table-column>
-            <el-table-column label="鍥哄簾(t)">
-                <el-table-column
-                        prop="province"
-                        label="绱浜х敓閲�">
-                </el-table-column>
-                <el-table-column
-                        prop="city"
-                        label="褰撴湀浜х敓閲�">
-                </el-table-column>
-            </el-table-column>
+            </el-table>
+        </el-tab-pane>
+        <el-tab-pane label="浼佷笟鎺掑悕" name="second"><el-table :data="tableData">
+            <el-table-column type="index" label="搴忓彿"></el-table-column>
+            <el-table-column prop="date" label="浼佷笟鍚嶇О"></el-table-column>
+            <el-table-column prop="name" label="搴熸按杈炬爣鐜�"></el-table-column>
+            <el-table-column prop="province" label="鍚嶆"></el-table-column>
+            <el-table-column prop="city" label="搴熸皵杈炬爣鐜�"></el-table-column>
+            <el-table-column prop="address" label="鍚嶆"></el-table-column>
+            <el-table-column prop="zip" label="浼犺緭鐜�"></el-table-column>
+            <el-table-column prop="zip" label="鍚嶆"></el-table-column>
+            <el-table-column prop="zip" label="璁惧瀹屽ソ鐜�"></el-table-column>
+            <el-table-column prop="zip" label="鎺掑悕"></el-table-column>
         </el-table></el-tab-pane>
-        <el-tab-pane label="浼佷笟鎺掑悕" name="second"><el-table
-                :data="tableData"
-                style="width: 100%"
-                max-height="250">
-            <el-table-column
-                    type="index"
-                    label="搴忓彿">
-            </el-table-column>
-            <el-table-column
-                    prop="date"
-                    label="浼佷笟鍚嶇О">
-            </el-table-column>
-            <el-table-column
-                    prop="name"
-                    label="搴熸按杈炬爣鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="province"
-                    label="鍚嶆">
-            </el-table-column>
-            <el-table-column
-                    prop="city"
-                    label="搴熸皵杈炬爣鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="address"
-                    label="鍚嶆">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="浼犺緭鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="鍚嶆">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="璁惧瀹屽ソ鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="鎺掑悕">
-            </el-table-column>
-        </el-table></el-tab-pane>
-        <el-tab-pane label="鎺掓斁鐐规帓鍚�" name="third"><el-table
-                :data="tableData">
-            <el-table-column
-                    type="index"
-                    label="搴忓彿">
-            </el-table-column>
-            <el-table-column
-                    prop="date"
-                    label="鎺掓斁鐐瑰悕绉�">
-            </el-table-column>
-            <el-table-column
-                    prop="name"
-                    label="鎺掓斁绫诲瀷">
-            </el-table-column>
-            <el-table-column
-                    prop="province"
-                    label="杈炬爣鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="city"
-                    label="鍚嶆">
-            </el-table-column>
-            <el-table-column
-                    prop="address"
-                    label="浼犺緭鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="鍚嶆">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="璁惧瀹屽ソ鐜�">
-            </el-table-column>
-            <el-table-column
-                    prop="zip"
-                    label="鍚嶆">
-            </el-table-column>
+        <el-tab-pane label="鎺掓斁鐐规帓鍚�" name="third"><el-table :data="tableData">
+            <el-table-column type="index" label="搴忓彿"></el-table-column>
+            <el-table-column prop="date" label="鎺掓斁鐐瑰悕绉�"></el-table-column>
+            <el-table-column prop="name" label="鎺掓斁绫诲瀷"></el-table-column>
+            <el-table-column prop="province" label="杈炬爣鐜�"></el-table-column>
+            <el-table-column prop="city" label="鍚嶆"></el-table-column>
+            <el-table-column prop="address" label="浼犺緭鐜�"></el-table-column>
+            <el-table-column prop="zip" label="鍚嶆"></el-table-column>
+            <el-table-column prop="zip" label="璁惧瀹屽ソ鐜�"></el-table-column>
+            <el-table-column prop="zip" label="鍚嶆"></el-table-column>
         </el-table></el-tab-pane>
     </el-tabs>
 
diff --git a/src/components/table/components/SolidWaste.vue b/src/components/table/components/SolidWaste.vue
index 89be52e..ae00c44 100644
--- a/src/components/table/components/SolidWaste.vue
+++ b/src/components/table/components/SolidWaste.vue
@@ -18,63 +18,33 @@
               placement="bottom"
               trigger="click"
               :disabled="!isShowIcon"
-              popper-class="popovers"
-          >
+              popper-class="popovers">
             <ChemicalWastewater v-show="$index ===1"></ChemicalWastewater>
             <i class="el-icon-caret-right" :class="{active: isActive === $index}" slot="reference" @click="doIcon($index)"></i>
             <!--                   <i class="el-icon-caret-bottom"   slot="reference" v-else @click="doIcon($index)"></i>-->
           </el-popover>
         </template>
       </el-table-column>
-      <el-table-column
-          label="搴忓彿"
-          width="45px"
-          type="index">
+      <el-table-column label="搴忓彿" width="45px" type="index">
       </el-table-column>
-      <el-table-column
-          prop="UserName"
-          label="浼佷笟鍚嶇О"
-          width="120px">
+      <el-table-column 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"
-          label="澶栨帓搴熸按閲忥紙m鲁锛�"
-          width="100px">
-      </el-table-column>
+      <el-table-column prop="WasteWaters" label="澶栨帓搴熸按閲忥紙m鲁锛�" width="100px"></el-table-column>
       <el-table-column label="COD  (t)">
-        <el-table-column
-            prop="AddOutPut"
-            label="绱浜х敓閲�"
-            width="70px">
-        </el-table-column>
-        <el-table-column
-            prop="MonthOutPut"
-            label="褰撴湀鐢熶骇閲�"
-            width="70px">
-        </el-table-column>
+        <el-table-column prop="AddOutPut" label="绱浜х敓閲�" width="70px"></el-table-column>
+        <el-table-column prop="MonthOutPut" label="褰撴湀鐢熶骇閲�" width="70px"></el-table-column>
       </el-table-column>
       <el-table-column label="姘ㄦ爱  (t)">
-        <el-table-column
-            prop="NH4NPut"
-            label="绱浜х敓閲�"
-            width="70px">
-        </el-table-column>
-        <el-table-column
-            prop="NH4NMonth"
-            label="褰撴湀鐢熶骇閲�"
-            width="70px">
-        </el-table-column>
+        <el-table-column prop="NH4NPut" label="绱浜х敓閲�"></el-table-column>
+        <el-table-column prop="NH4NMonth" label="褰撴湀鐢熶骇閲�"></el-table-column>
       </el-table-column>
       <el-table-column label="鎺掓斁鍙f娴嬬粺璁$姸鎬�">
-        <el-table-column
-            prop="normal"
-            label="姝e父"
-            width="60px">
+        <el-table-column prop="normal" label="姝e父" width="60px">
           <template slot-scope="{row,$index}">
             <u v-if="$index!=2" >{{row.normal}}</u>
             <el-popover v-else
@@ -92,25 +62,10 @@
             </el-popover>
           </template>
         </el-table-column>
-        <el-table-column
-            prop="overProof"
-            label="瓒呮爣"
-            width="60px">
-        </el-table-column>
-        <el-table-column
-            prop="Abnormal"
-            label="寮傚父"
-            width="60px">
-        </el-table-column>
-        <el-table-column
-            prop="StopProduction"
-            label="鍋滀骇"
-            width="60px">
-        </el-table-column>
-        <el-table-column
-            prop="deficiency"
-            label="缂哄け"
-            width="60px">
+        <el-table-column prop="overProof" label="瓒呮爣" width="60px"></el-table-column>
+        <el-table-column prop="Abnormal" label="寮傚父" width="60px"></el-table-column>
+        <el-table-column prop="StopProduction" label="鍋滀骇" width="60px"></el-table-column>
+        <el-table-column prop="deficiency" label="缂哄け" width="60px">
           <template slot-scope="{row,$index}">
             <u v-if="$index!=1" >{{row.deficiency}}</u>
             <el-popover v-else
@@ -201,11 +156,11 @@
   },
   methods: {
     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'
+      // 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'
+      // return 'text-align: center;background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;width:64px'
     },
     // 鑾峰彇鐐瑰嚮鐨勮〃鏍�
     handle (row, column, event, cell) {
diff --git a/src/components/table/components/WasteWater.vue b/src/components/table/components/WasteWater.vue
index af191ce..c8ad3dd 100644
--- a/src/components/table/components/WasteWater.vue
+++ b/src/components/table/components/WasteWater.vue
@@ -3,9 +3,6 @@
            <el-table
                    class="tableBox"
                    :data="tableData"
-                   style="width: 100%"
-                   :header-cell-style="tableHeaderColor"
-                   :cell-style="rowClass"
                    @cell-click="handle"
            >
                <el-table-column
@@ -41,11 +38,7 @@
                    <div v-else >{{scope.row.UserName}}</div>
                  </template>
                </el-table-column>
-               <el-table-column
-                       prop="WasteWaters"
-                       label="澶栨帓搴熸按閲忥紙m鲁锛�"
-                       width="100px">
-               </el-table-column>
+               <el-table-column prop="WasteWaters" label="澶栨帓搴熸按閲忥紙m鲁锛�"></el-table-column>
                <el-table-column label="COD  (t)">
                    <el-table-column
                            prop="AddOutPut"
@@ -201,11 +194,11 @@
   },
   methods: {
     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'
+    //  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'
+      // return 'text-align: center;background-color: rgba(26, 73, 81, 0.901960784313726);color:#fff;width:64px'
     },
     // 鑾峰彇鐐瑰嚮鐨勮〃鏍�
     handle (row, column, event, cell) {
@@ -228,17 +221,6 @@
 }
 </script>
 
-<style scoped>
-.popovers{
-  width: auto !important;
-  background-color: gray !important;
-}
-.popovers.el-popover{
-padding:0;
-}
-.active {
-  /*color: red;*/
-  transform:rotate(90deg);
-}
+<style>
 
 </style>
diff --git a/src/components/table/components/tabHandover.vue b/src/components/table/components/tabHandover.vue
index 35a1739..a346334 100644
--- a/src/components/table/components/tabHandover.vue
+++ b/src/components/table/components/tabHandover.vue
@@ -1,5 +1,5 @@
 <template>
-  <el-tabs  v-model="activeName" type="border-card">
+  <el-tabs  v-model="activeName">
     <el-tab-pane label="搴熸按" name="first">
       <waste-water></waste-water>
     </el-tab-pane>
diff --git a/src/components/table/summarySheets.vue b/src/components/table/summarySheets.vue
index 909a35f..fab563b 100644
--- a/src/components/table/summarySheets.vue
+++ b/src/components/table/summarySheets.vue
@@ -27,13 +27,13 @@
             </el-tooltip>
         </div>
     </transition>
-    <Dialog ref="summarySheets" title="浼佷笟棰勮鎶ヨ鍒嗙被缁熻" >
+    <Dialog ref="summarySheets" title="鎶ヨ〃" >
       <tab-handover></tab-handover>
     </Dialog>
-    <Dialog ref="warnDialog" title="浼佷笟棰勮鎶ヨ鍒嗙被缁熻" >
+    <Dialog ref="warnDialog" title="棰勬姤璀�" >
       <warn></warn>
     </Dialog>
-    <Dialog ref="indexStatisticsDialog" title="浼佷笟鎸囨爣鍒嗙被缁熻">
+    <Dialog ref="indexStatisticsDialog" title="浼佷笟鎸囨爣鍒嗙被缁熻" >
       <index-statistics></index-statistics>
     </Dialog>
   </div>
diff --git a/src/styles/theme-dark/el-ui/tabs.less b/src/styles/theme-dark/el-ui/tabs.less
index 17808d8..746d5b0 100644
--- a/src/styles/theme-dark/el-ui/tabs.less
+++ b/src/styles/theme-dark/el-ui/tabs.less
@@ -1,12 +1,15 @@
-.el-tabs{}
+.el-tabs{
 
+}
+.el-table td, .el-table th{
+  padding: 0;
+}
 .el-tabs__header{
   border-bottom: 1px solid @background-color-split !important;
   padding: 0;
   position: relative;
   margin: 0 0 15px;
 }
-
 .el-tabs__active-bar{
   position: absolute;
   bottom: 0;
diff --git a/src/views/popup/Dialog.vue b/src/views/popup/Dialog.vue
index f8c26a4..516e523 100644
--- a/src/views/popup/Dialog.vue
+++ b/src/views/popup/Dialog.vue
@@ -2,7 +2,6 @@
     <el-dialog  v-dialogDrag
             :title="title"
             :visible.sync="centerDialogVisible"
-            width="30%"
             :modal="false"
             :close-on-click-modal="false"
              @close='closeDialog'

--
Gitblit v1.8.0