add map marker draggable
This commit is contained in:
@@ -13,7 +13,9 @@ client-only(placeholder='Loading...' )
|
||||
:url="url"
|
||||
:attribution="attribution")
|
||||
LMarker(v-if="showMarker"
|
||||
:lat-lng="marker.coordinates")
|
||||
:lat-lng="marker.coordinates"
|
||||
@update:lat-lng="updateCoords"
|
||||
:draggable="draggable")
|
||||
|
||||
</template>
|
||||
<script>
|
||||
@@ -41,6 +43,8 @@ export default {
|
||||
if (this.mapCenter.length)
|
||||
return this.mapCenter
|
||||
else {
|
||||
this.place.latitude = isNaN(this.place.latitude) ? 0 : this.place.latitude
|
||||
this.place.longitude = isNaN(this.place.longitude) ? 0 : this.place.longitude
|
||||
return [this.place.latitude, this.place.longitude]
|
||||
}
|
||||
},
|
||||
@@ -57,6 +61,7 @@ export default {
|
||||
showMarker: { type: Boolean, default: true },
|
||||
mapCenter: { type: Array, default: () => ([]) },
|
||||
zoom: { type: Number, default: () => (16) },
|
||||
draggable: { type: Boolean, default: false },
|
||||
},
|
||||
mounted() {
|
||||
delete Icon.Default.prototype._getIconUrl;
|
||||
@@ -71,6 +76,12 @@ export default {
|
||||
this.$refs.leafletMap.mapObject.invalidateSize();
|
||||
}
|
||||
}, 200);
|
||||
},
|
||||
methods: {
|
||||
updateCoords(v) {
|
||||
this.place.latitude = Number.parseFloat(v.lat).toFixed(7)
|
||||
this.place.longitude = Number.parseFloat(v.lng).toFixed(7)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -38,7 +38,8 @@ v-card
|
||||
:rules="$validators.longitude")
|
||||
p.mt-4(v-if='place.isNew' v-html="$t('event.address_geocoded_disclaimer')")
|
||||
|
||||
Map.mt-4(:place='place' v-if="(settings.allow_geolocation && place.name !== 'online' && place.latitude && place.longitude)" )
|
||||
Map.mt-4(:place='place' draggable=true
|
||||
v-if="(settings.allow_geolocation && place.name !== 'online' && place.latitude && place.longitude)" )
|
||||
|
||||
v-divider(v-if='settings.allow_online_event && showGeocoded')
|
||||
|
||||
|
||||
@@ -62,7 +62,8 @@ v-container
|
||||
:label="$t('common.longitude')"
|
||||
:rules="$validators.longitude")
|
||||
|
||||
Map.mt-4(:place.sync='place' :key="dialog" v-if="settings.allow_geolocation && place.name !== 'online' && place.latitude && place.longitude")
|
||||
Map.mt-4(:place.sync='place' :key="dialog" draggable=true
|
||||
v-if="settings.allow_geolocation && place.name !== 'online' && place.latitude && place.longitude")
|
||||
|
||||
v-card-actions
|
||||
v-spacer
|
||||
@@ -109,7 +110,7 @@ export default {
|
||||
addressList: [],
|
||||
address: '',
|
||||
search: '',
|
||||
place: { name: '', address: '', id: null },
|
||||
place: { name: '', address: '', latitude: 0, longitude: 0, id: null },
|
||||
headers: [
|
||||
{ value: 'name', text: this.$t('common.name') },
|
||||
{ value: 'address', text: this.$t('common.address') },
|
||||
|
||||
Reference in New Issue
Block a user