encrypt/gancio
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

continue refactor of geocoding services, improved locale, fixes on mapEdit

Browse Source
This commit is contained in:
sedum
2023-02-20 07:05:21 +01:00
parent 7522e811fa
commit 8efeda085a
11 changed files with 117 additions and 1100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/MapEdit.vue
View File

@@ -54,7 +54,9 @@ export default {
});
setTimeout(() => {
this.$refs.map.mapObject.invalidateSize();
if (this.$refs.map && this.$refs.map.mapObject ) {
this.$refs.map.mapObject.invalidateSize();
}
}, 200);
}
}

22
components/WhereInput.vue
View File

@@ -28,7 +28,7 @@ v-row.mb-4
v-combobox.mr-4(v-model="virtualLocations" v-if="settings.allow_event_only_online && value.name === 'online'"
:prepend-icon='mdiLink'
:hint="$t('event.online_locations_help')"
:label="$t('event.online_event_urls')"
:label="$t('event.online_locations_url')"
clearable chips small-chips multiple deletable-chips hide-no-data hide-selected persistent-hint
:delimiters="[',', ';', '; ']"
:items="virtualLocations"
@@ -55,7 +55,7 @@ v-row.mb-4
v-dialog(v-model='whereInputAdvancedDialog' :key="whereAdvancedId" destroy-on-close max-width='700px' :fullscreen='$vuetify.breakpoint.xsOnly' dense)
WhereInputAdvanced(ref='whereAdvanced' :place.sync='value' :event='event' @close='whereInputAdvancedDialog = false && this.$refs.address.blur()'
:virtualLocations.sync="virtualLocations"
:online_event_only_value.sync='online_event_only'
:event_only_online_value.sync='event_only_online'
@update:onlineEvent="changeOnlineEvent"
@update:virtualLocations="selectLocations"
)
@@ -86,7 +86,7 @@ export default {
whereInputAdvancedDialog: false,
hideWhereInputAdvancedDialogButton: !$store.state.settings.allow_event_also_online && !$store.state.settings.allow_geolocation,
virtualLocations: this.event.locations || [],
online_event_only: (this.value.name === 'online') ? true : false,
event_only_online: (this.value.name === 'online') ? true : false,
whereAdvancedId: 1
}
},
@@ -135,7 +135,7 @@ export default {
}, 200),
selectPlace (p) {
// force online events under place: online address: online
this.online_event_only = false
this.event_only_online = false
this.place.isNew = false
this.whereAdvancedId++
@@ -150,7 +150,7 @@ export default {
}
this.place.id = p.id
if (this.settings.allow_event_only_online && this.place.name === 'online') {
this.online_event_only = true
this.event_only_online = true
}
this.disableAddress = true
} else { // this is a new place
@@ -184,6 +184,10 @@ export default {
},
selectLocations () {
this.event.locations = []
// Insert up to 3 online location: the main one and 2 fallback
if (this.virtualLocations && this.virtualLocations.length > 3) {
this.$nextTick(() => this.virtualLocations.pop())
}
this.virtualLocations && this.virtualLocations.forEach((item, i) => {
if (!item.startsWith('http')) {
this.virtualLocations[i] = `https://${item}`
@@ -192,10 +196,10 @@ export default {
})
},
changeOnlineEvent(v) {
this.online_event_only = v
// console.log(this.online_event_only)
if (this.online_event_only) { this.place.name = this.place.address = 'online' }
if (!this.online_event_only) { this.place.name = this.place.address = '' }
this.event_only_online = v
// console.log(this.event_only_online)
if (this.event_only_online) { this.place.name = this.place.address = 'online' }
if (!this.event_only_online) { this.place.name = this.place.address = '' }
this.place.latitude = null
this.place.longitude = null

60
components/WhereInputAdvanced.vue
View File

@@ -4,11 +4,11 @@ v-card
v-card-subtitle {{ $t('event.where_advanced_options_description') }}
v-card-text(v-if='settings.allow_event_also_online')
v-switch.mt-0.mb-4(v-model='online_event_only_update'
v-switch.mt-0.mb-4(v-model='event_only_online_update'
v-if='settings.allow_event_only_online'
persistent-hint
:label="$t('event.event_only_online_label')"
:hint="$t('event.online_event_only_help')")
:hint="$t('event.event_only_online_help')")
v-combobox.mt-0.mb-0.mr-4.my-5(v-model="virtualLocations_update"
v-if="place.name !== 'online' && settings.allow_event_also_online"
@@ -69,19 +69,19 @@ v-card
</template>
<script>
import { mdiMap, mdiLatitude, mdiLongitude, mdiCog, mdiLink, mdiCloseCircle, mdiMapMarker, mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant } from '@mdi/js'
import { mdiMap, mdiLatitude, mdiLongitude, mdiCog, mdiLink, mdiCloseCircle, mdiMapMarker,
mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant } from '@mdi/js'
import { mapState } from 'vuex'
import debounce from 'lodash/debounce'
import get from 'lodash/get'
import nominatim from '../server/services/geocoding/nominatim'
import photon from '../server/services/geocoding/photon'
import geolocation from '../server/helpers/geolocation/index'
export default {
name: 'WhereInputAdvanced',
props: {
place: { type: Object, default: () => ({}) },
event: { type: Object, default: () => null },
online_event_only_value: { type: Boolean, default: false },
event_only_online_value: { type: Boolean, default: false },
virtualLocations: { type: Array, default: [] }
},
components: {
@@ -93,33 +93,25 @@ export default {
mdiMapMarker, mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant,
showOnline: $store.state.settings.allow_event_also_online,
showGeocoded: $store.state.settings.allow_geolocation && this.place.isNew,
online_event_only: this.place.name === 'online',
event_only_online: this.place.name === 'online',
mapEdit: 1,
addressList: [],
loading: false,
nominatim_osm_type: {
way: mdiRoadVariant,
house: mdiHome,
node: mdiMapMarker,
relation: mdiCityVariant,
},
nominatim_class: ['amenity', 'shop', 'tourism', 'leisure', 'building'],
photon_osm_key: ['amenity', 'shop', 'tourism', 'leisure', 'building'],
photon_osm_type: {
'W': mdiRoadVariant,
'N': mdiMapMarker,
'R': mdiCityVariant,
iconsMapper: {
'mdiHome': mdiHome,
'mdiRoadVariant': mdiRoadVariant,
'mdiMapMarker': mdiMapMarker,
'mdiCityVariant': mdiCityVariant
},
geocoding_provider_type: $store.state.settings.geocoding_provider_type || 'Nominatim',
nominatimProvider: nominatim,
photonProvider: photon,
currentGeocodingProvider: geolocation.getGeocodingProvider($store.state.settings.geocoding_provider_type),
prevAddress: ''
}
},
computed: {
...mapState(['settings']),
online_event_only_update: {
get () { return this.online_event_only_value },
event_only_online_update: {
get () { return this.event_only_online_value },
set (value) {
this.$emit('update:onlineEvent', value)
this.close()
@@ -137,17 +129,8 @@ export default {
this.$emit('close')
},
loadCoordinatesResultIcon(item) {
if (this.geocoding_provider_type == "Nominatim") {
if ( this.nominatim_class.includes(item.class)) {
return this.mdiHome
}
return this.nominatim_osm_type[item.type]
} else if (this.geocoding_provider_type == "Photon") {
if ( this.photon_osm_key.includes(item.class)) {
return this.mdiHome
}
return this.photon_osm_type[item.type]
}
let icon = this.currentGeocodingProvider.loadResultIcon(item)
return this.iconsMapper[icon]
},
searchAddress: debounce(async function(ev) {
const pre_searchCoordinates = ev.target.value.trim().toLowerCase()
@@ -155,14 +138,7 @@ export default {
if (searchCoordinates.length) {
this.loading = true
const ret = await this.$axios.$get(`placeOSM/${this.geocoding_provider_type}/${searchCoordinates}`)
// this.geocoding_provider.mapQueryResults(ret)
if (this.geocoding_provider_type == "Nominatim") {
this.addressList = nominatim.mapQueryResults(ret)
} else if (this.geocoding_provider_type == "Photon") {
this.addressList = photon.mapQueryResults(ret)
}
this.addressList = this.currentGeocodingProvider.mapQueryResults(ret)
this.loading = false
}
}, 1000),

2
components/admin/Geolocation.vue
View File

@@ -60,7 +60,7 @@ v-card
</template>
<script>
import { mapActions, mapState } from 'vuex'
import { isoCountries } from '../../server/helpers/geolocation'
import { isoCountries } from '../../server/helpers/geolocation/isoCountries'
import { mdiChevronDown } from '@mdi/js'
// import Map from '~/components/Map'
import "leaflet/dist/leaflet.css"

51
components/admin/Places.vue
View File

@@ -19,13 +19,13 @@ v-container
v-model='place.name'
:placeholder='$t("common.name")')
v-text-field(
v-text-field(ref='address'
:rules="[ v => $validators.required('common.address')(v)]"
:label="$t('common.address')"
v-model='place.address'
persistent-hint)
v-combobox.mt-0.mb-4(ref='geocodedAddress'
v-combobox.mt-0.mb-4(ref='geocodedAddress' v-model='place.geocodedAddress'
v-if="(settings.allow_geolocation && place.name !== 'online')"
:disabled="!(settings.allow_geolocation && place.name !== 'online')"
:prepend-icon='mdiMapSearch'
@@ -42,6 +42,7 @@ v-container
span(v-html='message' :key="key")
template(v-slot:item="{ item, attrs, on }")
v-list-item(v-bind='attrs' v-on='on')
v-icon.pr-4(v-text='loadCoordinatesResultIcon(item)')
v-list-item-content(two-line v-if='item')
v-list-item-title(v-text='item.name')
v-list-item-subtitle(v-text='`${item.address}`')
@@ -87,13 +88,11 @@ v-container
</template>
<script>
import { mdiPencil, mdiChevronLeft, mdiChevronRight, mdiMagnify, mdiEye, mdiMapSearch, mdiChevronDown,
mdiLatitude, mdiLongitude } from '@mdi/js'
import { mdiPencil, mdiChevronLeft, mdiChevronRight, mdiChevronDown, mdiMagnify, mdiEye, mdiMapMarker,
mdiLatitude, mdiLongitude, mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant } from '@mdi/js'
import { mapState } from 'vuex'
import debounce from 'lodash/debounce'
import nominatim from '../../server/services/geocoding/nominatim'
import photon from '../../server/services/geocoding/photon'
// import geolocation from '../../server/helpers/geolocation/index'
import geolocation from '../../server/helpers/geolocation/index'
export default {
components: {
@@ -101,8 +100,8 @@ export default {
},
data( {$store} ) {
return {
mdiPencil, mdiChevronRight, mdiChevronLeft, mdiMagnify, mdiEye, mdiMapSearch, mdiChevronDown,
mdiLatitude, mdiLongitude,
mdiPencil, mdiChevronRight, mdiChevronLeft, mdiChevronDown, mdiMagnify, mdiEye, mdiMapMarker,
mdiLatitude, mdiLongitude, mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant,
loading: false,
dialog: false,
valid: false,
@@ -118,16 +117,19 @@ export default {
{ value: 'actions', text: this.$t('common.actions'), align: 'right' }
],
geocoding_provider_type: $store.state.settings.geocoding_provider_type || 'Nominatim',
nominatimProvider: nominatim,
photonProvider: photon
currentGeocodingProvider: geolocation.getGeocodingProvider($store.state.settings.geocoding_provider_type),
prevAddress: '',
iconsMapper: {
'mdiHome': mdiHome,
'mdiRoadVariant': mdiRoadVariant,
'mdiMapMarker': mdiMapMarker,
'mdiCityVariant': mdiCityVariant
},
}
},
async fetch() {
this.places = await this.$axios.$get('/places')
},
mounted() {
// this.currentGeocodingProvider = geolocation.getGeocodingProvider(this.settings.geocoding_provider_type)
},
computed: {
...mapState(['settings']),
},
@@ -136,6 +138,7 @@ export default {
this.place.name = item.name
this.place.address = item.address
if (this.settings.allow_geolocation) {
this.prevAddress = ''
this.place.geocodedAddress = ''
this.mapEdit++
this.place.latitude = item.latitude
@@ -153,19 +156,23 @@ export default {
this.dialog = false
},
selectAddress (v) {
let currentAddress = this.place.address
if (!v) { return }
if (typeof v === 'object') {
this.place.latitude = v.lat
this.place.longitude = v.lon
this.place.geocodedAddress = v.address
this.place.address = v.address
if (this.settings.allow_geolocation) {
this.place.geocodedAddress = v.address
if (currentAddress === this.prevAddress) {
console.log('here')
this.place.address = currentAddress
}
} else {
this.place.address = v
this.place.latitude = this.place.longitude = null
}
this.$emit('input', { ...this.place })
this.prevAddress = this.geocodedAddress
},
searchAddress: debounce(async function(ev) {
const pre_searchCoordinates = ev.target.value.trim().toLowerCase()
@@ -174,14 +181,14 @@ export default {
if (searchCoordinates.length) {
this.loading = true
const ret = await this.$axios.$get(`placeOSM/${this.geocoding_provider_type}/${searchCoordinates}`)
if (this.geocoding_provider_type == "Nominatim") {
this.addressList = nominatim.mapQueryResults(ret)
} else if (this.geocoding_provider_type == "Photon") {
this.addressList = photon.mapQueryResults(ret)
}
this.addressList = this.currentGeocodingProvider.mapQueryResults(ret)
this.loading = false
}
}, 1000)
}, 1000),
loadCoordinatesResultIcon(item) {
let icon = this.currentGeocodingProvider.loadResultIcon(item)
return this.iconsMapper[icon]
},
}
}
</script>