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

better calendar attrs and same day events

Browse Source
This commit is contained in:
lesion
2019-06-12 23:41:19 +02:00
parent e5fb3b2cca
commit c8895e77ff
4 changed files with 64 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
components/Calendar.vue
View File

@@ -37,40 +37,28 @@ export default {
const element = document.getElementById(day.day) const element = document.getElementById(day.day)
if (element) element.scrollIntoView(); //Even IE6 supports this if (element) element.scrollIntoView(); //Even IE6 supports this
}, },
eventToAttribute(event) {
let e = {
key: event.id,
customData: event,
order: event.start_datetime,
}
const day = moment(event.start_datetime).date()
// let color = event.past ? 'rgba(200,200,200,0.5)' : get(event, 'tags[0].color') || 'rgba(170,170,250,0.7)'
if (event.multidate) {
e.dates = {
start: event.start_datetime, end: event.end_datetime
}
e.highlight = {
color: sample(['purple', 'yellow', 'orange', 'red', 'green', 'blue']),
}
} else {
e.dates = event.start_datetime
e.dot = { color: sample(['purple', 'red', 'orange', 'yellow', 'green', 'blue']) }
}
return e
}
}, },
computed: { computed: {
...mapGetters(['filteredEvents']), ...mapGetters(['filteredEvents']),
...mapState(['events']),
attributes () { attributes () {
return [ return [
{ key: 'today', dates: new Date(), { key: 'today', dates: new Date(),
highlight: { highlight: { color: 'red' },
backgroundColor: '#aaffaa' },
}, {
}, key: 'event',
...this.filteredEvents.map(this.eventToAttribute) dates: this.filteredEvents
.filter(e => !e.multidate)
.map(e => e.start_datetime ),
dot: { }
},
{
key: 'multidays',
dates: this.filteredEvents
.filter(e => e.multidate)
.map( e => ({ start: e.start_datetime, end: e.end_datetime })),
highlight: { color: 'green' }
}
] ]
} }
} }

1
package.json
View File

@@ -7,7 +7,6 @@
"dev": "cross-env NODE_ENV=development nodemon server/index.js --watch server", "dev": "cross-env NODE_ENV=development nodemon server/index.js --watch server",
"build": "nuxt build", "build": "nuxt build",
"start": "cross-env NODE_ENV=production node server/index.js", "start": "cross-env NODE_ENV=production node server/index.js",
"generate": "nuxt generate",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .", "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint", "precommit": "npm run lint",
"migrate:dev": "sequelize db:migrate", "migrate:dev": "sequelize db:migrate",

74
pages/add/_edit.vue
View File

@@ -17,8 +17,8 @@
//- WHERE //- WHERE
el-tab-pane el-tab-pane
span(slot='label') <v-icon name='map-marker-alt'/> {{$t('common.where')}} span(slot='label') <v-icon name='map-marker-alt'/> {{$t('common.where')}}
p(v-html="$t('event.where_description')") p(v-html="$t('event.where_description')")
el-select.mb-3(v-model='event.place.name' el-select.mb-3(v-model='event.place.name'
@change='placeChoosed' @change='placeChoosed'
@@ -48,7 +48,7 @@
is-expanded is-expanded
:min-date='new Date()' :min-date='new Date()'
) )
el-row el-row
el-col(:span='12') el-col(:span='12')
div {{$t('event.time_start_description')}} div {{$t('event.time_start_description')}}
@@ -70,11 +70,11 @@
span {{$t('event.description_description')}} span {{$t('event.description_description')}}
el-input.mb-3(v-model='event.description' type='textarea' :rows='9') el-input.mb-3(v-model='event.description' type='textarea' :rows='9')
span {{$t('event.tag_description')}} span {{$t('event.tag_description')}}
br br
el-select(v-model='event.tags' multiple filterable allow-create el-select(v-model='event.tags' multiple filterable allow-create
default-first-option placeholder='Tag') default-first-option placeholder='Tag')
el-option(v-for='tag in tags' :key='tag.tag' el-option(v-for='tag in tags' :key='tag.tag'
:label='tag' :value='tag') :label='tag' :value='tag')
el-button.float-right(@click.native='next' :disabled='!couldProceed') {{$t('common.next')}} el-button.float-right(@click.native='next' :disabled='!couldProceed') {{$t('common.next')}}
@@ -107,7 +107,7 @@ export default {
const month = moment().month()+1 const month = moment().month()+1
const year = moment().year() const year = moment().year()
return { return {
event: { event: {
place: { name: '', address: '' }, place: { name: '', address: '' },
title: '', description: '', tags: [], title: '', description: '', tags: [],
multidate: false, multidate: false,
@@ -164,7 +164,7 @@ export default {
if (event.multidate) { if (event.multidate) {
data.date = { start: new Date(event.start_datetime), end: new Date(event.end_datetime) } data.date = { start: new Date(event.start_datetime), end: new Date(event.end_datetime) }
} else { } else {
data.date = new Date(event.start_datetime)// moment(event.start_datetime) data.date = new Date(event.start_datetime)
} }
data.time.start = moment(event.start_datetime).format('HH:mm') data.time.start = moment(event.start_datetime).format('HH:mm')
data.time.end = moment(event.end_datetime).format('HH:mm') data.time.end = moment(event.end_datetime).format('HH:mm')
@@ -177,7 +177,6 @@ export default {
data.loading = false data.loading = false
return data return data
} }
console.error('prima del return')
return { loading: false } return { loading: false }
}, },
computed: { computed: {
@@ -190,15 +189,34 @@ export default {
}), }),
todayEvents () { todayEvents () {
const date = moment(this.date) const date = moment(this.date)
return this.events.filter(e => date.isSame(moment(e.start_datetime), 'day')) return this.events.filter(e =>
!e.multidate ?
date.isSame(moment(e.start_datetime), 'day') :
moment(e.start_datetime).isSame(date, 'day') ||
moment(e.start_datetime).isBefore(date) && moment(e.end_datetime).isAfter(date)
)
}, },
...mapGetters(['filteredEvents']), ...mapGetters(['filteredEvents']),
attributes () { attributes () {
const tmp_events = this.events return [
.filter(e => this.id ? e.id !== this.event.id : true) { key: 'today', dates: new Date(),
.filter(e => !e.past) highlight: { color: 'red' },
},
return tmp_events.map(this.eventToAttribute) {
key: 'event',
dates: this.filteredEvents
.filter(e => !e.multidate)
.map(e => e.start_datetime ),
dot: { }
},
{
key: 'multidays',
dates: this.filteredEvents
.filter(e => e.multidate)
.map( e => ({ start: e.start_datetime, end: e.end_datetime })),
highlight: { color: 'green' }
}
]
}, },
disableAddress () { disableAddress () {
return this.places_name.find(p => p.name === this.event.place.name) return this.places_name.find(p => p.name === this.event.place.name)
@@ -209,42 +227,22 @@ export default {
case 0+t: case 0+t:
return true return true
case 1+t: case 1+t:
return this.event.place.name.length>0 && return this.event.place.name.length>0 &&
this.event.place.address.length>0 this.event.place.address.length>0
case 2+t: case 2+t:
if (this.date && this.time.start) return true if (this.date && this.time.start) return true
case 3+t: case 3+t:
return this.event.title.length>0 return this.event.title.length>0
case 4+t: case 4+t:
return this.event.place.name.length>0 && return this.event.place.name.length>0 &&
this.event.place.address.length>0 && this.event.place.address.length>0 &&
(this.date && this.time.start) && (this.date && this.time.start) &&
this.event.title.length>0 this.event.title.length>0
} }
} }
}, },
methods: { methods: {
...mapActions(['addEvent', 'updateEvent', 'updateMeta', 'updateEvents']), ...mapActions(['addEvent', 'updateEvent', 'updateMeta', 'updateEvents']),
eventToAttribute(event) {
let e = {
key: event.id,
customData: event,
order: event.start_datetime,
}
const day = moment(event.start_datetime).date()
let color = event.tags && event.tags.length && event.tags[0].color ? event.tags[0].color : 'rgba(170,170,250,0.7)'
if (event.past) color = 'rgba(200,200,200,0.5)'
if (event.multidate) {
e.dates = {
start: event.start_datetime, end: event.end_datetime
}
e.highlight = { }
} else {
e.dates = event.start_datetime
e.dot = { }
}
return e
},
next () { next () {
this.activeTab = String(Number(this.activeTab)+1) this.activeTab = String(Number(this.activeTab)+1)
if (this.activeTab === "2") { if (this.activeTab === "2") {

20
pages/event/_id.vue
View File

@@ -2,7 +2,8 @@
el-card#eventDetail(v-loading='!loaded') el-card#eventDetail(v-loading='!loaded')
//- close button //- close button
nuxt-link.float-right(to='/') nuxt-link.float-right(to='/')
el-button(circle icon='el-icon-close' type='danger' size='small' plain) el-button(type='danger' plain circle)
v-icon(name='times')
div(v-if='!event') div(v-if='!event')
h5 {{$t('event.not_found')}} h5 {{$t('event.not_found')}}
@@ -12,9 +13,11 @@
h5.text-center {{event.title}} h5.text-center {{event.title}}
div.nextprev div.nextprev
nuxt-link(v-if='prev' :to='`/event/${prev.id}`') nuxt-link(v-if='prev' :to='`/event/${prev.id}`')
el-button(icon='el-icon-arrow-left' round type='success') el-button( round type='success')
v-icon(name='chevron-left')
nuxt-link.float-right(v-if='next' :to='`/event/${next.id}`') nuxt-link.float-right(v-if='next' :to='`/event/${next.id}`')
el-button(icon='el-icon-arrow-right' round type='success') el-button(round type='success')
v-icon(name='chevron-right')
//- image //- image
img(:src='imgPath' v-if='event.image_path' @load='image_loaded') img(:src='imgPath' v-if='event.image_path' @load='image_loaded')
@@ -32,13 +35,13 @@
//- show hide, confirm, delete, edit buttons when allowed //- show hide, confirm, delete, edit buttons when allowed
div(v-if='mine') div(v-if='mine')
hr hr
el-button(v-if='event.is_visible' size='mini' plain type='warning' @click.prevents='toggle' icon='el-icon-view') {{$t('common.hide')}} el-button(v-if='event.is_visible' size='mini' plain type='warning' @click.prevents='toggle') {{$t('common.hide')}}
el-button(v-else plain type='success' size='mini' @click.prevents='toggle' icon='el-icon-view') {{$t('common.confirm')}} el-button(v-else plain type='success' size='mini' @click.prevents='toggle') {{$t('common.confirm')}}
el-button(plain type='danger' size='mini' @click.prevent='remove' icon='el-icon-remove') {{$t('common.remove')}} el-button(plain type='danger' size='mini' @click.prevent='remove') {{$t('common.remove')}}
el-button(plain type='primary' size='mini' @click='$router.replace(`/add/${event.id}`)' icon='el-icon-edit') {{$t('common.edit')}} el-button(plain type='primary' size='mini' @click='$router.replace(`/add/${event.id}`)') {{$t('common.edit')}}
//- comments //- comments
.card-body(v-if='event.activitypub_id') .card-body(v-if='event.activitypub_id && settings')
strong {{$t('common.related')}} - strong {{$t('common.related')}} -
a(:href='`https://mastodon.cisti.org/web/statuses/${event.activitypub_id}`') {{$t('common.add')}} a(:href='`https://mastodon.cisti.org/web/statuses/${event.activitypub_id}`') {{$t('common.add')}}
.card-header(v-for='comment in event.comments' :key='comment.id') .card-header(v-for='comment in event.comments' :key='comment.id')
@@ -93,6 +96,7 @@ export default {
}, },
computed: { computed: {
...mapGetters(['filteredEvents']), ...mapGetters(['filteredEvents']),
...mapState(['settings']),
next () { next () {
let found = false let found = false
return this.filteredEvents.find(e => { return this.filteredEvents.find(e => {