公共弹框修改 固废内容修改

chenzeping

2021-03-31 dd48001d9793e5d338d38feebee5fc44e1296005

公共弹框修改 固废内容修改

 src/api/mapApi.js

@@ -14,5 +14,9 @@
  },
  getSolidWaste (data) {
    return axios.get(mapUrl.getSolidWaste, data)
  },
  getSolidWasteBaseInfo (data) {
    return axios.get(mapUrl.getSolidWasteBaseInfo, data)
  }

}

 src/api/mapUrl.js

@@ -6,3 +6,4 @@
export const GetUser = $HOST + '/user/getUser'

export const getSolidWaste = $HOST + '/wasteSolid/getSolidWaste'
export const getSolidWasteBaseInfo = $HOST + '/wasteSolid/getSolidWasteBaseInfo'

 src/api/request.js

@@ -2,19 +2,12 @@
import Qs from 'qs'

export const QueryStoragePlaceListByCompanyAndName = (data = {}) => {
  return $http.post('/EPInterface/DataService/EPMapService.asmx/QueryStoragePlaceListByCompanyAndName', Qs.stringify(data), {
  return $http.post('http://10.246.162.140:8080/EPInterface/DataService/EPMapService.asmx/QueryStoragePlaceListByCompanyAndName', Qs.stringify(data), {
    headers: {
      'Content-Type': 'application/json'
    }
  })
}
// export const QueryStoragePlaceListByCompanyAndName = (data = {}) => {
//   return $http.get('http://xearth.cn:3000/wasteSolid/getSolidWaste', Qs.stringify(data), {
//     headers: {
//       'Content-Type': 'application/json'
//     }
//   })
// }
export const FlueGas = (data = {}) => {
  return $http.post('/EPInterface/DataService/EPMapService.asmx/ObtainningConInfo', Qs.stringify(data), {
    headers: {

 src/components/BaseNav/PublicBounced/PublicBounced.vue

@@ -1,5 +1,5 @@
<template>
  <div class="public-bounced" v-draw v-show="flag">
  <div class="public-bounced" v-if="flag">
    <div class="public-bounced-title">
      <span>{{ displayContent.Name }}</span>
      <i class="el-icon-circle-close" @click="closePopup"></i>
@@ -7,9 +7,10 @@
    <div class="public-bounced-content">
      <div class="public-bounced-content-left">
        <GasTab :displayContent="displayContent"></GasTab>
        <!--                <PublicTable v-if="value === 'gufei'" :requestSolidWasteData="displayContent.StoragePlaceId"></PublicTable>-->
        <PublicTable></PublicTable>
        <!--        <GasECharts v-else></GasECharts>-->
        <PublicTable v-if="value === 'gufei'" :requestSolidWasteData="displayContent.StoragePlaceId"></PublicTable>
        <GasECharts v-else></GasECharts>
        <!--        <PublicTable></PublicTable>-->
        <!--        <GasECharts></GasECharts>-->
      </div>
      <div class="public-bounced-content-right">
        <GasVideo></GasVideo>
@@ -23,7 +24,7 @@
import '@/components/BaseNav/SolidWaste/directive/dir'
import GasTab from '@components/BaseNav/PublicBounced/GasComponents/GasTab'
import PublicTable from '@components/BaseNav/PublicBounced/GasComponents/PublicTable'
// import GasECharts from '@components/BaseNav/PublicBounced/GasComponents/GasECharts'
import GasECharts from '@components/BaseNav/PublicBounced/GasComponents/GasECharts'
import GasVideo from '@components/BaseNav/PublicBounced/GasComponents/GasVideo'

export default {
@@ -31,7 +32,7 @@
  components: {
    GasTab,
    PublicTable,
    // GasECharts,
    GasECharts,
    GasVideo
  },
  data () {
@@ -41,11 +42,19 @@
    }
  },
  methods: {
    setData (data) {
    setData (data, value) {
      console.log(data)
      console.log(value)
      this.displayContent = data
      this.flag = true
      // this.value = value
      this.value = value
      console.log(this.flag)
    },
    // setData (data) {
    //   this.displayContent = data
    //   this.flag = true
    //   // this.value = value
    // },
    closePopup () {
      this.flag = false
    }
@@ -86,7 +95,7 @@
  .public-bounced-content {
    margin: 15px auto;
    display: flex;
    align-items: center;
    //align-items: center;
    justify-content: space-around;

    .public-bounced-content-left {

 src/components/BaseNav/SolidWaste/SolidWaste.js

@@ -1,7 +1,8 @@
import { QueryStoragePlaceListByCompanyAndName } from '@/api/request'
// 展示图片
import defaultImg from '@assets/images/map-pages/basenav/solidwaste/voc.png'
import Setting from '@assets/images/map-pages/basenav/solidwaste/gf_green.png'

import defaultImg from '../../../../public/assets/images/map/solidwaste/voc.png'
import setting from '../../../../public/assets/images/map/solidwaste/gf_green.png'

// 底图业务展示点
class AddSolidWasteHelper {
@@ -63,13 +64,9 @@
        marker.on('click', (e) => {
          try {
            // console.log(e)
            // console.log(this.map.getCenter())
            // console.log(this.map.setCenter([e.target.getLatLng().lat, e.target.getLatLng().lng]))
            // this.map.flyTo([e.target.getLatLng().lat, e.target.getLatLng().lng])
            // this.map.panTo([e.target.getLatLng().lat, e.target.getLatLng().lng], 100)
            this.setPanTo(e.target.getLatLng(), 250)
            this.setPanTo(e.target.getLatLng(), 200)
            this.EffectOfPulse(e.target.getLatLng())
            // this.SolidWastePopup.setData(data[i], 'gufei')
            this.SolidWastePopup.setData(data[i], 'gufei')
            return this.SolidWastePopup.$el
          } catch (error) {
            console.log(error)
@@ -114,7 +111,7 @@
      EffectOfChange = defaultImg
      this.EffectOfPulse(position, this.solidWasteMarkersLabels, this.SolidWasteLayerGroup)
    } else {
      EffectOfChange = Setting
      EffectOfChange = setting
    }
    return EffectOfChange
  }

 src/components/LayerController/logic/SolidWaste.js

@@ -5,8 +5,12 @@
const defaultImg = '/assets/images/map/solidwaste/voc.png'
const setting = '/assets/images/map/solidwaste/gf_green.png'

// 请求接口数据
const mapApi = require('../../../api/mapApi').default
// 使用封装方法
const AnimalService = require('../service/AnimalService').default

const publicBounced = require('../../BaseNav/PublicBounced/PublicBounced').default

module.exports = function () {
  /**
@@ -14,43 +18,48 @@
   * @param L leaflet对象
   */
  this.init = async (layer, L) => {
    // const SolidWasteIcon = this.SolidWasteIcon()
    this.animalService = new AnimalService({
      L: L,
      layer: layer
    })
    const res = await mapApi.getSolidWaste()
    // console.log(res)
    const data = res.Result.DataInfo || {}
    for (let i = 0; i < data.length; i++) {
    const result = await mapApi.getSolidWaste()
    const getSolidWasteData = result.Result.DataInfo || {}
    // 循环遍历数据 根据进行marker 的创建
    for (let i = 0; i < getSolidWasteData.length; i++) {
      // 经纬度 位置
      const positionX = data[i].Latitude
      const positionY = data[i].Longitude
      const positionX = getSolidWasteData[i].Latitude
      const positionY = getSolidWasteData[i].Longitude

      // 定义类型 用来区分数据的不同
      const judgeValue = data[i].StorageQty
      // 定义类型 用来区分数据的不同 1.接口接口数据来进行数据的判断 2.根据数据类型的不同，进行不同类型的图片显示
      const judgeValue = getSolidWasteData[i].StorageQty
      var iconUrl = this.differentTypes(judgeValue)

      const marker = L.marker.magic([positionX, positionY], {
      const marker = L.marker([positionX, positionY], {
        test: getSolidWasteData[i],
        icon: L.icon({
          iconUrl: iconUrl,
          iconSize: [50, 50],
          iconAnchor: [25, 25]
        })
      })

      layer.addLayer(marker)
    }
  }

  this.bindTooltip = (layer) => {
    return '测试固废'
    return layer.options.test.Name
  }

  this.clickListener = (e) => {
  this.clickListener = async (e) => {
    this.animalService.pulseEffect(e.latlng)
    console.log(e)
    return this.PublicBounced.$el
    const dataValue = {
      StoragePlaceId: e.layer.options.test.StoragePlaceId
    }
    const result = await mapApi.getSolidWasteBaseInfo(dataValue)
    // console.log(result)
    const PublicBounced = window.Vue.extend(publicBounced)
    const instance = new PublicBounced()
    instance.setData(result, 'gufei')
  }

  // 不同类型图片封装
@@ -63,8 +72,4 @@
    }
    return effectOfChange
  }
  // 固废点击进行的 内容的设置
  // SetSolidWasteContent (config, containerPopup) {
  //   this.SolidWastePopup = containerPopup
  // }
}

 src/components/LayerController/logic/WasteGas.js

@@ -28,9 +28,9 @@
      const data = res.data.Result.DataInfo
      for (let i = 0; i < data.length; i++) {
        // 经纬度 位置
        const positionX = data[i].Latitude
        const positionY = data[i].Longitude
        layer.addLayer(L.marker([positionX, positionY], {}))
        // const positionX = data[i].Latitude
        // const positionY = data[i].Longitude
        // layer.addLayer(L.marker([positionX, positionY], {}))
      }
    })
  }

 src/conf/MapConfig.js

@@ -25,8 +25,8 @@
  minZoom: 3,
  maxZoom: 18,
  // center: [26, 104],
  // center: [38.828558921813965, 117.41676807403564],
  center: [29.769515991210938, 107.03567504882812],
  center: [38.828558921813965, 117.41676807403564],
  // center: [29.454345703125, 113.40362548828125],
  zoom: 14,
  worldCopyJump: true,
  inertia: true,

 src/views/MapTemplate.vue

@@ -16,7 +16,7 @@
    <summary-sheets></summary-sheets>
    <enterprise></enterprise>
    <!--    <el-button id="map-btn" el-icon-c-scale-to-original icon="el-icon-c-scale-to-original" circle @click="isShowHidden"></el-button>-->
    <!--    <el-button type="primary" @click="ChangeState" class="solid-waste">固废</el-button>-->
<!--    <el-button type="primary" @click="ChangeState" class="solid-waste">固废</el-button>-->
    <el-button type="primary" @click="ChangeWaterState" class="Waste-water">废水</el-button>
    <el-button type="primary" @click="AddGasHelper" class="flue-gas">废气</el-button>
    <PublicBounced ref="PublicBounced"></PublicBounced>
@@ -39,6 +39,7 @@
import LegendPanel from '@components/panel/LegendPanel'
import Enterprise from '../components/table/enterprise'
// 底图业务js逻辑
import AddSolidWasteHelper from '@components/BaseNav/SolidWaste/SolidWaste'
import AddWasteWaterHelper from '@components/BaseNav/WasteWater/WasteWater'
import AddGasHelper from '@components/BaseNav/flueGas/flueGas'
// // 公共展示数据
@@ -82,6 +83,18 @@
    })
  },
  methods: {
    ChangeState () {
      const data = {
        companyId: 3900100145,
        userCode: 'wenchun.deng',
        name: '',
        marginWarr: '',
        longDayWarr: ''
      }
      const AddSolidWaste = new AddSolidWasteHelper({ map: this.map })
      AddSolidWaste.requestData(data)
      AddSolidWaste.SetSolidWasteContent(this.config, this.$refs.PublicBounced)
    },
    AddGasHelper () {
      const data = {
        companyId: 3900100145,
@@ -153,6 +166,7 @@
      this.vectorLayerHelper = Sgis.initVectorLayersHelper(this.map) // 初始化动态要素图层助手
      this.vectorLayerHelper.initVectorLayers(this.config)

      this.ChangeState()
      // this.AddGasHelper()
      // this.ChangeWaterState()