From 2d5e75bbc04d8c4c5c7dc6bb141ad16ffa2d9936 Mon Sep 17 00:00:00 2001 From: XingChuan <m17600301067@163.com> Date: 星期日, 30 五月 2021 12:24:54 +0800 Subject: [PATCH] Merge remote-tracking branch 'origin/develop' into develop --- src/components/base-page/enterprise-emergency/events-reported/ReportLocationPoint.vue | 114 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 114 insertions(+), 0 deletions(-) diff --git a/src/components/base-page/enterprise-emergency/events-reported/ReportLocationPoint.vue b/src/components/base-page/enterprise-emergency/events-reported/ReportLocationPoint.vue new file mode 100644 index 0000000..96388b5 --- /dev/null +++ b/src/components/base-page/enterprise-emergency/events-reported/ReportLocationPoint.vue @@ -0,0 +1,114 @@ +<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: '' + }, + marker: null + } + }, + 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) + this.marker = window.L.marker(as, { + icon: window.L.icon({ + iconUrl: iconUrl, + iconSize: [30, 30], + iconAnchor: [15, 15] + }) + }) + window.map.addLayer(this.marker) + window.map.off('click') + }) + }, + // 閫氳繃鏁版嵁瀹氫綅 + dataPoints () { + const as = [this.LongLatPos.latPos, this.LongLatPos.longPos] + // console.log(as) + window.map.setView(as, 17) + pulseEffect(as) + this.marker = window.L.marker(as, { + icon: window.L.icon({ + iconUrl: iconUrl, + iconSize: [30, 30], + iconAnchor: [15, 15] + }) + }) + window.map.addLayer(this.marker) + this.LongLatPos.latPos = '' + this.LongLatPos.longPos = '' + }, + // 鐐瑰嚮纭鎸夐挳浜嬩欢 + confirm () { + window.mapManager.clearHighlight() + window.map.removeLayer(this.marker) + 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> -- Gitblit v1.8.0