派生自 wuyushui/SewerAndRainNetwork

chenyabin
2021-04-27 4f35a8b56c12315c82fd5bd136f32da2dcadc5e2
src/components/panel/topicSearch/SewersSelect/SewersAnalysis.vue
@@ -17,8 +17,8 @@
                       title="根据起始、结束管段进行连通性分析">清除
            </el-button>
            <el-scrollbar style="height:450px">
              <el-card shadow="hover"> <!-- style="height: 300px"-->
                <span class="clearfixs">起始管段</span>
              <el-card shadow="hover">
                <span class="fixed-style">起始管段</span>
                <el-table
                    ref="singleTable"
                    highlight-current-row
@@ -62,7 +62,7 @@
                    </template>
                  </el-table-column>
                </el-table>
                <span class="clearfixs">结束管段</span>
                <span class="fixed-style">结束管段</span>
                <el-table
                    max-height="200"
                    highlight-current-row
@@ -105,7 +105,7 @@
                    </template>
                  </el-table-column>
                </el-table>
                <span class="clearfixs">分析结果:<span style="color: red;">{{ currentLinkIsTrue }}</span></span>
                <span class="fixed-style">分析结果:<span style="color: red;">{{ currentLinkIsTrue }}</span></span>
                <el-table
                    highlight-current-row
                    max-height="200"
@@ -160,7 +160,7 @@
            <el-button type="primary" @click="handleClick" size="mini" style="margin-bottom: 5px;" title="清除绘制">清除
            </el-button>
            <el-card shadow="hover">
              <span class="clearfixs">发生爆裂的管段</span>
              <span class="fixed-style">发生爆裂的管段</span>
              <el-table
                  ref="singleTable"
                  highlight-current-row
@@ -202,7 +202,7 @@
                  </template>
                </el-table-column>
              </el-table>
              <span class="clearfixs">需要关闭的阀门</span>
              <span class="fixed-style">需要关闭的阀门</span>
              <el-table
                  highlight-current-row
                  :data="bgFm"
@@ -343,7 +343,7 @@
            <el-button type="primary" @click="jdmClear" size="mini" style="margin-bottom: 5px;" title="清除截断面分析结果">清除
            </el-button>
            <el-card class="box-card">
              <div slot="header" class="clearfixs">
              <div slot="header" class="fixed-style">
                <span>管线查询结果</span>
              </div>
              <el-table
@@ -371,11 +371,11 @@
              </el-table>
            </el-card>
            <el-card class="box-card">
              <div slot="header" class="clearfixs">
              <div slot="header" class="fixed-style">
                <span>断面图</span>
              </div>
              <span v-show="!myChartShow" style="color: #909399;font-size: 12px;">暂无数据</span>
              <div v-show="myChartShow" id="echarts_box" style="width: 600px;height:300px;"></div>
              <div v-show="myChartShow" id="echarts_box" ref="myChart" style="width: 600px;height:300px;"></div>
            </el-card>
          </el-tab-pane>
        </el-tabs>
@@ -388,8 +388,7 @@
import eventBus from '../../../../eventBus'
import DrawLine from './AnalysisChoose/DrawLine'
// import main from "../leaflet/app/main"
import mapApi from '@/api/mapApi'
import mapApi from '../../../../api/mapApi'
export default {
  name: 'SewersAnalysis',
@@ -398,12 +397,13 @@
      // 地图点击类型 first连通性点击  second爆管点击  third流向点击 fourth横断面
      activeName: 'first',
      measure: null,
      map: null,
      map: window.map,
      myChart: null,
      myChartShow: false,
      flowPipeLine: null,
      // 用于判断
      currentSelectStart: null,
      currentSelectEnd: null,
      currentSelectStartLine: null,
@@ -443,12 +443,8 @@
    }
  },
  mounted () {
    // this.myChart = this.$echarts.init(document.getElementById('echarts_box'))
    // 全局map传递 || this.map = window.map
    this.map = window.map
    eventBus.$on('map-obj', (mapObj) => {
      this.map = mapObj
    })
    // 初始化echarts图表
    this.myChart = this.$echarts.init(this.$refs.myChart)
    // 使用 DrwLine方法
    eventBus.$on('draw-hdm-line', (points) => {
      this.getHdmPoint(points)
@@ -473,11 +469,11 @@
    // 流向地图上点击
    selectPipeLine () {
      this.map.on('click', this.selectClick)
      window.map.on('click', this.selectClick)
    },
    // 地图上点击回调
    selectClick (e) {
      this.map.off('click', this.selectClick)
      window.map.off('click', this.selectClick)
      const point = [e.latlng.lng, e.latlng.lat]
      console.log(point)
      this.getPipeLine(point)
@@ -776,12 +772,12 @@
    // 流向数据请求
    async getPipeLine (point) {
      const param = {
        x: point[0],
        y: point[1],
        radius: 3
      }
      console.log(param)
      // const param = {
      //   x: point[0],
      //   y: point[1],
      //   radius: 3
      // }
      // console.log(param)
      // 根据参数请求接口数据
      // const res = await api.getPipeline(param)
@@ -813,6 +809,7 @@
      console.log('正流向显示')
      console.log(e)
      // 清除流向方法
      this.clearLX()
      // const param = {
      //   points: e.data,
@@ -862,7 +859,8 @@
    // 横断面数据请求
    async getHdmPoint (line) {
      console.log('横断面的绘制线')
      console.table(line)
      // console.table(line)
      // 横断面数据
      this.hdmParam = {
        x1: line[0].lng,
        y1: line[0].lat,
@@ -958,7 +956,7 @@
  padding: 0;
}
/deep/ .clearfixs {
/deep/ .fixed-style {
  display: inline-block;
  color: #ffffff;
  margin: 15px;