Merge remote-tracking branch 'origin/develop' into develop

yangdelong

2021-05-29 71c663091d05b11c41f78d8e75cb8b3db63b9cbc

Merge remote-tracking branch 'origin/develop' into develop

 public/assets/environmentRiskPoint.json

@@ -1,7 +1,7 @@
[
  [
    {
      "no": 1,
      "no": 0,
      "company": "扬子石化",
      "plate": "炼油板块",
      "unitname": "芳烃厂、炼油厂",
@@ -10,10 +10,10 @@
      "after": "R4(115.48)M1(10)E1",
      "Longitude": 118.7936111111,
      "Latitude": 32.2583305556,
      "iconType": 1
      "riskLevel": 1
    },
    {
      "no": 2,
      "no": 0,
      "company": "扬子石化",
      "plate": "化工板块",
      "unitname": "水厂",
@@ -22,7 +22,7 @@
      "after": "R3(25)M1(10)E1",
      "Longitude": 118.8174111111,
      "Latitude": 32.2429611111,
      "iconType": 1
      "riskLevel": 1
    }
  ],[
      {
@@ -35,10 +35,10 @@
        "after": "R3(90)M2(25)E1",
        "Longitude": 113.36571,
        "Latitude": 29.54677,
        "iconType": 2
        "riskLevel": 2
      },
      {
        "no": 2,
        "no": 1,
        "company": "长岭炼化",
        "plate": "化工板块",
        "unitname": "港口部",
@@ -47,11 +47,11 @@
        "after": "Q3(29)M3(30)E1",
        "Longitude": 113.2917,
        "Latitude": 29.60036,
        "iconType": 2
        "riskLevel": 2
      }
  ],[
      {
        "no": 1,
        "no": 2,
        "company": "长岭炼化",
        "plate": "化工板块",
        "unitname": "港口部",
@@ -60,7 +60,7 @@
        "after": "Q3(19)M3(30)E1",
        "Longitude": 113.27935,
        "Latitude": 29.59832,
        "iconType": 3
        "riskLevel": 3
      },
      {
        "no": 2,
@@ -72,11 +72,11 @@
        "after": "R3(2.1)M3(30)E2",
        "Longitude": 113.28155,
        "Latitude": 29.59842,
        "iconType": 3
        "riskLevel": 3
      }
  ],[
      {
        "no": 1,
        "no": 3,
        "company": "中韩石化",
        "plate": "炼油板块",
        "unitname": "炼油二部",
@@ -85,7 +85,7 @@
        "after": "R3M2E1",
        "Longitude": 114.44016,
        "Latitude": 30.65305,
        "iconType": 4
        "riskLevel": 4
      }
  ]
]

 src/components/LayerController/logic/EnvironmentRisk.js

@@ -9,7 +9,6 @@
const echarts = require('echarts/lib/echarts')

module.exports = function () {
  let animalService = null
  // 环形统计图数组
  let riskLayerGroup = null

@@ -18,7 +17,7 @@
   * @param L leaflet对象
   */
  this.init = async (layer, L) => {
    animalService = new AnimalService({
    this.animalService = new AnimalService({
      L: L,
      layer: layer
    })
@@ -33,7 +32,7 @@
      riskLayerGroup.remove()
      riskLayerGroup = null
    }
    riskLayerGroup = animalService.L.featureGroup().addTo(animalService.layer)
    riskLayerGroup = this.animalService.L.featureGroup().addTo(this.animalService.layer)
    const result = await mapApi.getEnvironmentRisk()
    const features = result.features
    for (let i = 0; i < features.length; i++) {
@@ -46,16 +45,16 @@
      if (distract !== '长江沿线') {
        continue
      }
      animalService.L.marker([coordinates[1], coordinates[0]], {
        icon: animalService.L.divIcon({
      this.animalService.L.marker([coordinates[1], coordinates[0]], {
        icon: this.animalService.L.divIcon({
          className: '',
          iconAnchor: [15, 45],
          iconSize: [40, 40],
          html: '<div style="width: 40px; height: 40px; background-color: rgba(255,255,255,1); position: relative; border-radius: 50%;"></div>'
        })
      }).addTo(riskLayerGroup)
      animalService.L.marker([coordinates[1], coordinates[0]], {
        icon: animalService.L.divIcon({
      this.animalService.L.marker([coordinates[1], coordinates[0]], {
        icon: this.animalService.L.divIcon({
          className: '',
          iconAnchor: [30, 60],
          iconSize: [70, 70],

 src/components/LayerController/logic/RiskSource.js

@@ -2,7 +2,7 @@
 * 环境风险源
 */
// 信息组件
const RiskSourceIndex = require('../../../components/base-page/WasteSolid/WasteSolidIndex.vue').default
const RiskSourceIndex = require('../../base-page/RiskSource/RiskSourceIndex.vue').default
const riskRed = '/assets/images/map/environmentRisk/risk_red.png'
const riskSandybrown = '/assets/images/map/environmentRisk/risk_sandybrown.png'
const riskYellow = '/assets/images/map/environmentRisk/risk_yellow.png'
@@ -28,7 +28,7 @@
    const data = result[config.level] // 此处级别对应data数组下标，作为参数取数标识
    for (let i = 0; i < data.length; i++) {
      const postion = [data[i].Latitude, data[i].Longitude] // 坐标
      const iconUrl = this.riskIconUrl(data[i].iconType) // 风险源图标
      const iconUrl = this.riskIconUrl(data[i].riskLevel) // 风险源图标
      const marker = L.marker(postion, {
        totransferData: data[i],
        icon: L.icon({
@@ -55,9 +55,9 @@
   * @param e
   */
  this.clickListener = (e) => {
    // 点击marker的pulse()光波
    // 脉冲效果
    this.animalService.pulseEffect(e.latlng)
    /* flyTo()弹出框平移事件 */
    // 信息弹窗平移
    setPanTo(e.latlng, 200)
    // 弹框标题
    const title = e.layer.options.totransferData.Name
@@ -66,7 +66,7 @@
        comp: RiskSourceIndex, // 组件
        parent: this, // 父组件
        data: { // 传递的参数
          storagePlaceId: e.layer.options.totransferData.StoragePlaceId
          riskSourceId: e.layer.options.totransferData.no
        }
      },
      title: title // 标题

 src/components/base-page/RiskSource/PublicTable.vue

New file
@@ -0,0 +1,246 @@
<template>
  <div class="slotChildTable">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <div class="main-table">
      <div class="">
        <ul>
          <li>风险评估过程</li>
          <li>初始评价结果:{{ riskSourceAssess }}</li>
        </ul>
      </div>
      <div>
        <table border="1">
          <tr>
            <th colspan="2">风险控制</th>
            <th>评估指标</th>
            <th>分值</th>
          </tr>
          <tr>
            <td rowspan="3" colspan="2">安全管理（25分）</td>
            <td>重大或较大生产安全事故隐患未完成整改的记25分。</td>
            <td rowspan="3">25</td>
          </tr>
          <tr>
            <td>一般生产安全事故隐患未完成整改的，每一项记10分，记满25分为止。</td>
          </tr>
          <tr>
            <td>不存在上述问题的记0分。</td>
          </tr>
          <tr>
            <td rowspan="3" colspan="2">设备质量管理（25分）</td>
            <td>存在下列任意一项的记25分：
              （1）未按规定进行设备设施检测、检验的；
              （2）检测结果不能满足设备设施质量要求的；
              （3）未按设计标准建设的；
              （4）使用的设备设施等级不满足要求的。
            </td>
            <td rowspan="3">10</td>
          </tr>
          <tr>
            <td>存在下列情况的，每项记10分，记满25分为止：
              （1）设备设施超期使用且未经过评估的；
              （2）设备设施降等级使用未经评估的；
              （3）设计变更未经主管部门批准的。
            </td>
          </tr>
          <tr>
            <td>不存在上述问题的记0分。</td>
          </tr>
          <tr>
            <td rowspan="9">环境风险防控措施有效性（50分）</td>
            <td rowspan="2">事故紧急关断措施（15分）</td>
            <td>环境风险源不具备有效的事故紧急关断措施的（符合紧急关断时效要）记15分。</td>
            <td rowspan="2">15</td>
          </tr>
          <tr>
            <td>环境风险源具备有效的事故紧急关断措施的（符合紧急关断时效要求）记0分。</td>
          </tr>
          <tr>
            <td rowspan="3">建设项目环境风险防控要求落实（10分）</td>
            <td>无事故风险物质处置措施记15分。</td>
            <td rowspan="3">10</td>
          </tr>
          <tr>
            <td>存在以下情况的，每项记5分，记满15分为止：
              （1）井场未按要求设排水监控池的；
              （2）井场未按要求设围堰的；
              （3）存在两个及以上雨水排放口的。
            </td>
          </tr>
          <tr>
            <td>不存在上述问题的记0分。</td>
          </tr>
          <tr>
            <td rowspan="2">建设项目环境风险防控要求落实（10分）</td>
            <td>建设项目环境影响评价及其批复提出的环境风险防控措施不落实的记10分。</td>
            <td rowspan="2">0</td>
          </tr>
          <tr>
            <td>不存在上述问题的记0分。</td>
          </tr>
          <tr>
            <td rowspan="2">环境风险源事故现场处置方案（10分）</td>
            <td>存在以下情况的，每项记5分，记满10分为止：
              （1）无环境风险源事故处置方案的或环境风险源事故处置方案无环保内容的；
              （2）未按要求开展演练并记录的；
              （3）未按要求进行备案的。
            </td>
            <td rowspan="2">5</td>
          </tr>
          <tr>
            <td>不存在上述问题的记0分。</td>
          </tr>
        </table>
      </div>
      <el-table :data="riskSourceDetail" style="width: 100%" height="200px" :row-class-name="tableRowClassName">
        <el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop"
                         :label="item.label" :show-overflow-tooltip="true"></el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import mapApi from '@/api/mapApi'

export default {
  name: 'PublicTable',
  data () {
    return {
      riskSourceDetail: [],
      riskSourceAssess: '根据风险源周边环境风险受体3种类型，按照环境风险物质量(Q/R)、环境风险控制水平(M)矩阵，确定环境风险等级',
      listLabel: [
        {
          label: '序号',
          prop: 'no'
        },
        {
          label: '名称',
          prop: 'riskname'
        },
        {
          label: '评估等级',
          prop: 'riskLevel'
        },
        {
          label: '等级特征',
          prop: 'after'
        },
        {
          label: 'Q值',
          prop: 'riskLevel'
        },
        {
          label: 'M值',
          prop: 'riskLevel'
        },
        {
          label: 'E值',
          prop: 'riskLevel'
        }
      ]
    }
  },
  mounted () {
    this.$nextTick(() => {
    })
  },
  methods: {
    async refsRiskDataTable (param) {
      // 此处接口为根据风险源ID获取风险源评估数据（暂时为模拟数据）
      const result = await mapApi.getEnvironmentRiskPoint(param)
      this.riskSourceDetail = result[param.riskSourceId]
    },
    // 隔行颜色设置
    tableRowClassName ({
      row,
      rowIndex
    }) {
      if (rowIndex % 2 === 0) {
        return 'warning-row'
      } else if (rowIndex % 2 === 1) {
        return 'success-row'
      }
      return ''
    }
  }
}
</script>

<style lang="less" scoped>

/deep/ .el-table thead tr {
  color: #02a6b5 !important;
  //.el-table .has-gutter tr th .cell {
  //  //color: #fff; 435
  //}
}

/deep/ .el-table td {
  border-bottom: none !important;
}

/deep/ .el-table .has-gutter tr th {
  border: none;
}

/deep/ .el-table th.is-leaf {
  border-bottom: none !important;
}

/deep/ .el-table td {
  height: 30px !important;
  line-height: 30px !important;
}

/deep/ .el-table tbody tr:hover > td {
  background: none !important
}

.slotChildTable {
  position: relative;
  background: rgba(33, 41, 69, 0.9);

  .main-table {
    border: 1px #396d83 solid;
  }
}

.slotChildTable span {
  padding: 6px;
  border-style: solid;
  border-color: #02a6b5;
}

.slotChildTable span:nth-child(1) {
  position: absolute;
  left: -1px;
  top: -1px;
  border-width: 1px 0 0 1px;
}

.slotChildTable span:nth-child(2) {
  position: absolute;
  right: -1px;
  top: -1px;
  border-width: 1px 1px 0 0;
}

.slotChildTable span:nth-child(3) {
  position: absolute;
  right: -1px;
  bottom: -1px;
  border-width: 0 1px 1px 0;
}

.slotChildTable span:nth-child(4) {
  position: absolute;
  left: -1px;
  bottom: -1px;
  border-width: 0 0 1px 1px;
}

</style>

 src/components/base-page/RiskSource/PublicTabs.vue

New file
@@ -0,0 +1,120 @@
<template>
  <div class="slotChildTabs">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
    <div class="tabs-content">
      <ul>
        <li>风险名称:{{ riskSourceBaseInfo.riskname }}</li>
        <li>风险级别:{{ riskSourceBaseInfo.riskLevel }}</li>
        <li>风险描述:{{ riskSourceBaseInfo.depiction }}</li>
        <li class="lastli"></li>
      </ul>
    </div>
  </div>
</template>

<script>
import mapApi from '@/api/mapApi'

export default {
  name: 'PublicTabs',
  data () {
    return {
      riskSourceBaseInfo: []
    }
  },
  mounted () {
    this.$nextTick(() => {
      // this.refsDataTabs()
    })
  },
  methods: {
    async refsRiskDataTabs (param) {
      // 此处接口为根据风险源ID获取风险源基本信息（暂时为模拟数据）
      const result = await mapApi.getEnvironmentRiskPoint(param)
      this.riskSourceBaseInfo = result[param.riskSourceId][0]
    }
  }
}
</script>

<style scoped lang="less">

.slotChildTabs {
  position: relative;
  margin-bottom: 0.1rem;
  background-color: @background-color;

  .tabs-content {
    font-size: 0.06rem;
    font-weight: normal;
    padding: 0.04rem 0;
    border: 1px solid #396d83;

    ul {
      display: flex;
      align-items: center;
      justify-content: space-around;
      flex-wrap: wrap;

      li {
        margin-bottom: 0.04rem;
        text-align: center;
        min-width: 30%;
        background-color: #243a55;
        color: #00d0f9;
        border-radius: 0.02rem;
        font-size: 0.08rem;
        line-height: 0.09rem;
        padding: 0.03rem .5%;
      }

      .lastli {
        visibility: hidden
      }
    }
  }
}

.slotChildTabs span:nth-child(1) {
  position: absolute;
  left: -1px;
  top: -1px;
  padding: 6px;
  border-style: solid;
  border-color: #02a6b5;
  border-width: 1px 0 0 1px;
}

.slotChildTabs span:nth-child(2) {
  position: absolute;
  right: -1px;
  top: -1px;
  padding: 6px;
  border-style: solid;
  border-color: #02a6b5;
  border-width: 1px 1px 0 0;
}

.slotChildTabs span:nth-child(3) {
  position: absolute;
  right: -1px;
  bottom: -1px;
  padding: 6px;
  border-style: solid;
  border-color: #02a6b5;
  border-width: 0 1px 1px 0;
}

.slotChildTabs span:nth-child(4) {
  position: absolute;
  left: -1px;
  bottom: -1px;
  padding: 6px;
  border-style: solid;
  border-color: #02a6b5;
  border-width: 0 0 1px 1px;
}
</style>

 src/components/base-page/RiskSource/RiskSourceIndex.vue

New file
@@ -0,0 +1,100 @@
<template>
  <public-sector>
    <template v-slot:tabs>
      <public-tabs ref='refsRiskTabsData'></public-tabs>
    </template>
    <template v-slot:publicPart>
      <public-table ref="refsRiskTableData"></public-table>
    </template>
<!--    <template v-slot:video>-->
<!--      <public-video></public-video>-->
<!--    </template>-->
  </public-sector>
</template>

<script>

import PublicTabs from '@components/base-page/RiskSource/PublicTabs'
import PublicTable from '@components/base-page/RiskSource/PublicTable'
// import PublicVideo from '@components/base-page/PublicVideo'
import PublicSector from '@components/base-page/PublicSector'

export default {
  name: 'RiskSourceIndex',
  props: ['riskSourceId'],
  components: {
    PublicSector,
    PublicTabs,
    PublicTable
    // PublicVideo
  },
  mounted () {
    this.$nextTick(() => {
      this.refsData()
    })
  },
  data () {
    return {}
  },
  methods: {
    refsData () {
      const param = {
        riskSourceId: this.riskSourceId
      }
      this.$refs.refsRiskTabsData.refsRiskDataTabs(param)
      this.$refs.refsRiskTableData.refsRiskDataTable(param)
    }
  }
}
</script>

<style lang="less" scoped>
.public-bounced {
  z-index: 2000;
  position: absolute;
  top: 35%;
  left: 20%;

  .public-bounced-title {
    cursor: move;
    height: 0.1rem;
    padding: 10px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;

    span {
      color: #f4f7ff;
      margin: 0 15px;
      font-size: 14px;
    }

    i {
      color: #C0C4CC;
      margin: 0 15px;
      font-size: 22px;
      cursor: pointer;
    }

    i:hover {
      color: #00fff6;
    }
  }

  .public-bounced-content {
    //padding: 0.1rem;
    display: flex;
    //align-items: center;
    //justify-content: space-around;

    .public-bounced-content-left {
      //width: 4.8rem;
    }

    .public-bounced-content-right {
      //width: 3rem;
      margin-left: 0.1rem;
    }
  }
}
</style>

 src/components/base-page/enterprise-emergency/discard/PipelineFile.vue

File was renamed from src/components/base-page/enterprise-emergency/PipelineFile.vue
@@ -6,7 +6,7 @@
                    <el-form-item label="管线名称">
                        <el-input v-model="form.pipeName">
                            <el-button style="padding-right:10px;" slot="suffix" type="text">
                                <img src="../../../../public/assets/images/map/emergency/search.png" alt="">
                                <img src="../../../../../public/assets/images/map/emergency/search.png" alt="">
                            </el-button>
                        </el-input>
                    </el-form-item>
@@ -15,7 +15,7 @@
                    <el-form-item label="管段编码">
                        <el-input v-model="form.pipeCode">
                            <el-button style="padding-right:10px;" slot="suffix" type="text">
                                <img src="../../../../public/assets/images/map/emergency/search.png" alt="">
                                <img src="../../../../../public/assets/images/map/emergency/search.png" alt="">
                            </el-button>
                        </el-input>
                    </el-form-item>
@@ -45,9 +45,9 @@
</template>

<script>
import eventBus from '../../../eventBus'
import foldPng from '../../../../public/assets/images/map/emergency/fold.png'
import filePng from '../../../../public/assets/images/map/emergency/file.png'
import eventBus from '../../../../eventBus'
import foldPng from '../../../../../public/assets/images/map/emergency/fold.png'
import filePng from '../../../../../public/assets/images/map/emergency/file.png'

export default {
  name: 'PipelineFile',

 src/components/base-page/enterprise-emergency/discard/PositionChange.vue

File was renamed from src/components/base-page/enterprise-emergency/PositionChange.vue
@@ -99,8 +99,7 @@
</template>

<script>
import eventBus from '../../../eventBus'

import eventBus from '../../../../eventBus'
export default {
  name: 'PositionChange',
  props: ['location'],

 src/components/base-page/enterprise-emergency/discard/ReportIncident.vue

File was renamed from src/components/base-page/enterprise-emergency/ReportIncident.vue
@@ -70,7 +70,7 @@
                                    <!--                                       @click="locationInfo"></el-button>-->
                                    <el-button style="padding-right:10px;" slot="suffix" type="text"
                                               @click="locationInfo">
                                        <img src="../../../../public/assets/images/map/loc.png" alt="">
                                        <img src="../../../../../public/assets/images/map/loc.png" alt="">
                                    </el-button>
                                </el-input>
                            </el-form-item>
@@ -148,8 +148,8 @@
    </div>
</template>
<script>
import '../../../utils/dragBoxes'
import eventBus from '../../../eventBus'
import '../../../../utils/dragBoxes'
import eventBus from '../../../../eventBus'
// 引入组件
import PositionChange from './PositionChange'
import PipelineFile from './PipelineFile'

 src/components/base-page/enterprise-emergency/events-reported/EventsReported.vue

@@ -139,7 +139,7 @@
                :modal="false"
                v-dialogDrag
        >
            <ReportLocation @locationClick="getlocaltionClick"></ReportLocation>
            <ReportLocation></ReportLocation>
        </el-dialog>
    </div>
</template>
@@ -336,12 +336,12 @@
    })
  },
  methods: {
    // 接收子组件传递的数据
    getlocaltionClick (val) {
      // console.log(val)
      this.ruleForm.positionOf = val.latPos + '-' + val.longPos
      this.dialogLocation = !this.dialogLocation
    },
    // // 接收子组件传递的数据
    // getlocaltionClick (val) {
    //   // console.log(val)
    //   this.ruleForm.positionOf = val.latPos + '-' + val.longPos
    //   this.dialogLocation = !this.dialogLocation
    // },
    // 消息推送 选择推送的对象
    infoChange () {
      if (this.ruleForm.beingPushed.indexOf('短信推送') > -1 || this.ruleForm.beingPushed.indexOf('手机应用推送') > -1) {

 src/components/base-page/enterprise-emergency/events-reported/ReportLocation.vue

@@ -8,139 +8,34 @@
                <ReportLocationSection></ReportLocationSection>
            </el-tab-pane>
            <el-tab-pane label="经纬度定位" name="third">
                <el-row class="place-box">
                    <div class="place-left">
                        <el-form :model="LongLatPos" label-width="90px">
                            <el-form-item label="经度:">
                                <el-input v-model="LongLatPos.longPos"></el-input>
                            </el-form-item>
                            <el-form-item label="纬度:">
                                <el-input v-model="LongLatPos.latPos"></el-input>
                            </el-form-item>
                        </el-form>
                    </div>
                    <div class="place-right">
                        <el-button type="primary" @click="mapPoints">定位</el-button>
                    </div>
                </el-row>
                <div class="place-bottom" style="text-align: center;margin: 5px">
                    <el-button type="primary" @click="confirm">确认</el-button>
                </div>
                <ReportLocationPoint></ReportLocationPoint>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
// import eventBus from '../../../../eventBus'

// 管段定位组件
import ReportLocationSection from './ReportLocationSection'
import ReportLocationSearch from './ReportLocationSearch'

import iconUrl from '../../../../../public/assets/images/map/loc.png'
import ReportLocationPoint from './ReportLocationPoint'

export default {
  name: 'ReportLocation',
  components: {
    ReportLocationSearch,
    ReportLocationSection
    ReportLocationSection,
    ReportLocationPoint
  },
  data () {
    return {
      // active tab切换
      activeName: 'first',
      // 经纬度定位
      LongLatPos: {
        longPos: '',
        latPos: ''
      }
    }
  },
  // mounted () {
  //   // 接收规定 每次重新选择定位 都指定 选择第一个开始
  //   eventBus.$on('tab-change', (obj) => {
  //     this.activeName = obj
  //   })
  // },
  methods: {
    // 地图上点击
    selectPipeLine () {
      window.map.on('click', this.selectClick)
      // window.mapManager.clickDialogSwitch = false
    },
    // 地图上点击回调
    selectClick (e) {
      window.map.off('click', this.selectClick)
      // const point = [e.latlng.lng, e.latlng.lat]
      const pointX = e.latlng.lng
      const pointY = e.latlng.lat
      // let marker = window.L.marker(point,{
      //
      // })
      this.clickLocation = '\'' + pointX + '\'' + pointY + ''
      this.mapPointResult(e)
    },
    mapPointResult (e) {
      console.log(e)
      this.LongLatPos.longPos = e.latlng.lng
      this.LongLatPos.latPos = e.latlng.lat
      const as = [e.latlng.lat, e.latlng.lng]
      // console.log(as)
      const marker = window.L.marker(as, {
        icon: window.L.icon({
          iconUrl: iconUrl,
          iconSize: [30, 30],
          iconAnchor: [15, 15]
        })
      })
      window.map.addLayer(marker)
    },
    // 获得焦点 进行定位
    focusLocation () {
      this.selectPipeLine()
    },
    // 经纬度定位
    mapPoints () {
      this.selectPipeLine()
    },
    // 点击确认按钮事件
    confirm () {
      // 通过子组件向父组件传递数据
      this.$emit('locationClick', this.LongLatPos)
      this.clickLocation = ''
      this.LongLatPos.longPos = ''
      this.LongLatPos.latPos = ''
      activeName: 'first'
    }
  }
}
</script>

<style lang="less" scoped>
    .place-box {
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .place {
        text-align: center;

        .place-top {
            display: flex;
            align-items: center;
            justify-content: space-around;

            .place-right {
                .el-button {
                    margin: 15px;
                }
            }
        }

        .place-bottom {
            .el-button {
                /*margin: 15px;*/
            }
        }
    }
</style>

 src/components/base-page/enterprise-emergency/events-reported/ReportLocationPoint.vue

New file
@@ -0,0 +1,111 @@
<template>
    <div class="location-lon-and-lat">
        <el-row class="place-box">
            <div class="place-left">
                <el-form :model="LongLatPos" label-width="90px">
                    <el-form-item label="经度:">
                        <el-input v-model="LongLatPos.longPos"></el-input>
                    </el-form-item>
                    <el-form-item label="纬度:">
                        <el-input v-model="LongLatPos.latPos"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <div class="place-right">
                <el-button type="primary" size="small" @click="mapPoints">点击定位</el-button>
                <el-button type="primary" size="small" @click="dataPoints">数据定位</el-button>
            </div>
        </el-row>
        <div class="place-bottom" style="text-align: right;margin: 5px">
            <el-button type="primary" @click="confirm">确认</el-button>
        </div>
    </div>
</template>

<script>
import { pulseEffect } from '../../../../utils/utils'
import iconUrl from '../../../../../public/assets/images/map/loc.png'
import eventBus from '../../../../eventBus'

export default {
  name: 'ReportLocationPoint',
  data () {
    return {
      // 经纬度定位
      LongLatPos: {
        longPos: '',
        latPos: ''
      }
    }
  },
  methods: {
    // 点击定位
    mapPoints () {
      window.map.on('click', (e) => {
        this.LongLatPos.longPos = parseFloat(e.latlng.lng).toFixed(6)
        this.LongLatPos.latPos = parseFloat(e.latlng.lat).toFixed(6)
        const as = [this.LongLatPos.latPos, this.LongLatPos.longPos]
        // console.log(as)
        window.map.setView(as, 17)
        pulseEffect(as)
        const marker = window.L.marker(as, {
          icon: window.L.icon({
            iconUrl: iconUrl,
            iconSize: [30, 30],
            iconAnchor: [15, 15]
          })
        })
        window.map.addLayer(marker)
        window.map.off('click')
      })
    },
    // 通过数据定位
    dataPoints () {
      const as = [this.LongLatPos.latPos, this.LongLatPos.longPos]
      // console.log(as)
      window.map.setView(as, 17)
      pulseEffect(as)
      const marker = window.L.marker(as, {
        icon: window.L.icon({
          iconUrl: iconUrl,
          iconSize: [30, 30],
          iconAnchor: [15, 15]
        })
      })
      window.map.addLayer(marker)
      this.LongLatPos.latPos = ''
      this.LongLatPos.longPos = ''
    },
    // 点击确认按钮事件
    confirm () {
      eventBus.$emit('location-setChange', true)
      this.LongLatPos.longPos = ''
      this.LongLatPos.latPos = ''
    }
  }
}
</script>

<style lang="less" scoped>
    .place-box {
        display: flex;
        align-items: center;
        justify-content: space-around;
    }

    .place {
        text-align: center;

        .place-top {
            display: flex;
            align-items: center;
            justify-content: space-around;

            .place-right {
                .el-button {
                    margin: 15px;
                }
            }
        }
    }
</style>

 src/components/base-page/enterprise-emergency/events-reported/ReportLocationSearch.vue

@@ -3,8 +3,23 @@
        <el-row>
            <el-input type="text" v-model="clickLocation" clearable @change="focusLocation"></el-input>
        </el-row>
        <el-row>
            <el-button type="primary" @click="confirm" style="text-align: right">确认</el-button>
        <el-scrollbar style="height:86.22px">
            <el-row v-for="(item,index) in searchList" :key="index" style="display: flex;align-items: center">
                <el-col :span="12">
                    <span>{{ item.name }}</span>
                </el-col>
                <el-col :span="12">
                    <el-button type="primary" size="mini" icon="el-icon-position" @click="locationMapClick(item)">定位
                    </el-button>
                </el-col>
                <!--            <el-pagination-->
                <!--                    layout="prev, pager, next"-->
                <!--                    :total="50">-->
                <!--            </el-pagination>-->
            </el-row>
        </el-scrollbar>
        <el-row style="text-align: right">
            <el-button type="primary" @click="confirm">确认</el-button>
        </el-row>
    </div>
</template>
@@ -14,16 +29,19 @@
import { reportLocationSearch } from '../../../../api/request'
import { pulseEffect } from '../../../../utils/utils'
import eventBus from '../../../../eventBus'
import iconUrl from '../../../../../public/assets/images/map/loc.png'

export default {
  name: 'ReportLocationSearch',
  data () {
    return {
      // 点击定位绑定数据
      clickLocation: ''
      clickLocation: '',
      searchList: []
    }
  },
  methods: {
    // 获得焦点 进行定位
    // 搜索定位
    focusLocation () {
      // console.log(this.clickLocation)
      // console.log(window.map.getZoom())
@@ -43,31 +61,73 @@
      }
      // console.log(data)
      reportLocationSearch(data).then(res => {
        console.log(res)
        // console.log(res)
        this.searchList = res.pois
        // console.log(this.searchList)
        // const as = res.pois[0].lonlat.trim().split(' ')
        // window.map.setView([as[1], as[0]], 17)
        // pulseEffect([as[1], as[0]])
        for (let i = 0; i < res.pois.length; i++) {
          const as = res.pois[i].lonlat.trim().split(' ')
          if (res.pois[i].name.indexOf(this.clickLocation) >= 0) {
            window.map.setView([as[1], as[0]], 17)
            pulseEffect([as[1], as[0]])
          }
        }
        // for (let i = 0; i < res.pois.length; i++) {
        //   const as = res.pois[i].lonlat.trim().split(' ')
        //   if (res.pois[i].name.indexOf(this.clickLocation) >= 0) {
        //     window.map.setView([as[1], as[0]], 17)
        //     pulseEffect([as[1], as[0]])
        //   }
        // }
      })
      this.clickLocation = ''
    },
    // 点击定位
    locationMapClick (val) {
      console.log(val)
      const ps = val.lonlat.trim().split(' ')
      // const htmls = '<div><ul><li>' + val.name + '</li> + <li>' + val.adress + '</li></ul></div>'
      // var myIcon = window.L.divIcon({
      //   html: htmls,
      //   className: 'company-bindTooltip',
      //   iconSize: 16
      // })
      const htmls = '<div><ul><li>' + val.name + '</li> <br/> <li>' + val.address + '</li> <br/> <li>' + val.phone + '</li></ul></div>'
      const marker = window.L.marker([ps[1], ps[0]], {
        icon: window.L.icon({
          iconUrl: iconUrl,
          iconSize: [30, 30],
          iconAnchor: [15, 15]
        })
        // icon: myIcon
      })
        .bindTooltip(htmls, {
          // permanent: 'true',
          direction: 'bottom',
          offset: [0, 10],
          sticky: true,
          className: ''
        })
      window.map.addLayer(marker)
      window.map.setView([ps[1], ps[0]], 17)
      pulseEffect([ps[1], ps[0]])
    },
    // 点击确认按钮事件
    confirm () {
      // 通过子组件向父组件传递数据
      // this.$emit('locationClick', this.LongLatPos)
      this.searchList = []
      this.clickLocation = ''
      eventBus.$emit('location-setChange', true)
      // console.log('搜索定位')
    }
  }
}
</script>

<style lang="less" scoped>
    /*/deep/ .el-row {*/
    /*    margin: 2px 0 !important;*/
    /*    padding: 0;*/
    /*    height: 10px;*/
    /*    max-height: 10px;*/
    /*}*/
    .div-list-search {

    }

    .click-location {
        margin: 0 auto;
        text-align: center;

 src/components/base-page/enterprise-emergency/events-reported/ReportLocationSection.vue

@@ -117,7 +117,7 @@
                    <el-table-column
                            show-overflow-tooltip
                            width="150"
                            prop="properties.code"
                            prop="properties.pipecode"
                            label="编号">
                    </el-table-column>
                    <el-table-column
@@ -147,12 +147,9 @@
</template>

<script>

// import { pulseEffect } from '../../../../utils/utils'
// import mapApi from '../../../../api/mapApi'
import { highlight, fitBounds } from '../../../helpers/LocateHelper'
import WfsHelper from '@components/helpers/WfsHelper'
import AjaxUtils from '@utils/AjaxUtils'
import { fitBounds, highlight } from '../../../../components/helpers/LocateHelper'
import eventBus from '../../../../eventBus'
import { WMS_URL } from '../../../../conf/Constants'

@@ -208,10 +205,6 @@
        const resAffFac = await AjaxUtils.GetDataAsynByUrl(this.wfsHelper.getUrl(), {})
        console.log(resAffFac)
        if (resAffFac instanceof Object && Object.prototype.hasOwnProperty.call(resAffFac, 'features')) {
          // console.log(resAffFac.features)
          // for (let i = 0; i < resAffFac.features.length; i++) {
          //   console.log(resAffFac.features[i])
          // }
          this.tableDataAffFac = resAffFac.features
        }
        this.wfsHelper = new WfsHelper()
@@ -273,7 +266,7 @@
          EXCEPTIONS: 'application/vnd.ogc.se_inimage'
        })
        AjaxUtils.get4JsonDataByUrl(WMS_URL, wmsParams, (res) => {
          console.log(res)
          // console.log(res)
          for (let i = 0; i < res.data.features.length; i++) {
            // console.log(res.data.features[i])
            this.tableList.push(res.data.features[i])
@@ -284,12 +277,13 @@
        // 附属设施
        this.affFacData(e)
        // })
        window.map.off('click')
      })
      // 数据 重新获取 进行置空
      this.tableList = []
      this.tableListSection = []
      this.form.pipeName = ''
      this.tableDataAffFac = []
      this.form.pipeName = ''
      this.form.sectionName = ''
      this.form.affiliatedFacilities = ''
    },
@@ -331,8 +325,8 @@
      const wmsParams = Object.assign({
        LAYERS: 'sewer:view_pipeline',
        QUERY_LAYERS: 'sewer:view_pipeline',
        // LAYERS: 'pipeline_fs',
        // QUERY_LAYERS: 'pipeline_fs',
        // LAYERS: 'sewer:pipeline_fs',
        // QUERY_LAYERS: 'sewer:pipeline_fs',
        WIDTH: size.x,
        HEIGHT: size.y,
        X: Math.round(point.x),
@@ -351,7 +345,7 @@
        EXCEPTIONS: 'application/vnd.ogc.se_inimage'
      })
      AjaxUtils.get4JsonDataByUrl(WMS_URL, wmsParams, (res) => {
        // console.log(res)
        console.log(res)
        for (let i = 0; i < res.data.features.length; i++) {
          this.tableDataAffFac.push(res.data.features[i])
        }

 src/utils/utils.js

@@ -27,7 +27,7 @@
 * 脉冲效果
 */
export function pulseEffect (xy) {
  let times = 1000
  let times = 5
  const colors = ['#00f100', '#ff0000']
  // 插件 效果实现
  var pulsingIcon = window.L.icon.pulse({

 src/views/MapTemplate.vue

@@ -41,7 +41,7 @@
// // 公共展示数据
// import PublicBounced from '@components/base-page/PublicBounced/PublicBounced'
import LayerFactory from '@components/LayerController/service/LayerFactory'
import ReportIncident from '../components/base-page/enterprise-emergency/ReportIncident'
import ReportIncident from '../components/base-page/enterprise-emergency/discard/ReportIncident'
import Emergency from '@components/emergency/index'
import MapManager from '../components/helpers/MapManager'
import Message from '@components/message/index'