new hide_calendar / hide_thumbs / header_image settings

This commit is contained in:
lesion
2022-11-09 10:17:52 +01:00
parent 68b7fc6cd0
commit 31cfef1d89
9 changed files with 111 additions and 21 deletions

View File

@@ -224,6 +224,7 @@ export default {
transition: opacity .5s;
opacity: 0;
visibility: hidden;
overflow: scroll;
// position: absolute;
}

View File

@@ -1,14 +1,14 @@
<template lang="pug">
v-card.h-event.event.d-flex(itemscope itemtype="https://schema.org/Event")
nuxt-link(:to='`/event/${event.slug || event.id}`' itemprop="url")
MyPicture(:event='event' thumb :lazy='lazy')
MyPicture(v-if='!settings.hide_thumbs' :event='event' thumb :lazy='lazy')
v-icon.float-right.mr-1(v-if='event.parentId' color='success' v-text='mdiRepeat')
.title.p-name(itemprop="name") {{ event.title }}
v-card-text.body.pt-0.pb-0
time.dt-start.subtitle-1(:datetime='event.start_datetime | unixFormat("YYYY-MM-DD HH:mm")' itemprop="startDate" :content="event.start_datetime | unixFormat('YYYY-MM-DDTHH:mm')") <v-icon v-text='mdiCalendar'></v-icon> {{ event | when }}
.d-none.dt-end(itemprop="endDate" :content="event.end_datetime | unixFormat('YYYY-MM-DDTHH:mm')") {{ event.end_datetime | unixFormat('YYYY-MM-DD HH:mm') }}
nuxt-link.place.d-block.p-location.pl-0(text color='primary' :to='`/place/${encodeURIComponent(event.place.name)}`' itemprop="location" itemscope itemtype="https://schema.org/Place") <v-icon v-text='mdiMapMarker'></v-icon> <span itemprop='name'>{{ event.place.name }}</span>
.d-none.dt-end(v-if='event.end_datetime' itemprop="endDate" :content="event.end_datetime | unixFormat('YYYY-MM-DDTHH:mm')") {{ event.end_datetime | unixFormat('YYYY-MM-DD HH:mm') }}
nuxt-link.place.d-block.p-location.pl-0(text :to='`/place/${encodeURIComponent(event.place.name)}`' itemprop="location" itemscope itemtype="https://schema.org/Place") <v-icon v-text='mdiMapMarker'></v-icon> <span itemprop='name'>{{ event.place.name }}</span>
.d-none(itemprop='address') {{ event.place.address }}
v-card-actions.pt-0.actions.justify-space-between

View File

@@ -23,7 +23,7 @@ export default {
.loading-page {
z-index: -10;
position: fixed;
top: 0;
top: 178px;
left: 0;
width: 100%;
height: 100%;

View File

@@ -6,9 +6,19 @@ v-container
v-switch.mt-5(v-model='is_dark'
inset
:label="$t('admin.is_dark')")
v-switch.mt-5(v-model='hide_thumbs'
inset
:label="$t('admin.hide_thumbs')")
v-switch.mt-5(v-model='hide_calendar'
inset
:label="$t('admin.hide_calendar')")
v-card-title {{$t('admin.default_images')}}
v-card-text
v-row
v-col(cols='6')
v-col(cols='4')
//- LOGO
v-file-input.mt-5(ref='upload'
:label="$t('admin.favicon')"
@@ -18,16 +28,29 @@ v-container
v-btn(color='warning' text @click='resetLogo') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img.mt-2(:src='`/logo.png?${logoKey}`' max-height="60px" contain)
v-col(cols='6')
//- NOIMG
v-col(cols='4')
//- FALLBACK IMAGE
v-file-input.mt-5(ref='upload'
:label="$t('admin.fallbackImage')"
:label="$t('admin.fallback_image')"
persistent-hint
@change='uploadFallbackImage'
accept='image/*')
template(slot='append-outer')
v-btn(color='warning' text @click='resetFallbackImage') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img.mt-2(:src='`/fallbackimage.png?${fallbackImageKey}`' max-height="150px" contain)
v-img.mt-2(:src='`/fallbackimage.png?${fallbackImageKey}`' max-height="150px" contain)
v-col(cols='4')
//- HEADER IMAGE
v-file-input.mt-5(ref='upload'
:label="$t('admin.header_image')"
persistent-hint
@change='uploadHeaderImage'
accept='image/*')
template(slot='append-outer')
v-btn(color='warning' text @click='resetHeaderImage') <v-icon v-text='mdiRestore'></v-icon> {{$t('common.reset')}}
v-img.mt-2(:src='`/headerimage.png?${headerImageKey}`' max-height="150px" contain)
//- TODO choose theme colors
//- v-row
@@ -91,6 +114,7 @@ export default {
valid: false,
logoKey: 0,
fallbackImageKey: 0,
headerImageKey: 0,
link: { href: '', label: '' },
linkModal: false
// menu: [false, false, false, false]
@@ -111,7 +135,15 @@ export default {
this.$vuetify.theme.dark = value
this.setSetting({ key: 'theme.is_dark', value })
}
}
},
hide_thumbs: {
get () { return this.settings.hide_thumbs },
set (value) { this.setSetting({ key: 'hide_thumbs', value }) }
},
hide_calendar: {
get () { return this.settings.hide_calendar },
set (value) { this.setSetting({ key: 'hide_calendar', value }) }
},
// 'colors[0]': {
// get () {
// return this.settings['theme.colors'] || [0, 0]
@@ -144,16 +176,24 @@ export default {
forceFallbackImageReload () {
this.fallbackImageKey++
},
forceHeaderImageReload () {
this.headerImageKey++
},
resetLogo (e) {
this.setSetting({ key: 'logo', value: null })
.then(this.forceLogoReload)
e.stopPropagation()
},
resetFallbackImage (e) {
this.setSetting({ key: 'fallbackImage', value: null })
this.setSetting({ key: 'fallback_image', value: null })
.then(this.forceFallbackImageReload)
e.stopPropagation()
},
resetHeaderImage (e) {
this.setSetting({ key: 'header_image', value: null })
.then(this.forceHeaderImageReload)
e.stopPropagation()
},
updateColor (i, v) {
this.colors[i] = v.hex
this.$vuetify.theme.themes.dark[i] = v.hex
@@ -210,8 +250,21 @@ export default {
this.forceFallbackImageReload()
} catch (e) {
}
}
},
async uploadHeaderImage (file) {
const formData = new FormData()
formData.append('headerImage', file)
try {
await this.$axios.$post('/settings/headerImage', formData)
this.$root.$emit('message', {
message: 'Header image updated'
})
this.forceHeaderImageReload()
} catch (e) {
}
},
save (key, value) {
if (this.settings[key] !== value) {
this.setSetting({ key, value })