vue 管道的溯源

管道的溯源很简单，只是图的遍历简单应用，问题是管道的画图，和图结构的确定。

 

溯源的思路是点击一个出问题的井，然后网这个管道的上游找。well是上游的井，pip则是这条管道的数据。只要一直往上找然后顺便保存下pip的数据就行了。

 

画图：这里是一次添加一个管道，所以需要遍历所有的管道进行画图。

 setGraphPip(pip) {
      if (!this.graphPip) this.graphPip = new Map()
      let objPip = {
        pip: pip,//记录管道数据
        well: pip.flowDirection ? pip.endCode : pip.startCode//上游的井的编码
      }, startWells = this.graphPip.get(pip.startCode)//查询图的该编码，因为一个管道有2个点我需要都记录下来，已经有的需要在原来的基础上添加，那么这个图就画出来了
        , endWells = this.graphPip.get(pip.endCode)
      if (objPip.well != pip.startCode) {//排除自己查询自己，我的上游不能是我
        if (startWells) {
          startWells.push(objPip)
        } else {
          startWells = [objPip]
        }
        this.graphPip.set(pip.startCode, startWells)
      }
      if (objPip.well != pip.endCode) {
        if (endWells) {
          endWells.push(objPip)
        } else {
          endWells = [objPip]
        }
        this.graphPip.set(pip.endCode, endWells)
      }

    },

 

遍历：核心代码，我这里所有需要get，set的都是用Map创建的

  dfsGraph(code) {
      let arr = this.graphPip.get(code),//获取创建的图对应code里的数据
        well = this.wellCode.get(code)//根据井code拿到井数据
      if (arr && (well.alarmStatus || well.deviceNum == 0)) {//井报警，能查到井的数据就进行循环
        arr.forEach(item => {
          if (!this.rootPips.has(item.well) && code !== item.well) {//接下来要查的井有没有保存,排除自己查自己
            this.rootPips.set(code, this.selctPips.includes(item.pip.id) ? item.pip : null) //管道是否被选中，并且记录井，这里保存的就是溯源的答案
            this.dfsGraph(item.well)//查找下一个井
          }
        })
      }
    },