派生自 wuyushui/SewerAndRainNetwork

徐旺旺
2021-04-22 20bac7bbc63788b14a40757da47a7f200d4155c1
src/components/BaseNav/WasteGas/RealData.vue
@@ -27,7 +27,7 @@
            <el-option label="100" value="100"></el-option>
          </el-select>
        </div>
        <div class="detailbtn" @click="onSubmit">查询</div>
        <div class="detailbtn" @click="querySearch">查询</div>
      </div>
      <div style="width:5rem;height:1.5rem;" ref="echarts"></div>
    </div>
@@ -97,21 +97,15 @@
      // 开始 /结束 时间 和采样点值的绑定值数据
      formInline: {
        region: '',
        timeStart: '',
        timeEnd: ''
      },
      // echarts的options数据传入
      echartsOptions: {
        legend: [],
        ydatas: [],
        yname: ' 浓度(mg/m³)'
        timeEnd: '',
        timeStart: ''
      },
      // 实时数据列表
      RealTimeDataList: [],
      EXHRealTimeDataList: [],
      bzz: null,
      bzzList: []
      exhbzz: [],
      exhbzzList: []
    }
  },
  mounted () {
@@ -121,14 +115,14 @@
  },
  methods: {
    // 点击查询按钮功能
    onSubmit () {
      this.DrawEXHRealTimeDateChart()
    querySearch () {
      // 用于接口数据请求的参数 开始/结束时间 || 可选择查询的开始/结束时间
      this.formInline.timeEnd = dayjs().format('YYYYMMDD HHmmss')
      this.formInline.timeStart = dayjs().subtract(3, 'minute').format('YYYYMMDD HHmmss')
      this.initEchartsData()
    },
    // 初始化数据获取echarts的options数据
    async initEchartsData () {
      // 用于接口数据请求的参数 开始/结束时间 || 可选择查询的开始/结束时间
      this.formInline.timeEnd = dayjs().format('YYYY-MM-DD HH:mm:ss')
      this.formInline.timeStart = dayjs().subtract(3, 'minute').format('YYYY-MM-DD HH:mm:ss')
      const data = {
        $tagCodeList: 'TJIP45.y2h508CEMS01NOX,CTJIP45.y2h508CEMS01SO2,CTJIP45.y2h508CEMS01F,CTJIP45.y2h508CEMS01PM',
        $startTime: this.formInline.timeEnd,
@@ -144,27 +138,25 @@
        // 处理数据开始
        const d = res
        const nameList = [] // 存放图例
        // 数据类型// var data={name:'',value:[now1.getFullYear(), now1.getMonth() + 1, now1.getDate().join('/'),value]}
        let data = {}
        // 存放data的数组
        let datalist
        // var bzh = []
        let data // 数据类型// let data={name:'',value:[now1.getFullYear(), now1.getMonth() + 1, now1.getDate().join('/'),value]}
        let datalist // 存放data的数组
        // let bzh = []
        for (let i = 0; i < d.length; i++) {
          if (d[i].ErrorMessage != null) {
            continue
          }
          // const name = CFG.DATA_REALTIME_TAGCODETABLE[d[i].UnionTagCode].TagName
          // 临时name数据
          const nameListTemp = [
            {
              'TJIP45.lscl2tbAIA-10505-1': '氮氧化物',
              'TJIP45.lscl2tbAIA-10505-2': '烟尘',
              'TJIP45.lscl2tb552AISA11202A': '二氧化磷',
              'TJIP45.lscl2tb552AISA11201B': 'ph',
              'TJIP45.lscl2tb552AI10710': '二氧化碳'
              'TJIP45.y2h508CEMS01NOX': '氮氧化物',
              'TJIP45.y2h508CEMS01SO2': '烟尘',
              'TJIP45.y2h508CEMS01F': '二氧化磷',
              'TJIP45.y2h508CEMS01PM': 'ph'
              // 'TJIP45.lscl2tb552AI10710': '二氧化碳'
            }
          ]
          const name = nameListTemp[0][d[i].UnionTagCode]
          if (nameList.length === 0) {
@@ -178,17 +170,10 @@
              name: name,
              data: [data]
            }
            this.RealTimeDataList.push(datalist)
            // console.log(this.RealTimeDataList)
            // bzh.push(d[i].StdValue);
            this.EXHRealTimeDataList.push(datalist)
          } else if (nameList.indexOf(name) < 0) {
            nameList.push(name)
            // bzh.push(d[i].StdValue);
            const newdate = new Date(d[i].ReadTime)
            data = {
              name: name,
              value: [newdate, d[i].TagValue]
@@ -197,11 +182,10 @@
              name: name,
              data: [data]
            }
            this.RealTimeDataList.push(datalist)
            this.EXHRealTimeDataList.push(datalist)
          } else if (i === d.length - 1) {
            if (nameList.indexOf(name) < 0) {
              nameList.push(name)
              // bzh.push(d[i].StdValue);
              const newdate = new Date(d[i].ReadTime)
              data = {
                name: name,
@@ -211,16 +195,16 @@
                name: name,
                data: [data]
              }
              this.RealTimeDataList.push(datalist)
              this.EXHRealTimeDataList.push(datalist)
            } else {
              const newdate = new Date(d[i].ReadTime)
              data = {
                name: name,
                value: [newdate, d[i].TagValue]
              }
              for (var k = 0; k < this.RealTimeDataList.length; k++) {
                if (this.RealTimeDataList[k].name === name) {
                  this.RealTimeDataList[k].data.push(data)
              for (let k = 0; k < this.EXHRealTimeDataList.length; k++) {
                if (this.EXHRealTimeDataList[k].name === name) {
                  this.EXHRealTimeDataList[k].data.push(data)
                }
              }
            }
@@ -230,20 +214,19 @@
              name: name,
              value: [newdate, d[i].TagValue]
            }
            for (let k = 0; k < this.RealTimeDataList.length; k++) {
              if (this.RealTimeDataList[k].name === name) {
                this.RealTimeDataList[k].data.push(data)
            for (let k = 0; k < this.EXHRealTimeDataList.length; k++) {
              if (this.EXHRealTimeDataList[k].name === name) {
                this.EXHRealTimeDataList[k].data.push(data)
              }
            }
          }
        }
        // console.log(this.EXHRealTimeDataList)
        const divid = 'mycharteff_second'
        const divid = 'mychart_ss'
        const title = name
        const lengList = []
        let objTemp = []
        // console.log(objTemp)
        let objTemp
        for (let l = 0; l < nameList.length; l++) {
          let obj
@@ -260,8 +243,7 @@
            iconurl = 'image://../assets/imgs/legend/VOCs.png'
          }
          if (nameList[l] === '废水' || nameList[l] === '废水流量') { // 将废水流量排到数组最后
            // eslint-disable-next-line no-const-assign
          if (nameList[l] === '废气' || nameList[l] === '废气流量') { // 将废气流量排到数组最后
            objTemp = {
              name: nameList[l],
              icon: iconurl,
@@ -283,12 +265,10 @@
            }
            lengList.push(obj)
          }
          // console.log(lengList)
        }
        lengList.push(objTemp)
        const legend = lengList
        // const xdata = dateList.reverse();
        const ydatas = []
        for (let j = 0; j < nameList.length; j++) {
@@ -313,47 +293,46 @@
          // 临时数据
          const BBZMAPPING = [
            {
              COD: 35,
              废水流量: null,
              二氧化碳: 35,
              ph: 9,
              总氮: 15,
              总磷: 0.3,
              黯淡: 3
              氨氮: 3
            }
          ]
          for (let m = 0; m < this.RealTimeDataList.length; m++) {
          for (let m = 0; m < this.EXHRealTimeDataList.length; m++) {
            let stdValue = null
            if (this.RealTimeDataList[m].name === nameList[j]) {
              // for (let p in BBZMAPPING) {
              //   stdValue = BBZMAPPING[this.RealTimeDataList[m].name]
              // }
              BBZMAPPING.forEach((item) => {
                stdValue = BBZMAPPING[this.RealTimeDataList[m].name]
              })
            if (this.EXHRealTimeDataList[m].name === nameList[j]) {
              for (const i in this.BBZMAPPING) {
                console.log(i)
                stdValue = BBZMAPPING[this.EXHRealTimeDataList[m].name]
              }
              ydata = {
                name: nameList[j],
                data: this.RealTimeDataList[m].data,
                data: this.EXHRealTimeDataList[m].data,
                zdcbcolor: zdcbcolor,
                zxcolor: zxcolor,
                bzz: stdValue
              }
              this.bzz = {
              this.exhbzz = {
                name: nameList[j],
                bzhui: stdValue
              }
              this.bzzList.push(this.bzz)
              this.exhbzzList.push(this.exhbzz)
              ydatas.push(ydata)
            }
          }
        }
        const yname = '浓度(mg/l)'
        const yname = '浓度(mg/m³)'
        this.DrawRealTimeDateChart(divid, title, legend, ydatas, yname)
        //
        // this.IntervalRealTimeDate(id, unionTagCodeList, BBZMAPPING)
        this.IntervalRealTimeDate()
      }
    },
    // 获取数据用于echarts图表绘制
    DrawRealTimeDateChart (id, title, legend, ydatas, yname) {
      // console.log(ydatas)
      this.myChart = this.$echarts.init(this.$refs.echarts)
      const serLists = []
      let dataUnit
@@ -371,7 +350,7 @@
              normal: {
                color: function (c) { // 根据value 显示不同的折点颜色
                  let biaozhuiz
                  for (var i = 0; i < this.bzzList.length; i++) {
                  for (let i = 0; i < this.bzzList.length; i++) {
                    if (this.bzzList[i].name === c.seriesName) {
                      biaozhuiz = this.bzzList[i].bzhui
                    }
@@ -445,13 +424,13 @@
          }
        }
        if (ydatas[i].name === '废气流量' || ydatas[i].name === '废气') {
        if (ydatas[i].name === '氮氧化物' || ydatas[i].name === '废气') {
          obj.yAxisIndex = 1
        }
        // 临时
        const datatype = 1
        if (datatype === 1) {
          dataUnit = '流量(m³/d)'
          dataUnit = '废气流量(m³/d)'
        } else {
          dataUnit = '流量(m³/h)'
        }
@@ -472,13 +451,13 @@
          formatter: function (params) {
            let s = params[0].name + '<br />'
            for (let i = 0; i < params.length; i++) {
              // var name = params[i].name
              // let name = params[i].name
              // 图表title名称
              const seriesName = params[i].seriesName
              // 值
              const value = params[i].value[1]
              // var valueFliter = formatter(value)
              // let valueFliter = formatter(value)
              const valueFliter = parseFloat(value).toFixed(2)
              let maker = params[i].marker
@@ -571,9 +550,10 @@
        yAxis: [{
          type: 'value',
          name: yname,
          max: function (value) {
            return parseInt(value.max + 30)
          },
          // max: function (value) {
          //   console.log(value)
          //   return parseInt(value.max + 30)
          // },
          axisLabel: {
            formatter: '{value}',
            textStyle: {