From c74fb6e3cfc1c25c7ef1415c5ae96f57d007850b Mon Sep 17 00:00:00 2001
From: zhouwx <1175765986@qq.com>
Date: Thu, 12 Mar 2026 08:32:48 +0800
Subject: [PATCH] 修改
---
src/views/safetyReview/projectManage/components/mapLocation.vue | 33 ++++++++++++++++++++++++---------
1 files changed, 24 insertions(+), 9 deletions(-)
diff --git a/src/views/safetyReview/projectManage/components/mapLocation.vue b/src/views/safetyReview/projectManage/components/mapLocation.vue
index dcb20b3..497dabd 100644
--- a/src/views/safetyReview/projectManage/components/mapLocation.vue
+++ b/src/views/safetyReview/projectManage/components/mapLocation.vue
@@ -17,15 +17,20 @@
</div>
<div class="mapLocation_latlng">
<span>经度：</span>
- <el-input class="mapLocation_latlng_input" id="lng" v-model="state.longitude"></el-input>
+ <el-input class="mapLocation_latlng_input" id="lng" v-model.trim="state.longitude" @change="getAdress"></el-input>
</div>
<div class="mapLocation_latlng">
<span>纬度：</span>
- <el-input class="mapLocation_latlng_input" id="lat" v-model="state.latitude"></el-input>
+ <el-input class="mapLocation_latlng_input" id="lat" v-model.trim="state.latitude" @change="getAdress"></el-input>
</div>
+ <div class="mapLocation_latlng">
+ <span>地址：</span>
+ <el-input class="mapLocation_latlng_input" id="lat" v-model.trim="state.BAddress"></el-input>
+ </div>
+
</div>
<div class="mapLocation_body">
- <baidu-map class="map" ak="BkZdiHBj9aGrMdVFM48r2njNiMzsekga" v="3.0" type="API" :center="state.center" :zoom="state.zoom" scroll-wheel-zoom @ready="initMap" @click="getPosition">
+ <baidu-map class="map" @ready="getAdress" ak="8r64GW9ERCWLwF83f9hG7onI1YC0dq7v" v="3.0" type="API" :center="state.center" :zoom="state.zoom" scroll-wheel-zoom @click="getPosition">
<div style="position: absolute;z-index: 999;margin-top: -495px">
<label>搜索：<input v-model="state.keyword"></label>
<bm-local-search
@@ -35,12 +40,9 @@
:pageCapacity="3"
></bm-local-search>
</div>
-
<bm-marker :position="{lng: state.longitude, lat: state.latitude}" :dragging="true" animation="BMAP_ANIMATION_BOUNCE">
<bm-label content="选择地点" :labelStyle="{color: 'red', fontSize : '24px'}" :offset="{width: -35, height: 30}"/>
</bm-marker>
-
-
</baidu-map>
</div>
<div align="right" style="margin-top: 10px">
@@ -51,7 +53,7 @@
</template>
<script setup>
-import {ref, onMounted, reactive, toRefs, defineComponent,defineExpose,defineEmits} from 'vue';
+import {ref, onMounted, reactive, toRefs, defineComponent, defineExpose, defineEmits, watch} from 'vue';
import { BaiduMap,BmMarker,BmLocalSearch } from 'vue-baidu-map-3x'
const state = reactive({
title: '',
@@ -64,7 +66,8 @@
lat: '39.88973394962104'
},
keyword:'',
- location: ''
+ location: '',
+ BAddress: ''
})
const emit = defineEmits(['giveLatLng'])
@@ -77,6 +80,7 @@
const getPosition = ({type, target, point, pixel, overlay})=>{
state.longitude = point.lng
state.latitude = point.lat
+ getAdress()
}
const openMapLocation=(longitude,latitude)=>{
@@ -108,6 +112,16 @@
const initMap=()=>{
}
+const myGeo = ref(null)
+const getAdress = () => {
+ myGeo.value = new BMap.Geocoder();
+ const pt = new BMap.Point(state.longitude, state.latitude);
+ myGeo.value.getLocation(pt,function(result){
+ state.BAddress = result.address; //获取到当前定位的详细地址信息
+ },
+ { enableHighAccuracy: true }
+ );
+}
defineExpose({
openMapLocation
@@ -135,7 +149,8 @@
}
.mapLocation_body{
width:100%;
- height:500px
+ height:500px;
+ margin-top: 20px;
}
.mapLocation_latlng{
padding-top:10px;
--
Gitblit v1.9.2