废气小时数据、日数据、人工数据接口替换；增加点位id、检测项id查询；无数据提示；UI优化。

XingChuan

2021-05-30 82732610befafe88ae9512c9ac37e6a4bcf291c7

废气小时数据、日数据、人工数据接口替换；增加点位id、检测项id查询；无数据提示；UI优化。

 src/api/mapApi.js

@@ -39,11 +39,11 @@
  },
  // 废气点小时日数据
  getWasteGasMonData (data) {
    return axios.get(mapUrl.getWasteGasMonData, data)
    return axios.post(mapUrl.getWasteGasMonData, qs.stringify(data), { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' })
  },
  // 废气人工数据
  getWasteGasManualData (data) {
    return axios.get(mapUrl.getWasteGasManualData, data)
    return axios.post(mapUrl.getWasteGasManualData, qs.stringify(data), { 'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8' })
  },
  // 废水点
  getWasteWater (data) {

 src/api/mapUrl.js

@@ -15,8 +15,8 @@
export const getWasteGas = $HOSTII + '/EPInterface/DataService/EPMapService.asmx/ObtainningConInfo'
export const getWasteGasDetails = $HOST + '/wasteGas/getWasteGasMonitoringDetails'
export const DataItems = $HOST + '/wasteGas/RTDB/DataItems' // 废气实时数据
export const getWasteGasMonData = $HOST + '/wasteGas/QueryOnlineMonData'
export const getWasteGasManualData = $HOST + '/wasteGas/QueryLabMonData'
export const getWasteGasMonData = $HOSTII + '/EPInterface/DataService/EPMapService.asmx/QueryOnlineMonData'
export const getWasteGasManualData = $HOSTII + '/EPInterface/DataService/EPMapService.asmx/QueryLabMonData'

// 废水
export const getWasteWater = $HOSTII + '/EPInterface/DataService/EPMapService.asmx/ObtainningConInfo' // 废水点信息

 src/components/LayerController/logic/WasteGas.js

@@ -77,7 +77,9 @@
        comp: WasteGasIndex, // 组件
        parent: this, // 父组件
        data: { // 传递的参数
          storagePlaceId: res
          storagePlaceId: res,
          OnlineMonEmissPointId: e.layer.options.test.OnlineMonEmissPointId,
          LabMonPointId: e.layer.options.test.LabMonPointId
        }
      },
      title: '天津石化' + title // 标题

 src/components/LayerController/logic/WasteWater.js

@@ -79,7 +79,9 @@
        parent: this, // 父组件
        data: { // 传递的参数
          // info: this.info
          storagePlaceId: res
          storagePlaceId: res,
          OnlineMonEmissPointId: e.layer.options.totransferData.OnlineMonEmissPointId,
          LabMonPointId: res.LabMonPointId
        }
      },
      title: '天津石化' + title // 标题

 src/components/base-page/PublicDataStandard.vue

@@ -7,7 +7,7 @@
      <!--      <span class="grid-content">废气流量 : <i style="color: #e8ee0b">120343.18</i></span>-->
      <span class="grid-content" v-for="item in dataStandard" :key="item.current.name">{{ item.current.name }} :
        <i style="color: #e8ee0b">{{ item.current.val }}</i>  {{
          item.standard.name && item.current.name.indexOf('流量') === -1 ? item.standard.name + ':' : ''
          item.standard.name && item.current.name.indexOf('流量') === -1 && item.current.name.indexOf('温度') === -1 ? item.standard.name + ':' : ''
        }} <i style="color: #fff">{{ item.standard.val }}</i></span>
    </div>
  </div>

 src/components/base-page/WasteGas/DayData.vue

@@ -1,5 +1,5 @@
<template>
  <div class="echarts-box">
  <div class="waste-gas-day-chart-box echarts-box">
    <div class="tab-scroll">
      <PublicDataStandard :dataStandard="dataStandard"></PublicDataStandard>
    </div>
@@ -9,11 +9,18 @@
      <span class="demonstration">结束时间：</span>
      <el-date-picker v-model="formData.timeEnd" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" size="mini"></el-date-picker>
      <span class="demonstration">采样点数：</span>
      <el-select v-model="formData.region" placeholder="请选择" size="mini">
      <el-select class="selectBox" v-model="formData.region" placeholder="请选择" size="mini">
        <el-option v-for="(item,index) in formData.regionList" :key="index" :label="item" :value="item"></el-option>
      </el-select>
      <el-button @click="querySearch">查询</el-button>
      <el-button>明细表</el-button>
      <el-popover
          placement="top"
          width="100%"
          popper-class="popoverBoxStyle"
          trigger="click">
        <dynamic-table :tableData="tableData" :tableHeader="tableConfig" v-if="tableData"></dynamic-table>
        <el-button class="mingxiBtn" slot="reference" id="mingxiBtn">明细表</el-button>
      </el-popover>
    </div>
    <div class="echarts-chart">
      <div ref="wastegasday"></div>
@@ -28,61 +35,29 @@
import 'dayjs/locale/es'
import dayjs from 'dayjs'
import mapApi from '@/api/mapApi'
import DynamicTable from '../../../views/popup/DynamicHeader/DynamicTable' // 多级表头表格

export default {
  name: 'DayData',
  components: {
    PublicDataStandard
    PublicDataStandard,
    DynamicTable
  },
  props: {
    OnlineMonEmissPointId: {
      type: Number
    }
  },
  data () {
    return {
      // tab栏传递接收数据
      dataStandard: [
        {
          current: {
            name: '氮氧化物',
            val: 29.93
          },
          standard: {
            name: '标准',
            val: 100
          }
        },
        {
          current: {
            name: '二氧化硫',
            val: 17.34
          },
          standard: {
            name: '标准',
            val: 50
          }
        },
        {
          current: {
            name: '烟尘',
            val: 6.93
          },
          standard: {
            name: '标准',
            val: 30
          }
        },
        {
          current: {
            name: '废气流量',
            val: 120
          },
          standard: {
            name: '',
            val: null
          }
        }],
      dataStandard: [],
      tableData: [],
      formData: {
        region: '25',
        regionList: [25, 50, 75, 100],
        timeStart: dayjs().subtract(24, 'hours').format('YYYY-MM-DD HH:mm:ss'),
        timeEnd: dayjs().format('YYYY-MM-DD HH:mm:ss')
        timeStart: dayjs().subtract(1, 'month').format('YYYY-MM-DD'),
        timeEnd: dayjs().format('YYYY-MM-DD')
      },
      dataType: 1,
      myChart: null,
@@ -90,12 +65,125 @@
      jcdID: 1,
      exhbzzList: [],
      bzz: null,
      bzzList: []
      bzzList: [],
      // 配置明细表表头
      tableConfig: [
        {
          id: 100,
          label: '排放点',
          prop: 'OnLineMonEmissPointName'
        },
        {
          id: 200,
          label: '监测时间',
          prop: 'MonTimeStr'
        },
        {
          id: 300,
          label: '氮氧化物',
          prop: 'PoltmtrlName',
          children: [
            {
              id: 310,
              label: '浓度（mg/m³）',
              prop: '氮氧化物_OrglQty'
            },
            {
              id: 320,
              label: '折算值（mg/m³））',
              prop: '氮氧化物_ConvertQty'
            },
            {
              id: 330,
              label: '标准值（mg/m³）',
              prop: '氮氧化物_StdValue'
            },
            {
              id: 340,
              label: '排放量（kg/h）',
              prop: '氮氧化物_EmissQty'
            }
          ]
        },
        {
          id: 400,
          label: '二氧化硫',
          prop: 'PoltmtrlName',
          children: [
            {
              id: 410,
              label: '浓度（mg/m³）',
              prop: '氮氧化物_OrglQty'
            },
            {
              id: 420,
              label: '折算值（mg/m³））',
              prop: '氮氧化物_ConvertQty'
            },
            {
              id: 430,
              label: '标准值（mg/m³）',
              prop: '氮氧化物_StdValue'
            },
            {
              id: 440,
              label: '排放量（kg/h）',
              prop: '氮氧化物_EmissQty'
            }
          ]
        },
        {
          id: 500,
          label: '烟尘',
          prop: 'PoltmtrlName',
          children: [
            {
              id: 510,
              label: '浓度（mg/m³）',
              prop: '氮氧化物_OrglQty'
            },
            {
              id: 520,
              label: '折算值（mg/m³））',
              prop: '氮氧化物_ConvertQty'
            },
            {
              id: 530,
              label: '标准值（mg/m³）',
              prop: '氮氧化物_StdValue'
            },
            {
              id: 540,
              label: '排放量（kg/h）',
              prop: '氮氧化物_EmissQty'
            }
          ]
        },
        {
          id: 600,
          label: '废气流量',
          prop: '',
          children: [
            {
              id: 610,
              label: '气量（m³/h）',
              prop: '废气流量_MonQty'
            }
          ]
        }
      ]
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.initnData()
      if (!this.OnlineMonEmissPointId) {
        document.querySelector('.waste-gas-day-chart-box').innerHTML = '没有查询到数据！'
        document.querySelector('.waste-gas-day-chart-box').style.textAlign = 'center'
        document.querySelector('.waste-gas-day-chart-box').style.height = '2.02rem'
        document.querySelector('.waste-gas-day-chart-box').style.lineHeight = '1rem'
      } else {
        this.initnData()
      }
    })
  },
  methods: {
@@ -104,8 +192,11 @@
    },
    async initnData () {
      const data = {
        onLineMonEmissPointId: 23,
        monItemId: 28,
        poltSourceId: '',
        poltMtrlId: '',
        emissTypeId: '',
        onLineMonEmissPointId: this.OnlineMonEmissPointId,
        monItemId: '28,31,226',
        beginTime: this.formData.timeStart,
        endTime: this.formData.timeEnd,
        dataType: this.dataType
@@ -116,6 +207,8 @@
    },
    get24HourDate (res) {
      if (res.length > 0) {
        this.dataStandard = []
        this.tableData = this.analysisResult(res) // 小时明细表解析结果
        // 处理数据开始
        const d = res
        const nameList = [] // 存放图例
@@ -153,20 +246,46 @@

          if (nameList.length === 0) {
            nameList.push(d[i].PoltmtrlName.trim())
            this.dataStandard.push({
              current: {
                name: d[i].PoltmtrlName.trim(),
                val: ''
              },
              standard: {
                name: '标准',
                val: ''
              }
            })
            dateList.push(strDate)

            bzh.push(d[i].StdValue)
            data = {
              name: d[i].PoltmtrlName.trim(),
              data: [d[i].MonQty]
              data: []
            }
            if (d[i].MonQty !== null) {
              data.data.push(d[i].MonQty)
            }
            dataList.push(data)
          } else if (nameList.indexOf(d[i].PoltmtrlName.trim()) < 0) {
            nameList.push(d[i].PoltmtrlName)
            this.dataStandard.push({
              current: {
                name: d[i].PoltmtrlName.trim(),
                val: ''
              },
              standard: {
                name: '标准',
                val: ''
              }
            })
            bzh.push(d[i].StdValue)
            data = {
              name: d[i].PoltmtrlName.trim(),
              data: [d[i].MonQty]
              data: []
            }
            if (d[i].MonQty !== null) {
              data.data.push(d[i].MonQty)
            }
            dataList.push(data)
          } else {
@@ -279,6 +398,10 @@
        }

        const yname = '浓度(mg/l)'
        for (var t = 0; t < this.dataStandard.length; t++) {
          this.dataStandard[t].current.val = ydatas[t].data[ydatas[t].data.length - 1].toFixed(2)
          this.dataStandard[t].standard.val = ydatas[t].bzz
        }
        this.CreateChart(divid, title, legend, xdata, ydatas, yname, this.jcdID, this.datatype)
      }
    },
@@ -465,10 +588,12 @@
            saveAsImage: {}
          }
        },
        grid: { // 网格
        grid: {
          // 与绝对定位相似，top，left，right，bottom 设定是根据上级盒子宽高来计算
          top: '20%',
          left: '15%'
          // containLabel: true
          left: '6%',
          right: '8%',
          bottom: '12%'
        },
        legend: { // 图例
          data: legend
@@ -586,10 +711,90 @@
        series: serLists
      }
      this.myChart.setOption(option)
    },
    analysisResult (result) {
      // 处理表格头
      const json = {}
      const arr = []
      // 处理表格内容
      const bodyDataList = []
      const dataMap = {}
      for (let i = 0; i < result.length; i++) {
        json[result[i].PoltmtrlName] = result[i].PoltmtrlName
        const rgdata = result[i]
        const timeTag = rgdata.MonTimeStr
        if (!dataMap[timeTag]) {
          dataMap[timeTag] = { MonTimeStr: '' + rgdata.MonTimeStr }
        }

        // 往数据中添加属性数据
        const el = dataMap[timeTag]
        el.OnLineMonEmissPointName = rgdata.OnLineMonEmissPointName
        el[rgdata.PoltmtrlName + '_OrglQty'] = rgdata.OrglQty ? rgdata.OrglQty.toFixed(2) : '--' // 原始值
        el[rgdata.PoltmtrlName + '_ConvertQty'] = rgdata.ConvertQty ? rgdata.ConvertQty.toFixed(2) : '--' // 折标量
        el[rgdata.PoltmtrlName + '_StdValue'] = rgdata.StdValue ? rgdata.StdValue.toFixed(2) : '--' // 标准值
        el[rgdata.PoltmtrlName + '_EmissQty'] = rgdata.EmissQty ? rgdata.EmissQty.toFixed(2) : '--' // 排放量
        el[rgdata.PoltmtrlName + '_MonQty'] = rgdata.MonQty ? rgdata.MonQty.toFixed(2) : '--' // 监测量
      }
      let FQLLtemp = ''
      let FQWDtemp = ''
      let FQYHLtemp = ''
      for (var key in json) {
        if (key === '废气流量' || key === '废气') {
          FQLLtemp = key
        } else if (key === '温度') {
          FQWDtemp = key
        } else if (key === '氧含量') {
          FQYHLtemp = key
        } else {
          arr.push(key)
        }
      }
      if (FQLLtemp != null) {
        arr.push(FQLLtemp)
      }
      if (FQWDtemp != null) {
        arr.push(FQWDtemp)
      }
      if (FQYHLtemp != null) {
        arr.push(FQYHLtemp)
      }
      for (var p in dataMap) {
        bodyDataList.push(dataMap[p])
      }
      return bodyDataList
    }
  }
}
</script>

<style scoped lang="less">
<style lang="less">
.waste-gas-day-chart-box .echarts-form .el-input__inner {
  background-color: rgba(0, 0, 0, 0);
  height: .13rem;
  border-color: #336fa4;
}
.waste-gas-day-chart-box .echarts-form{
  margin-top: 1px
}
.waste-gas-day-chart-box .echarts-form .el-input__icon{
  height: .13rem;
  top: -.02rem;
  right: -0.03rem;
  position: absolute;
  color: #00d0f9;
}
.waste-gas-day-chart-box .echarts-form .selectBox .el-input__icon:last-child{
  top: .02rem;
}
.waste-gas-day-chart-box .echarts-form .selectBox .is-reverse{
  top: -.02rem !important;
}
.waste-gas-day-chart-box .echarts-form .el-button{
  background-color: rgba(0, 0, 0, 0);
  height: .13rem;
}
.waste-gas-day-chart-box .echarts-form .mingxiBtn{
  margin-left: -.02rem;
}
</style>

 src/components/base-page/WasteGas/Detail.vue

@@ -5,20 +5,20 @@
       style="width: 100%;height: 100%">
     <el-table-column prop="LabMonTime" label="检测时间"></el-table-column>
     <el-table-column label="氮氧化物">
       <el-table-column prop="NOMonTime" label="监测值" width="70"></el-table-column>
       <el-table-column prop="NOEndTime" label="标准值" width="70"></el-table-column>
       <el-table-column prop="LabMonValue" label="监测值" width="70"></el-table-column>
       <el-table-column prop="StdValue" label="标准值" width="70"></el-table-column>
     </el-table-column>
     <el-table-column label="二氧化硫">
       <el-table-column prop="SOMontime" label="监测值" width="70"></el-table-column>
       <el-table-column prop="SoEndTime" label="标准值" width="70"></el-table-column>
       <el-table-column prop="LabMonValue" label="监测值" width="70"></el-table-column>
       <el-table-column prop="StdValue" label="标准值" width="70"></el-table-column>
     </el-table-column>
     <el-table-column label="烟尘">
       <el-table-column prop="MonItemId" label="监测值" width="70"></el-table-column>
       <el-table-column prop="EndMonTime" label="标准值" width="70"></el-table-column>
       <el-table-column prop="LabMonValue" label="监测值" width="70"></el-table-column>
       <el-table-column prop="StdValue" label="标准值" width="70"></el-table-column>
     </el-table-column>
     <el-table-column label="非甲烷总烃">
       <el-table-column prop="MonItemId" label="监测值" width="70"></el-table-column>
       <el-table-column prop="MonItemId" label="标准值" width="70"></el-table-column>
       <el-table-column prop="LabMonValue" label="监测值" width="70"></el-table-column>
       <el-table-column prop="StdValue" label="标准值" width="70"></el-table-column>
     </el-table-column>
   </el-table>
 </div>
@@ -35,22 +35,32 @@
      tableData: []
    }
  },
  props: {
    LabMonPointId: {
      type: Number
    }
  },
  mounted () {
    this.initdetail()
    this.$nextTick(() => {
      this.initdetail()
    })
  },
  methods: {
    async initdetail () {
      const timeEnd = dayjs().format('YYYY-MM-DD HH:mm:ss')
      const timeStart = dayjs().subtract(3, 'minute').format('YYYY-MM-DD HH:mm:ss')
      const timeEnd = dayjs().format('YYYY-MM-DD')
      const timeStart = dayjs().subtract(1, 'year').format('YYYY-MM-DD')
      const data = {
        companyId: 3900100145,
        labMonPointId: 219,
        companyCode: '',
        poltSourceId: '',
        labMonPointId: this.LabMonPointId ? this.LabMonPointId : '',
        poltMtrlId: '',
        monItemId: '28,31',
        emissTypeId: '',
        beginTime: timeStart,
        endTime: timeEnd
      }
      const result = (await mapApi.getWasteGasManualData(data)).Result.DataInfo
      // console.log(result)
      this.tableData = result
      this.tableData = (await mapApi.getWasteGasManualData(data)).Result.DataInfo
    }
  }
}

 src/components/base-page/WasteGas/HourData.vue

@@ -1,5 +1,5 @@
<template>
  <div class="echarts-box">
  <div id="waste-gas-hours-chart-box" class="waste-gas-hours-chart-box echarts-box">
    <div class="tab-scroll">
      <PublicDataStandard :dataStandard="dataStandard"></PublicDataStandard>
    </div>
@@ -9,11 +9,18 @@
      <span class="demonstration">结束时间：</span>
      <el-date-picker v-model="formData.timeEnd" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" size="mini"></el-date-picker>
      <span class="demonstration">采样点数：</span>
      <el-select v-model="formData.region" placeholder="请选择" size="mini" >
      <el-select class="selectBox" v-model="formData.region" placeholder="请选择" size="mini" >
        <el-option v-for="(item,index) in formData.regionList" :key="index" :label="item" :value="item"></el-option>
      </el-select>
      <el-button @click="querySearch">查询</el-button>
      <el-button @click="ScheduleShow">明细表</el-button>
      <el-popover
          placement="top"
          width="100%"
          popper-class="popoverBoxStyle"
          trigger="click">
        <dynamic-table :tableData="tableData" :tableHeader="tableConfig" v-if="tableData"></dynamic-table>
        <el-button class="mingxiBtn" slot="reference" id="mingxiBtn">明细表</el-button>
      </el-popover>
    </div>
    <div class="echarts-chart">
      <div ref="wastegashour"></div>
@@ -31,6 +38,7 @@
<script>
import Scheduleof from '@components/base-page/WasteGas/Scheduleof'
import PublicDataStandard from '../PublicDataStandard'
import DynamicTable from '../../../views/popup/DynamicHeader/DynamicTable' // 多级表头表格

import 'dayjs/locale/es'
import dayjs from 'dayjs'
@@ -41,69 +49,149 @@
  components: {
    // PublicDetailedList
    PublicDataStandard,
    Scheduleof
    Scheduleof,
    DynamicTable
  },
  props: {
    OnlineMonEmissPointId: {
      type: Number
    }
  },
  data () {
    return {
      // tab栏传递接收数据
      dataStandard: [
        {
          current: {
            name: '氮氧化物',
            val: 29.93
          },
          standard: {
            name: '标准',
            val: 100
          }
        },
        {
          current: {
            name: '二氧化硫',
            val: 17.34
          },
          standard: {
            name: '标准',
            val: 50
          }
        },
        {
          current: {
            name: '烟尘',
            val: 6.93
          },
          standard: {
            name: '标准',
            val: 30
          }
        },
        {
          current: {
            name: '废气流量',
            val: 120
          },
          standard: {
            name: '',
            val: null
          }
        }],
      dataStandard: [],
      formData: {
        region: '25',
        regionList: [25, 50, 75, 100],
        timeStart: dayjs().subtract(24, 'hours').format('YYYY-MM-DD HH:mm:ss'),
        timeEnd: dayjs().format('YYYY-MM-DD HH:mm:ss')
      },
      tableData: [],
      showSchedule: false,
      dataType: 2,
      myChart: null,
      exhbzz: null,
      jcdID: 1,
      exhbzzList: []
      exhbzzList: [],
      // 配置明细表表头
      tableConfig: [
        {
          id: 100,
          label: '排放点',
          prop: 'OnLineMonEmissPointName'
        },
        {
          id: 200,
          label: '监测时间',
          prop: 'MonTimeStr'
        },
        {
          id: 300,
          label: '氮氧化物',
          prop: 'PoltmtrlName',
          children: [
            {
              id: 310,
              label: '浓度（mg/m³）',
              prop: '氮氧化物_OrglQty'
            },
            {
              id: 320,
              label: '折算值（mg/m³））',
              prop: '氮氧化物_ConvertQty'
            },
            {
              id: 330,
              label: '标准值（mg/m³）',
              prop: '氮氧化物_StdValue'
            },
            {
              id: 340,
              label: '排放量（kg/h）',
              prop: '氮氧化物_EmissQty'
            }
          ]
        },
        {
          id: 400,
          label: '二氧化硫',
          prop: 'PoltmtrlName',
          children: [
            {
              id: 410,
              label: '浓度（mg/m³）',
              prop: '氮氧化物_OrglQty'
            },
            {
              id: 420,
              label: '折算值（mg/m³））',
              prop: '氮氧化物_ConvertQty'
            },
            {
              id: 430,
              label: '标准值（mg/m³）',
              prop: '氮氧化物_StdValue'
            },
            {
              id: 440,
              label: '排放量（kg/h）',
              prop: '氮氧化物_EmissQty'
            }
          ]
        },
        {
          id: 500,
          label: '烟尘',
          prop: 'PoltmtrlName',
          children: [
            {
              id: 510,
              label: '浓度（mg/m³）',
              prop: '氮氧化物_OrglQty'
            },
            {
              id: 520,
              label: '折算值（mg/m³））',
              prop: '氮氧化物_ConvertQty'
            },
            {
              id: 530,
              label: '标准值（mg/m³）',
              prop: '氮氧化物_StdValue'
            },
            {
              id: 540,
              label: '排放量（kg/h）',
              prop: '氮氧化物_EmissQty'
            }
          ]
        },
        {
          id: 600,
          label: '废气流量',
          prop: '',
          children: [
            {
              id: 610,
              label: '气量（m³/h）',
              prop: '废气流量_MonQty'
            }
          ]
        }
      ]
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.initnData()
      if (!this.OnlineMonEmissPointId) {
        document.querySelector('#waste-gas-hours-chart-box').innerHTML = '没有查询到数据！'
        document.querySelector('#waste-gas-hours-chart-box').style.textAlign = 'center'
        document.querySelector('#waste-gas-hours-chart-box').style.height = '2.02rem'
        document.querySelector('#waste-gas-hours-chart-box').style.lineHeight = '1rem'
      } else {
        this.initnData()
      }
    })
  },
  methods: {
@@ -116,8 +204,11 @@
    },
    async initnData () {
      const data = {
        onLineMonEmissPointId: 23,
        monItemId: 28,
        poltSourceId: '',
        poltMtrlId: '',
        emissTypeId: '',
        onLineMonEmissPointId: this.OnlineMonEmissPointId,
        monItemId: '28,31,226',
        beginTime: this.formData.timeStart,
        endTime: this.formData.timeEnd,
        dataType: this.dataType
@@ -128,6 +219,8 @@
    },
    get24HourDate (res) {
      if (res.length > 0) {
        this.dataStandard = []
        this.tableData = this.analysisResult(res) // 小时明细表解析结果
        // 处理数据开始
        const d = res
        const nameList = [] // 存放图例
@@ -210,21 +303,41 @@

          if (nameList.length === 0) {
            nameList.push(d[i].PoltmtrlName.trim())
            this.dataStandard.push({
              current: {
                name: d[i].PoltmtrlName.trim(),
                val: 29.93
              },
              standard: {
                name: '标准',
                val: 100
              }
            })
            dateList.push(strDate)
            if ((d[i].PoltmtrlName === '废气流量' || d[i].PoltmtrlName === '废气') && d[i].MonQty < 0) {
              d[i].MonQty = 0
            }
            data.push(d[i].MonQty)
            if (d[i].MonQty !== null)data.push(d[i].MonQty)
            bzh.push(d[i].StdValue)
          } else if (nameList.indexOf(d[i].PoltmtrlName.trim()) < 0) {
            nameList.push(d[i].PoltmtrlName)
            this.dataStandard.push({
              current: {
                name: d[i].PoltmtrlName.trim(),
                val: 29.93
              },
              standard: {
                name: '标准',
                val: 100
              }
            })
            bzh.push(d[i].StdValue)
            dataList.push(data)
            data = []
            if ((d[i].PoltmtrlName === '废气流量' || d[i].PoltmtrlName === '废气') && d[i].MonQty < 0) {
              d[i].MonQty = 0
            }
            data.push(d[i].MonQty)
            if (d[i].MonQty !== null)data.push(d[i].MonQty)
          } else if (i === d.length - 1) {
            if ((d[i].PoltmtrlName === '废气流量' || d[i].PoltmtrlName === '废气') && d[i].MonQty < 0) {
              d[i].MonQty = 0
@@ -238,7 +351,7 @@
            if ((d[i].PoltmtrlName === '废气流量' || d[i].PoltmtrlName === '废气') && d[i].MonQty < 0) {
              d[i].MonQty = 0
            }
            data.push(d[i].MonQty)
            if (d[i].MonQty !== null)data.push(d[i].MonQty)
          }
        }
        // 处理数据结束
@@ -337,7 +450,10 @@
        }

        const yname = '浓度(mg/m³)'

        for (var t = 0; t < this.dataStandard.length; t++) {
          this.dataStandard[t].current.val = ydatas[t].data[ydatas[t].data.length - 1].toFixed(2)
          this.dataStandard[t].standard.val = ydatas[t].bzz
        }
        this.CreateChart(id, title, legend, xdata, ydatas, yname, this.jcdID, this.datatype)
      }
    },
@@ -525,10 +641,12 @@
            saveAsImage: {}
          }
        },
        grid: { // 网格
        grid: {
          // 与绝对定位相似，top，left，right，bottom 设定是根据上级盒子宽高来计算
          top: '20%',
          left: '15%'
          // containLabel: true
          left: '6%',
          right: '8%',
          bottom: '12%'
        },
        legend: { // 图例
          data: legend
@@ -646,10 +764,90 @@
        series: serLists
      }
      this.myChart.setOption(option)
    },
    analysisResult (result) {
      // 处理表格头
      const json = {}
      const arr = []
      // 处理表格内容
      const bodyDataList = []
      const dataMap = {}
      for (let i = 0; i < result.length; i++) {
        json[result[i].PoltmtrlName] = result[i].PoltmtrlName
        const rgdata = result[i]
        const timeTag = rgdata.MonTimeStr
        if (!dataMap[timeTag]) {
          dataMap[timeTag] = { MonTimeStr: '' + rgdata.MonTimeStr }
        }

        // 往数据中添加属性数据
        const el = dataMap[timeTag]
        el.OnLineMonEmissPointName = rgdata.OnLineMonEmissPointName
        el[rgdata.PoltmtrlName + '_OrglQty'] = rgdata.OrglQty ? rgdata.OrglQty.toFixed(2) : '--' // 原始值
        el[rgdata.PoltmtrlName + '_ConvertQty'] = rgdata.ConvertQty ? rgdata.ConvertQty.toFixed(2) : '--' // 折标量
        el[rgdata.PoltmtrlName + '_StdValue'] = rgdata.StdValue ? rgdata.StdValue.toFixed(2) : '--' // 标准值
        el[rgdata.PoltmtrlName + '_EmissQty'] = rgdata.EmissQty ? rgdata.EmissQty.toFixed(2) : '--' // 排放量
        el[rgdata.PoltmtrlName + '_MonQty'] = rgdata.MonQty ? rgdata.MonQty.toFixed(2) : '--' // 监测量
      }
      let FQLLtemp = ''
      let FQWDtemp = ''
      let FQYHLtemp = ''
      for (var key in json) {
        if (key === '废气流量' || key === '废气') {
          FQLLtemp = key
        } else if (key === '温度') {
          FQWDtemp = key
        } else if (key === '氧含量') {
          FQYHLtemp = key
        } else {
          arr.push(key)
        }
      }
      if (FQLLtemp != null) {
        arr.push(FQLLtemp)
      }
      if (FQWDtemp != null) {
        arr.push(FQWDtemp)
      }
      if (FQYHLtemp != null) {
        arr.push(FQYHLtemp)
      }
      for (var p in dataMap) {
        bodyDataList.push(dataMap[p])
      }
      return bodyDataList
    }
  }
}
</script>

<style scoped lang="less">
<style lang="less">
.waste-gas-hours-chart-box .echarts-form .el-input__inner {
  background-color: rgba(0, 0, 0, 0);
  height: .13rem;
  border-color: #336fa4;
}
.waste-gas-hours-chart-box .echarts-form{
  margin-top: 1px
}
.waste-gas-hours-chart-box .echarts-form .el-input__icon{
  height: .13rem;
  top: -.02rem;
  right: -0.03rem;
  position: absolute;
  color: #00d0f9;
}
.waste-gas-hours-chart-box .echarts-form .selectBox .el-input__icon:last-child{
  top: .02rem;
}
.waste-gas-hours-chart-box .echarts-form .selectBox .is-reverse{
  top: -.02rem !important;
}
.waste-gas-hours-chart-box .echarts-form .el-button{
  background-color: rgba(0, 0, 0, 0);
  height: .13rem;
}
.waste-gas-hours-chart-box .echarts-form .mingxiBtn{
  margin-left: -.02rem;
}
</style>

 src/components/base-page/WasteGas/PublicTabs.vue

@@ -7,12 +7,12 @@
    <div class="main">
      <div class="main-matter">
        <ul>
          <li>监测点名称:{{ storagePlaceId.Name }}</li>
          <li>生产单位:{{ storagePlaceId.porltName }}</li>
          <li>排放类型名称:{{ storagePlaceId.MonTypeName }}</li>
          <li>排放去向:{{ storagePlaceId.EmissDirecti }}</li>
          <li>控制级别名称:{{ storagePlaceId.ContrLevelShowName }}</li>
          <li>内/外排口:{{ storagePlaceId.OrOutPortName }}</li>
          <li :title="storagePlaceId.Name"><span class="namer">监测点名称：</span>{{ storagePlaceId.Name }}</li>
          <li :title="storagePlaceId.porltName"><span class="namer">生产单位：</span>{{ storagePlaceId.porltName }}</li>
          <li :title="storagePlaceId.MonTypeName"><span class="namer">排放类型名称：</span>{{ storagePlaceId.MonTypeName }}</li>
          <li :title="storagePlaceId.EmissDirecti"><span class="namer">排放去向：</span>{{ storagePlaceId.EmissDirecti }}</li>
          <li :title="storagePlaceId.ContrLevelShowName"><span class="namer">控制级别名称：</span>{{ storagePlaceId.ContrLevelShowName }}</li>
          <li :title="storagePlaceId.OrOutPortName"><span class="namer">内/外排口：</span>{{ storagePlaceId.OrOutPortName }}</li>
        </ul>
      </div>
    </div>
@@ -70,20 +70,26 @@
      //height: 100%;
      display: flex;
      align-items: center;
      justify-content: space-around;
      flex-wrap: wrap;
      margin-bottom: -0.04rem;

      li {
        margin-bottom: 0.04rem;
        text-align: center;
        margin: 0.02rem 0.03rem;
        min-width: 31%;
        background-color: #243a55;
        color: #00d0f9;
        box-shadow: 0 0 10px rgba(129,211,248,.35) inset;
        color: #00fff6;
        border-radius: 0.02rem;
        font-size: 0.08rem;
        line-height: 0.09rem;
        padding: 0.03rem .5%;
        max-width: 1.2rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        .namer{
          display: inline-block;
          width: .6rem;
          text-align: right;
        }
      }

      .lastli {

 src/components/base-page/WasteGas/WasteGasIndex.vue

@@ -25,12 +25,12 @@
            <i style=" background: #fc1d04;"></i>
          </div>
        </div>
        <component :is="currentTab" ref="RealData"></component>
        <component :is="currentTab" :OnlineMonEmissPointId="OnlineMonEmissPointId" :LabMonPointId="LabMonPointId" ref="RealData"></component>
      </div>
    </template>
    <template v-slot:video>
<!--    <template v-slot:video>
      <public-video></public-video>
    </template>
    </template>-->
  </public-sector>
</template>

@@ -47,7 +47,17 @@

export default {
  name: 'WasteGasIndex',
  props: ['storagePlaceId'],
  props: {
    storagePlaceId: {
      type: Object
    },
    OnlineMonEmissPointId: {
      type: Number
    },
    LabMonPointId: {
      type: Number
    }
  },
  components: {
    PublicSector,
    PublicTabs,
@@ -84,52 +94,49 @@
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0;
  padding-left: 0.07rem;
  border-bottom: 1px #243a55 solid;

  .navigation-left {
    display: flex;
    align-items: center;

    .uncheck {
      margin: 0 10px;
      cursor: pointer;
      padding: 5px;
      margin-left: -0.05rem;
      width: .8rem;
      padding: 6px 0;
      /*border: 1px solid #2b87c8;*/
      /*border-radius: 4px;*/
      background-position: 0 0;
      background-repeat: no-repeat;
      background-size: 100% 100%;
      background-image: url("../../../../public/assets/images/map-pages/title_bg.png");
      text-align: center;
      vertical-align: middle !important;
      color: #fff;
      -webkit-transform: skew(30deg);
      -moz-transform: skew(30deg);
      -o-transform: skew(30deg);
      transform: skew(15deg);
    }

    .default-uncheck {
      background-color: #0e639e;
      color: #fff;
      color: #C0C0C0;
      cursor: pointer;
    }

    .hover {
      background-color: #0e639e;
      color: #fff;
      background-image: url("../../../../public/assets/images/map-pages/title_bg2.png");
      color: #ffffff;
      cursor: pointer;
    }

    .hover:hover {
      cursor: pointer;
      padding: 5px;
      border: 1px solid #2b87c8;
      border-radius: 4px;
      text-align: center;
      color: #fff;
      color: #F0FFFF;
    }
  }

  .navigation-left :hover {
    background-color: #0e639e;
    color: #fff;
    cursor: pointer;
  }
@@ -151,7 +158,6 @@

.public-part {
  position: relative;

  background-color: @background-color;
  font-size: 0.06rem;
  font-weight: normal;

 src/components/base-page/WasteGas/WasteGasRealChart.vue

@@ -1,5 +1,5 @@
<template>
  <div class="echarts-box">
  <div id="wasteGasRealChartBox" class="echarts-box">
    <div class="tab-scroll">
      <PublicDataStandard :dataStandard="dataStandard"></PublicDataStandard>
    </div>
@@ -9,7 +9,7 @@
      <span class="demonstration">结束时间：</span>
      <el-date-picker v-model="formData.endTime" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" size="mini"></el-date-picker>
      <span class="demonstration">采样点数：</span>
      <el-select v-model="formData.region" placeholder="请选择" size="mini">
      <el-select class="selectBox" v-model="formData.region" placeholder="请选择" size="mini">
        <el-option v-for="(item,index) in formData.regionList" :key="index" :label="item" :value="item"></el-option>
      </el-select>
      <el-button @click="querySearch">查询</el-button>
@@ -497,8 +497,11 @@
          }
        },
        grid: {
          top: '40px',
          bottom: '30px'
          // 与绝对定位相似，top，left，right，bottom 设定是根据上级盒子宽高来计算
          top: '20%',
          left: '6%',
          right: '6%',
          bottom: '12%'
        },
        legend: {
          data: legend
@@ -602,8 +605,8 @@
}
</script>

<style scoped lang="less">
.echarts-box {
<style lang="less">
#wasteGasRealChartBox {
  .echarts-form {
    .demonstration {
      color: #00fff6;
@@ -639,4 +642,29 @@
    content: " ";
  }
}
#wasteGasRealChartBox .echarts-form .el-input__inner {
  background-color: rgba(0, 0, 0, 0);
  height: .13rem;
  border-color: #336fa4;
}
#wasteGasRealChartBox .echarts-form{
  margin-top: 1px
}
#wasteGasRealChartBox .echarts-form .el-input__icon{
  height: .13rem;
  top: -.02rem;
  right: -0.03rem;
  position: absolute;
  color: #00d0f9;
}
#wasteGasRealChartBox .echarts-form .selectBox .el-input__icon:last-child{
  top: .02rem;
}
#wasteGasRealChartBox .echarts-form .selectBox .is-reverse{
  top: -.02rem !important;
}
#wasteGasRealChartBox .echarts-form .el-button{
  background-color: rgba(0, 0, 0, 0);
  height: .13rem;
}
</style>

 src/components/base-page/WasteWater/Detail.vue

@@ -1,5 +1,5 @@
<template>
  <div class="detail" style="width: 5rem">
  <div id="wasteWaterDetailBox" class="detail" style="width: 5rem">
    <el-table :data="tableData" style="width: 100%;" height="2.07rem">
      <el-table-column prop="LabMonTime" label="检测时间"></el-table-column>
      <el-table-column label="COD">
@@ -56,8 +56,15 @@
      timeStart: dayjs().subtract(3, 'minute').format('YYYY-MM-DD HH:mm:ss')
    }
  },
  props: {
    LabMonPointId: {
      type: Number
    }
  },
  mounted () {
    this.initdetail()
    this.$nextTick(() => {
      this.initdetail()
    })
  },
  methods: {
    async initdetail () {
@@ -71,13 +78,13 @@
        timeStart = dayjs().subtract(365, 'day').format('YYYY-MM-DD HH:mm:ss')
      }
      const data = {
        poltSourceId: '',
        poltMtrlId: '',
        companyCode: '',
        emissTypeId: '',
        monItemId: 28,
        companyId: 3900100145,
        labMonPointId: 219,
        companyCode: '',
        poltSourceId: '',
        labMonPointId: this.LabMonPointId ? this.LabMonPointId : '',
        poltMtrlId: '',
        monItemId: '28,31,35',
        emissTypeId: '',
        beginTime: timeStart,
        endTime: timeEnd
      }

 src/components/base-page/WasteWater/WasteWaterDayChart.vue

@@ -150,6 +150,11 @@
      ]
    }
  },
  props: {
    OnlineMonEmissPointId: {
      type: Number
    }
  },
  mounted () {
    this.$nextTick(() => {
      this.draw24Chart()

 src/components/base-page/WasteWater/WasteWaterHoursChart.vue

@@ -153,8 +153,15 @@
      ]
    }
  },
  props: {
    OnlineMonEmissPointId: {
      type: Number
    }
  },
  mounted () {
    this.draw24Chart()
    this.$nextTick(() => {
      this.draw24Chart()
    })
  },
  methods: {
    // 点击查询功能

 src/components/base-page/WasteWater/WasteWaterIndex.vue

@@ -25,7 +25,7 @@
            <i style=" background: #fc1d04;"></i>
          </div>
        </div>
        <component :is="currentTab" ref="RealData"></component>
        <component :is="currentTab" :OnlineMonEmissPointId="OnlineMonEmissPointId" :LabMonPointId='LabMonPointId' ref="RealData"></component>
      </div>
    </template>
<!--    <template v-slot:video>
@@ -47,7 +47,17 @@

export default {
  name: 'WasteWaterIndex',
  props: ['storagePlaceId'],
  props: {
    storagePlaceId: {
      type: Object
    },
    OnlineMonEmissPointId: {
      type: Number
    },
    LabMonPointId: {
      type: Number
    }
  },
  components: {
    PublicSector,
    PublicTabs,