派生自 wuyushui/SewerAndRainNetwork

wangqi
2021-04-12 e2617bb02680f0755824cab9235f142b3e1ac708
Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop

 Conflicts:
 src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue
9个文件已修改
208 ■■■■ 已修改文件
src/Sgis.js 2 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue 112 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue 52 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/LayerController/logic/WasteWater.js 2 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/LayerController/service/LayerFactory.js 26 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/LayerController/service/WfsLayerService.js 5 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/plugin/FullScreen.js 3 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/plugin/MeaSure.js 2 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/conf/MapConfig.js 4 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/Sgis.js
@@ -1,7 +1,7 @@
import BasemapHelper from '@components/helpers/BasemapHelper'
import VectorLayerHelper from '@components/helpers/VectorLayerHelper'
// 初始化显示
// import '@components/plugin/PathDrag'
import '@components/plugin/PathDrag'
import MapConfig from '@/conf/MapConfig'
import '@components/plugin/PathDashFlow' // 流动线图
import DownLoad from '@components/plugin/DownLoad'
src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue
@@ -64,6 +64,7 @@
<script>
import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
// import dayjs from 'dayjs'
export default {
  name: 'ECharts',
@@ -82,25 +83,10 @@
        user: '',
        region: ''
      },
      source: {
      }
      info: this.series
    }
  },
  methods: {
    datalistBtn (value) {
      // var inputSelect = document.getElementById('#ipt').value
      // var optionlength = document.getElementsByTagName('option').length
      // var optionId = ''
      // for (var i = 0; i < optionlength; i++) {
      //   // var optionValue = $('option').eq(i).attr('data-value')
      //   if (inputSelect == optionValue) {
      //     optionId = $('option').eq(i).attr('data-id')
      //   }
      // }
      console.log(1)
      // this.value = value
    },
    onSubmit () {
      console.log('submit!')
    },
@@ -117,12 +103,12 @@
        this.myChart.resize()
      }
    },
    initOptions: function (dataDate, dataValue1, dataValue2, dataValue3) {
    initOptions: function (dateDate, series) {
      var options = {
        title: {
          // text: '折线图堆叠'
        },
        color: ['#5470c6', '#91CC75', '#EE6666', '#FF0087'],
        color: ['#446cdc', '#c4c916', '#c1187e'],
        tooltip: {
          trigger: 'axis',
          axisPointer: {
@@ -170,7 +156,6 @@
          start: 0,
          end: 100,
          show: false,
          // handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
          handleSize: '80%',
          handleStyle: {
            color: '#fff',
@@ -183,8 +168,8 @@
        // x轴的设置
        xAxis: {
          type: 'category',
          boundaryGap: ['10%', '10%'],
          data: dataDate,
          boundaryGap: false,
          data: dateDate,
          axisLabel: { // x轴全部显示
            rotate: 20,
            interval: 0,
@@ -256,29 +241,7 @@
            }
          }
        }],
        series: [
          {
            name: 'COD',
            type: 'line',
            stack: '总量',
            data: dataValue1,
            yAxisIndex: 0
          },
          {
            name: '氨氮',
            type: 'line',
            stack: '总量',
            data: dataValue2,
            yAxisIndex: 0
          },
          {
            name: '废水流量',
            type: 'line',
            stack: '总量',
            data: dataValue3,
            yAxisIndex: 1
          }
        ]
        series: series
      }
      return options
    }
@@ -286,50 +249,35 @@
  mounted () {
    this.$nextTick(() => {
      this.drawChart()
      const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getQueryOnlineMonData)).reverse()
      const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getQueryOnlineMonDateData)).reverse()
      console.log(dataWatch)
      var dataValue1 = []
      var dataValue2 = []
      var dataValue3 = []
      var dataDate = []
      for (var i = 0; i < 24; i++) {
        dataDate.push(dataWatch[i].MonTimeStr.substring(0, 8))
      }
      var dateDate = []
      // {COD:[3,4,5]}
      var data = {}
      for (var n = 0; n < dataWatch.length; n++) {
        if (dataWatch[n].PoltmtrlName === 'COD') {
          dataValue1.push(dataWatch[n].MonQty)
        } else if (dataWatch[n].PoltmtrlName === '氨氮') {
          dataValue2.push(dataWatch[n].MonQty)
        } else if (dataWatch[n].PoltmtrlName === '废水流量') {
          dataValue3.push(dataWatch[n].MonQty)
        var d = dataWatch[n].MonTimeStr.substring(5, 9)
        if (dateDate.indexOf(d) < 0) {
          dateDate.push(d)
        }
        if (data[dataWatch[n].PoltmtrlName]) {
          data[dataWatch[n].PoltmtrlName].push(dataWatch[n].MonQty)
        } else {
          data[dataWatch[n].PoltmtrlName] = [dataWatch[n].MonQty]
        }
      }
      const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3)
      var series = []
      for (var k in data) {
        series.push({
          name: k,
          type: 'line',
          yAxisIndex: k === '废水流量' ? 1 : 0,
          data: data[k]
        })
      }
      console.log(series)
      const opitons = this.initOptions(dateDate, series)
      this.myChart = this.$echarts.init(this.$refs.main)
      this.myChart.setOption(opitons)
    })
  },
  // 地图切换
  updateBasemapList () {
    this.basemapList = this.basemapHelper.getBasemapList()
    console.log(this.basemapList)
  },
  changeBasemap (itm) {
    const code = itm.code
    this.basemapList.forEach((item) => {
      if (item.code === code) {
        console.log(this.currentBaseMapCode)
        if (this.currentBaseMapCode == null || this.currentBaseMapCode !== code) {
          this.currentBaseMapCode = code
          this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, true)
        } else {
          this.basemapHelper.showBasemap(item.code, item.conf.annotationCheck, false)
        }
        this.basemapHelper.getBasemapList().forEach((item) => {
          item.layer.bringToBack()
        })
      }
    })
  }
}
src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
@@ -10,6 +10,15 @@
            <li @click='tabTaggle("EChartsDate")'>日数据</li>
            <li @click='tabTaggle("ECharts")'>人工数据</li>
        </ul>
        <div id="title" >
            <span><strong> &nbsp; </strong></span>
            <span >正常</span>
            <span ></span>
            <span >预警</span>
            <span ></span>
            <span >超标</span>
            <span ></span>
        </div>
        <component :is="currentTab" v-bind="$attrs"></component>
    </div>
</template>
@@ -113,4 +122,47 @@
  color: #682000;
  cursor: pointer;
}
#title{
    height: 30px;
    /* margin-top: 30px; */
    color: #ffffff;
    margin-top: 5px;
}
#title span:nth-child(1){
    /*margin-left: 478px*/
}
#title span:nth-child(2){
    /*margin-left: 177px*/
}
#title span:nth-child(3){
    display: inline-block;
    background-color: #4ec99c;
    height: 15px;
    width: 35px;
    margin-left: 10px;
    border-radius: 5px;
}
#title span:nth-child(6){
    /*margin-left: 21px*/
}
#title span:nth-child(7){
    display: inline-block;
    background-color: red;
    height: 15px;
    width: 35px;
    margin-left: 7px;
    border-radius: 5px;
}
#title span:nth-child(4){
    margin-left: 17px;
}
#title span:nth-child(5){
    display: inline-block;
    background-color: orange;
    height: 15px;
    width: 35px;
    margin-left: 9px;
    border-radius: 5px;
}
</style>
src/components/LayerController/logic/WasteWater.js
@@ -45,6 +45,8 @@
    }
  }
  // 分割线-------------------------------------------------------------------------------
  // this.
  this.bindTooltip = (layer) => {
    return layer.options.test.Name
  }
src/components/LayerController/service/LayerFactory.js
@@ -11,13 +11,17 @@
  init (layerConfig) {
    // 1. 遍历layer config
    if (layerConfig) {
    for (var i = 0, l = layerConfig.length; i < l; i++) {
      var config = layerConfig[i]
      var layers = config.layers
        var childLayer = config.childLayer
      layers && this.init(config.layers)
        childLayer && this.init(config.childLayer)
      var checked = config.checked
      checked && this.load(config)
      }
    }
  }
@@ -72,17 +76,25 @@
  }
  /**
   * todo 这里无效,貌似是因为geojson加载到地图也是个layergroup
   *
     * 设置index,线在最下面,点在上面
     * @param layerGroup 图层组
     */
  setZIndex (layerGroup) {
    var layers = layerGroup.getLayers()
    if (layers.length > 0) {
      var layer = layers[0]
      if (layer.feature && (layer.feature.geometry.type === 'LineString' || layer.feature.geometry.type === 'MultiLineString')) {
        layerGroup.bringToBack()
  setZIndex (layer) {
    if (Array.isArray(layer)) {
      for (var i = 0; i < layer.length; i++) {
        this.setZIndex(layer[i])
      }
      } else {
        layerGroup.bringToFront()
      if (layer.getLayers) {
        this.setZIndex(layer.getLayers())
      } else {
        if (layer.feature && (layer.feature.geometry.type === 'LineString' || layer.feature.geometry.type === 'MultiLineString')) {
          layer.bringToBack()
        } else {
          layer.bringToFront()
        }
      }
    }
  }
src/components/LayerController/service/WfsLayerService.js
@@ -1,7 +1,6 @@
/**
 * 加载业务数据图层
 */
import { STYLES } from '../../../conf/Constants'
import AjaxUtils from '../../../utils/AjaxUtils'
@@ -30,14 +29,13 @@
  loadData (wfsUrl) {
    AjaxUtils.get4JsonDataByUrl(wfsUrl, this.params, (res) => {
      console.log(res)
      this.draw(res.data.features)
    })
  }
  draw (features) {
    const icon = this.config.icon
    this.L.geoJSON(features, {
    const geojsonLayer = this.L.geoJSON(features, {
      style: function (feature) {
        return {
          fill: STYLES.FILL,
@@ -75,6 +73,7 @@
          .on('mouseover', (e) => this.mouseOverListener(e, layer)).on('mouseout', (e) => this.mouseOutListener(e, layer))
      }
    }).addTo(this.layer)
    window.layerFactory.setZIndex(geojsonLayer)
  }
  mouseOverListener (e, layer) {
src/components/plugin/FullScreen.js
@@ -48,7 +48,8 @@
      },
      _toggleTitle: function () {
        this.link.title = this.optionsthis._map.isFullscreen()]
        this.link.title = this.options
        this._map.isFullscreen()
      }
    })
src/components/plugin/MeaSure.js
@@ -52,6 +52,7 @@
    areaMeasure.points.pop()
  },
  dblclick: function (e) { // 双击结束
    console.log(areaMeasure.polygon.dragging)
    console.log('双击结束', e)
    areaMeasure.polygon.enableEdit()
    areaMeasure.polygon.dragging.disable()
@@ -128,6 +129,7 @@
    distanceMeasure.points.pop()
  },
  dblclick: function (e) { // 双击结束
    console.log(distanceMeasure.polyline.dragging)
    console.log('双击结束', e)
    distanceMeasure.polyline.enableEdit()
    distanceMeasure.polyline.dragging.disable()
src/conf/MapConfig.js
@@ -1,6 +1,5 @@
import * as L from 'leaflet'
import TDT from './TDT'
import { LayerSewersPoint } from './layers/LayerSewers'
import { LayerTopic } from './LayerTopic'
import { LayerBasin } from './layers/LayerBasin'
@@ -42,8 +41,7 @@
  IntranetBaseMaps: TDT.intranet,
  InternetBaseMaps: TDT.internet,
  Layers: {
    LayerSewersLine: [LayerBasin, LayerTopic],
    layerSewersPoint: LayerSewersPoint
    LayerSewersLine: [LayerBasin, LayerTopic]
  } // 污雨水图层配置
}