mirror of
https://framagit.org/les/gancio.git
synced 2025-02-01 00:52:01 +01:00
improve event page layout
This commit is contained in:
parent
3a5a95e9ed
commit
5f520c3485
1 changed files with 14 additions and 12 deletions
|
@ -18,14 +18,14 @@ v-container#event.pa-0.pa-sm-2
|
||||||
v-card(outlined)
|
v-card(outlined)
|
||||||
v-card-text
|
v-card-text
|
||||||
v-icon.float-right(v-if='event.parentId' color='success' v-text='mdiRepeat')
|
v-icon.float-right(v-if='event.parentId' color='success' v-text='mdiRepeat')
|
||||||
.title.text-h5
|
.title.text-h5.mb-5
|
||||||
b.p-name(itemprop="name") {{event.title}}
|
strong.p-name.text--primary(itemprop="name") {{event.title}}
|
||||||
|
|
||||||
time.dt-start.text-h6(:datetime='event.start_datetime|unixFormat("YYYY-MM-DD HH:mm")' itemprop="startDate" :content="event.start_datetime|unixFormat('YYYY-MM-DDTHH:mm')")
|
time.dt-start.text-h6(: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(v-text='mdiCalendar')
|
||||||
b.ml-2 {{event|when}}
|
strong.ml-2 {{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')}}
|
.d-none.dt-end(itemprop="endDate" :content="event.end_datetime|unixFormat('YYYY-MM-DDTHH:mm')") {{event.end_datetime|unixFormat('YYYY-MM-DD HH:mm')}}
|
||||||
div.text-subtitle-1 {{event.start_datetime|from}}
|
div.text-subtitle-1.mb-5 {{event.start_datetime|from}}
|
||||||
small(v-if='event.parentId') ({{event|recurrentDetail}})
|
small(v-if='event.parentId') ({{event|recurrentDetail}})
|
||||||
|
|
||||||
.text-h6.p-location.h-adr(itemprop="location" itemscope itemtype="https://schema.org/Place")
|
.text-h6.p-location.h-adr(itemprop="location" itemscope itemtype="https://schema.org/Place")
|
||||||
|
@ -34,10 +34,9 @@ v-container#event.pa-0.pa-sm-2
|
||||||
.text-subtitle-1.p-street-address(itemprop='address') {{event.place && event.place.address}}
|
.text-subtitle-1.p-street-address(itemprop='address') {{event.place && event.place.address}}
|
||||||
|
|
||||||
//- tags, hashtags
|
//- tags, hashtags
|
||||||
v-card-text(v-if='event.tags.length')
|
v-card-text.pt-0(v-if='event.tags && event.tags.length')
|
||||||
v-chip.p-category.ml-1.mt-3(v-for='tag in event.tags' color='primary'
|
v-chip.p-category.ml-1.mt-3(v-for='tag in event.tags' color='primary'
|
||||||
outlined :key='tag' :to='`/tag/${tag}`')
|
outlined :key='tag' :to='`/tag/${tag}`') {{tag}}
|
||||||
span(v-text='tag')
|
|
||||||
|
|
||||||
//- info & actions
|
//- info & actions
|
||||||
v-toolbar
|
v-toolbar
|
||||||
|
@ -131,6 +130,9 @@ import get from 'lodash/get'
|
||||||
import moment from 'dayjs'
|
import moment from 'dayjs'
|
||||||
import clipboard from '../../assets/clipboard'
|
import clipboard from '../../assets/clipboard'
|
||||||
import MyPicture from '~/components/MyPicture'
|
import MyPicture from '~/components/MyPicture'
|
||||||
|
import EventAdmin from '@/components/eventAdmin'
|
||||||
|
import EmbedEvent from '@/components/embedEvent'
|
||||||
|
|
||||||
const { htmlToText } = require('html-to-text')
|
const { htmlToText } = require('html-to-text')
|
||||||
|
|
||||||
import { mdiArrowLeft, mdiArrowRight, mdiDotsVertical, mdiCodeTags, mdiClose,
|
import { mdiArrowLeft, mdiArrowRight, mdiDotsVertical, mdiCodeTags, mdiClose,
|
||||||
|
@ -141,8 +143,8 @@ export default {
|
||||||
name: 'Event',
|
name: 'Event',
|
||||||
mixins: [clipboard],
|
mixins: [clipboard],
|
||||||
components: {
|
components: {
|
||||||
EventAdmin: () => import('@/components/eventAdmin'),
|
EventAdmin,
|
||||||
EmbedEvent: () => import('@/components/embedEvent'),
|
EmbedEvent,
|
||||||
MyPicture
|
MyPicture
|
||||||
},
|
},
|
||||||
async asyncData ({ $axios, params, error }) {
|
async asyncData ({ $axios, params, error }) {
|
||||||
|
@ -168,7 +170,7 @@ export default {
|
||||||
if (!this.event) {
|
if (!this.event) {
|
||||||
return {}
|
return {}
|
||||||
}
|
}
|
||||||
const tags_feed = this.event.tags.map(tag => ({
|
const tags_feed = this.event.tags && this.event.tags.map(tag => ({
|
||||||
rel: 'alternate',
|
rel: 'alternate',
|
||||||
type: 'application/rss+xml',
|
type: 'application/rss+xml',
|
||||||
title: `${this.settings.title} events tagged ${tag}`,
|
title: `${this.settings.title} events tagged ${tag}`,
|
||||||
|
@ -246,7 +248,7 @@ export default {
|
||||||
return this.event.media && this.event.media.length
|
return this.event.media && this.event.media.length
|
||||||
},
|
},
|
||||||
plainDescription () {
|
plainDescription () {
|
||||||
return htmlToText(this.event.description.replace('\n', '').slice(0, 1000))
|
return htmlToText(this.event.description && this.event.description.replace('\n', '').slice(0, 1000))
|
||||||
},
|
},
|
||||||
currentAttachmentLabel () {
|
currentAttachmentLabel () {
|
||||||
return get(this.selectedResource, `data.attachment[${this.currentAttachment}].name`, '')
|
return get(this.selectedResource, `data.attachment[${this.currentAttachment}].name`, '')
|
||||||
|
|
Loading…
Reference in a new issue