Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetw...

wangqi

2021-03-29 78b643de0b8690d566146858cd781be98d01777d

Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop


 Conflicts:

	src/api/request.js

	src/main.js

	src/views/MapTemplate.vue

 package.json

@@ -28,6 +28,7 @@
    "leaflet.markercluster": "^1.4.1",
    "lodash": "^4.17.10",
    "nprogress": "^0.2.0",
    "qs": "^6.10.1",
    "rbush": "^3.0.1",
    "screenfull": "^3.3.3",
    "style-resources-loader": "^1.4.1",

 src/Sgis.js

@@ -16,13 +16,9 @@
import './components/plugin/Editable' // 标绘操作
import './components/plugin/MagicMarker' // 动画Marker
import './assets/css/map/magic.min.css' // 动画Marker css
import './components/BaseNav/Pulse'
import './components/BaseNav/Pulse.css'

// import WmtsSupport from '@components/plugin/wmts_plugins'
// import CanvasMarkers from '@components/plugin/CanvasMarkers'
// import FullScreen from '@components/plugin/FullScreen'
// import 'leaflet-canvas-markers'
import '@/components/plugin/magicMarker.css'
import '@components/plugin/pulse/Pulse' // marker 外圈波
import '@components/plugin/pulse/Pulse.css' // marker 外圈波 css

let map = null
const L = window.L
@@ -30,18 +26,6 @@
  if (map != null) {
    map.remove()
  }

  // Leaflet扩展代码
  // Editable.init(L) // 图层编辑
  // PathDrag.init(L) // 路径拖拽
  // MagicMarker.init(L) // 动画Marker
  // WmtsSupport.init(L) // 扩展，使支持WMTS
  // CustomPopup.init(L) // 自定义弹出框
  // CanvasMarkers.init(L)// 画布图层
  // 全屏
  // FullScreen.init(L)
  // 下载
  // LeafletMeasurePath.init(L)
  DownLoad.init(L)

  map = L.map(div, MapConfig.mapOptions)
@@ -52,8 +36,6 @@

  window.map = map
  window.L = L

  // L.sgis = L.sgis || L

  initTileLayersHelper(map)


 src/api/request.js

@@ -4,25 +4,14 @@
// export const requestSolidWaste = (url, data = {}) => {
//   return $http.post('./static/SolidWaste.json', data)
// }
export const requestSolidWaste = (url) => {
  return $http.get('./static/SolidWaste.json')
// export const requestSolidWaste = (url) => {
//   return $http.get('./static/SolidWaste.json')
import Qs from 'qs'

export const QueryStoragePlaceListByCompanyAndName = (data = {}) => {
  return $http.post('/EPInterface/DataService/EPMapService.asmx/QueryStoragePlaceListByCompanyAndName', Qs.stringify(data), {
    headers: {
      'Content-Type': 'application/json'
    }
  })
}
export const FlueGas = (url) => {
  return $http.get('./static/airQuality.json')
}
// export function FlueGas () {
//   return axios.post('http://10.246.162.140:8080/EPInterface/DataService/EPMapService.asmx/ObtainningConInfo', {
//     companyId: 3900100145,
//     id: '',
//     monType: 2,
//     userCode: 'wenchun.deng',
//     monDuration: '',
//     epName: '',
//     secdDeptId: '',
//     contrLevel: '',
//     dataStatus: '',
//     dataFlag: '',
//     runStatus: '',
//     emissTypeId: ''
//   })
// }

 src/assets/images/map-pages/basenav/solidwaste/gf_green.png

 src/assets/images/map-pages/basenav/solidwaste/voc.png

 src/components/BaseNav/PublicBounced/PublicBounced.vue

New file
@@ -0,0 +1,80 @@
<template>
  <div class="public-bounced" v-show="flag">
    <div class="popup_title">{{ displayContent.Name }}</div>
    <div class="popup_bottom">
      <button @click="closePopup">确定</button>
    </div>
  </div>
</template>

<script>

export default {
  name: 'PublicBounced',
  data () {
    return {
      displayContent: [],
      flag: false
    }
  },
  methods: {
    setData (data) {
      this.displayContent = data
      this.flag = true
    },
    closePopup () {
      this.flag = false
    }
  }
}
</script>

<style scoped>
.public-bounced {
  width: 80%;
  z-index: 499;
  position: absolute;
  top: 15%;
  left: 10%;
  background-color: rgba(128, 128, 128, 0.507);
  padding: 1%;
  border-radius: 20px;
  margin: 10% auto;
}

.popup_title {
  text-align: center;
  font-weight: 600;
  font-size: 30px;
}

.popup_center {
  padding: 10%;
  font-size: 20px;
}

.popup_bottom {
  display: flex;
  justify-content: space-around;
}

button {
  width: 25%;
  height: 20%;
  padding: 2%;
  border: 1px solid gray;
  border-radius: 10px;
}

button:nth-child(1) {
  background-color: orangered;
  color: white;
  font-size: 20px;
}

button:nth-child(2) {
  background-color: gray;
  color: black;
  font-size: 20px;
}
</style>

 src/components/BaseNav/SolidContent.vue

File was deleted

 src/components/BaseNav/SolidWaste/Popup.vue

New file
@@ -0,0 +1,111 @@
<template>
  <div class="box" @click.stop="clo_box">
    <div class="popup_content">
      <div class="popup_title">{{ this.title }}</div>
      <div class="popup_center">
        <div v-if="this.content_text">{{ this.content_text }}</div>
        <slot></slot>
      </div>
      <div class="popup_bottom">
        <button @click="popup_sub">确定{{ displayContent.Name }}</button>
        <button @click="popup_clo">取消</button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'SolidContent',
  data () {
    return {
      displayContent: []
    }
  },
  props: {
    title: {
      type: String,
      default: '默认标题'
    },
    content_text: {
      type: String,
      default: ''
    },
    hidden: {
      type: Boolean,
      default: false
    }
  },
  methods: {
    // 点击确定事件
    popup_sub () {
      this.$emit('popup_sub')
    },
    // 点击了取消事件
    popup_clo () {
      this.$emit('popup_clo')
    },
    // 点击了弹出框以外区域
    clo_box (e) {
      if (e.target._prevClass === 'box') {
        this.$emit('clo_box')
      }
    }
  }
}
</script>

<style scoped>
.box {
  width: 80%;
  z-index: 999;
  position: absolute;
  top: 50%;
  left: 25%;
  background-color: rgba(128, 128, 128, 0.507);
}

.popup_content {
  background-color: white;
  padding: 1%;
  border-radius: 20px;
  width: 40%;
  margin: 10% auto;
}

.popup_title {
  text-align: center;
  font-weight: 600;
  font-size: 30px;
}

.popup_center {
  padding: 10%;
  font-size: 20px;
}

.popup_bottom {
  display: flex;
  justify-content: space-around;
}

button {
  width: 25%;
  height: 20%;
  padding: 2%;
  border: 1px solid gray;
  border-radius: 10px;
}

button:nth-child(1) {
  background-color: orangered;
  color: white;
  font-size: 20px;
}

button:nth-child(2) {
  background-color: gray;
  color: black;
  font-size: 20px;
}
</style>

 src/components/BaseNav/SolidWaste/SolidContent.vue

New file
@@ -0,0 +1,82 @@
<template>
  <div class="public-bounced" v-show="flag">
    <div class="popup_title">{{ displayContent.Name }}</div>
    <div class="popup_bottom">
      <button @click="closePopup">确定</button>
      <button @click="closePopup">取消</button>
    </div>
  </div>
</template>

<script>
import '@components/BaseNav/SolidWaste/directive'

export default {
  name: 'SolidContent',
  data () {
    return {
      displayContent: [],
      flag: false
    }
  },
  methods: {
    setData (data) {
      this.displayContent = data
      this.flag = true
    },
    closePopup () {
      this.flag = false
    }
  }
}
</script>

<style scoped>
.public-bounced {
  width: 80%;
  z-index: 499;
  position: absolute;
  top: 15%;
  left: 10%;
  background-color: rgba(128, 128, 128, 0.507);
  padding: 1%;
  border-radius: 20px;
  margin: 10% auto;
}

.popup_title {
  text-align: center;
  font-weight: 600;
  font-size: 30px;
}

.popup_center {
  padding: 10%;
  font-size: 20px;
}

.popup_bottom {
  display: flex;
  justify-content: space-around;
}

button {
  width: 25%;
  height: 20%;
  padding: 2%;
  border: 1px solid gray;
  border-radius: 10px;
}

button:nth-child(1) {
  background-color: orangered;
  color: white;
  font-size: 20px;
}

button:nth-child(2) {
  background-color: gray;
  color: black;
  font-size: 20px;
}
</style>

 src/components/BaseNav/SolidWaste/SolidWaste.js

File was renamed from src/components/BaseNav/SolidWaste.js
@@ -1,7 +1,7 @@
import { requestSolidWaste } from '@/api/request'
import { QueryStoragePlaceListByCompanyAndName } from '@/api/request'
// 展示图片
import defaultImg from '@components/BaseNav/magicMarker.png'
import Setting from '@components/BaseNav/voc.png'
import defaultImg from '@assets/images/map-pages/basenav/solidwaste/voc.png'
import Setting from '@assets/images/map-pages/basenav/solidwaste/gf_green.png'

// 底图业务展示点
class AddSolidWasteHelper {
@@ -16,9 +16,9 @@
  }

  // 请求数据 data 为参数， 请求后台数据时 携带data参数
  requestData () {
    requestSolidWaste().then(res => {
      // console.log(res)
  requestData (data) {
    QueryStoragePlaceListByCompanyAndName(data).then(res => {
      console.log(res)
      this.DrawTheSolidWasteContent(res.Result.DataInfo)
    }).catch(err => {
      console.log(err)
@@ -36,51 +36,44 @@
    }
    for (let i = 0; i < data.length; i++) {
      // 经纬度 位置
      const positionX = data[i].positionX
      const positionY = data[i].positionY
      const positionX = data[i].Latitude
      const positionY = data[i].Longitude

      // 判断 经纬度位置信息是否存在
      // if (positionX != null && positionY != null) {
      // 用于 判断 => 判断是否展示脉冲效果 => temp(临时)
      const determineValueOne = data[i].LongDayWarning
      var determineValueTwo = data[i].StorageQty
      const positionArea = [positionX, positionY]
      if (positionX != null && positionY != null) {
        // 用于 判断 => 判断是否展示脉冲效果 => temp(临时)
        const determineValueOne = data[i].LongDayWarning
        var determineValueTwo = data[i].StorageQty
        const positionArea = [positionX, positionY]

      // 图标展示
      var iconUrl = this.SolidWasteIconUrl(determineValueOne, determineValueTwo, positionArea)
      var Icon = new SolidWasteIcon({ iconUrl: iconUrl })
      // var url = Icon.options.iconUrl
        // 图标展示
        var iconUrl = this.SolidWasteIconUrl(determineValueOne, determineValueTwo, positionArea)
        var Icon = new SolidWasteIcon({ iconUrl: iconUrl })
        // var url = Icon.options.iconUrl

      const marker = this.L.marker([positionX, positionY], { icon: Icon })
        const marker = this.L.marker([positionX, positionY], { icon: Icon })

      marker.bindPopup(() => {
        return this.SolidWastePopup.$el
      }, {
        className: 's-map-popup',
        minWidth: 600,
        closeButton: true,
        autoClose: false
      })
      // 划过出现 展示数据
      marker.bindTooltip(data[i].StoragePlaceName, {
        permanent: true,
        offset: [0, -16],
        direction: 'top',
        className: ''
      })
      // 点击 事件
      marker.on('click', (e) => {
        try {
          // console.log(e)
          this.EffectOfPulse(e.target.getLatLng())
          this.SolidWastePopup.setDate(data[i])
        } catch (error) {
          console.log(error)
        }
      })
      // 设置内容添加到图层
      this.SolidWasteLayerGroup.addLayer(marker)
      // }
        // 划过出现 展示数据
        marker.bindTooltip(data[i].Name, {
          permanent: true,
          offset: [0, 16],
          direction: 'bottom',
          className: ''
        })
        // 点击 事件
        marker.on('click', (e) => {
          try {
            // console.log(e)
            this.EffectOfPulse(e.target.getLatLng())
            this.SolidWastePopup.setData(data[i])
            return this.SolidWastePopup.$el
          } catch (error) {
            console.log(error)
          }
        })
        // 设置内容添加到图层
        this.SolidWasteLayerGroup.addLayer(marker)
      }
    }
  }

@@ -146,7 +139,8 @@
  PulseCountSetting () {
    var HeightLightTime = 5
    var PulseNumber = 5
    const pulseinterver = setInterval(() => {
    const pulseinterver = setInterval((e) => {
      console.log(e)
      if (PulseNumber > 0) {
        PulseNumber--
      } else {

 src/components/BaseNav/SolidWaste/SolidWasteTable.vue

 src/components/BaseNav/SolidWaste/directive.js

 src/components/BaseNav/SolidWasteExtend.js

File was deleted

 src/components/BaseNav/WireSurface/index.js

New file
@@ -0,0 +1,23 @@

// 引入用于处理接口数据获取的方法
import { getDataInitWireSurface } from '@src/api/request'

class initWireSurface {
  constructor (options) {
    this.map = options.map
    this.L = window.L
    this.initWireSurfaceMap = new Map()
    this.initWireSurfacePopup = this.L.layerGroup().addTo(this.map)
  }

  // 获取页面线/面数据
  getDataInitWireSurface () {
    getDataInitWireSurface().then(res => {
      console.log(res)
    }).catch(error => {
      console.log(error)
    })
  }
}

export default initWireSurface

 src/components/BaseNav/style.css

File was deleted

 src/components/plugin/MagicMarker.js

@@ -1,49 +1,27 @@
const init = (L) => {
  (function (window) {
    console.log(window)
    const setOptions = function (obj, options) {
      for (const i in options) {
        obj[i] = options[i]
      }
      return obj
/* eslint-disable */
!(function (i) {
  var c = function (i, c) {
    for (var n in c) i[n] = c[n]
    return i
  }
  L.Icon.Magic = function (i) {
    if (i.iconUrl) {
      var n = { html: '<div class=\'magicDiv\'><div class=\'magictime ' + i.magic + '\'>' + i.html + '<img id=\'migic\' src=\'' + i.iconUrl + '\'/></div></div>' }
    } else {
      var n = { html: '<div class=\'magicDiv\'><div class=\'magictime ' + i.magic + '\'>' + i.html + '</div></div>' }
    }
    L.Icon.Magic = function (options) {
      let opts
      if (options.iconUrl) {
        opts = {
          html: "<div class='magicDiv'><div class='magictime " + options.magic + "'><img id='migic' src='" + options.iconUrl + "'/></div></div>"
          // className: 'magicDiv',
        }
      } else {
        opts = {
          html: "<div class='magicDiv'><div class='magictime " + options.magic + "'>" + options.html + '</div></div>'
          // className: 'magicDiv',
        }
      }
      delete options.html
      const magicIconOpts = setOptions(opts, options)
      // console.log(magicIconOpts)
      const magicIcon = L.divIcon(magicIconOpts)
      return magicIcon
    delete i.html
    var a = c(n, i)
    console.log(a)
    var r = L.divIcon(a)
    return r
  }, L.icon.magic = function (i) {
    return new L.Icon.Magic(i)
  }, L.Marker.Magic = L.Marker.extend({
    initialize: function (i, c) {
      c.icon = L.icon.magic(c), L.Marker.prototype.initialize.call(this, i, c)
    }

    L.icon.magic = function (options) {
      return new L.Icon.Magic(options)
    }

    L.Marker.Magic = L.Marker.extend({
      initialize: function (latlng, options) {
        options.icon = L.icon.magic(options)
        L.Marker.prototype.initialize.call(this, latlng, options)
      }
    })

    L.marker.magic = function (latlng, options) {
      return new L.Marker.Magic(latlng, options)
    }
  })(window)
}

export default {
  init
}
  }), L.marker.magic = function (i, c) {
    return new L.Marker.Magic(i, c)
  }
}(window))

 src/components/plugin/pulse/Pulse.css

 src/components/plugin/pulse/Pulse.js

 src/conf/MapConfig.js

@@ -2,6 +2,7 @@
import TDT from './TDT'
import { LayerSewersLine, LayerSewersPoint } from './LayerSewers'
import { LayerWasteWater } from './LayerWasteWater'

const curWwwPath = window.document.location.href
const pathname = window.document.location.pathname
const pos = curWwwPath.indexOf(pathname)
@@ -22,7 +23,7 @@
  minZoom: 3,
  maxZoom: 18,
  // center: [26, 104],
  center: [32.224016189575195, 118.77070426940918],
  center: [38.828558921813965, 117.41676807403564],
  zoom: 14,
  worldCopyJump: true,
  inertia: true,
@@ -38,7 +39,10 @@
  // defaultBasemapCode: 'tianditu_img', // 默认显示 地图类型
  IntranetBaseMaps: TDT.intranet,
  InternetBaseMaps: TDT.internet,
  Layers: { LayerSewersLine: [LayerSewersLine, LayerWasteWater], layerSewersPoint: LayerSewersPoint } // 污雨水图层配置
  Layers: {
    LayerSewersLine: [LayerSewersLine, LayerWasteWater],
    layerSewersPoint: LayerSewersPoint
  } // 污雨水图层配置
}

/**

 src/utils/axios.js

@@ -83,7 +83,8 @@

// 创建axios实例
const Service = axios.create({
  timeout: 1000
  timeout: 1000,
  baseURL: 'http://10.246.162.140:8080/'
})

const CancelToken = axios.CancelToken

 src/views/MapTemplate.vue

@@ -20,6 +20,7 @@
    <SolidContent ref="SolidWastePopup"></SolidContent>
    <el-button type="primary" @click="AddGasHelper" class="flue-gas">废气</el-button>
    <popup-gas ref="FlueGas"></popup-gas>
    <PublicBounced ref="PublicBounced"></PublicBounced>
  </div>
</template>

@@ -38,12 +39,15 @@
// import MenuSpecial from '@components/panel/MenuTopic'
import LegendPanel from '@components/panel/LegendPanel'
import Enterprise from '../components/table/enterprise'
import SolidContent from '@components/BaseNav/SolidContent'
// 底图业务js逻辑
import AddSolidWasteHelper from '@components/BaseNav/SolidWaste'
// 废气
import AddGasHelper from '@components/flueGas/flueGas'
import PopupGas from '@/components/flueGas/popup-gas'
import AddSolidWasteHelper from '@components/BaseNav/SolidWaste/SolidWaste'
// 公共展示数据
import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'

export default {
  name: 'MapTemplate',
  components: {
@@ -76,9 +80,6 @@
      return this.$store.state.map.config
    }
  },
  // created () {
  //   this.FlueGas()
  // },
  beforeMount () {
    this.$nextTick(() => {
      this.init()
@@ -91,9 +92,16 @@
      AddGas.SetPlueGasContent(this.config, this.$refs.FlueGas)
    },
    ChangeState () {
      const data = {
        companyId: 3900100145,
        userCode: 'wenchun.deng',
        name: '',
        marginWarr: '',
        longDayWarr: ''
      }
      const AddSolidWaste = new AddSolidWasteHelper({ map: this.map })
      AddSolidWaste.requestData()
      AddSolidWaste.SetSolidWasteContent(this.config, this.$refs.SolidWastePopup)
      AddSolidWaste.requestData(data)
      AddSolidWaste.SetSolidWasteContent(this.config, this.$refs.PublicBounced)
    },
    saveMapStatus () {
      window.serviceLayerHelper = this.serviceLayerHelper