弹出框修改

chenzeping

2021-03-29 ff7d4833fba266445fa57fd3998e6ce43bacc80a

弹出框修改

 src/api/request.js

@@ -8,22 +8,10 @@
    }
  })
}
export const FlueGas = (url) => {
  return $http.get('./static/airQuality.json')
export const FlueGas = (data = {}) => {
  return $http.post('/EPInterface/DataService/EPMapService.asmx/ObtainningConInfo', Qs.stringify(data), {
    headers: {
      'Content-Type': 'application/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/components/BaseNav/PublicBounced/PublicBounced.vue

@@ -1,16 +1,19 @@
<template>
  <div class="public-bounced" v-show="flag">
  <div class="public-bounced" v-draw v-show="flag">
    <div class="public-bounced-title">
      <span>{{ displayContent.Name }}</span>
      <i class="el-icon-circle-close" @click="closePopup"></i>
    </div>
    <div class="public-bounced-content">
      <span>内容</span>
      <div class="public-bounced-content-left"></div>
      <div class="public-bounced-content-right"></div>
    </div>
  </div>
</template>

<script>

import '@/components/BaseNav/SolidWaste/directive'

export default {
  name: 'PublicBounced',
@@ -42,7 +45,7 @@
  left: 10%;
  background-color: #002432;
  margin: 1% auto;
  border: 1px #a5bfd8 solid;
  border: 1px #9fc5c8 solid;

  .public-bounced-title {
    width: 100%;
@@ -65,5 +68,23 @@
    }
  }

  .public-bounced-content {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-around;
    .public-bounced-content-left {
      width: 48%;
      height: 400px;
      border: 1px red solid;
    }
    .public-bounced-content-right {
      width: 48%;
      height: 400px;
      border: 1px red solid;
    }
  }

}
</style>

 src/components/BaseNav/SolidWaste/directive.js

@@ -2,9 +2,9 @@

// 自定义元素实现弹框拖拽[重点]
Vue.directive('draw', {
  inserted: function (el, binding, vNode) {
    el.setAttribute('style', 'position: fixed; z-index: 9999')
  },
  // inserted: function (el, binding, vNode) {
  //   el.setAttribute('style', 'position: fixed; z-index: 9999')
  // },
  bind: function (el, bindding, vNode) {
    el.setAttribute('draggable', true)
    let left, top, width, height

 src/components/flueGas/flueGas.js

@@ -15,8 +15,8 @@
  }

  // 获取数据
  requestData () {
    FlueGas().then(res => {
  requestData (data) {
    FlueGas(data).then(res => {
      console.log(res)
      this.DrawFlueGasContent(res.Result.DataInfo)
    }).catch(err => {
@@ -75,7 +75,7 @@
        try {
          // console.log(e)
          this.EffectOfPulse(e.target.getLatLng())
          this.FlueGasPopup.setDate(data[i])
          this.FlueGasPopup.setData(data[i])
        } catch (error) {
          console.log(error)
        }

 src/utils/axios.js

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

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


 src/views/MapTemplate.vue

@@ -17,10 +17,8 @@
    <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>
<!--    <SolidContent ref="SolidWastePopup"></SolidContent>-->
    <PublicBounced ref="PublicBounced"></PublicBounced>
    <el-button type="primary" @click="AddGasHelper" class="flue-gas">废气</el-button>
    <popup-gas ref="FlueGas"></popup-gas>
    <public-bouncedounced ref="PublicBounced"></public-bouncedounced>
  </div>
</template>

@@ -44,9 +42,9 @@
// import SolidContent from '@components/SolidWaste/SolidContent'
// 废气
import AddGasHelper from '@components/flueGas/flueGas'
import PopupGas from '@/components/flueGas/popup-gas'
// import PopupGas from '@/components/flueGas/popup-gas'
// // 公共展示数据
// import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'
import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'

export default {
  name: 'MapTemplate',
@@ -63,8 +61,8 @@
    Popup,
    summarySheets,
    // SolidContent,
    PopupGas
    // PublicBounced
    // PopupGas,
    PublicBounced
  },
  data () {
    return {
@@ -88,9 +86,23 @@
  },
  methods: {
    AddGasHelper () {
      const data = {
        companyId: 3900100145,
        id: '',
        monType: 2,
        userCode: 'wenchun.deng',
        monDuration: '',
        epName: '',
        secdDeptId: '',
        contrLevel: '',
        dataStatus: '',
        dataFlag: '',
        runStatus: '',
        emissTypeId: ''
      }
      const AddGas = new AddGasHelper({ map: this.map })
      AddGas.requestData()
      AddGas.SetPlueGasContent(this.config, this.$refs.FlueGas)
      AddGas.requestData(data)
      AddGas.SetPlueGasContent(this.config, this.$refs.PublicBounced)
    },
    ChangeState () {
      const data = {
@@ -179,11 +191,12 @@

<style lang="less">
.flue-gas {
  position:fixed;
  position: fixed;
  top: 88px;
  left: 180px;
  z-index: 500;
}

.solid-waste {
  position: absolute;
  top: 88px;