工具栏样式修改，报表页面部分完成，样式调试。

chenyabin

2021-04-22 7b446d6f843e820734319ff05003eadd2f2d944b

工具栏样式修改，报表页面部分完成，样式调试。

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

@@ -131,6 +131,7 @@

.el-table th, .el-table tr {
  background-color: transparent;
  padding: 0.02rem;
}

.el-table {
@@ -221,13 +222,20 @@
    margin: 5px;
    width: 30px;
    height: 30px;
    background: @background-color-tools;
    color: #00fff6;
    background: rgba(0, 16, 30, 0.7);
    border: 0.00521rem solid #00fff6;
    vertical-align: middle !important;

    img {
      width: 16px;
      height: 16px;
    }
  }
  .el-button.hover{
    color: @color-highlight;
    border: .00521rem solid @color-highlight;
    box-shadow: 0 0 .03rem @color-highlight;
  }
}

@@ -375,9 +383,7 @@
    }
  }
}
.el-table--border{
  border-bottom: 1px solid #ddd;
}


.el-dialog--center .el-dialog__body{
  padding: 0.04rem;
@@ -411,6 +417,19 @@

.el-table td, .el-table th.is-leaf {
  font-size: 0.08rem;
}
.el-table .has-gutter tr th{
  border:1px solid @background-color-split;
}
.el-table .has-gutter tr th  .cell{
  color: #fff;
}
.el-table--border{
 // border:1px solid @background-color-split;
  border:none
}
.el-table--border::after, .el-table--group::after, .el-table::before{
  background:none;
}

.el-table .warning-row {
@@ -647,10 +666,28 @@
.fixed-table {
  background: rgba(0, 16, 30, 1) !important;
}
/****************************私有***/
.baoBiao{
  .el-dialog.el-dialog--center{
    top:100px;
    left: 100px;
/****************************报表二级子弹框样式***/
.el-tabs__nav-wrap::after{background: none;}
.el-tabs__header{margin-bottom: 0.04rem;
  .is-active{color: @color-highlight}
}
.el-tabs__active-bar{
  background: @color-highlight;
}

.el-popover.popovers{
  background: @background-color;
  padding: 0;
  border: 0.00521rem solid @color;
  overflow: hidden;
  box-shadow: 0 0 0.03rem @color;
  .el-popover__title{color: #fff;margin: 0;padding:0.06rem; background: @background-color;border-bottom: 1px solid @background-color-split}
  .refinery {
    background-color: @background-color;

  }
  .waste-water{
    background-color: @background-color;
  }
}


 src/components/LayerController/modules/LcServiceLayer.vue

@@ -94,7 +94,7 @@
        .wms-panel {

            .wms-panel-scrollbar{
                height: 457px;
                height: 600px;
                width: 285px;
                //width: 2.5rem;
                font-size: 14px;

 src/components/panel/ToolBoxPanel.vue

@@ -14,12 +14,11 @@
              :popper-class="'tools-panel-content'"
              v-for="(item,index) in menuList" :key="index"
              :width="item.index === '2'?230 : 150"
              v-model="isShow[index]"
          >
              v-model="isShow[index]">
            <el-button slot="reference" class="el-button" :class="active === index? 'tools-panel-choose':''" @click.native="changeChoose(index)">
              <i :class="'icon iconfont '+item.icon"></i>
            </el-button>
            <el-button v-for="(itemT,indexT) in item.items" :key="indexT" @click="choiceItem(itemT,indexT)" v-show="item.index!=='2'">
            <el-button v-for="(itemT,indexT) in item.items" :key="indexT" @click="choiceItem(itemT,indexT)" v-show="item.index!=='2'" :class="indexT==toolActive?'hover':''" >
              <i :class="'icon iconfont '+itemT.icon"></i>
            </el-button>
            <lc-base-map v-show="item.index==='2'"></lc-base-map>
@@ -102,6 +101,7 @@
      checkedItem: false,
      Selecd: -1,
      isSelecd: -1,
      toolActive: -1,
      menuList: [
        {
          icon: 'iconjuliceliang', // plot,
@@ -114,6 +114,7 @@
              label: '点标绘',
              icon: 'iconlocation-full', // marker,
              title: '点标绘',
              active: false,
              iconChoose: markerChoose
            },
            {
@@ -121,6 +122,7 @@
              label: '线标绘',
              icon: 'iconline', // line,
              title: '线标绘',
              active: 0,
              iconChoose: lineChoose
            },
            {
@@ -128,6 +130,7 @@
              label: '多边形',
              icon: 'iconliubianxing1', // polygonJ,
              title: '多边形',
              active: 0,
              iconChoose: polygonJChoose
            },
            {
@@ -135,6 +138,7 @@
              label: '矩形',
              icon: 'iconcheckbox-full', // polygonS,
              title: '矩形',
              active: 0,
              iconChoose: polygonSChoose
            },
            {
@@ -142,11 +146,13 @@
              label: '圆形',
              icon: 'iconyuan', // polygonY,
              title: '圆形',
              active: 0,
              iconChoose: polygonYChoose
            },
            {
              index: '1-4',
              label: '删除',
              active: -1,
              icon: 'icondelete-fill', // del,
              title: '删除标绘',
              iconChoose: delChoose
@@ -164,6 +170,7 @@
              label: '距离',
              icon: 'iconjuliceliang', // distance,
              title: '距离测量',
              active: 0,
              iconChoose: distanceChoose
            },
            {
@@ -171,6 +178,7 @@
              label: '面积',
              icon: 'iconmianjiceliang', // mm,
              title: '面积测量',
              active: 0,
              iconChoose: mmChoose
            },
            {
@@ -178,6 +186,7 @@
              label: '清除',
              icon: 'icondelete-fill', // del,
              title: '清除测量',
              active: -1,
              iconChoose: delChoose
            }
          ]
@@ -191,6 +200,7 @@
            {
              label: '影像图',
              index: '2-1',
              active: 0,
              items: [
                {
                  index: '2-1-1',
@@ -201,6 +211,7 @@
            {
              label: '矢量图',
              index: '2-2',
              active: 0,
              items: [
                {
                  index: '2-2-1',
@@ -211,6 +222,7 @@
            {
              label: '地形图',
              index: '2-3',
              active: 0,
              items: [
                {
                  index: '2-3-1',
@@ -230,18 +242,21 @@
              index: '4-1',
              label: '全屏',
              icon: 'icontianchongxing-', // FullScreen,
              active: 0,
              title: '全屏'
            },
            {
              index: '4-2',
              label: 'A4横向',
              icon: 'iconsaoma', // cross,
              active: 0,
              title: 'A4横向'
            },
            {
              index: '4-3',
              label: 'A4纵向',
              icon: 'iconsaoma zongs', // vertical,
              active: 0,
              title: 'A4纵向'
            }
          ]
@@ -270,6 +285,7 @@
        this.drawLayer = this.L.layerGroup().addTo(this.map)
      }
      this.active = index
      this.toolActive = -1
      // console.log(this.basemapList)
      for (let i = 0; i < this.isShow.length; i++) {
        if (i !== index) {
@@ -282,6 +298,11 @@
    },
    choiceItem (itemT, indexT) {
      this.Selecd = indexT
      if (itemT.active !== -1) {
        this.toolActive = indexT
      } else {
        this.toolActive = -1
      }
      if (this.isSelecd === indexT) {
        this.checkedItem = !this.checkedItem
      } else {
@@ -432,8 +453,9 @@
      margin: 0 0.015rem;
      width: 0.2725rem;
      height: 0.2725rem;
       color:#fff;
       color:#00fff6;
      background: @background-color;
       border: 0.00521rem solid #00fff6;
      vertical-align: middle !important;
       font-size: 20px;
      .base-map-img {

 src/components/table/components/SoilGroundwater.vue

File was renamed from src/components/BaseNav/SoilGroundwater/ReportTable.vue
@@ -4,7 +4,7 @@
            <el-table-column width="30px" label="">
                <template slot-scope="{row,$index}">
                    <el-popover placement="bottom" trigger="click" :disabled="!isShowIcon" popper-class="popovers">
                        <!--  <ChemicalWastewater v-show="$index ===1"></ChemicalWastewater> -->
                        <ChemicalWastewater v-show="$index ===1"></ChemicalWastewater>
                        <i class="el-icon-caret-right" :class="{active: isActive === $index}" slot="reference" @click="doIcon($index)"></i>
                    </el-popover>
                </template>
@@ -23,8 +23,8 @@
                </div>
                <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>
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="一级风险地块">
                        <refinery :tableHeader="tableHeader1" :tableContent="tableContent1" ></refinery>
                        <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                    </el-popover>
                </template>
@@ -35,8 +35,8 @@
                </div>
                <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>
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="二级风险地块">
                        <refinery :tableHeader="tableHeader1" :tableContent="tableContent1"></refinery>
                        <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                    </el-popover>
                </template>
@@ -47,8 +47,8 @@
                </div>
                <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>
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="三级风险地块">
                        <refinery :tableHeader="tableHeader1" :tableContent="tableContent1"></refinery>
                        <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                    </el-popover>
                </template>
@@ -59,8 +59,8 @@
                </div>
                <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>
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="土壤采样点">
                        <refinery :tableHeader="tableHeader2" :tableContent="tableContent1"></refinery>
                        <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                    </el-popover>
                </template>
@@ -71,8 +71,8 @@
                </div>
                <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>
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="地下水采样点">
                        <refinery :tableHeader="tableHeader2" :tableContent="tableContent1"></refinery>
                        <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                    </el-popover>
                </template>
@@ -144,7 +144,25 @@
        StopProduction: '2',
        deficiency: '2'

      }]
      }],
      tableHeader1: [
        { name: '企业名称', width: '140', propS: 'value1' },
        { name: '地块名称', width: '140', propS: 'value2' },
        { name: '地块信息', width: '140', propS: 'value3' },
        { name: '地下水（个）', width: '140', propS: 'value4' },
        { name: '土壤（个）', width: '140', propS: 'value5' }
      ],
      tableHeader2: [
        { name: '土壤名称', width: '140', propS: 'value1' },
        { name: 'PH', width: '80', propS: 'value2' },
        { name: '六价格', width: '100', propS: 'value3' },
        { name: '铅', width: '100', propS: 'value4' },
        { name: '汞', width: '100', propS: 'value5' }
      ],
      tableContent1: [
        { value1: '1', value2: '2', value3: '3', value4: '4', value5: '5' },
        { value1: '1', value2: '2', value3: '3', value4: '4', value5: '5' }
      ]
    }
  },
  methods: {

 src/components/table/components/WasteGas.vue

@@ -1,131 +1,54 @@
<template>
    <div class="Waste-water">
        <el-table
                class="tableBox"
                :data="tableData"
                :header-cell-style="tableHeaderColor"
                :cell-style="rowClass"
                @cell-click="handle"
        >
            <el-table-column
                    width="30px"
                    label=""
            >
        <el-table class="tableBox" :data="tableData" :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"
                >
                <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 label="序号" width="45px" type="index"></el-table-column>
            <el-table-column prop="UserName" label="企业名称">
                  <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="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 prop="WasteWaters" label="工业外排废水量（m³）" width="100px"></el-table-column>
            <el-table-column label="二氧化硫 (产生量/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
                    prop="WasteWaters"
                    label="工业外排废水量（m³）"
                    width="100px">
            <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="二氧化硫 (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="VOCs  (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 label="VOCs  (产生量/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">
                <el-table-column prop="normal" label="正常" width="40px">
                  <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="监测点排放明细"
                    >
                      <refinery></refinery>
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="监测点排放明细">
                      <refinery :tableHeader="tableHeader1" :tableContent="tableContent1"></refinery>
                      <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
                    </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="40px"></el-table-column>
                <el-table-column prop="Abnormal" label="异常" width="40px"></el-table-column>
                <el-table-column prop="StopProduction" label="停产" width="40px"></el-table-column>
                <el-table-column prop="deficiency" label="缺失" width="40px">
                  <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="监测点排放明细"
                    >
                    <el-popover v-else placement="bottom-end" trigger="click" popper-class="popovers" title="监测点排放明细">
                      <MissingAlarm></MissingAlarm>
                      <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u>
                    </el-popover>
@@ -199,16 +122,28 @@
        StopProduction: '2',
        deficiency: '2'

      }]
      }],
      tableHeader1: [
        { name: '排放点', width: '140', propS: 'value1' },
        { name: '单位部门', width: '80', propS: 'value2' },
        { name: '废气排放量（m³）', width: '120', propS: 'value3' },
        { name: '二氧化硫（t）', width: '100', propS: 'value4' },
        { name: '氮氧化物（t）', width: '100', propS: 'value5' },
        { name: 'VOCs（t）', width: '100', propS: 'value5' }
      ],
      tableContent1: [
        { value1: '1', value2: '2', value3: '3', value4: '4', value5: '5' },
        { value1: '1', value2: '2', value3: '3', value4: '4', value5: '5' }
      ]
    }
  },
  methods: {
    tableHeaderColor ({ 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) {

 src/components/table/components/WasteSolid.vue

@@ -35,26 +35,25 @@
          <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 prop="WasteWaters" width="100px">
        <div slot="header">
          <span>外排废水量</span>
          <div>（m³）</div>
        </div>
      </el-table-column>
      <el-table-column label="氨氮  (t)">
        <el-table-column prop="NH4NPut" label="累计产生量"></el-table-column>
        <el-table-column prop="NH4NMonth" label="当月生产量"></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="累计"></el-table-column>
        <el-table-column prop="NH4NMonth" label="当月"></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="监测点明细表"
            >
            <el-popover v-else placement="bottom-end" 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>-->
@@ -69,13 +68,7 @@
        <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"
            >
            <el-popover v-else placement="bottom-end" trigger="click" title="天津石化监测点缺失报警明细" popper-class="popovers">
              <MissingAlarm></MissingAlarm>
              <u slot="reference" style="color: #00ffff">{{ row.deficiency }}</u>
            </el-popover>

 src/components/table/components/WasteWater.vue

@@ -4,12 +4,7 @@
               <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"
                        >
                 <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>-->
@@ -17,32 +12,32 @@
                   </template>
               </el-table-column>
               <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="企业名称" >
                 <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">
               <el-table-column prop="WasteWaters" width="80">
                   <div slot="header">
                      <span>外排废水量</span>
                       <div>（m³）</div>
                   </div>
               </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 label="COD  (产生量/t)">
                   <el-table-column prop="AddOutPut" label="累计" width="70"></el-table-column>
                   <el-table-column prop="MonthOutPut" label="当月" width="70"></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 label="氨氮  (产生量/t)">
                   <el-table-column prop="NH4NPut" label="累计" width="70"></el-table-column>
                   <el-table-column prop="NH4NMonth" label="当月" width="70"></el-table-column>
               </el-table-column>
               <el-table-column label="排放口检测统计状态">
                   <el-table-column prop="normal" label="正常" width="60px">
               <el-table-column label="排放口检测统计状态 (个)">
                   <el-table-column prop="normal" label="正常" width="60">
                     <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="监测点明细表">
                       <el-popover v-else placement="bottom-end" 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>-->
@@ -51,22 +46,13 @@
                       </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="60"></el-table-column>
                   <el-table-column prop="Abnormal" label="异常" width="60"></el-table-column>
                   <el-table-column prop="StopProduction" label="停产" width="60"></el-table-column>
                   <el-table-column prop="deficiency" label="缺失" width="60">
                     <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"
                       >
                       <el-popover v-else placement="bottom-end" trigger="click" title="天津石化监测点缺失报警明细" popper-class="popovers">
                         <MissingAlarm></MissingAlarm>
                         <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u>
                       </el-popover>

 src/components/table/components/componented/ChemicalWastewater.vue

@@ -8,19 +8,24 @@
        <div class="panel-title">监测点排放明细</div>
        <el-table class="tableBox" :data="tableData">
            <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="WasteWaters" label="工业外排废水量（m³）" width="200px"></el-table-column>
            <el-table-column prop="UserName" label="企业名称" width="120"></el-table-column>
            <el-table-column prop="WasteWaters" width="100">
                <div slot="header">
                    <span>工业外排废水量</span>
                    <div>（m³）</div>
                </div>
            </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 prop="AddOutPut" label="一般固废" width="65"></el-table-column>
                <el-table-column prop="MonthOutPut" label="危险废物" width="65"></el-table-column>
            </el-table-column>
            <el-table-column label="贮存状态（个）">
                <el-table-column prop="normal" label="正常" width="100px"></el-table-column>
                <el-table-column prop="warning" label="预警" width="100px"></el-table-column>
                <el-table-column prop="normal" label="正常" width="60"></el-table-column>
                <el-table-column prop="warning" label="预警" width="60"></el-table-column>
            </el-table-column>
            <el-table-column label="贮存状态（个）">
                <el-table-column prop="normal" label="正常" width="100px"></el-table-column>
                <el-table-column prop="warning" label="预警" width="100px"></el-table-column>
                <el-table-column prop="normal" label="正常" width="60"></el-table-column>
                <el-table-column prop="warning" label="预警" width="60"></el-table-column>
            </el-table-column>
        </el-table>
    </div>
@@ -48,30 +53,9 @@
  }
}
</script>
<style scoped>
<style lang="less">
    .Chemical-Waste-water {
    /*    position:fixed;*/
    /*    top: 330px;*/
    /*    left: 65px;*/
    /*    !*width: 850px;*!*/
    /*    !*height: 265px;*!*/
    /*    border: #90c8e0 1px solid;*/
    /*    z-index:3000;*/
      text-align: center;
        background-color: rgba(26, 73, 81, 0.901960784313726);
      text-align: center;background:@background-color;
        color: #fff;
    }
    /*.head-area{*/
    /*    color: #fff;*/
    /*    width: 100%;*/
    /*    height: 40px;*/
    /*    background-color: #002433;*/
    /*    font-size: 16px;*/
    /*    border-bottom: #90c8e0 2px solid;*/
    /*    padding-left: 16px;*/
    /*    !*line-height: 40px;*!*/
    /*}*/
    /*.head-area-button{*/
    /*    margin-right: 5px;*/
    /*}*/
</style>

 src/components/table/components/componented/MissingAlarm.vue

@@ -1,99 +1,28 @@
<template>
<div class="MissingAlarm">
<div class="waste-water">
  <el-tabs v-model="activeName">
    <el-tab-pane label="小时数据" name="first">
      <el-table
          :data="tableData"
          border
          style="width: 100%"
      >
        <el-table-column
            prop="date"
            label="排放点"
            width="150">
        </el-table-column>
          <el-table-column
              prop="name"
              label="排放类型"
              width="120">
          </el-table-column>
          <el-table-column
              prop="name"
              label="报警时间"
              width="120">
          </el-table-column>
          <el-table-column
              prop="name"
              label="恢复时间"
              width="120">
          </el-table-column>
        <el-table-column
            prop="name"
            label="缺失小时数"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="缺失原因类型"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="原因描述"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="整改措施"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="限定整改结束时间"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="实际整改结束时间"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="联网时间"
            width="120">
        </el-table-column>
        <el-table-column
            prop="name"
            label="凭证"
            width="120">
        </el-table-column>
      <el-table :data="tableData" border style="width: 100%">
          <el-table-column prop="date" label="排放点" width="150"></el-table-column>
          <el-table-column prop="name" label="排放类型" width="120"></el-table-column>
          <el-table-column prop="name" label="报警时间" width="120"></el-table-column>
          <el-table-column prop="name" label="恢复时间" width="120"></el-table-column>
          <el-table-column prop="name" label="缺失小时数" width="120"></el-table-column>
          <el-table-column prop="name" label="缺失原因类型" width="120"></el-table-column>
          <el-table-column prop="name" label="原因描述" width="120"></el-table-column>
          <el-table-column prop="name" label="整改措施" width="120"></el-table-column>
          <el-table-column prop="name" label="限定整改结束时间" width="120"></el-table-column>
          <el-table-column prop="name" label="实际整改结束时间" width="120"></el-table-column>
          <el-table-column prop="name" label="联网时间" width="120"></el-table-column>
          <el-table-column prop="name" label="凭证" width="120"></el-table-column>
      </el-table>
    </el-tab-pane>
    <el-tab-pane label="日数据" name="second">
      <el-table
          :data="tableData"
          border
          style="width: 100%">
        <el-table-column
            prop="date"
            label="排放点"
            width="150">
        </el-table-column>
          <el-table-column
              prop="name"
              label="排放类型"
              width="120">
          </el-table-column>
          <el-table-column
              prop="name"
              label="检测时间"
              width="120">
          </el-table-column>
          <el-table-column
              prop="name"
              label="状态"
              width="120">
          </el-table-column>
      <el-table :data="tableData" border style="width: 100%">
          <el-table-column prop="date" label="排放点" width="150"></el-table-column>
          <el-table-column prop="name" label="排放类型" width="120"></el-table-column>
          <el-table-column prop="name" label="检测时间" width="120"></el-table-column>
          <el-table-column prop="name" label="状态" width="120"></el-table-column>
      </el-table>
    </el-tab-pane>
  </el-tabs>
@@ -134,9 +63,5 @@
</script>

<style scoped>
.MissingAlarm {
  background-color: #0E3565;
  color: #fff;
  text-align: center;
}

</style>

 src/components/table/components/componented/refinery.vue

@@ -1,36 +1,13 @@
<template>
  <div class="refinery">
    <el-table
        :data="tableData"
        border
        style="width: 100%">
    <el-table :data="tableData" border style="width: 100%">
      <el-table-column label="序号" width="45px" type="index"></el-table-column>
      <el-table-column
          label="序号"
          width="45px"
          type="index">
      </el-table-column>
      <el-table-column
          prop="date"
          label="排放点"
          width="180">
      </el-table-column>
      <el-table-column
          prop="name"
          label="单位部门"
          width="180">
      </el-table-column>
      <el-table-column
          prop="address"
          label="废水产生量（m3）">
      </el-table-column>
      <el-table-column
          prop="address"
          label="COD (t)">
      </el-table-column>
      <el-table-column
          prop="address"
          label="氨氮(t)">
      </el-table-column>
              v-for="(item,index) in tableHeader"
              :key="index"
              :prop="item.propS"
              :label="item.name"
              :width="item.width"></el-table-column>
    </el-table>
  </div>
</template>
@@ -58,12 +35,24 @@
        address: ' 1516 弄'
      }]
    }
  },
  props: {
    tableHeader: {
      type: Array,
      default: () => {
        return []
      },
      tableContent: {
        type: Array,
        default: () => {
          return []
        }
      }
    }
  }
}
</script>

<style scoped lang="less">
.refinery {
  background-color: #0E3565;
}

</style>

 src/components/table/components/tabHandover.vue

@@ -23,9 +23,10 @@

<script>
import WasteWater from '@components/table/components/WasteWater'
import ReportTable from '../../../components/BaseNav/SoilGroundwater/ReportTable'

// import WasteGas from '@components/table/components/WasteGas'
import SoilGroundwater from '@components/table/components/SoilGroundwater'

import WasteGas from '@components/table/components/WasteGas'
import SolidWaste from '@components/table/components/WasteSolid'
import AirQuality from '@components/table/components/AirQuality'

@@ -36,6 +37,7 @@
  components: {
    WasteWater,
    // WasteGas,
    // SoilGroundwater,
    SolidWaste,
    AirQuality
  },
@@ -57,7 +59,7 @@
          this.gcComp = WasteWater
          break
        case '废气':
          this.gcComp = WasteWater
          this.gcComp = WasteGas
          break
        case '固废':
          this.gcComp = SolidWaste
@@ -66,7 +68,7 @@
          this.gcComp = AirQuality
          break
        case '土壤及地下水':
          this.gcComp = ReportTable
          this.gcComp = SoilGroundwater
          break
        case '管线':
          this.gcComp = AirQuality

 src/components/table/summarySheets.vue

@@ -1,6 +1,6 @@
<template>
  <div class="summary-sheets">
    <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="" placement="left">
    <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="报表" placement="left">
      <div :class='["iconBtn",subtopic ? "active-button" : ""]' @click="subtopicBtn" >
         <i class="el-icon-tickets icon"></i>
      </div>
@@ -115,16 +115,7 @@
}
</script>

<style scoped lang="less">
  .animationChange-enter-active, .animationChange-leave-active {
    transition: all 0.5s;
  }

  .animationChange-enter, .animationChange-leave-to {
    opacity: 0;
    transform: translateX(-100px);
  }

<style lang="less">
.summary-sheets {
  position: absolute;
  display: inline-flex;
@@ -138,8 +129,8 @@
    display: inline-flex;
    .iconBtn{
      margin-left: 0.03rem;
      border-color:#DCDFE6;
      color:#fff;
      border-color:#00fff6;
      color:#00fff6;
    }
    .iconBtn.active-button{
      //border-color:#00fff6 !important;
@@ -154,7 +145,14 @@
    top: 15%;
    left: 3rem;
  }
    .animationChange-enter-active, .animationChange-leave-active {
        transition: all 0.5s;
    }

    .animationChange-enter, .animationChange-leave-to {
        opacity: 0;
        transform: translateX(-100px);
    }
  /*color: #fff;*/

  .el-icon-c-scale-to-original {
@@ -162,5 +160,11 @@
    height: 30px;
    font-size: 30px;
  }

        .el-dialog.el-dialog--center{
            left: 0.5rem;
            top: 0.73979rem;
        }

}
</style>

 src/utils/dialogDrag.js

@@ -11,7 +11,6 @@
    //console.log(dragDom.style.cssText)
    //dragDom.style.cssText += ';top:0px;'
   // dragDom.style.cssText = 'bottom:15px;'

    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
    const sty = (function () {
      if (window.document.currentStyle) {
@@ -22,6 +21,7 @@
    })()

    dialogHeaderEl.onmousedown = (e) => {

      // 鼠标按下，计算当前元素距离可视区的距离
      const disX = e.clientX - dialogHeaderEl.offsetLeft
      const disY = e.clientY - dialogHeaderEl.offsetTop

 src/views/MapTemplate.vue

@@ -133,13 +133,6 @@
  z-index: 999;
}

.Waste-water {
  position: absolute;
  top: 88px;
  left: 280px;
  z-index: 999;
}

.full-screen {
  width: 100%;
  height: 100%;

 src/views/Temp.vue

@@ -200,13 +200,6 @@
  z-index: 999;
}

.Waste-water {
  position: absolute;
  top: 88px;
  left: 280px;
  z-index: 999;
}

.full-screen {
  width: 100%;
  height: 100%;