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

refactoring online events

Browse Source
This commit is contained in:
lesion
2023-04-05 16:14:55 +02:00
parent 121af4872d
commit 8c8103a5ee
12 changed files with 139 additions and 165 deletions
Download Patch File Download Diff File Expand all files Collapse all files

137
components/WhereInput.vue
View File

@@ -1,6 +1,7 @@
<template lang="pug">
v-row.mb-4
v-col(cols=12 md=6)
//- this is the name used by people
v-combobox(ref='place'
:rules="[$validators.required('common.where')]"
:label="$t('common.where')"
@@ -18,6 +19,8 @@ v-row.mb-4
v-list-item(v-bind='attrs' v-on='on')
v-list-item-content(two-line v-if='item.create')
v-list-item-title <v-icon color='primary' v-text='mdiPlus' :aria-label='$t("common.add")'></v-icon> {{$t('common.add')}} <strong>{{item.name}}</strong>
v-list-item-content(two-line v-else-if='item.online')
v-list-item-title <v-icon color='primary' v-text='mdiLaptopAccount' :aria-label='$t("common.online")'></v-icon> {{$t('common.online')}}
v-list-item-content(two-line v-else)
v-list-item-title(v-text='item.name')
v-list-item-subtitle(v-text='item.address')
@@ -34,14 +37,14 @@ v-row.mb-4
:label="$t('common.address')"
:hint="$t('event.address_description')"
persistent-hint)
template(v-slot:append v-if="!hideWhereInputAdvancedDialogButton")
v-icon(v-text='mdiCog' :disabled='!(value.name && settings.allow_event_also_online) && !(value.isNew && settings.allow_geolocation)'
template(v-slot:append v-if="showAdvancedDialogButton")
v-icon(v-text='mdiCog'
@click="whereInputAdvancedDialog = true")
v-combobox.mr-4(v-model="onlineLocations" v-if="settings.allow_event_only_online && value.name === 'online'"
v-combobox.mr-4(v-model="onlineLocations" v-else
:prepend-icon='mdiLink'
:hint="$t('event.online_locations_help')"
:label="$t('event.online_locations_url')"
:label="$t('event.online_locations')"
clearable chips small-chips multiple deletable-chips hide-no-data hide-selected persistent-hint
:delimiters="[',', ';', '; ']"
:items="onlineLocations"
@@ -50,24 +53,21 @@ v-row.mb-4
v-chip(v-bind="attrs" :outlined='index !== 0'
close :close-icon='mdiCloseCircle' @click:close='parent.selectItem(item)'
:input-value="selected" label small) {{ item }}
template(v-slot:append)
v-icon(v-text='mdiCog' :disabled='!value.name' @click="whereInputAdvancedDialog = true")
//- template(v-slot:append)
//- v-icon(v-text='mdiCog' :disabled='!value.name' @click="whereInputAdvancedDialog = true")
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()'
v-dialog(v-model='whereInputAdvancedDialog' 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()'
:onlineLocations.sync="onlineLocations"
:event_only_online_value.sync='event_only_online'
@update:onlineEvent="changeEventOnlyOnline"
@update:onlineLocations="selectLocations"
)
@update:onlineLocations="selectLocations")
</template>
<script>
import { mdiMap, mdiMapMarker, mdiPlus, mdiCog, mdiLink, mdiCloseCircle } from '@mdi/js'
import { mdiMap, mdiMapMarker, mdiPlus, mdiCog, mdiLink, mdiCloseCircle, mdiLaptopAccount } from '@mdi/js'
import { mapState } from 'vuex'
import debounce from 'lodash/debounce'
import get from 'lodash/get'
import WhereInputAdvanced from './WhereInputAdvanced.vue'
export default {
@@ -79,38 +79,45 @@ export default {
components: { WhereInputAdvanced },
data ( {$store} ) {
return {
mdiMap, mdiMapMarker, mdiPlus, mdiCog, mdiLink, mdiCloseCircle,
mdiMap, mdiMapMarker, mdiPlus, mdiCog, mdiLink, mdiCloseCircle, mdiLaptopAccount,
places: [],
place: { },
placeName: '',
disableAddress: true,
whereInputAdvancedDialog: false,
hideWhereInputAdvancedDialogButton: !$store.state.settings.allow_event_also_online && !$store.state.settings.allow_geolocation,
onlineLocations: this.event.online_locations || [],
event_only_online: (this.value.name === 'online') ? true : false,
whereAdvancedId: 1
}
},
computed: {
...mapState(['settings']),
filteredPlaces () {
if (!this.placeName) { return this.places }
const placeName = this.placeName.trim().toLowerCase()
let nameMatch = false
const matches = this.places.filter(p => {
const tmpName = p.name.toLowerCase()
const tmpAddress = p.address.toLowerCase()
if (tmpName.includes(placeName)) {
if (tmpName === placeName) { nameMatch = true }
return true
}
return tmpAddress.includes(placeName)
})
if (!nameMatch) {
matches.unshift({ create: true, name: this.placeName })
showAdvancedDialogButton () {
if (!(this.settings.allow_geolocation || this.settings.allow_online_event)) {
return false
}
return matches
if (!this.place.isNew && !this.settings.allow_online_event) return false
return true
}
// filteredPlaces () {
// if (!this.placeName) { return this.places }
// const placeName = this.placeName.trim().toLowerCase()
// let nameMatch = false
// const matches = this.places.filter(p => {
// const tmpName = p.name.toLowerCase()
// const tmpAddress = p.address.toLowerCase()
// if (tmpName.includes(placeName)) {
// if (tmpName === placeName) { nameMatch = true }
// return true
// }
// return tmpAddress.includes(placeName)
// })
// if (!nameMatch) {
// matches.unshift({ create: true, name: this.placeName })
// }
// return matches
// }
},
mounted () {
this.$nextTick( () => {
@@ -120,28 +127,32 @@ export default {
methods: {
search: debounce(async function(ev) {
const search = ev ? ev.target.value.trim().toLowerCase() : ''
this.places = await this.$axios.$get(`place?search=${search}`)
this.places = await this.$axios.$get('place', { params: { search } })
// Filter out the place with name 'online' if not allowed
if (this.places.length && !this.settings.allow_event_only_online) {
if (this.places.length) {
this.places = this.places.filter(p => p.name !== 'online')
}
if (this.settings.allow_online_event) {
this.places.push({ online: true, name: 'online' })
}
if (!search && this.places.length) {
return this.places
}
const matches = this.places.filter(p => p.name !== 'online').find(p => search === p.name.toLocaleLowerCase())
const matches = this.places.find(p => search === p.name.toLocaleLowerCase())
if (!matches && search) {
this.places.unshift({ create: true, name: ev.target.value.trim() })
}
}, 200),
selectPlace (p) {
// force online events under place: online address: online
this.event_only_online = false
// this.event_only_online = false
this.place.isNew = false
this.whereAdvancedId++
// this.whereAdvancedId++
if (!p) { return }
if (typeof p === 'object' && !p.create) {
if (typeof p === 'object' && !p.create && !p.online) {
if (p.id === this.value.id) return
this.place.name = p.name
this.place.address = p.address
@@ -150,9 +161,9 @@ export default {
this.place.longitude = p.longitude
}
this.place.id = p.id
if (this.settings.allow_event_only_online && this.place.name === 'online') {
this.event_only_online = true
}
// if (this.settings.allow_event_only_online && this.place.name === 'online') {
// this.event_only_online = true
// }
this.disableAddress = true
} else { // this is a new place
this.place.isNew = true
@@ -173,15 +184,15 @@ export default {
this.place.longitude = p.longitude
}
// If 'event only online' is not allowed: reset place and online_locations
if (this.place.name === 'online') {
if (!this.settings.allow_event_only_online) {
this.$nextTick(() => { this.$refs.place && this.$refs.place.setValue('') && this.$refs.place.focus() })
this.event.online_locations = []
return
} else {
this.event_online_only = true
}
}
// if (this.place.name === 'online') {
// if (!this.settings.allow_event_only_online) {
// this.$nextTick(() => { this.$refs.place && this.$refs.place.setValue('') && this.$refs.place.focus() })
// this.event.online_locations = []
// return
// } else {
// this.event_online_only = true
// }
// }
this.disableAddress = false
this.$refs.place.blur()
this.$nextTick(() => { this.$refs.address && this.$refs.address.focus() })
@@ -206,18 +217,18 @@ export default {
})
}
},
changeEventOnlyOnline(v) {
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.onlineLocations = [] }
this.place.latitude = null
this.place.longitude = null
// changeEventOnlyOnline(v) {
// 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.onlineLocations = [] }
// this.place.latitude = null
// this.place.longitude = null
// Update onlineLocations
this.event.online_locations && this.selectLocations()
this.$emit('input', { ...this.place })
},
// // Update onlineLocations
// this.event.online_locations && this.selectLocations()
// this.$emit('input', { ...this.place })
// },
}
}
</script>

68
components/WhereInputAdvanced.vue
View File

@@ -3,30 +3,8 @@ v-card
v-card-title {{ $t('event.where_advanced_options') }}
v-card-subtitle {{ $t('event.where_advanced_options_description') }}
v-card-text(v-if='settings.allow_event_also_online')
v-switch.mt-0.mb-0(v-model='event_only_online_update'
v-if='settings.allow_event_only_online'
persistent-hint
:label="$t('event.event_only_online_label')")
v-combobox.mt-0.mb-0.mr-4.my-5(v-model="onlineLocations_update"
v-if="place.name !== 'online' && settings.allow_event_also_online"
:prepend-icon='mdiLink'
:hint="$t('event.online_locations_help')"
:label="$t('event.online_locations')"
clearable chips small-chips multiple deletable-chips hide-no-data hide-selected persistent-hint
:delimiters="[',', ';', '; ']"
:items="onlineLocations_update")
template(v-slot:selection="{ item, index, on, attrs, selected, parent }")
v-chip(v-bind="attrs" :outlined='index !== 0'
close :close-icon='mdiCloseCircle' @click:close='parent.selectItem(item)'
:input-value="selected" label small) {{ item }}
v-divider(v-if='showGeocoded && showOnline')
v-card-text.mt-5(v-if='showGeocoded')
v-combobox(ref='geocodedAddress' v-if="settings.allow_geolocation && place.name !== 'online' || (!settings.allow_event_only_online && place.name === 'online')"
v-focus
v-card-text(v-if='showGeocoded')
v-combobox(ref='geocodedAddress'
:prepend-icon='mdiMapSearch'
@input.native='searchAddress'
:label="$t('common.search_coordinates')"
@@ -63,7 +41,23 @@ v-card
:rules="$validators.longitude")
p.mt-4(v-if='place.isNew' v-html="$t('event.address_geocoded_disclaimer')")
MapEdit.mt-4(:place='place' :key='mapEdit' v-if="(settings.allow_geolocation && place.name !== 'online' && place.latitude && place.longitude)" )
MapEdit.mt-4(:place='place' v-if="(settings.allow_geolocation && place.name !== 'online' && place.latitude && place.longitude)" )
v-divider(v-if='settings.allow_online_event && showGeocoded')
v-card-text.mt-6(v-if='settings.allow_online_event')
v-combobox(v-model="onlineLocations_update"
:prepend-icon='mdiLink'
:hint="$t('event.online_locations_help')"
:label="$t('event.online_locations')"
clearable chips small-chips multiple deletable-chips hide-no-data hide-selected persistent-hint
:delimiters="[',', ';']"
:items="onlineLocations_update")
template(v-slot:selection="{ item, index, on, attrs, selected, parent }")
v-chip(v-bind="attrs" :outlined='index !== 0'
close :close-icon='mdiCloseCircle' @click:close='parent.selectItem(item)'
:input-value="selected" label small) {{ item }}
v-card-actions
v-spacer
@@ -75,7 +69,6 @@ import { mdiMap, mdiLatitude, mdiLongitude, mdiCog, mdiLink, mdiCloseCircle, mdi
mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant } from '@mdi/js'
import { mapState } from 'vuex'
import debounce from 'lodash/debounce'
import get from 'lodash/get'
import geolocation from '../server/helpers/geolocation/index'
export default {
@@ -83,7 +76,6 @@ export default {
props: {
place: { type: Object, default: () => ({}) },
event: { type: Object, default: () => null },
event_only_online_value: { type: Boolean, default: false },
onlineLocations: { type: Array, default: [] }
},
components: {
@@ -93,18 +85,13 @@ export default {
return {
mdiMap, mdiLatitude, mdiLongitude, mdiCog, mdiLink, mdiCloseCircle,
mdiMapMarker, mdiMapSearch, mdiRoadVariant, mdiHome, mdiCityVariant,
showOnline: $store.state.settings.allow_event_also_online,
showGeocoded: $store.state.settings.allow_geolocation && this.place.name !== 'online',
disableGeocoded: this.place.name === 'online' || !this.place.isNew,
event_only_online: this.place.name === 'online',
mapEdit: 1,
addressList: [],
loading: false,
iconsMapper: {
'mdiHome': mdiHome,
'mdiRoadVariant': mdiRoadVariant,
'mdiMapMarker': mdiMapMarker,
'mdiCityVariant': mdiCityVariant
mdiHome,
mdiRoadVariant,
mdiMapMarker,
mdiCityVariant
},
currentGeocodingProvider: geolocation.getGeocodingProvider($store.state.settings.geocoding_provider_type),
prevAddress: ''
@@ -112,12 +99,8 @@ export default {
},
computed: {
...mapState(['settings']),
event_only_online_update: {
get () { return this.event_only_online_value },
set (value) {
this.$emit('update:onlineEvent', value)
this.close()
}
showGeocoded () {
return this.settings.allow_geolocation && this.place.name !== 'online' && this.place.isNew
},
onlineLocations_update: {
get () { return this.onlineLocations },
@@ -155,7 +138,6 @@ export default {
} else {
this.place.latitude = this.place.longitude = null
}
this.mapEdit++
this.prevAddress = v.address
},
}

26
components/admin/Settings.vue
View File

@@ -52,18 +52,14 @@ v-container
inset
:label="$t('admin.recurrent_event_visible')")
v-switch.mt-1(v-model='allow_online_event'
inset
:label="$t('admin.allow_online_event')")
v-switch.mt-1(v-model='allow_geolocation'
inset
:label="$t('admin.allow_geolocation')")
v-switch.mt-1(v-model='allow_event_only_online'
inset
:label="$t('admin.allow_event_only_online')")
v-switch.mt-1(v-model='allow_event_also_online'
inset
:label="$t('admin.allow_event_also_online')")
v-dialog(v-model='showSMTP' destroy-on-close max-width='700px' :fullscreen='$vuetify.breakpoint.xsOnly')
SMTP(@close='showSMTP = false')
@@ -134,17 +130,9 @@ export default {
get () { return this.settings.allow_geolocation },
set (value) { this.setSetting({ key: 'allow_geolocation', value }) }
},
allow_event_only_online: {
get () { return this.settings.allow_event_only_online },
set (value) { this.setSetting({ key: 'allow_event_only_online', value })
if (value == true) { this.allow_event_also_online = value }
}
},
allow_event_also_online: {
get () { return this.settings.allow_event_also_online },
set (value) { this.setSetting({ key: 'allow_event_also_online', value })
if (value == false) { this.setSetting({ key: 'allow_event_only_online', value }) }
}
allow_online_event: {
get () { return this.settings.allow_online_event },
set (value) { this.setSetting({ key: 'allow_online_event', value }) }
},
filteredTimezones () {
const current_timezone = DateTime.local().zoneName