管线分析功能

ChenZeping

2021-04-29 13ac96cc81d84fe26f733c96eec4305e8d71b389

 src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue

@@ -354,15 +354,17 @@
          <span>管线查询结果</span>
        </div>
        <el-table
            class="dddddd"
            :data="tableData"
            max-height="200"
            style="width: 100%" @row-click="selectRow" size="mini">
          <el-table-column
              prop="name"
              prop="pipename"
              label="管线名称"
              width="180">
          </el-table-column>
          <el-table-column
              prop="type"
              prop="mediumtype"
              label="管线类型"
              width="180">
          </el-table-column>
@@ -903,10 +905,21 @@
      // 已绘制线图 进行绘制横断面数据分析
      const res = await mapApi.getCrossSection(this.hdmParam)
      console.log(res)
      const dataPoint = res.data.point
      console.log(dataPoint)
      // this.tableData = dataPoint.pipelines.extraData
      for (let i = 0; i < dataPoint.length; i++) {
        const obj = {
          pipename: dataPoint[i].pipelines.extraData.pipename,
          mediumtype: dataPoint[i].pipelines.extraData.mediumtype
        }
        this.tableData.push(obj)
      }
    },
    // 横断面绘制完成后 进行横断面数据分析 进行图表展示
    async selectRow (e) {
      console.log(e)
      // const dataSeries = e.data.pointInterval
      // 3. 使用刚指定的配置项和数据，显示图表
      const option = {
        xAxis: {
@@ -918,6 +931,7 @@
        },
        series: [{
          data: [820, 932, 901, 934, 1290, 1330, 1320],
          // data: dataSeries,
          type: 'line'
        }]
      }
@@ -936,6 +950,31 @@
</script>

<style lang="less" scoped>
/*****滚动条***/
.dddddd{
  .el-table__fixed-right-patch{
    display: none;
  }
}
.dddddd::-webkit-scrollbar {
  /*滚动条整体样式*/
  width: 10px; /*高宽分别对应横竖滚动条的尺寸*/
  height: 10px;
}

.dddddd::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 10px;
  background: #000;
}

.dddddd::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: @background-color;
  border-radius: 10px;
}

///deep/ .el-table__row:hover > td {
//  background: none !important;
//}