派生自 wuyushui/SewerAndRainNetwork

chenzeping
2021-04-21 9a7a37389c784684cb848d86817fcc15f22e0f4a
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,
@@ -136,6 +130,7 @@
        $step: 15
      }
      const result = (await mapApi.DataItems(data)).data
      console.log(result)
      this.getRtdb15s(result)
    },
    // echarts数据处理
@@ -144,27 +139,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 +171,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 +183,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 +196,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 +215,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 +244,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 +266,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++) {
@@ -314,46 +295,45 @@
          const BBZMAPPING = [
            {
              COD: 35,
              废水流量: null,
              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 +351,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
                    }
@@ -472,13 +452,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