Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetw...

zhangshuaibao

2021-04-08 8db683d564865b4bcfb436b35dff1eea5b3816fc

Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop


 Conflicts:

	src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue

 package.json

@@ -19,6 +19,7 @@
    "dayjs": "^1.9.6",
    "echarts": "^4.2.1",
    "element-ui": "^2.14.1",
    "esri-leaflet": "^3.0.1",
    "fullscreen": "^1.1.1",
    "jquery": "^3.5.1",
    "js-cookie": "^2.2.0",
@@ -28,6 +29,7 @@
    "leaflet.markercluster": "^1.4.1",
    "lodash": "^4.17.10",
    "nprogress": "^0.2.0",
    "proj4": "^2.7.2",
    "qs": "^6.10.1",
    "rbush": "^3.0.1",
    "screenfull": "^3.3.3",

 src/assets/css/map/map-panel-style.less

@@ -53,6 +53,7 @@
.select-down {
  border: none !important;
  background-color: @background-color;
  margin: 0;

  //.el-scrollbar{
  //
@@ -242,13 +243,18 @@

/***************Company 图层 悬浮框样式。*********************************/
.company-bindTooltip {
  background: none;
  background: @background-color-split;
  border: none;
  color: red;
  font-size: 16px;
  font-weight: 900 !important;
  text-shadow: 0 0 5px #fff;
  //filter:Dropshadow(offx=1,offy=0,color=white)
  //Dropshadow(offx=0,offy=1,color=white)
  //Dropshadow(offx=0,offy=-1,color=white)
  //Dropshadow(offx=-1,offy=0,color=white);
  box-shadow: none;
  -webkit-text-stroke: .5px #fff;
}

.company-bindTooltip-hover h3 {
@@ -342,3 +348,14 @@
  }

}
.panel-title{
  color: @color-title;
  font-size: 18px;
  padding: 10px;
  text-align: center;
  border-bottom: 1px solid @background-color-split;
}

.el-tabs__header .is-top {
  
}

 src/assets/css/map/map-popup.less

@@ -6,13 +6,15 @@
        background-color: @background-color;
        /*background-color: transparent;*/
        border: .00521rem solid @color;
        padding: .05rem;
        //-webkit-box-shadow: 0 0 0.03125rem 0 @color;
        //box-shadow: 0 0 0.03125rem 0 @color;
        -webkit-box-shadow: 0 0 10px 0 @color;
        box-shadow: 0 0 .03rem @color;
        //border-radius: .03rem;
        padding:6px;
        border-radius: 10px;
        .leaflet-popup-content{margin: 0}

    }

    .leaflet-popup-tip-container {

 src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue

@@ -50,18 +50,19 @@
<!--                    </div>-->
<!--                </el-dialog>-->
<!--            </div>-->
            <div style="width:750px;height:260px;" id="echarts" ref="main">
            <div style="width:100%;height:1rem;margin-top:-0.1rem;position:absolute;" id="echarts" ref="main">
            </div>
        </div>
    </div>
</template>

<script>
// import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'

export default {
  name: 'ECharts',
  components: {
    // PublicDetailedList
    PublicDetailedList
  },
  data () {
    return {
@@ -234,69 +235,53 @@
    }
  },
  mounted () {
    this.drawChart()
    const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getWasteWaterMonitoring))
    console.log(dataWatch)
    for (var i = 0; i < dataWatch.length; i++) {
      this.dataDate.push(dataWatch[i].MonTimeStr.substring(10, 17))
    }
    console.log(this.dataDate)
    this.$nextTick(() => {
      this.drawChart()
      const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getWasteWaterMonitoring))
      // console.log(dataWatch)
      for (var i = 0; i < dataWatch.length; i++) {
        this.dataDate.push(dataWatch[i].MonTimeStr.substring(10, 17))
      }
      // console.log(this.dataDate)
    })
  }
}
</script>

<style scoped lang="less">
    .infomation {
        margin-left: 10px;
    }
.Infomation {
  margin-left: 10px;
  height: 0.2rem;
}

    .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;
        padding: 0 15px;
    }
.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;
  padding: 0 15px;
}

    .form-echrts {
        width: 100%;
        height: 100%;
        border: 1px solid #396d83;
        //margin: 10px 10px 10px 10px;
        .el-dialog-div {
            //height: 50vh!important;
            overflow: auto;
            //overflow: hidden;
        }
        .block{
            .date{
                width: 300px;
                height: 30px;
            }
        }
        .text-size{
            display: flex;
            justify-content: space-around;
        }
        .from-search{
            display: flex;
            justify-content: space-around;
            .demo-form-inline{
                display: flex;
                justify-content: space-around;
            }
            .el-button--mini, .el-button--mini.is-round{
                height: 30px;
            }
        }
        #echarts {
            margin: 0;
            padding: 0;
            //border: 1px solid #396d83;
            //margin: 10px 10px 10px 10px;
        }
    }
.form-echrts {
  width: 100%;
  height: 1rem;
  border-top: 1px solid #396d83;
  //margin: 10px 10px 10px 10px;
  .el-dialog-div {
    //height: 50vh!important;
    overflow: auto;
    //overflow: hidden;
  }

  #echarts {
    margin: 0;
    padding: 0;
    //height: 3rem;
    //border: 1px solid #396d83;
    //margin: 10px 10px 10px 10px;
  }
}
</style>

 src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue

@@ -26,7 +26,7 @@
.win {
  position: relative;
  background-color: rgba(33, 41, 69, 0.9);
  height: 2.1rem;
  //height: 2rem;
}

.main {

 src/components/BaseNav/PublicBounced/PublicBounced.vue

@@ -14,39 +14,13 @@
          <public-chart v-else :getWasteGasDetails="getWasteGasDetails"
                        :value="value"
                        :getWasteWaterMonitoring="getWasteWaterMonitoring"
                        :getWasteWaterMonitoringDetails="getWasteWaterMonitoringDetails
"></public-chart>
                        :getWasteWaterMonitoringDetails="getWasteWaterMonitoringDetails"></public-chart>
        </div>
      </div>
      <div class="public-bounced-content-right">
        <public-video></public-video>
      </div>
    </div>
    <!--    <el-dialog-->
    <!--        :visible.sync="flag"-->
    <!--        width="70%"-->
    <!--        v-drag-->
    <!--        :modal="false">-->
    <!--      <div class="public-bounced-title">-->
    <!--        <span>{{ displayContentTitle }}</span>-->
    <!--        <i class="el-icon-circle-close" @click="closePopup"></i>-->
    <!--      </div>-->
    <!--      <div class="public-bounced-content">-->
    <!--        <div class="public-bounced-content-left">-->
    <!--          <public-tabs :displayContentTab="displayContentTab" :value="value"-->
    <!--                       :setWasteGasdata="setWasteGasdata" :setWasteWaterdata="setWasteWaterdata"></public-tabs>-->
    <!--          <div class="public-bounced-content-left-bottom">-->
    <!--            <public-table v-if="value === 'gufei'"-->
    <!--                          :displayContentTable="displayContentTable"></public-table>-->
    <!--            <public-chart v-else :getWasteGasDetails="getWasteGasDetails"-->
    <!--                          :getWasteWaterMonitoring="getWasteWaterMonitoring"></public-chart>-->
    <!--          </div>-->
    <!--        </div>-->
    <!--        <div class="public-bounced-content-right">-->
    <!--          <public-video></public-video>-->
    <!--        </div>-->
    <!--      </div>-->
    <!--    </el-dialog>-->
  </div>
</template>

@@ -107,7 +81,7 @@
      this.setWasteWaterdata = dataWater
      // console.log(data)
      this.getWasteWaterMonitoring = drawData
      console.log(drawData)
      // console.log(drawData)
      this.getWasteWaterMonitoringDetails = dataDetail
      this.displayContentTitle = dataWater.Name
      this.flag = true
@@ -119,14 +93,16 @@

<style lang="less" scoped>
.public-bounced {
  width: 10rem;
  width: 8rem;
  //height: 2.6rem;
  //width: 70vw;
  //height: 30vh;
  z-index: 999;
  position: absolute;
  top: 5%;
  left: 5%;
  //bottom: 2rem;
  //left: 5rem;
  top: 15%;
  left: 15%;
  background-color: #002432;
  border: 1px #9fc5c8 solid;

@@ -159,7 +135,7 @@
    justify-content: space-around;

    .public-bounced-content-left {
      width: 6.8rem;
      width: 4.8rem;
    }

    .public-bounced-content-right {

 src/components/LayerController/LayerController.vue

@@ -1,7 +1,7 @@
<template>
  <div :class='["float-panel",layerControllerVisible ? "active" : ""]' >

    <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="图层" placement="left">
    <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="图层控制" placement="left">
      <div @click="showPanel" class="iconBtn" :class='layerControllerVisible ? "active-button" : ""' v-show="!layerControllerVisible" style="  position: absolute;top:0;left: 0;">
        <img src="@assets/images/map-pages/icon/layer.png" alt="" class="icon">
        <!--        <span class="icon-name">图层</span>-->
@@ -96,10 +96,6 @@
  min-height: 0.28rem;
  min-width: 0.28rem;
  overflow: hidden;
  div {
    color: #00fff6;
  }

  .iconBtn.active{
    display: none;
  }
@@ -238,20 +234,20 @@
    background: #0E3565;
  }
  .el-button--default{
   margin-left: 10px;
    padding: 15px 3px;
    background:@background-color;
    color:@color-tool;
    position: absolute;
    top:0;
    right: -26px;
    left: 100%;
    margin-left: .02rem;
    border-radius: 0.03rem 50% 50% 0.03rem;
  }
  .el-button--default:hover{
    background:@background-color;
  }
  .legend-content{
    width: 250px;
    width: 1.79167rem;
  }
}


 src/components/LayerController/modules/LcServiceLayer.vue

@@ -1,11 +1,11 @@
<template>
    <div class="inner-panel">
        <div class="title"> 图层控制 </div>
        <div class="panel-title"> 图层控制 </div>
        <div class="wms-panel">
            <el-scrollbar class="wms-panel-scrollbar">
                <div v-for="item in serviceLayers" :key="item.code" class="layerbox">
                    <!-- 一级图层遍历 -->
                    <div>
                    <div style="padding-left:10px;padding-top:10px">
                        <input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code"
                               @change="swAllLayers(item)"/>{{ item.name }}
                    </div>
@@ -103,13 +103,6 @@

<style scoped lang="less">
    .inner-panel {
        .title{
            color: @color-title;
            font-size: 18px;
            margin: 10px;
            text-align: center;
        }

        .btn-filter {
            cursor: pointer;
            color: #ffffff;
@@ -118,13 +111,14 @@
        .wms-panel {

            .wms-panel-scrollbar{
                height: 50vh;
                height: 457px;
                width: 100%;
                font-size: 14px;
            }
            .layerbox {
                width: 100%;
                .layerbox-item {
                    padding-left: 20px;
                    padding-left: 30px;
                    padding-top: 5px;
                    .basemap-layer-item {
                        margin-bottom: 5px;

 src/components/LayerController/modules/LcServiceLayerFilter.vue

@@ -101,7 +101,6 @@

<style scoped lang="less">
    .inner-panel {
        color: #90c8e0;
        font-size: 13px;
        position: absolute;
        left: 1.82167rem;
@@ -110,21 +109,20 @@
        .filter-group {
            display: flex;
            flex-flow: row;

            .filter-item {
                width: 0.6rem;
                height: 100%;
                margin-right: 5px;

                background-color: @background-color;
                box-shadow: 0 0 0.03rem #00fff6;
                border-radius: 0.03rem;
                .title {
                    height: 25px;
                    background-color: #091331;
                    border: 1px solid #10488c;
                    border-bottom:1px solid @background-color-split;
                    padding: 5px 0;
                    background-color: @background-color;
                }

                .content {
                    background-color: rgba(44, 62, 80, 0.6);
                    border: 1px solid #10488c;
                    max-height: 200px;
                    padding-bottom: 5px;
                    //overflow-y: hidden;

 src/components/panel/RightSearchPanel.vue

@@ -10,15 +10,13 @@
                  <button type="button" class="el-button special-button el-button--default el-icon-d-arrow-right"></button>
              </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)}" >
          <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left">
          <li>
<!--            <span>{{item.name}}</span>-->
<!--            <div >-->
                <img src="../../assets/images/map-pages/icon/sl.png" class="icon">
<!--            </div>-->
          </li>
          </el-tooltip>
              <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>
@@ -41,7 +39,7 @@
      </div>

      <div :class="'search-container map-background'">
        <div class="el-message-box__content" style="padding:6px;font-size: 13px;">
        <div class="el-message-box__content" style="padding:0 6px 6px 6px;font-size: 13px;">
          <component :title="title" :is="gcComp"></component>
        </div>
      </div>
@@ -182,11 +180,7 @@
</script>

<style lang="less">
.search-title{
    color:@color-title;
    font-size: 18px;
    margin: 5px;
}

.search-container {
    position: relative;
    width: 1.79167rem;
@@ -469,13 +463,14 @@
        .el-icon-search{
            width: 40px;
            border:1px solid @color;
            height: 26px;
            line-height: 26px;
            height: 28px;
            line-height: 28px;
            text-align: center;
            color:#fff;
            border-radius: 2px;
            cursor:pointer;
            background: rgba(0,16,30,.5);
            padding:0;
        }
    }
    /*单选按钮样式*/
@@ -524,16 +519,6 @@
        color:@color-over;
        background: @background-color;
    }
  //.search-panel {
  //  border: #07325B;
  //  background-color: #07325B !important;
  //  margin-top: 0px;
  //
  //  .el-input__inner {
  //    border-radius: 0px !important;
  //    background-color: #061e51 !important;
  //  }
  //}

  input::-webkit-input-placeholder {
    color: #569ee1;
@@ -701,10 +686,11 @@
    .sewers-search{
        position: relative;
        overflow: hidden;
        .panel-title{}
        .search-panel{
            background-color: transparent;
            border: 1px solid @background-color-split;
            padding: 10px 0;
            border-bottom: 1px solid @background-color-split;
            // .el-input{width:calc(100% - 40px);position: relative}
            /deep/ input {
                border-radius: 0;

 src/components/panel/topicSearch/DischargeSearch.vue

@@ -1,6 +1,6 @@
<template>
  <div class="sewers-search" v-if="gdVisible">
    <div class="search-title">{{title}}</div>
    <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">
@@ -40,7 +40,7 @@
        <!--              <el-form-item >-->
        <div class="rightButtonSearch">
          <el-input  v-model="form.keyword" size="mini"  placeholder="在此输入关键字搜索"></el-input>
          <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
          <el-button class="el-icon-search" @click="handleSearch"></el-button>
        </div>
      </el-form>
    </div>
@@ -122,7 +122,7 @@
import WfsHelper from '@components/helpers/WfsHelper'
import AjaxUtils from '@utils/AjaxUtils'
export default {
  name: 'SewersSearch',
  name: 'DischargeSearch',
  data () {
    return {
      gdVisible: true,
@@ -147,7 +147,8 @@
        { name: '一级风险', value: '2', color: 'sandybrown' },
        { name: '二级风险', value: '3', color: 'yellow' },
        { name: '三级风险', value: '4', color: 'green' }
      ]
      ],
      areaTypeOptions: []
    }
  },
  props: ['title'],

 src/components/panel/topicSearch/EnvRiskSearch.vue

@@ -1,6 +1,6 @@
<template>
  <div class="sewers-search" v-if="gdVisible">
    <div class="search-title">{{title}}</div>
    <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">
@@ -13,7 +13,7 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="企业名称" size="mini">
        <el-form-item label="企业名称：" size="mini">
          <el-select style="width: 100%"  v-model="form.enterpriseVal"  @change="enterpriseType" :popper-class="'select-down'">
            <el-option
                v-for="item in enterpriseTypeOptions"
@@ -23,7 +23,7 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="二级单位" size="mini">
        <el-form-item label="二级单位：" size="mini">
          <el-select style="width: 100%"  v-model="form.enterpriseSubunitsVal"  @change="enterpriseSubunitsType" :popper-class="'select-down'">
            <el-option
                v-for="item in enterpriseSubunitsTypeOptions"
@@ -33,14 +33,14 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="风险级别" size="mini"></el-form-item>
        <el-form-item label="风险级别：" size="mini"></el-form-item>
        <el-radio-group v-model="form.type" class="levelOfRisk">
          <el-radio  v-for="(item,index) in levelOfRisk" :label="item.value" :key="index"><span class="levelOfRisk-type">{{item.name}}<i :style="'background:'+item.color"></i></span></el-radio>
        </el-radio-group>
        <div class="rightButtonSearch">
          <el-input  v-model="form.keyword" size="mini"  placeholder="在此输入关键字搜索">
          </el-input>
          <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
          <el-button class="el-icon-search" @click="handleSearch"></el-button>
        </div>
      </el-form>
    </div>
@@ -82,7 +82,7 @@
import WfsHelper from '@components/helpers/WfsHelper'
import AjaxUtils from '@utils/AjaxUtils'
export default {
  name: 'SewersSearch',
  name: 'EnvRiskSearch',
  data () {
    return {
      gdVisible: true,
@@ -107,7 +107,8 @@
        { name: '一级风险', value: '2', color: 'sandybrown' },
        { name: '二级风险', value: '3', color: 'yellow' },
        { name: '三级风险', value: '4', color: 'green' }
      ]
      ],
      areaTypeOptions: []
    }
  },
  props: ['title'],

 src/components/panel/topicSearch/GasWasteSearch.vue

@@ -1,6 +1,6 @@
<template>
  <div class="sewers-search" v-if="gdVisible">
    <div class="search-title">{{title}}</div>
    <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">
@@ -13,7 +13,7 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="企业名称" size="mini">
        <el-form-item label="企业名称：" size="mini">
          <el-select style="width: 100%"  v-model="form.enterpriseVal"  @change="enterpriseType" :popper-class="'select-down'">
            <el-option
                v-for="item in enterpriseTypeOptions"
@@ -23,7 +23,7 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="二级单位" size="mini">
        <el-form-item label="二级单位：" size="mini">
          <el-select style="width: 100%"  v-model="form.enterpriseSubunitsVal"  @change="enterpriseSubunitsType" :popper-class="'select-down'">
            <el-option
                v-for="item in enterpriseSubunitsTypeOptions"
@@ -33,7 +33,7 @@
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="三级单位" size="mini">
        <el-form-item label="三级单位：" size="mini">
          <el-select style="width: 100%"  v-model="form.enterpriseSubunitsVal"  @change="enterpriseSubunitsType" :popper-class="'select-down'">
            <el-option
                v-for="item in enterpriseSubunitsTypeOptions"
@@ -54,7 +54,7 @@
            <!-- <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-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
          <el-button class="el-icon-search" @click="handleSearch"></el-button>
        </div>
        <!--              </el-form-item>-->
        <!--              <el-form-item>-->
@@ -63,7 +63,7 @@
        <!--              </el-form-item>-->
      </el-form>
    </div>
    <el-scrollbar style="height:300px">
    <el-scrollbar style="height:264px">
      <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" -->
        <i class="state"></i>
        <div>
@@ -72,46 +72,7 @@
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>
      <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" -->
        <i class="state"></i>
        <div>
          <h3>###炼化部</h3>
          <p>所属部门：<span>炼化部</span></p>
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>
      <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" -->
        <i class="state"></i>
        <div>
          <h3>###炼化部</h3>
          <p>所属部门：<span>炼化部</span></p>
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>
      <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" -->
        <i class="state"></i>
        <div>
          <h3>###炼化部</h3>
          <p>所属部门：<span>炼化部</span></p>
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>
      <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" -->
        <i class="state"></i>
        <div>
          <h3>###炼化部</h3>
          <p>所属部门：<span>炼化部</span></p>
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>
      <div class="environmental-risk-list" ><!-- v-for="(item,index) in list" :key="index" -->
        <i class="state"></i>
        <div>
          <h3>###炼化部</h3>
          <p>所属部门：<span>炼化部</span></p>
          <p>风险级别：<span>三级</span></p>
        </div>
      </div>

    </el-scrollbar>
    <!--   <span class="location-btn" @click="handleLocation(item)">588</span> -->
    <el-card class="footer-page" v-if="total > 10">
@@ -141,7 +102,7 @@
import WfsHelper from '@components/helpers/WfsHelper'
import AjaxUtils from '@utils/AjaxUtils'
export default {
  name: 'SewersSearch',
  name: 'GasWasteSearch',
  data () {
    return {
      gdVisible: true,

 src/components/panel/topicSearch/SewersSearch.vue

@@ -1,6 +1,6 @@
<template>
        <div class="sewers-search" v-if="gdVisible">
          <div class="search-title">{{title}}</div>
          <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">
@@ -30,7 +30,7 @@
                  <!-- <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-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
                <el-button class="el-icon-search" @click="handleSearch"></el-button>
              </div>
              <!--              </el-form-item>-->
              <!--              <el-form-item>-->
@@ -40,46 +40,15 @@
            </el-form>
          </div>
          <el-scrollbar style="height:380.44px;" >
            <div class="B-TMD-table-list" v-for="(item,index) in list" :key="index">
              <div class="B-TMD-table-list-title">
                <div class="B-TMD-table-list-head">
                  <div class="B-TMD-table-list-title-y"
                       :class="['B-TMD-table-list-title-y-nam', { 'warning': item.vehicleStatus==='910003' }, { 'offline': item.vehicleStatus==='910001' }]">
                    <!--                    <span>运单号：</span>-->
                    <span id="waybillNumber" class=""
                          :title="item.properties.pipename">
                                                <span class="location-btn" @click="handleLocation(item)">{{ item.properties.pipename }}</span>
                                            </span>
                  </div>
                  <!--                  <div class="B-TMD-table-list-title-c">-->
                  <!--                    {{ labelList[0] }}：-->
                  <!--                    <span id="plateNumber_p">-->
                  <!--                                                <span id="plateNumber_n"><a href="#">{{ item.properties.item.p1 }}</a></span>-->
                  <!--                                            </span>-->
                  <!--                  </div>-->
                </div>
                <!--                <div class="B-TMD-table-icons" style="float:right">-->
                <!--                  <ul>-->
                <!--                    <li class="B-TMD-table-list-title-y-adress"-->
                <!--                        @click="handleLocation(item)"></li>-->
                <!--                    <li :class="[{'B-TMD-table-list-title-y-car': item.vehicleStatus ==='910002', 'B-TMD-table-list-title-y-car-offline': item.vehicleStatus ==='910001','B-TMD-table-list-title-y-car-warning': item.vehicleStatus==='910003' }]"></li>-->
                <!--                  </ul>-->
                <!--                </div>-->
              </div>
              <div class="B-TMD-table-list-content">

                <div v-for="itm in labelList" :key="itm.label">
            <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 id="b_twe_loan" :title="item.properties[itm.key] ">{{ item.properties[itm.key] }}</span>
                </div>
                <!--                <div><span>收货企业：</span> <span-->
                <!--                    id="b_twe_loan1" :title="item.recvWarehouseName">{{ item.recvWarehouseName }}</span>-->
                <!--                </div>-->
                  <span :title="item.properties[itm.key] ">{{ item.properties[itm.key] }}</span>
                </p>
              </div>
              <!--              <div class="B-TMD-table-list-bottom">-->
              <!--                <div class="B-TMD-table-list-bottom-name">-->
              <!--                  货物名称：<span :title="item.materialName">{{ item.materialName }}</span></div>-->
              <!--              </div>-->
            </div>
          </el-scrollbar>
          <el-card class="footer-page" v-if="total > 10">

 src/components/panel/topicSearch/SoilGroundWaterSearch.vue

@@ -1,6 +1,6 @@
<template>
    <div class="sewers-search" v-if="gdVisible">
        <div class="search-title">{{title}}</div>
        <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">
@@ -44,7 +44,7 @@
                        <!-- <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-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
                    <el-button class="el-icon-search" @click="handleSearch"></el-button>
                </div>

                <!--              </el-form-item>-->
@@ -157,7 +157,8 @@
        { name: '一级风险', value: '2', color: 'sandybrown' },
        { name: '二级风险', value: '3', color: 'yellow' },
        { name: '三级风险', value: '4', color: 'green' }
      ]
      ],
      areaTypeOptions: []
    }
  },
  props: ['title'],

 src/components/panel/topicSearch/SolidWasteSearch.vue

@@ -1,6 +1,6 @@
<template>
  <div class="sewers-search" v-if="judgeVisible">
    <div class="search-title">{{title}}</div>
    <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 v-for="(item,index) in solidWasteTypeOptions" :key="index" :label="item.label+'：'" size="mini"
@@ -26,7 +26,7 @@

        <div class="rightButtonSearch">
          <el-input  v-model="form.keyword" size="mini"  placeholder="在此输入关键字搜索"></el-input>
          <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
          <el-button class="el-icon-search" @click="handleSearch"></el-button>
        </div>
      </el-form>
    </div>

 src/components/panel/topicSearch/WaterWasteSearch.vue

@@ -1,6 +1,6 @@
<template>
    <div class="sewers-search" v-if="judgeVisible">
        <div class="search-title">{{title}}</div>
        <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 v-for="(item,index) in solidWasteTypeOptions" :key="index" :label="item.label+'：'" size="mini"
@@ -20,7 +20,7 @@
                </el-radio-group>
                <div class="rightButtonSearch">
                    <el-input  v-model="form.keyword" size="mini"  placeholder="在此输入关键字搜索"></el-input>
                    <el-buttom class="el-icon-search" @click="handleSearch"></el-buttom>
                    <el-button class="el-icon-search" @click="handleSearch"></el-button>
                </div>
            </el-form>
        </div>

 src/components/plugin/proj4leaflet.js

New file
@@ -0,0 +1,273 @@
/* eslint-disable */
(function (factory) {
    var L, proj4;
    if (typeof define === 'function' && define.amd) {
        // AMD
        define(['leaflet', 'proj4'], factory);
    } else if (typeof module === 'object' && typeof module.exports === "object") {
        // Node/CommonJS
        L = require('leaflet');
        proj4 = require('proj4');
        module.exports = factory(L, proj4);
    } else {
        // Browser globals
        if (typeof window.L === 'undefined' || typeof window.proj4 === 'undefined')
            throw 'Leaflet and proj4 must be loaded first';
        factory(window.L, window.proj4);
    }
}(function (L, proj4) {
    if (proj4.__esModule && proj4.default) {
        // If proj4 was bundled as an ES6 module, unwrap it to get
        // to the actual main proj4 object.
        // See discussion in https://github.com/kartena/Proj4Leaflet/pull/147
        proj4 = proj4.default;
    }

    L.Proj = {};

    L.Proj._isProj4Obj = function(a) {
        return (typeof a.inverse !== 'undefined' &&
            typeof a.forward !== 'undefined');
    };

    L.Proj.Projection = L.Class.extend({
        initialize: function(code, def, bounds) {
            var isP4 = L.Proj._isProj4Obj(code);
            this._proj = isP4 ? code : this._projFromCodeDef(code, def);
            this.bounds = isP4 ? def : bounds;
        },

        project: function (latlng) {
            var point = this._proj.forward([latlng.lng, latlng.lat]);
            return new L.Point(point[0], point[1]);
        },

        unproject: function (point, unbounded) {
            var point2 = this._proj.inverse([point.x, point.y]);
            return new L.LatLng(point2[1], point2[0], unbounded);
        },

        _projFromCodeDef: function(code, def) {
            if (def) {
                proj4.defs(code, def);
            } else if (proj4.defs[code] === undefined) {
                var urn = code.split(':');
                if (urn.length > 3) {
                    code = urn[urn.length - 3] + ':' + urn[urn.length - 1];
                }
                if (proj4.defs[code] === undefined) {
                    throw 'No projection definition for code ' + code;
                }
            }

            return proj4(code);
        }
    });

    L.Proj.CRS = L.Class.extend({
        includes: L.CRS,

        options: {
            transformation: new L.Transformation(1, 0, -1, 0)
        },

        initialize: function(a, b, c) {
            var code,
                proj,
                def,
                options;

            if (L.Proj._isProj4Obj(a)) {
                proj = a;
                code = proj.srsCode;
                options = b || {};

                this.projection = new L.Proj.Projection(proj, options.bounds);
            } else {
                code = a;
                def = b;
                options = c || {};
                this.projection = new L.Proj.Projection(code, def, options.bounds);
            }

            L.Util.setOptions(this, options);
            this.code = code;
            this.transformation = this.options.transformation;

            if (this.options.origin) {
                this.transformation =
                    new L.Transformation(1, -this.options.origin[0],
                        -1, this.options.origin[1]);
            }

            if (this.options.scales) {
                this._scales = this.options.scales;
            } else if (this.options.resolutions) {
                this._scales = [];
                for (var i = this.options.resolutions.length - 1; i >= 0; i--) {
                    if (this.options.resolutions[i]) {
                        this._scales[i] = 1 / this.options.resolutions[i];
                    }
                }
            }

            this.infinite = !this.options.bounds;

        },

        scale: function(zoom) {
            var iZoom = Math.floor(zoom),
                baseScale,
                nextScale,
                scaleDiff,
                zDiff;
            if (zoom === iZoom) {
                return this._scales[zoom];
            } else {
                // Non-integer zoom, interpolate
                baseScale = this._scales[iZoom];
                nextScale = this._scales[iZoom + 1];
                scaleDiff = nextScale - baseScale;
                zDiff = (zoom - iZoom);
                return baseScale + scaleDiff * zDiff;
            }
        },

        zoom: function(scale) {
            // Find closest number in this._scales, down
            var downScale = this._closestElement(this._scales, scale),
                downZoom = this._scales.indexOf(downScale),
                nextScale,
                nextZoom,
                scaleDiff;
            // Check if scale is downScale => return array index
            if (scale === downScale) {
                return downZoom;
            }
            if (downScale === undefined) {
                return -Infinity;
            }
            // Interpolate
            nextZoom = downZoom + 1;
            nextScale = this._scales[nextZoom];
            if (nextScale === undefined) {
                return Infinity;
            }
            scaleDiff = nextScale - downScale;
            return (scale - downScale) / scaleDiff + downZoom;
        },

        distance: L.CRS.Earth.distance,

        R: L.CRS.Earth.R,

        /* Get the closest lowest element in an array */
        _closestElement: function(array, element) {
            var low;
            for (var i = array.length; i--;) {
                if (array[i] <= element && (low === undefined || low < array[i])) {
                    low = array[i];
                }
            }
            return low;
        }
    });

    L.Proj.GeoJSON = L.GeoJSON.extend({
        initialize: function(geojson, options) {
            this._callLevel = 0;
            L.GeoJSON.prototype.initialize.call(this, geojson, options);
        },

        addData: function(geojson) {
            var crs;

            if (geojson) {
                if (geojson.crs && geojson.crs.type === 'name') {
                    crs = new L.Proj.CRS(geojson.crs.properties.name);
                } else if (geojson.crs && geojson.crs.type) {
                    crs = new L.Proj.CRS(geojson.crs.type + ':' + geojson.crs.properties.code);
                }

                if (crs !== undefined) {
                    this.options.coordsToLatLng = function(coords) {
                        var point = L.point(coords[0], coords[1]);
                        return crs.projection.unproject(point);
                    };
                }
            }

            // Base class' addData might call us recursively, but
            // CRS shouldn't be cleared in that case, since CRS applies
            // to the whole GeoJSON, inluding sub-features.
            this._callLevel++;
            try {
                L.GeoJSON.prototype.addData.call(this, geojson);
            } finally {
                this._callLevel--;
                if (this._callLevel === 0) {
                    delete this.options.coordsToLatLng;
                }
            }
        }
    });

    L.Proj.geoJson = function(geojson, options) {
        return new L.Proj.GeoJSON(geojson, options);
    };

    L.Proj.ImageOverlay = L.ImageOverlay.extend({
        initialize: function (url, bounds, options) {
            L.ImageOverlay.prototype.initialize.call(this, url, null, options);
            this._projectedBounds = bounds;
        },

        // Danger ahead: Overriding internal methods in Leaflet.
        // Decided to do this rather than making a copy of L.ImageOverlay
        // and doing very tiny modifications to it.
        // Future will tell if this was wise or not.
        _animateZoom: function (event) {
            var scale = this._map.getZoomScale(event.zoom);
            var northWest = L.point(this._projectedBounds.min.x, this._projectedBounds.max.y);
            var offset = this._projectedToNewLayerPoint(northWest, event.zoom, event.center);

            L.DomUtil.setTransform(this._image, offset, scale);
        },

        _reset: function () {
            var zoom = this._map.getZoom();
            var pixelOrigin = this._map.getPixelOrigin();
            var bounds = L.bounds(
                this._transform(this._projectedBounds.min, zoom)._subtract(pixelOrigin),
                this._transform(this._projectedBounds.max, zoom)._subtract(pixelOrigin)
            );
            var size = bounds.getSize();

            L.DomUtil.setPosition(this._image, bounds.min);
            this._image.style.width = size.x + 'px';
            this._image.style.height = size.y + 'px';
        },

        _projectedToNewLayerPoint: function (point, zoom, center) {
            var viewHalf = this._map.getSize()._divideBy(2);
            var newTopLeft = this._map.project(center, zoom)._subtract(viewHalf)._round();
            var topLeft = newTopLeft.add(this._map._getMapPanePos());

            return this._transform(point, zoom)._subtract(topLeft);
        },

        _transform: function (point, zoom) {
            var crs = this._map.options.crs;
            var transformation = crs.transformation;
            var scale = crs.scale(zoom);

            return transformation.transform(point, scale);
        }
    });

    L.Proj.imageOverlay = function (url, bounds, options) {
        return new L.Proj.ImageOverlay(url, bounds, options);
    };

    return L.Proj;
}));

 src/components/table/components/SolidWaste.vue

@@ -1,111 +1,201 @@
<template>
   <div class="Solid-Waste">
       <el-table
               class="tableBox"
               :data="tableData"
               :header-cell-style="tableHeaderColor"
               :cell-style="rowClass"
               @cell-click="handle"
       >
           <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">
             <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 label="产生量 （吨）">
               <el-table-column
                       prop="AddOutPut"
                       label="一般固废"
                       width="100px">
               </el-table-column>
               <el-table-column
                       prop="MonthOutPut"
                       label="危险废物"
                       width="100px">
               </el-table-column>
           </el-table-column>
           <el-table-column label="贮存状态（个）">
               <el-table-column
                       prop="normal"
                       label="正常"
                       width="100px">
                 <template slot-scope="{row,$index}">
                   <u v-if="$index!=1" >{{row.normal}}</u>
                   <el-popover v-else
                               placement="bottom-end"
                               width="200"
                               trigger="click"
                               title="监测点排放明细"
                   >
                     <ChemicalWastewater></ChemicalWastewater>
                     <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                   </el-popover>
                 </template>
               </el-table-column>
               <el-table-column
                       prop="warning"
                       label="预警"
                       width="100px">
               </el-table-column>
           </el-table-column>
       </el-table>
   </div>
  <div class="waste-water">
    <el-table
        class="tableBox"
        :data="tableData"
        style="width: 100%"
        :header-cell-style="tableHeaderColor"
        :cell-style="rowClass"
        @cell-click="handle"
    >
      <el-table-column
          width="30px"
          label=""
      >
        <template slot-scope="{row,$index}">
          <!--                   <i class="el-icon-caret-right" v-if="$index ===1"></i>-->
          <el-popover
              placement="bottom"
              trigger="click"
              :disabled="!isShowIcon"
              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>
      <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 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>
      <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>
      <el-table-column label="排放口检测统计状态">
        <el-table-column
            prop="normal"
            label="正常"
            width="60px">
          <template slot-scope="{row,$index}">
            <u v-if="$index!=2" >{{row.normal}}</u>
            <el-popover v-else
                        placement="bottom-end"
                        width="200"
                        trigger="click"
                        popper-class="popovers"
                        title="监测点明细表"
            >
              <refinery></refinery>
              <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
              <!--                       <i class="el-icon-caret-bottom" v-else-if="isShowIcon&&scope.row.index===1"></i>-->
              <!--                       <i v-if="isShowIcon" class="el-icon-caret-bottom" slot="reference" @click="isbtn"></i>-->
              <!--                   <i v-else class="el-icon-caret-right" slot="reference" @click="isbtn"></i>-->
            </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">
          <template slot-scope="{row,$index}">
            <u v-if="$index!=1" >{{row.deficiency}}</u>
            <el-popover v-else
                        placement="bottom-end"
                        width="200"
                        trigger="click"
                        title="天津石化监测点缺失报警明细"
                        popper-class="popovers"
            >
              <MissingAlarm></MissingAlarm>
              <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u>
            </el-popover>
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
    <!--       <ChemicalWastewater v-show="isShowIcon"></ChemicalWastewater>-->
    <!--           </el-col>-->
    <!--       </el-row>-->
  </div>
</template>

<script>
import ChemicalWastewater from '@components/table/components/componented/ChemicalWastewater'
import ChemicalWastewater from './componented/ChemicalWastewater'
import Refinery from '@components/table/components/componented/refinery'
import MissingAlarm from '@components/table/components/componented/MissingAlarm'
export default {
  name: 'SolidWaste',
  components: {
    MissingAlarm,
    Refinery,
    ChemicalWastewater
  },
  data () {
    return {
      isActive: '',
      isShowIcon: false,
      tableData: [{
        UserName: '集团名称',
        AddOutPut: '580',
        MonthOutPut: '250',
        normal: '10',
        warning: '9'
        WasteWaters: '',
        AddOutPut: '',
        MonthOutPut: '',
        NH4NPut: '',
        NH4NMonth: '',
        normal: '',
        overProof: '',
        Abnormal: '',
        StopProduction: '',
        deficiency: ''
      }, {
        UserName: '天津石化',
        WasteWaters: '116.6',
        AddOutPut: '58.3',
        MonthOutPut: '13.1',
        warning: '13.1',
        normal: '21'
        NH4NPut: '58.3',
        NH4NMonth: '13.1',
        normal: '21',
        overProof: '2',
        Abnormal: '2',
        StopProduction: '2',
        deficiency: '2'
      }, {
        UserName: 'xxxx炼化3',
        WasteWaters: '116.6',
        MonthOutPut: '13.1',
        warning: '13.1',
        normal: '21'
        NH4NPut: '58.3',
        NH4NMonth: '13.1',
        normal: '21',
        overProof: '2',
        Abnormal: '2',
        StopProduction: '2',
        deficiency: '2'
      }, {
        UserName: 'xxxx4',
        WasteWaters: '116.6',
        AddOutPut: '58.3',
        MonthOutPut: '13.1',
        warning: '13.1',
        normal: '21'
        NH4NPut: '58.3',
        NH4NMonth: '13.1',
        normal: '21',
        overProof: '2',
        Abnormal: '2',
        StopProduction: '2',
        deficiency: '2'

      }]
    }
  },
@@ -120,14 +210,35 @@
    // 获取点击的表格
    handle (row, column, event, cell) {
      console.log(row.UserName)
    },
    doIcon (index) {
      if (index !== 1) {
        this.isShowIcon = false
        this.isActive = ''
        return
      }
      this.isShowIcon = !this.isShowIcon
      if (index === this.isActive) {
        this.isActive = ''
        return
      }
      this.isActive = index
    }
  }
}
</script>

<style scoped>
.Solid-Waste{
    width: 100%;
    height: 100%;
.popovers{
  width: auto !important;
  background-color: gray !important;
}
.popovers.el-popover{
  padding:0;
}
.active {
  /*color: red;*/
  transform:rotate(90deg);
}

</style>

 src/components/table/summarySheets.vue

@@ -1,33 +1,41 @@
<template>
    <div class="summary-sheets">
        <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="统计表" placement="left">
            <div :class='["iconBtn",summaryVisible ? "active-button" : ""]' @click="closeBtn">
                <img src="@assets/images/map-pages/icon/toolbox/table.png" alt="" class="icon">
                <!--<span class="icon-name">统计表</span>-->
            </div>
        </el-tooltip>
        <Dialog ref="summarySheets" title="企业指标分类统计">
          <tab-handover></tab-handover>
        </Dialog >
  <div class="summary-sheets">
    <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="统计表" placement="left">
      <div :class='["iconBtn",summaryVisible ? "active-button" : ""]' @click="closeBtn">
        <img src="@assets/images/map-pages/icon/toolbox/table.png" alt="" class="icon">
        <!--<span class="icon-name">统计表</span>-->
      </div>
    </el-tooltip>
    <!--        <Dialog ref="summarySheets" title="企业指标分类统计">-->
    <!--          <tab-handover></tab-handover>-->
    <!--        </Dialog >-->
    <div class="dialog" v-drag v-show="dialogShow">
      <tab-handover></tab-handover>
    </div>
  </div>
</template>

<script>
import tabHandover from '@components/table/components/tabHandover'
import Dialog from '@views/popup/Dialog'
// import Dialog from '@views/popup/Dialog'

import '@/components/BaseNav/SolidWaste/directive/dir'

export default {
  name: 'summary-sheet.vue',
  components: {
    tabHandover,
    Dialog
    tabHandover
    // Dialog
  },
  data () {
    return {
      summaryVisible: false
      summaryVisible: false,
      dialogShow: false
    }
  },
  methods: {
    closeBtn () {
      this.dialogShow = !this.dialogShow
      // const summary = document.getElementById('summary')
      // summary.style.display = 'none'
      this.$refs.summarySheets.show()
@@ -46,19 +54,28 @@
</script>

<style scoped lang="less">
    .summary-sheets {
        position: absolute;
        top: 0.42979rem;
        left: 0.14583rem;
        /*width: 850px;*/
        /*height: 265px;*/
        z-index:500;
.summary-sheets {
  position: absolute;
  top: 0.42979rem;
  left: 0.14583rem;
  /*width: 850px;*/
  /*height: 265px;*/
  z-index: 500;

        /*color: #fff;*/
       .el-icon-c-scale-to-original {
         width: 30px;
         height: 30px;
         font-size: 30px;
       }
    }
  .dialog {
    //width: 800px;
    //height: 300px;
    position: absolute;
    top: 15%;
    left: 3rem;
  }

  /*color: #fff;*/

  .el-icon-c-scale-to-original {
    width: 30px;
    height: 30px;
    font-size: 30px;
  }
}
</style>

 src/router/index.js

@@ -35,9 +35,11 @@
    console.log(homeRouterName)
    next()
  } else if (!token) {
    next({
      name: LOGIN_PAGE_ROUTE_NAME // 跳转到登录页
    })
    // next({
    //   name: LOGIN_PAGE_ROUTE_NAME // 跳转到登录页
    // })
    console.log(LOGIN_PAGE_ROUTE_NAME)
    next()
  } else {
    next()
  }

 src/styles/theme-dark/el-ui/tabs.less

@@ -1,7 +1,7 @@
.el-tabs{}

.el-tabs__header{
  border-bottom: 1px solid #26defd;
  border-bottom: 1px solid @background-color-split !important;
  padding: 0;
  position: relative;
  margin: 0 0 15px;
@@ -125,7 +125,9 @@
  overflow: hidden;
  position: relative;
}

.el-tabs--card > .el-tabs__header{
  border-bottom: 1px solid @background-color-split;
}
.el-tabs--card > .el-tabs__header .el-tabs__active-bar {
  display: none;
}

 src/views/Temp.vue

@@ -35,7 +35,11 @@
// // 公共展示数据
import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'
import LayerFactory from '@components/LayerController/service/LayerFactory'

const esri = require('esri-leaflet')
// const proj4 = require('proj4')
const proj4 = require('proj4')
window.proj4 = proj4
const Proj = require('../components/plugin/proj4leaflet')
export default {
  name: 'Temp',
  components: {
@@ -82,6 +86,35 @@
    },
    init () {
      const mapcontainer = this.$refs.rootmap
      const CRS_4490 = new Proj.CRS('EPSG:4490', '+proj=longlat +ellps=GRS80 +no_defs', {
        resolutions: [
          1.40625,
          0.703125,
          0.3515625,
          0.17578125,
          0.087890625,
          0.0439453125,
          0.02197265625,
          0.010986328125,
          0.0054931640625,
          0.00274658203125,
          0.001373291015625,
          6.866455078125E-4,
          3.4332275390625E-4,
          1.71661376953125E-4,
          8.58306884765625E-5,
          4.291534423828125E-5,
          2.1457672119140625E-5,
          1.0728836059570312E-5,
          5.364418029785156E-6,
          2.682209064925356E-6,
          1.3411045324626732E-6
        ],
        origin: [-180, 90]
      })
      console.log(mapcontainer)
      console.log(CRS_4490)
      debugger
      this.map = Sgis.initMap(mapcontainer)
      this.$refs.toolBox.map = this.map

@@ -94,7 +127,7 @@
      window.layerFactory = layerFactory

      this.basemapHelper = Sgis.initBasemapsHelper(this.map) // 初始化基础底图助手
      this.basemapHelper.initBasemap(this.config, true) // 第二个参数，表示是否内网底图
      this.basemapHelper.initBasemap(this.config, false) // 第二个参数，表示是否内网底图
      // this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // 初始化动态要素图层助手
      // this.vectorLayerHelper.initVectorLayers(this.config)

@@ -106,6 +139,15 @@
      // this.setBasemapHelper(this.basemapHelper)
      // this.setServiceLayerHelper(this.serviceLayerHelper)
      // this.setVectorLayerHelper(this.vectorLayerHelper)
      this.loadArcgisImg()
    },
    loadArcgisImg () {
      // const url = 'http://10.246.132.249:8080/OneMapServer/rest/services/base-map-image-enterprise/MapServer/tile/{z}/{y}/{x}'
      const url = 'http://10.246.132.249:8080/OneMapServer/rest/services/base-map-image-enterprise/MapServer'
      // const arcgisTileLayer = this.L.tileLayer(url, {
      const arcgisTileLayer = esri.tiledMapLayer({ url: url })
      // const arcgisTileLayer = esri.dynamicMapLayer({ url: url })
      arcgisTileLayer.addTo(this.map)
    },
    onLayerClick () {
      this.$refs.popup.setShow()