surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CEventsCalendar.ts

Browse Source 
calendarioeventi.ts
CMySingleEvent.ts
evento.ts
This commit is contained in:
Paolo Arena
2021-10-04 01:29:15 +02:00
parent 3aebf19a91
commit 76918f6b2c
31 changed files with 1068 additions and 561 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/nuovo_componente.ts.old
View File

@@ -4,6 +4,8 @@ import { useUserStore } from '@store/UserStore'
import { useGlobalStore } from '@store/globalStore' import { useGlobalStore } from '@store/globalStore'
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
import { getCurrentInstance } from 'vue'
export default defineComponent({ export default defineComponent({
name: '', name: '',
props: { props: {
@@ -35,6 +37,8 @@ export default defineComponent({
const userStore = useUserStore() const userStore = useUserStore()
const globalStore = useGlobalStore() const globalStore = useGlobalStore()
// const root = getCurrentInstance(); // same as ctx.root in component
return { return {
} }

2
package.json
View File

@@ -24,6 +24,7 @@
}, },
"dependencies": { "dependencies": {
"@quasar/extras": "^1.11.0", "@quasar/extras": "^1.11.0",
"@quasar/quasar-ui-qcalendar": "^4.0.0-beta.6",
"@vue/compat": "^3.2.12", "@vue/compat": "^3.2.12",
"@vue/compiler-sfc": "^3.2.12", "@vue/compiler-sfc": "^3.2.12",
"@vue/eslint-config-standard": "^6.1.0", "@vue/eslint-config-standard": "^6.1.0",
@@ -73,6 +74,7 @@
"devDependencies": { "devDependencies": {
"@babel/eslint-parser": "^7.15.7", "@babel/eslint-parser": "^7.15.7",
"@quasar/app": "^3.1.0", "@quasar/app": "^3.1.0",
"@quasar/quasar-app-extension-qcalendar": "^4.0.0-beta.6",
"@types/bcryptjs": "^2.4.2", "@types/bcryptjs": "^2.4.2",
"@types/dotenv": "^8.2.0", "@types/dotenv": "^8.2.0",
"@types/googlemaps": "^3.43.3", "@types/googlemaps": "^3.43.3",

BIN
public/images/noimg.png Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

5
quasar.conf.js
View File

@@ -42,6 +42,7 @@ module.exports = configure((ctx) => ({
// https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css // https://v2.quasar.dev/quasar-cli/quasar-conf-js#Property%3A-css
css: [ css: [
'app.scss', 'app.scss',
// '~quasar-ui-qcalendar/src/css/calendar-day.sass'
], ],
// https://github.com/quasarframework/quasar/tree/dev/extras // https://github.com/quasarframework/quasar/tree/dev/extras
@@ -88,6 +89,10 @@ module.exports = configure((ctx) => ({
vueCompiler: true, vueCompiler: true,
gzip: false, // gzip true gzip: false, // gzip true
analyze: false, // true analyze: false, // true
transpile: true,
transpileDependencies: [
/quasar-ui-qcalendar[\\/]src/
],
chainWebpack(chain, { isServer, isClient }) { chainWebpack(chain, { isServer, isClient }) {
chain.resolve.alias chain.resolve.alias

4
quasar.extensions.json
View File

@@ -1 +1,3 @@
{} {
"@quasar/qcalendar": {}
}

8
src/boot/calendar.ts Executable file
View File

@@ -0,0 +1,8 @@
import { boot } from 'quasar/wrappers'
// @ts-ignore
import Plugin from '@quasar/quasar-ui-qcalendar/src/QCalendarDay.js'
// import '@quasar/quasar-ui-qcalendar/src/css/calendar-day.sass'
export default boot(({ app }) => {
app.use(Plugin)
})

370
src/components/CEventsCalendar/CEventsCalendar.ts.off → src/components/CEventsCalendar/CEventsCalendar.ts
View File

@@ -1,29 +1,30 @@
import { defineComponent, ref, computed, PropType, reactive, watch } from 'vue' import { defineComponent, ref, onMounted, onBeforeMount, computed, PropType, reactive, watch } from 'vue'
import { useI18n } from '@src/boot/i18n' import { useI18n } from '@src/boot/i18n'
import { useUserStore } from '@store/UserStore' import { useUserStore } from '@store/UserStore'
import { useGlobalStore } from '@store/globalStore' import { useGlobalStore } from '@store/globalStore'
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
import { colors, Screen, Platform, date } from 'quasar' import { colors, Screen, Platform, date } from 'quasar'
import { static_data } from '@src/db/static_data' import { EState, IBookedEvent, IBookedEventPage, IEvents, IMessage, IMessagePage } from '@model'
import translate from '@src/globalroutines/util'
import { lists } from '@store/Modules/lists'
import { EState, IBookedEvent, IBookedEventPage, IEvents, IMessage, IMessagePage, IOperators } from "model"
import { Logo } from '../logo' import { Logo } from '../logo'
import { Footer } from '../Footer' import { Footer } from '../Footer'
import { CTitle } from '../CTitle' import { CTitle } from '../CTitle'
import { CImgText } from '../CImgText' import { CImgText } from '../CImgText'
import { CMyEditor } from '../CMyEditor' import { CMyEditor } from '../CMyEditor'
import { CDateTime } from "@/components/CDateTime" import { CDateTime } from '@/components/CDateTime'
import { CMyAvatar } from '../CMyAvatar' import { CMyAvatar } from '../CMyAvatar'
import { CMySingleEvent } from "@/components/CMySingleEvent" import { CMySingleEvent } from '@/components/CMySingleEvent'
import { CMyTeacher } from "@/components/CMyTeacher" import { CMyTeacher } from '@/components/CMyTeacher'
import { CMySelect } from '../CMySelect' import { CMySelect } from '../CMySelect'
import { tools } from "@store/Modules/tools" import { tools } from '@store/Modules/tools'
import { costanti } from "@costanti" import { costanti } from '@costanti'
// import { stop, prevent, stopAndPrevent } from 'quasar/src/utils/event'
import MixinEvents from '../../mixins/mixin-events' import MixinEvents from '../../mixins/mixin-events'
import { useCalendarStore } from '@store/CalendarStore' import { useCalendarStore } from '@store/CalendarStore'
import { toolsext } from "@store/Modules/toolsext" import { func_tools, toolsext } from '@store/Modules/toolsext'
import { useMessageStore } from '@store/MessageStore'
import { static_data } from '@/db/static_data'
export default defineComponent({ export default defineComponent({
name: 'CEventsCalendar', name: 'CEventsCalendar',
@@ -38,11 +39,6 @@ export default defineComponent({
required: false, required: false,
default: 0, default: 0,
}, },
mybool: {
type: Boolean,
required: true,
default: false,
},
}, },
components: { components: {
Logo, Logo,
@@ -54,20 +50,25 @@ export default defineComponent({
CDateTime, CDateTime,
CMyAvatar, CMyAvatar,
CMySingleEvent, CMySingleEvent,
CMyTeacher CMyTeacher,
}, },
setup(props, { emit, root }) { setup(props, { emit }) {
const $q = useQuasar() const $q = useQuasar()
const { t } = useI18n() const { t } = useI18n()
const userStore = useUserStore() const userStore = useUserStore()
const globalStore = useGlobalStore() const globalStore = useGlobalStore()
const calendarStore = useCalendarStore() const calendarStore = useCalendarStore()
const messageStore = useMessageStore()
const resources = ref([])
const calendar = ref(null)
const calendarView = ref('month') const calendarView = ref('month')
const selectedDate = ref('') const selectedDate = ref('')
const tabeditor = ref('details') const tabeditor = ref('details')
const showPrev = ref(false) const showPrev = ref(false)
const formDefault = ref(<IEvents> { const formDefault = ref(<IEvents>{
title: '', title: '',
details: '', details: '',
bodytext: '', bodytext: '',
@@ -77,7 +78,7 @@ export default defineComponent({
bgcolor: '#839ff2' bgcolor: '#839ff2'
}) })
const formbookEventDefault = ref(<IBookedEvent> { const formbookEventDefault = ref(<IBookedEvent>{
userId: '', userId: '',
msgbooking: '', msgbooking: '',
infoevent: '', infoevent: '',
@@ -90,7 +91,7 @@ export default defineComponent({
modified: false modified: false
}) })
const formAskForDefault = ref(<IMessage> { const formAskForDefault = ref(<IMessage>{
dest: { dest: {
idapp: process.env.APP_ID, idapp: process.env.APP_ID,
username: '' username: ''
@@ -102,7 +103,7 @@ export default defineComponent({
message: '' message: ''
}) })
const dateFormatter = ref('') const dateFormatter = ref(<any>void 0)
const titleFormatter: any = ref(null) const titleFormatter: any = ref(null)
const keyValue = ref(0) const keyValue = ref(0)
@@ -115,7 +116,7 @@ export default defineComponent({
{ label: 'Month', value: 'month' } { label: 'Month', value: 'month' }
]) ])
const addEvent = ref(false) const addEvent = ref(false)
const bookEventpage = ref(<IBookedEventPage> { const bookEventpage = ref(<IBookedEventPage>{
show: false, show: false,
bookedevent: { bookedevent: {
userId: '', userId: '',
@@ -128,7 +129,7 @@ export default defineComponent({
state: EState.None state: EState.None
}) })
const askInfopage = ref(<IMessagePage> { const askInfopage = ref(<IMessagePage>{
show: false, show: false,
msg: { msg: {
message: '' message: ''
@@ -136,21 +137,41 @@ export default defineComponent({
state: EState.None state: EState.None
}) })
const contextDay = ref(null) const contextDay = ref(<any>null)
const eventForm = ref(<IEvents> { ...formDefault }) const eventForm = ref(<IEvents>{
const bookEventForm = ref({ ...formbookEventDefault }) title: '',
const askInfoForm = ref(<IMessage> { ...formAskForDefault }) details: '',
bodytext: '',
dateTimeStart: tools.getstrYYMMDDDateTime(tools.getDateNow()),
dateTimeEnd: tools.getstrYYMMDDDateTime(tools.getDateNow()),
icon: '',
bgcolor: '#839ff2'
})
const bookEventForm = ref({ ...formbookEventDefault.value })
const askInfoForm = ref(<IMessage>{
dest: {
idapp: process.env.APP_ID,
username: ''
},
origin: {
idapp: process.env.APP_ID,
username: ''
},
message: ''
})
const displayEvent = ref(false) const displayEvent = ref(false)
const myevent = ref(null) const myevent = ref({})
// const events = [] // const events = []
const gmt = '' const gmt = ''
const dragging = ref(false) const dragging = ref(false)
const draggedEvent = ref(null) const draggedEvent = ref(<IEvents>{})
const ignoreNextSwipe = ref(false) const ignoreNextSwipe = ref(false)
const locale = computed(() => calendarStore.locale) const locale = computed(() => calendarStore.locale)
const { findEventIndex, UpdateDbByFields, isAlreadyBooked } = MixinEvents() const { isShowPrice, getImgEvent, getStyleByEvent, isAlreadyBooked, getWhereIcon, getWhereName,
editable, getContribtypeById, getPrice, isEventEnabled, findEventIndex, UpdateDbByFields,
} = MixinEvents()
function visuAllCal() { function visuAllCal() {
return props.mysingleevent === null return props.mysingleevent === null
@@ -181,14 +202,6 @@ export default defineComponent({
return calendarStore.theme return calendarStore.theme
} }
function intervalStart() {
return calendarStore.intervalRange.min * (1 / calendarStore.intervalRangeStep)
}
function intervalCount() {
return (calendarStore.intervalRange.max - calendarStore.intervalRange.min) * (1 / calendarStore.intervalRangeStep)
}
function containerStyle() { function containerStyle() {
const styles = { height: '' } const styles = { height: '' }
if (calendarView.value !== 'month' || (calendarView.value === 'month' && calendarStore.dayHeight === 0)) { if (calendarView.value !== 'month' || (calendarView.value === 'month' && calendarStore.dayHeight === 0)) {
@@ -200,14 +213,21 @@ export default defineComponent({
// convert the events into a map of lists keyed by date // convert the events into a map of lists keyed by date
function eventsMap() { function eventsMap() {
// console.log('eventsMap') // console.log('eventsMap')
const map = {} const map: {} = {}
calendarStore.eventlist.forEach((myevent: IEvents) => (map[tools.getstrDateTime(myevent.dateTimeStart)] = map[tools.getstrDateTime(myevent.dateTimeStart)] || []).push(myevent)) calendarStore.eventlist.forEach((myevent: IEvents) => {
const myind: string = tools.getstrDateTime(myevent.dateTimeStart)
// @ts-ignore
return (map[myind] = map[myind] || []).push(myevent)
})
return map return map
} }
function addOrUpdateEvent() { function addOrUpdateEvent() {
if (contextDay.value && contextDay.value.bgcolor) { if (contextDay.value) {
return t('dialog.update') if (contextDay.value && contextDay.value.bgcolor) {
return t('dialog.update')
}
} }
return t('dialog.add') return t('dialog.add')
} }
@@ -259,9 +279,11 @@ export default defineComponent({
}) })
function mounted() { function mounted() {
root.$on('calendar:next', calendarNext) /*if (root) {
root.$on('calendar:prev', calendarPrev) root.$on('calendar:next', calendarNext)
root.$on('calendar:today', calendarToday) root.$on('calendar:prev', calendarPrev)
root.$on('calendar:today', calendarToday)
}*/
SetToday() SetToday()
// calendarStore.eventlist = events // calendarStore.eventlist = events
@@ -279,9 +301,12 @@ export default defineComponent({
} }
function beforeDestroy() { function beforeDestroy() {
/*
root.$off('calendar:next', calendarNext) root.$off('calendar:next', calendarNext)
root.$off('calendar:prev', calendarPrev) root.$off('calendar:prev', calendarPrev)
root.$off('calendar:today', calendarToday) root.$off('calendar:today', calendarToday)
*/
} }
function showEvent(eventparam: IEvents) { function showEvent(eventparam: IEvents) {
@@ -293,7 +318,7 @@ export default defineComponent({
function selectEvent(eventparam: IEvents) { function selectEvent(eventparam: IEvents) {
if (myevent.value === eventparam) if (myevent.value === eventparam)
myevent.value = null myevent.value = {}
else else
myevent.value = eventparam myevent.value = eventparam
@@ -312,19 +337,21 @@ export default defineComponent({
} }
function resetForm() { function resetForm() {
eventForm.value = { ...formDefault } eventForm.value = { ...formDefault.value }
} }
function addEventMenu(day: any) { function addEventMenu(day: any) {
console.log('addeventmenu', day) console.log('addeventmenu', day)
if (calendarView.value === 'scheduler' || calendarView.value === 'week-scheduler' || calendarView.value === 'month-scheduler' || !editable.value) { if (calendarView.value === 'scheduler' || calendarView.value === 'week-scheduler' || calendarView.value === 'month-scheduler' || !editable) {
return return
} }
resetForm() resetForm()
contextDay.value = { ...day.scope } contextDay.value = { ...day.scope }
eventForm.value.dateTimeStart.value = tools.getstrYYMMDDDateTime(day.scope.timestamp.date + ' 21:00:00') if (eventForm.value) {
eventForm.value.dateTimeEnd.value = tools.getstrYYMMDDDateTime(day.scope.timestamp.date + ' 22:00:00') eventForm.value.dateTimeStart = tools.getstrYYMMDDDateTime(day.scope.timestamp.date + ' 21:00:00')
eventForm.value.dateTimeEnd = tools.getstrYYMMDDDateTime(day.scope.timestamp.date + ' 22:00:00')
}
console.log('eventForm', eventForm) console.log('eventForm', eventForm)
@@ -350,14 +377,14 @@ export default defineComponent({
bookEventForm.value.numpeopleDinner = 0 bookEventForm.value.numpeopleDinner = 0
bookEventForm.value.numpeopleDinnerShared = 0 bookEventForm.value.numpeopleDinnerShared = 0
bookEventForm.value.booked = true bookEventForm.value.booked = true
bookEventpage = EState.Creating bookEventpage.value.state = EState.Creating
displayEvent = false displayEvent.value = false
bookEventpage.value.show = true // show dialog bookEventpage.value.show = true // show dialog
} }
} }
function askForInfoEventMenu(eventparam) { function askForInfoEventMenu(eventparam: any) {
if (!userStore.isLogged || !userStore.my.verified_email) { if (!userStore.isLogged || !userStore.my.verified_email) {
// Visu right Toolbar to make SignIn // Visu right Toolbar to make SignIn
globalStore.rightDrawerOpen = true globalStore.rightDrawerOpen = true
@@ -368,7 +395,7 @@ export default defineComponent({
// $router.push('/signin') // $router.push('/signin')
} else { } else {
console.log('askForInfoEventMenu') console.log('askForInfoEventMenu')
askInfoForm.value = { ...formAskForDefault } askInfoForm.value = { ...formAskForDefault.value }
myevent.value = eventparam myevent.value = eventparam
@@ -376,7 +403,7 @@ export default defineComponent({
message: '' message: ''
} }
askInfopage.value = EState.Creating askInfopage.value.state = EState.Creating
displayEvent.value = false displayEvent.value = false
askInfopage.value.show = true // show dialog askInfopage.value.show = true // show dialog
@@ -414,9 +441,9 @@ export default defineComponent({
tools.CancelEvent($q, eventparam) tools.CancelEvent($q, eventparam)
} }
function duplicateEvent(eventparam, numgg, numev = 1) { function duplicateEvent(eventparam: any, numgg: number, numev = 1) {
for (let i = 0; i < numev; ++i) { for (let i = 0; i < numev; ++i) {
globalStore.DuplicateRec({ table: tools.TABEVENTS, id: eventparam._id }).then((rec) => { globalStore.DuplicateRec({ table: costanti.TABEVENTS, id: eventparam._id }).then((rec) => {
if (rec) { if (rec) {
rec.dateTimeStart = tools.addDays(new Date(rec.dateTimeStart), numgg * (i + 1)) rec.dateTimeStart = tools.addDays(new Date(rec.dateTimeStart), numgg * (i + 1))
rec.dateTimeEnd = tools.addDays(new Date(rec.dateTimeEnd), numgg * (i + 1)) rec.dateTimeEnd = tools.addDays(new Date(rec.dateTimeEnd), numgg * (i + 1))
@@ -425,12 +452,12 @@ export default defineComponent({
} }
}) })
} }
// tools.ActionRecTable(this, lists.MenuAction.DUPLICATE_RECTABLE, tools.TABEVENTS, eventparam._id, eventparam, 'db.duplicatedrecord') // tools.ActionRecTable(this, lists.MenuAction.DUPLICATE_RECTABLE, costanti.TABEVENTS, eventparam._id, eventparam, 'db.duplicatedrecord')
} }
function formatDate(mydate: any) { function formatDate(mydate: any) {
let d = void 0 let d: any = void 0
if (mydate !== void 0) { if (mydate !== void 0) {
d = new Date(mydate) d = new Date(mydate)
@@ -444,7 +471,7 @@ export default defineComponent({
return [year, tools.padTime(month), tools.padTime(day)].join('-') return [year, tools.padTime(month), tools.padTime(day)].join('-')
} }
function formatTime(mydate) { function formatTime(mydate: any) {
const d = mydate !== void 0 ? new Date(mydate) : new Date(), const d = mydate !== void 0 ? new Date(mydate) : new Date(),
hours = '' + d.getHours(), hours = '' + d.getHours(),
minutes = '' + d.getMinutes() minutes = '' + d.getMinutes()
@@ -452,7 +479,7 @@ export default defineComponent({
return [tools.padTime(hours), tools.padTime(minutes)].join(':') return [tools.padTime(hours), tools.padTime(minutes)].join(':')
} }
function getDuration(dateTimeStart, dateTimeEnd, unit) { function getDuration(dateTimeStart: Date, dateTimeEnd: Date, unit: any) {
const start = new Date(dateTimeStart) const start = new Date(dateTimeStart)
const end = new Date(dateTimeEnd) const end = new Date(dateTimeEnd)
const diff = date.getDateDiff(end, start, unit) const diff = date.getDateDiff(end, start, unit)
@@ -460,35 +487,34 @@ export default defineComponent({
} }
function saveEvent() { function saveEvent() {
const self = this
// ++Todo VALIDATE $refs.myevent // ++Todo VALIDATE $refs.myevent
if (true) { if (true) {
// close the dialog // close the dialog
self.addEvent = false addEvent.value = false
const form = { ...self.eventForm } const form = { ...eventForm.value }
let update = false let update = false
if (self.contextDay._id) { if (contextDay.value._id) {
// an update // an update
update = true update = true
} else { } else {
// an add // an add
} }
const data = { ...form } const data: any = { ...form }
// ++Save into the Database // ++Save into the Database
const mydatatosave = { const mydatatosave = {
id: data._id, id: data._id,
table: tools.TABEVENTS, table: costanti.TABEVENTS,
fieldsvalue: data fieldsvalue: data
} }
if (update === true) { if (update) {
UpdateDbByFields($q, data, true, contextDay.value) UpdateDbByFields($q, data, true, contextDay.value)
} else { } else {
const mydataadd = { const mydataadd = {
table: tools.TABEVENTS, table: costanti.TABEVENTS,
data data
} }
@@ -496,8 +522,8 @@ export default defineComponent({
if (record) { if (record) {
tools.showPositiveNotif($q, t('db.recupdated')) tools.showPositiveNotif($q, t('db.recupdated'))
if (update === true) { if (update) {
const index = self.findEventIndex(self.contextDay) const index = findEventIndex(contextDay)
if (index >= 0) { if (index >= 0) {
// @ts-ignore // @ts-ignore
calendarStore.eventlist.splice(index, 1, { ...data }) calendarStore.eventlist.splice(index, 1, { ...data })
@@ -512,22 +538,22 @@ export default defineComponent({
} else { } else {
tools.showNegativeNotif($q, t('db.recfailed')) tools.showNegativeNotif($q, t('db.recfailed'))
// Undo... // Undo...
const index = self.findEventIndex(self.contextDay) const index = findEventIndex(contextDay)
if (index >= 0) { if (index >= 0) {
// @ts-ignore // @ts-ignore
calendarStore.eventlist.splice(index, 1, { ...self.contextDay }) calendarStore.eventlist.splice(index, 1, { ...contextDay })
} }
} }
}) })
} }
self.contextDay = null contextDay.value = null
} }
} }
function EditBookEvent(myevent: IEvents) { function EditBookEvent(myevent: IEvents) {
myevent = myevent
const bookedevent = calendarStore.getters.findEventBooked(myevent, false) const bookedevent: any = calendarStore.findEventBooked(myevent, false)
console.log('bookedevent', bookedevent) console.log('bookedevent', bookedevent)
@@ -543,33 +569,32 @@ export default defineComponent({
bookEventForm.value.datebooked = bookedevent.datebooked bookEventForm.value.datebooked = bookedevent.datebooked
} }
bookEventpage = EState.Modifying bookEventpage.value.state = EState.Modifying
bookEventpage.value.bookedevent = bookedevent bookEventpage.value.bookedevent = bookedevent
bookEventpage.value.show = true bookEventpage.value.show = true
} }
function sendMsg(myevent: IEvents) { function sendMsg(myevent: IEvents) {
const self = this askInfopage.value.show = false
askInfopage.show = false
const data: IMessage = { const data: IMessage = {
source: { source: {
event_id: myevent._id, event_id: myevent._id,
infoevent: tools.gettextevent(this, myevent) infoevent: tools.gettextevent(myevent)
}, },
dest: { dest: {
idapp: process.env.APP_ID, idapp: process.env.APP_ID,
username: myevent.teacher username: myevent.teacher
}, },
message: askInfoForm.message message: askInfoForm.value.message
} }
MessageStore.SendMsgEvent(data).then((ris) => { messageStore.SendMsgEvent(data).then((ris) => {
self.contextDay = null contextDay.value = null
if (ris) if (ris)
tools.showPositiveNotif(self.$q, self.t('cal.sendmsg_sent')) tools.showPositiveNotif($q, t('cal.sendmsg_sent'))
else else
tools.showNegativeNotif(self.$q, self.t('cal.sendmsg_error')) tools.showNegativeNotif($q, t('cal.sendmsg_error'))
}) })
} }
@@ -594,7 +619,7 @@ export default defineComponent({
msgbooking: bookEventForm.value.msgbooking, msgbooking: bookEventForm.value.msgbooking,
booked: bookEventForm.value.booked, booked: bookEventForm.value.booked,
datebooked: tools.getDateNow(), datebooked: tools.getDateNow(),
modified: (bookEventpage.value !== EState.Creating) modified: (bookEventpage.value.state !== EState.Creating)
} }
BookEvent(data).then((ris) => { BookEvent(data).then((ris) => {
@@ -641,37 +666,33 @@ export default defineComponent({
} }
} }
function handleSwipe({ evt, ...info }) { function onDragEnter(ev: any, eventparam: any) {
if (dragging.value === false) { /*
if (info.dur >= 30 && ignoreNextSwipe.value === false) {
if (info.direction === 'right') {
calendarPrev()
} else if (info.direction === 'left') {
calendarNext()
}
} else {
ignoreNextSwipe.value = false
}
}
stopAndPrevent(evt)
}
function onDragEnter(ev: any, eventparam) {
prevent(ev) prevent(ev)
*/
} }
function onDragStart(ev, eventparam) { function onDragStart(ev: any, eventparam: any) {
dragging.value = true dragging.value = true
draggedEvent.value = eventparam draggedEvent.value = eventparam
/*
stop(ev) stop(ev)
*/
} }
function onDragEnd(ev, eventparam) {
function onDragEnd(ev: any, eventparam: any) {
/*
stopAndPrevent(ev) stopAndPrevent(ev)
resetDrag() resetDrag()
*/
} }
function onDragOver(ev, day, type) { function onDragOver(ev: any, day: any, type: any) {
/*
if (type === 'day') { if (type === 'day') {
stopAndPrevent(ev) stopAndPrevent(ev)
return draggedEvent.value.dateTimeStart !== day.dateTimeStart return draggedEvent.value.dateTimeStart !== day.dateTimeStart
@@ -679,29 +700,34 @@ export default defineComponent({
stopAndPrevent(ev) stopAndPrevent(ev)
// return draggedEvent.value.date !== day.date && draggedEvent.value.time !== day.time // return draggedEvent.value.date !== day.date && draggedEvent.value.time !== day.time
return draggedEvent.value.dateTimeStart !== day.dateTimeStart return draggedEvent.value.dateTimeStart !== day.dateTimeStart
} }*/
} }
function onDrop(ev, day, type) { function onDrop(ev: any, day: any, type: any) {
ev.preventDefault() ev.preventDefault()
ev.stopPropagation() ev.stopPropagation()
console.log('day.dateTimeStart', day.dateTimeStart, day.date, 'day.time', day.time) console.log('day.dateTimeStart', day.dateTimeStart, day.date, 'day.time', day.time)
if (type === 'day') { if (type === 'day') {
// @ts-ignore
draggedEvent.value.dateTimeStart = day.date + ' ' + tools.getstrTime(draggedEvent.value.dateTimeStart) draggedEvent.value.dateTimeStart = day.date + ' ' + tools.getstrTime(draggedEvent.value.dateTimeStart)
// @ts-ignore
draggedEvent.value.dateTimeEnd = day.date + ' ' + tools.getstrTime(draggedEvent.value.dateTimeEnd) draggedEvent.value.dateTimeEnd = day.date + ' ' + tools.getstrTime(draggedEvent.value.dateTimeEnd)
draggedEvent.value.side = void 0 draggedEvent.value.side = void 0
} else if (type === 'interval') { } else if (type === 'interval') {
const mins = date.getDateDiff(draggedEvent.value.dateTimeEnd, draggedEvent.value.dateTimeStart, 'minutes') const mins = date.getDateDiff(draggedEvent.value.dateTimeEnd, draggedEvent.value.dateTimeStart, 'minutes')
// @ts-ignore
draggedEvent.value.dateTimeStart = day.date + ' ' + day.time draggedEvent.value.dateTimeStart = day.date + ' ' + day.time
// @ts-ignore
const mystart = new Date(draggedEvent.value.dateTimeStart) const mystart = new Date(draggedEvent.value.dateTimeStart)
draggedEvent.value.dateTimeEnd = tools.addMinutes(mystart, mins) draggedEvent.value.dateTimeEnd = tools.addMinutes(mystart, mins)
// draggedEvent.value.dateTimeEnd = day.dateTimeEnd // draggedEvent.value.dateTimeEnd = day.dateTimeEnd
// draggedEvent.value.time = day.time // draggedEvent.value.time = day.time
draggedEvent.value.side = void 0 draggedEvent.value.side = void 0
} }
// console.log('Start', draggedEvent.value.dateTimeStart, 'End', draggedEvent.value.dateTimeEnd) // console.log('Start', draggedEvent.value.dateTimeStart, 'End', draggedEvent.value.dateTimeEnd)
// Save Date // Save Date
UpdateDbByFields($q, { UpdateDbByFields($q, {
_id: draggedEvent.value._id, _id: draggedEvent.value._id,
dateTimeStart: draggedEvent.value.dateTimeStart, dateTimeStart: draggedEvent.value.dateTimeStart,
@@ -711,33 +737,33 @@ export default defineComponent({
} }
function resetDrag() { function resetDrag() {
// @ts-ignore
draggedEvent.value = void 0 draggedEvent.value = void 0
dragging.value = false dragging.value = false
if (Platform.is.desktop) { if (Platform.is.desktop) {
ignoreNextSwipe = true ignoreNextSwipe.value = true
} }
} }
async function BookEvent(eventparam: IBookedEvent) async function BookEvent(eventparam: IBookedEvent) {
{
return await calendarStore.BookEvent(eventparam) return await calendarStore.BookEvent(eventparam)
} }
function createContribType(value) { function createContribType(value: any) {
console.log('createContribType', value) console.log('createContribType', value)
tools.createNewRecord(this, 'contribtype', { label: value }).then((myrec) => { tools.createNewRecord($q, 'contribtype', { label: value }).then((myrec) => {
// console.log('myrec') // console.log('myrec')
calendarStore.contribtype.push(myrec) calendarStore.contribtype.push(myrec)
}) })
} }
function getEventDate(eventparam) { function getEventDate(eventparam: any) {
const parts = eventparam.dateTimeStart.split('-') const parts = eventparam.dateTimeStart.split('-')
const mydate = new Date(parts[0], parts[1] - 1, parts[2]) const mydate = new Date(parts[0], parts[1] - 1, parts[2])
return dateFormatter.format(mydate) return dateFormatter.value.format(mydate)
} }
function badgeClasses(eventparam, type) { function badgeClasses(eventparam: any, type: any) {
const cssColor = tools.isCssColor(eventparam.bgcolor) const cssColor = tools.isCssColor(eventparam.bgcolor)
const isHeader = type === 'header' const isHeader = type === 'header'
return { return {
@@ -748,8 +774,8 @@ export default defineComponent({
} }
} }
function badgeStyles(eventparam, type, timeStartPos, timeDurationHeight) { function badgeStyles(eventparam: any, type: any, timeStartPos: any, timeDurationHeight: any) {
const s = { color: '', top: '', height: '', opacity: 1 } const s = { color: '', top: '', height: '', opacity: 1, 'background-color': 'black', 'align-items': '' }
if (tools.isCssColor(eventparam.bgcolor)) { if (tools.isCssColor(eventparam.bgcolor)) {
s['background-color'] = eventparam.bgcolor s['background-color'] = eventparam.bgcolor
@@ -771,34 +797,36 @@ export default defineComponent({
} }
function calendarNext() { function calendarNext() {
$refs.calendar.next() // @ts-ignore
calendar.value.next()
} }
function calendarPrev() { function calendarPrev() {
$refs.calendar.prev() // @ts-ignore
calendar.value.prev()
} }
function calendarToday(today) { function calendarToday(today: any) {
selectedDate = today selectedDate.value = today
} }
function SetToday() { function SetToday() {
root.$emit('calendar:today', formatDate(tools.getDateNow())) // root.$emit('calendar:today', formatDate(tools.getDateNow()))
} }
function onChanged(data) { function onChanged(data: any) {
// uncomment to see data in console // uncomment to see data in console
// let { start, end } = data // let { start, end } = data
// console.log('onChanged:', start, end) // console.log('onChanged:', start, end)
} }
function onMoved(moved) { function onMoved(moved: any) {
// uncomment to see data in console // uncomment to see data in console
// console.log('onMoved:', moved) // console.log('onMoved:', moved)
} }
function getEventList() { function getEventList() {
const mylist = calendarStore.eventlist.filter((rec) => (new Date(rec.dateTimeEnd) >= tools.getDateNowEvent())) const mylist = calendarStore.eventlist.filter((rec: IEvents) => (new Date(rec.dateTimeEnd!) >= tools.getDateNowEvent()))
if (props.showfirstN > 0) if (props.showfirstN > 0)
return mylist.slice(0, props.showfirstN) return mylist.slice(0, props.showfirstN)
else else
@@ -807,7 +835,6 @@ export default defineComponent({
function getEvents(dt: any) { function getEvents(dt: any) {
const eventsloc = [] const eventsloc = []
// console.log('dt', dt)
for (let i = 0; i < calendarStore.eventlist.length; ++i) { for (let i = 0; i < calendarStore.eventlist.length; ++i) {
let added = false let added = false
@@ -840,20 +867,11 @@ export default defineComponent({
} }
} }
} }
// if (eventsloc.length > 0) // if (eventsloc.length > 0)
// console.log('eventsloc', eventsloc) // console.log('eventsloc', eventsloc)
return eventsloc return eventsloc
} }
function isEventEnabled(myevent: IEvents) {
// check if event is in the past
const datenow = tools.addDays(tools.getDateNow(), -1)
// console.log('datenow', datenow, 'end', myevent.dateTimeEnd)
return (new Date(myevent.dateTimeEnd) >= datenow)
}
function getTitleEv(event: IEvents) { function getTitleEv(event: IEvents) {
return (!!event.short_tit) ? event.short_tit : event.title return (!!event.short_tit) ? event.short_tit : event.title
} }
@@ -862,14 +880,14 @@ export default defineComponent({
return event.title return event.title
} }
onMounted(mounted)
onBeforeMount(beforeMount)
return { return {
calendarView, calendarView,
selectedDate, selectedDate,
tabeditor, tabeditor,
showPrev, showPrev,
keyValue, keyValue,
weekdays, weekdays,
addEvent, addEvent,
@@ -886,6 +904,64 @@ export default defineComponent({
visuAllCal, visuAllCal,
title_cal, title_cal,
calendarStore, calendarStore,
eventsMap,
addOrUpdateEvent,
sendMsg,
calendar,
getEventList,
getEvents,
getTitleEv,
getLongTitleEv,
onChanged,
onMoved,
dayHeight,
theme,
containerStyle,
scrollerPopupStyle160,
hasModifiedBooking,
checkseinviaMsg,
getTitleBtnBooking,
onDragOver,
onDragEnd,
onDragStart,
onDragEnter,
adjustTimestamp,
saveBookEvent,
EditBookEvent,
saveEvent,
onDrop,
resourceDayClicked,
resourceClicked,
onDateChanged,
selectEvent,
showEvent,
addEventMenu,
addBookEventMenu,
askForInfoEventMenu,
clEvent,
deleteEvent,
duplicateEvent,
resources,
calendarPrev,
calendarNext,
badgeClasses,
badgeStyles,
tools,
globalStore,
getImgEvent,
getStyleByEvent,
isAlreadyBooked,
getWhereIcon,
getWhereName,
editable,
getContribtypeById,
getPrice,
isShowPrice,
isEventEnabled,
findEventIndex,
createContribType,
static_data,
editEvent,
} }
} }
}) })

441
src/components/CEventsCalendar/CEventsCalendar.vue.off → src/components/CEventsCalendar/CEventsCalendar.vue
View File

@@ -36,21 +36,21 @@
</q-menu> </q-menu>
</q-btn> </q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="delete" v-close-popup v-if="editable" flat round color="white" icon="delete" v-close-popup
@click="deleteEvent(myevent)"></q-btn> @click="deleteEvent(myevent)"></q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="edit" v-close-popup v-if="editable" flat round color="white" icon="edit" v-close-popup
@click="editEvent(myevent)"></q-btn> @click="editEvent(myevent)"></q-btn>
<q-btn <q-btn
flat round color="white" icon="cancel" v-close-popup flat round color="white" icon="cancel" v-close-popup
@click="myevent = null; displayEvent = false"></q-btn> @click="myevent = null; displayEvent = false"></q-btn>
</q-toolbar> </q-toolbar>
<q-card-section class="inset-shadow"> <q-card-section class="inset-shadow">
<q-img <q-img
:src="getImgEvent(myevent)" :src="getImgEvent(myevent)"
class="absolute-top" class="absolute-top"
style="height: 150px;" style="height: 150px;"
:alt="myevent.title"> :alt="myevent.title">
</q-img> </q-img>
<div style="margin-top: 150px;"> <div style="margin-top: 150px;">
<!--<div v-if="myevent.allday" class="text-caption">{{ getEventDate(myevent) }}</div>--> <!--<div v-if="myevent.allday" class="text-caption">{{ getEventDate(myevent) }}</div>-->
@@ -79,8 +79,8 @@ flat round color="white" icon="cancel" v-close-popup
<q-chip> <q-chip>
<q-avatar v-if="getWhereIcon(myevent.wherecode)"> <q-avatar v-if="getWhereIcon(myevent.wherecode)">
<img <img
:src="`../../public/images/avatar/` + getWhereIcon(myevent.wherecode)" :src="`../../public/images/avatar/` + getWhereIcon(myevent.wherecode)"
alt="Località"> alt="Località">
</q-avatar> </q-avatar>
<q-avatar v-else color="blue" font-size="20px" text-color="white" icon="home"> <q-avatar v-else color="blue" font-size="20px" text-color="white" icon="home">
</q-avatar> </q-avatar>
@@ -96,22 +96,22 @@ flat round color="white" icon="cancel" v-close-popup
</div> </div>
<div v-if="myevent.dateTimeStart" class="cal__when"> <div v-if="myevent.dateTimeStart" class="cal__when">
<span class="cal__where-title">{{ $t('cal.when') }}: <span class="cal__where-title">{{ $t('cal.when') }}:
<span v-html="tools.getstrDateTimeEvent(mythis, myevent, true)"></span> <span v-html="tools.getstrDateTimeEvent($t, myevent, true)"></span>
</span> </span>
</div> </div>
<p v-if="myevent.linkpdf" style="margin-top: 10px; text-align: center"> <p v-if="myevent.linkpdf" style="margin-top: 10px; text-align: center">
<q-btn <q-btn
size="md" type="a" :href="`../../statics/` + myevent.linkpdf" size="md" type="a" :href="myevent.linkpdf"
target="_blank" rounded color="primary" icon="info" :label="$t('cal.showpdf')"> target="_blank" rounded color="primary" icon="info" :label="$t('cal.showpdf')">
</q-btn> </q-btn>
</p> </p>
</div> </div>
</q-card-section> </q-card-section>
<q-card-actions align="right"> <q-card-actions align="right">
<q-btn <q-btn
rounded v-if="!myevent.nobookable && static_data.functionality.BOOKING_EVENTS" rounded v-if="!myevent.nobookable && static_data.functionality.BOOKING_EVENTS"
color="primary" @click="addBookEventMenu(myevent)" :disable="!isEventEnabled(myevent)" color="primary" @click="addBookEventMenu(myevent)" :disable="!isEventEnabled(myevent)"
:label="$t('cal.booking')"> :label="$t('cal.booking')">
</q-btn> </q-btn>
<q-btn v-else :label="$t('dialog.ok')" color="primary" v-close-popup></q-btn> <q-btn v-else :label="$t('dialog.ok')" color="primary" v-close-popup></q-btn>
</q-card-actions> </q-card-actions>
@@ -123,7 +123,7 @@ rounded v-if="!myevent.nobookable && static_data.functionality.BOOKING_EVENTS"
<q-card v-if="addEvent" :style="`min-width: `+ tools.myheight_dialog() + `px;`"> <q-card v-if="addEvent" :style="`min-width: `+ tools.myheight_dialog() + `px;`">
<q-toolbar class="bg-primary text-white"> <q-toolbar class="bg-primary text-white">
<q-toolbar-title> <q-toolbar-title>
{{ addOrUpdateEvent }} {{ $t('cal.event') }} {{ addOrUpdateEvent() }} {{ $t('cal.event') }}
</q-toolbar-title> </q-toolbar-title>
<q-btn flat round color="white" icon="close" v-close-popup></q-btn> <q-btn flat round color="white" icon="close" v-close-popup></q-btn>
</q-toolbar> </q-toolbar>
@@ -134,25 +134,25 @@ rounded v-if="!myevent.nobookable && static_data.functionality.BOOKING_EVENTS"
class="q-gutter-sm"> class="q-gutter-sm">
<CMySelect <CMySelect
:label="$t('event.typol')" v-model:value="eventForm.typol" optval="typol_code" :label="$t('event.typol')" v-model:value="eventForm.typol" optval="typol_code"
optlab="label" optlab="label"
:options="calendarStore.disciplines" :useinput="false"> :options="globalStore.disciplines" :useinput="false">
</CMySelect> </CMySelect>
<div> <div>
<q-input <q-input
color="grey-1" v-model="eventForm.short_tit" autofocus color="grey-1" v-model="eventForm.short_tit" autofocus
debounce="1000" debounce="1000"
:input-style="`background-color: ${eventForm.bgcolor} !important; color: white !important; font-weight: bold; `" :input-style="`background-color: ${eventForm.bgcolor} !important; color: white !important; font-weight: bold; `"
borderless rounded dense :label="$t('event.short_tit')" borderless rounded dense :label="$t('event.short_tit')"
></q-input> ></q-input>
<q-input <q-input
color="grey-1" v-model="eventForm.title" autofocus color="grey-1" v-model="eventForm.title" autofocus
debounce="1000" debounce="1000"
:input-style="`background-color: ${eventForm.bgcolor} !important; color: white !important; font-weight: bold; `" :input-style="`background-color: ${eventForm.bgcolor} !important; color: white !important; font-weight: bold; `"
borderless rounded dense :label="$t('event.title')" borderless rounded dense :label="$t('event.title')"
:rules="[v => v && v.length > 0 || $t('event.notempty')]"></q-input> :rules="[v => v && v.length > 0 || $t('event.notempty')]"></q-input>
</div> </div>
@@ -177,11 +177,11 @@ color="grey-1" v-model="eventForm.title" autofocus
<div class="q-gutter-sm myflex"> <div class="q-gutter-sm myflex">
<q-input <q-input
class="myflex" dense v-model="eventForm.img" class="myflex" dense v-model="eventForm.img"
:label="$t('event.img')"></q-input> :label="$t('event.img')"></q-input>
<q-input <q-input
class="myflex" dense v-model="eventForm.img_small" class="myflex" dense v-model="eventForm.img_small"
:label="$t('event.img_small')"></q-input> :label="$t('event.img_small')"></q-input>
</div> </div>
<div class="q-gutter-sm myflex"> <div class="q-gutter-sm myflex">
@@ -203,8 +203,8 @@ class="myflex" dense v-model="eventForm.img_small"
</template> </template>
</q-input> </q-input>
<q-input <q-input
class="myflex" dense v-model="eventForm.icon" class="myflex" dense v-model="eventForm.icon"
:label="$t('event.icon')"></q-input> :label="$t('event.icon')"></q-input>
</div> </div>
<CMyEditor v-model:value="eventForm.details" :showButtons="false"> <CMyEditor v-model:value="eventForm.details" :showButtons="false">
@@ -238,58 +238,58 @@ class="myflex" dense v-model="eventForm.icon"
<div class="q-gutter-sm myflex"> <div class="q-gutter-sm myflex">
<CMySelect <CMySelect
myclass="myflex" :label="$t('cal.teacher') + ' 1°'" myclass="myflex" :label="$t('cal.teacher') + ' 1°'"
v-model:value="eventForm.teacher" v-model:value="eventForm.teacher"
optval="username" :optlab="(item) => item.name + ' ' + item.surname" optval="username" :optlab="(item) => item.name + ' ' + item.surname"
:options="calendarStore.operators" :useinput="false"> :options="calendarStore.operators" :useinput="false">
</CMySelect> </CMySelect>
<CMySelect <CMySelect
myclass="myflex" :label="$t('cal.teacher') + ' 2°'" myclass="myflex" :label="$t('cal.teacher') + ' 2°'"
v-model:value="eventForm.teacher2" v-model:value="eventForm.teacher2"
optval="username" :optlab="(item) => item.name + ' ' + item.surname" optval="username" :optlab="(item) => item.name + ' ' + item.surname"
:options="calendarStore.operators" :useinput="false"> :options="calendarStore.operators" :useinput="false">
</CMySelect> </CMySelect>
<CMySelect <CMySelect
myclass="myflex" :label="$t('cal.teacher') + ' 3°'" myclass="myflex" :label="$t('cal.teacher') + ' 3°'"
v-model:value="eventForm.teacher3" v-model:value="eventForm.teacher3"
optval="username" :optlab="(item) => item.name + ' ' + item.surname" optval="username" :optlab="(item) => item.name + ' ' + item.surname"
:options="calendarStore.operators" :useinput="false"> :options="calendarStore.operators" :useinput="false">
</CMySelect> </CMySelect>
<CMySelect <CMySelect
myclass="myflex" :label="$t('cal.teacher') + ' 4°'" myclass="myflex" :label="$t('cal.teacher') + ' 4°'"
v-model:value="eventForm.teacher4" v-model:value="eventForm.teacher4"
optval="username" :optlab="(item) => item.name + ' ' + item.surname" optval="username" :optlab="(item) => item.name + ' ' + item.surname"
:options="calendarStore.operators" :useinput="false"> :options="calendarStore.operators" :useinput="false">
</CMySelect> </CMySelect>
<CMySelect <CMySelect
:label="$t('cal.where')" v-model:value="eventForm.wherecode" optval="code" :label="$t('cal.where')" v-model:value="eventForm.wherecode" optval="code"
optlab="placename" optlab="placename"
:options="calendarStore.wheres" :useinput="false"> :options="calendarStore.wheres" :useinput="false">
</CMySelect> </CMySelect>
</div> </div>
<div class="q-gutter-sm myflex wrap"> <div class="q-gutter-sm myflex wrap">
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.internal" class="myflex wrap" dense v-model="eventForm.internal"
:label="$t('event.internal')"></q-checkbox> :label="$t('event.internal')"></q-checkbox>
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.lunchAvailable" class="myflex wrap" dense v-model="eventForm.lunchAvailable"
:label="$t('event.lunchAvailable')"></q-checkbox> :label="$t('event.lunchAvailable')"></q-checkbox>
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.dinnerAvailable" class="myflex wrap" dense v-model="eventForm.dinnerAvailable"
:label="$t('event.dinnerAvailable')"></q-checkbox> :label="$t('event.dinnerAvailable')"></q-checkbox>
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.dinnerSharedAvailable" class="myflex wrap" dense v-model="eventForm.dinnerSharedAvailable"
:label="$t('event.dinnerSharedAvailable')"></q-checkbox> :label="$t('event.dinnerSharedAvailable')"></q-checkbox>
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.news" class="myflex wrap" dense v-model="eventForm.news"
:label="$t('event.news')"></q-checkbox> :label="$t('event.news')"></q-checkbox>
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.nobookable" class="myflex wrap" dense v-model="eventForm.nobookable"
:label="$t('event.nobookable')"></q-checkbox> :label="$t('event.nobookable')"></q-checkbox>
<q-checkbox <q-checkbox
class="myflex wrap" dense v-model="eventForm.canceled" class="myflex wrap" dense v-model="eventForm.canceled"
:label="$t('event.canceled')"></q-checkbox> :label="$t('event.canceled')"></q-checkbox>
</div> </div>
<div class="q-gutter-sm row items-start"> <div class="q-gutter-sm row items-start">
@@ -300,42 +300,42 @@ class="myflex wrap" dense v-model="eventForm.canceled"
<div class="q-gutter-sm myflex"> <div class="q-gutter-sm myflex">
<CMySelect <CMySelect
:label="$t('event.contribtype')" v-model:value="eventForm.contribtype" :label="$t('event.contribtype')" v-model:value="eventForm.contribtype"
optval="_id" optlab="label" optval="_id" optlab="label"
:useinput="false" :useinput="false"
:newvaluefunc="createContribType" :options="calendarStore.contribtype"> :newvaluefunc="createContribType" :options="calendarStore.contribtype">
</CMySelect> </CMySelect>
<div v-if="isShowPrice(eventForm)"> <div v-if="isShowPrice(eventForm)">
<q-input <q-input
dense type="number" v-model="eventForm.price" dense type="number" v-model="eventForm.price"
:label="$t('event.price')"></q-input> :label="$t('event.price')"></q-input>
<q-input <q-input
dense v-model="eventForm.infoafterprice" dense v-model="eventForm.infoafterprice"
:label="$t('event.infoafterprice')"></q-input> :label="$t('event.infoafterprice')"></q-input>
</div> </div>
</div> </div>
<div class="q-gutter-sm myflex"> <div class="q-gutter-sm myflex">
<CMySelect <CMySelect
myclass="myflex" :label="$t('event.pagefooter') + ' 1°'" myclass="myflex" :label="$t('event.pagefooter') + ' 1°'"
v-model:value="eventForm.pagefooter" v-model:value="eventForm.pagefooter"
style="min-width: 300px;" style="min-width: 300px;"
:multiple="true" :multiple="true"
optval="path" optlab="title" optval="path" optlab="title"
:options="calendarStore.internalpages" :useinput="false"> :options="calendarStore.internalpages" :useinput="false">
</CMySelect> </CMySelect>
<br> <br>
<q-input <q-input
class="myflex" dense v-model="eventForm.linkpage" class="myflex" dense v-model="eventForm.linkpage"
:label="$t('event.linkpage')"></q-input> :label="$t('event.linkpage')"></q-input>
<q-input <q-input
class="myflex" dense v-model="eventForm.linkpdf" class="myflex" dense v-model="eventForm.linkpdf"
:label="$t('event.linkpdf')"></q-input> :label="$t('event.linkpdf')"></q-input>
<q-input <q-input
class="myflex" dense v-model="eventForm.facebook" class="myflex" dense v-model="eventForm.facebook"
:label="$t('event.facebook')"></q-input> :label="$t('event.facebook')"></q-input>
</div> </div>
</q-tab-panel> </q-tab-panel>
</q-tab-panels> </q-tab-panels>
@@ -360,10 +360,10 @@ class="myflex" dense v-model="eventForm.facebook"
<q-card-section class="inset-shadow"> <q-card-section class="inset-shadow">
<q-img <q-img
:src="getImgEvent(myevent)" :src="getImgEvent(myevent)"
class="absolute-top" class="absolute-top"
style="height: 200px;" style="height: 200px;"
:alt="myevent.title"> :alt="myevent.title">
</q-img> </q-img>
<div style="margin-top: 150px;"> <div style="margin-top: 150px;">
@@ -375,7 +375,7 @@ class="myflex" dense v-model="eventForm.facebook"
</q-chip> </q-chip>
<div v-if="myevent.dateTimeStart" class="cal__when"> <div v-if="myevent.dateTimeStart" class="cal__when">
<span class="cal__where-title">{{ $t('cal.when') }}: <span class="cal__where-title">{{ $t('cal.when') }}:
<span v-html="tools.getstrDateTimeEvent(mythis, myevent, true)"></span> <span v-html="tools.getstrDateTimeEvent($t, myevent, true)"></span>
</span> </span>
</div> </div>
<div class="q-pa-xs"> <div class="q-pa-xs">
@@ -390,8 +390,8 @@ class="myflex" dense v-model="eventForm.facebook"
</q-checkbox> </q-checkbox>
<div <div
v-if="bookEventForm.booked" class="q-gutter-xs q-mx-xs" v-if="bookEventForm.booked" class="q-gutter-xs q-mx-xs"
style="min-width: 140px;"> style="min-width: 140px;">
<q-select <q-select
rounded outlined v-model="bookEventForm.numpeople" rounded outlined v-model="bookEventForm.numpeople"
:options="tools.SelectListNumPeople" :options="tools.SelectListNumPeople"
@@ -403,8 +403,8 @@ v-if="bookEventForm.booked" class="q-gutter-xs q-mx-xs"
<div style="display: inline-flex; " class="q-px-xs centermydiv"> <div style="display: inline-flex; " class="q-px-xs centermydiv">
<div class="itemprenota">{{ $t('cal.selnumpeopleLunch') }}</div> <div class="itemprenota">{{ $t('cal.selnumpeopleLunch') }}</div>
<div <div
class="q-gutter-xs" class="q-gutter-xs"
style="min-width: 140px; margin-left: 10px;"> style="min-width: 140px; margin-left: 10px;">
<q-select <q-select
rounded outlined v-model="bookEventForm.numpeopleLunch" rounded outlined v-model="bookEventForm.numpeopleLunch"
:options="tools.SelectListNumPeople" :options="tools.SelectListNumPeople"
@@ -427,8 +427,8 @@ class="q-gutter-xs"
</div> </div>
</div> </div>
<div <div
v-if="myevent.dinnerSharedAvailable" class="q-px-xs centermydiv" v-if="myevent.dinnerSharedAvailable" class="q-px-xs centermydiv"
style="display: inline-flex; "> style="display: inline-flex; ">
<div style="display: inline-flex; " class="q-px-xs centermydiv"> <div style="display: inline-flex; " class="q-px-xs centermydiv">
<div class="itemprenota">{{ $t('cal.selnumpeopleDinnerShared') }}</div> <div class="itemprenota">{{ $t('cal.selnumpeopleDinnerShared') }}</div>
<div class="q-gutter-xs " style="min-width: 180px; margin-left: 10px;"> <div class="q-gutter-xs " style="min-width: 180px; margin-left: 10px;">
@@ -442,9 +442,9 @@ v-if="myevent.dinnerSharedAvailable" class="q-px-xs centermydiv"
</div> </div>
<q-input <q-input
v-model="bookEventForm.msgbooking" :label="$t('cal.writemsg')+':'" v-model="bookEventForm.msgbooking" :label="$t('cal.writemsg')+':'"
type="textarea" debounce="500" type="textarea" debounce="500"
input-class="myinput-area" input-class="myinput-area"
> >
</q-input> </q-input>
</q-card-section> </q-card-section>
@@ -455,23 +455,23 @@ v-model="bookEventForm.msgbooking" :label="$t('cal.writemsg')+':'"
<p v-if="myevent.linkpdf" style="margin-top: 10px; text-align: center"> <p v-if="myevent.linkpdf" style="margin-top: 10px; text-align: center">
<q-btn <q-btn
size="md" type="a" :href="`../../statics/` + myevent.linkpdf" size="md" type="a" :href="myevent.linkpdf"
target="_blank" rounded color="primary" icon="info" :label="$t('cal.showpdf')"> target="_blank" rounded color="primary" icon="info" :label="$t('cal.showpdf')">
</q-btn> </q-btn>
</p> </p>
</div> </div>
</q-card-section> </q-card-section>
<q-card-actions align="right"> <q-card-actions align="right">
<q-btn <q-btn
v-if="bookEventpage.state === EState.Modifying" flat :label="$t('cal.cancelbooking')" v-if="bookEventpage.state === EState.Modifying" flat :label="$t('cal.cancelbooking')"
color="negative" color="negative"
@click="tools.CancelBookingEvent($q, myevent, bookEventForm._id, true)"></q-btn> @click="tools.CancelBookingEvent($q, myevent, bookEventForm._id, true)"></q-btn>
<q-btn <q-btn
v-if="checkseinviaMsg" flat :label="$t('dialog.sendonlymsg')" color="primary" v-if="checkseinviaMsg" flat :label="$t('dialog.sendonlymsg')" color="primary"
@click="sendMsg(myevent)"></q-btn> @click="sendMsg(myevent)"></q-btn>
<q-btn <q-btn
v-else :label="getTitleBtnBooking" color="primary" @click="saveBookEvent(myevent)" v-else :label="getTitleBtnBooking" color="primary" @click="saveBookEvent(myevent)"
:disable="!(bookEventpage.state === EState.Creating || hasModifiedBooking)"></q-btn> :disable="!(bookEventpage.state === EState.Creating || hasModifiedBooking)"></q-btn>
<q-btn flat :label="$t('dialog.cancel')" color="primary" v-close-popup></q-btn> <q-btn flat :label="$t('dialog.cancel')" color="primary" v-close-popup></q-btn>
@@ -490,10 +490,10 @@ v-else :label="getTitleBtnBooking" color="primary" @click="saveBookEvent(myevent
<q-card-section class="inset-shadow"> <q-card-section class="inset-shadow">
<q-img <q-img
:src="getImgEvent(myevent)" :src="getImgEvent(myevent)"
class="absolute-top" class="absolute-top"
style="height: 150px;" style="height: 150px;"
:alt="myevent.title"> :alt="myevent.title">
</q-img> </q-img>
<div style="margin-top: 150px;"> <div style="margin-top: 150px;">
@@ -505,16 +505,16 @@ v-else :label="getTitleBtnBooking" color="primary" @click="saveBookEvent(myevent
</q-chip> </q-chip>
<div v-if="myevent.dateTimeStart" class="cal__when"> <div v-if="myevent.dateTimeStart" class="cal__when">
<span class="cal__where-title">{{ $t('cal.when') }}: <span class="cal__where-title">{{ $t('cal.when') }}:
<span v-html="tools.getstrDateTimeEvent(mythis, myevent, true)"></span> <span v-html="tools.getstrDateTimeEvent($t, myevent, true)"></span>
</span> </span>
</div> </div>
<div class="q-pa-xs"> <div class="q-pa-xs">
<q-card class="text-white windowcol"> <q-card class="text-white windowcol">
<q-card-section> <q-card-section>
<q-input <q-input
v-model="askInfoForm.message" :label="$t('cal.writemsg')+':'" v-model="askInfoForm.message" :label="$t('cal.writemsg')+':'"
autofocus debounce="500" type="textarea" autofocus debounce="500" type="textarea"
input-class="myinput-area"> input-class="myinput-area">
</q-input> </q-input>
</q-card-section> </q-card-section>
</q-card> </q-card>
@@ -524,8 +524,8 @@ v-model="askInfoForm.message" :label="$t('cal.writemsg')+':'"
</q-card-section> </q-card-section>
<q-card-actions align="right"> <q-card-actions align="right">
<q-btn <q-btn
flat :label="$t('dialog.sendmsg')" color="primary" flat :label="$t('dialog.sendmsg')" color="primary"
@click="sendMsg(myevent)"></q-btn> @click="sendMsg(myevent)"></q-btn>
<q-btn flat :label="$t('dialog.cancel')" color="primary" v-close-popup></q-btn> <q-btn flat :label="$t('dialog.cancel')" color="primary" v-close-popup></q-btn>
</q-card-actions> </q-card-actions>
</q-card> </q-card>
@@ -534,7 +534,7 @@ flat :label="$t('dialog.sendmsg')" color="primary"
<!--v-touch-swipe.mouse.left.right="handleSwipe" --> <!--v-touch-swipe.mouse.left.right="handleSwipe" -->
<!-- the calendar --> <!-- the calendar -->
<q-page v-if="visuAllCal && showfirstN === 0" class="column" style="min-height: 200px !important;"> <q-page v-if="visuAllCal() && showfirstN === 0" class="column" style="min-height: 200px !important;">
<div> <div>
<q-toolbar class="mytoolbar"> <q-toolbar class="mytoolbar">
@@ -545,14 +545,16 @@ flat :label="$t('dialog.sendmsg')" color="primary"
<q-separator vertical/> <q-separator vertical/>
<!--<q-btn label="GG" color="primary" @click="calendarView = 'day'"/> <!--<q-btn label="GG" color="primary" @click="calendarView = 'day'"/>
<q-btn label="Set" color="primary" @click="calendarView = 'week'"/>--> <q-btn label="Set" color="primary" @click="calendarView = 'week'"/>-->
<!--
<q-btn label="5 GG" color="primary" @click="calendarView = '5day-agenda'"/> <q-btn label="5 GG" color="primary" @click="calendarView = '5day-agenda'"/>
<q-btn label="Sett" color="primary" @click="calendarView = 'week-agenda'"/> <q-btn label="Sett" color="primary" @click="calendarView = 'week-agenda'"/>
<q-btn label="Mese" color="primary" @click="calendarView = 'month'"/> <q-btn label="Mese" color="primary" @click="calendarView = 'month'"/>
-->
<q-space/> <q-space/>
</q-toolbar> </q-toolbar>
<q-separator/> <q-separator/>
<div class="text-center"><span <div class="text-center"><span
class="q-mr-xl q-toolbar__title nowrap text-blue">{{ title_cal }}</span> class="q-mr-xl q-toolbar__title nowrap text-blue">{{ title_cal() }}</span>
</div> </div>
<!-- <!--
@@ -561,8 +563,8 @@ flat :label="$t('dialog.sendmsg')" color="primary"
--> -->
<q-calendar <q-calendar-month
v-if="visuAllCal" v-if="visuAllCal()"
ref="calendar" ref="calendar"
class="calendar" class="calendar"
:key="keyValue" :key="keyValue"
@@ -577,8 +579,8 @@ flat :label="$t('dialog.sendmsg')" color="primary"
:view="calendarView" :view="calendarView"
:weekdays="weekdays" :weekdays="weekdays"
:interval-minutes="60 * calendarStore.intervalRangeStep" :interval-minutes="60 * calendarStore.intervalRangeStep"
:interval-start="calendarStore.intervalStart" :interval-start="calendarStore.intervalStart()"
:interval-count="calendarStore.intervalCount" :interval-count="calendarStore.intervalCount()"
:hour24-format="calendarStore.hour24Format" :hour24-format="calendarStore.hour24Format"
:short-month-label="calendarStore.shortMonthLabel" :short-month-label="calendarStore.shortMonthLabel"
:show-day-of-year-label="calendarStore.showDayOfYearLabel" :show-day-of-year-label="calendarStore.showDayOfYearLabel"
@@ -589,48 +591,49 @@ flat :label="$t('dialog.sendmsg')" color="primary"
:interval-height="calendarStore.intervalHeight" :interval-height="calendarStore.intervalHeight"
:resource-height="calendarStore.resourceHeight" :resource-height="calendarStore.resourceHeight"
:resource-width="calendarStore.resourceWidth" :resource-width="calendarStore.resourceWidth"
:day-height="dayHeight" :day-height="dayHeight()"
:show-month-label="calendarStore.showMonthLabel" :show-month-label="calendarStore.showMonthLabel"
:show-work-weeks="calendarStore.showWorkWeeks" :show-work-weeks="calendarStore.showWorkWeeks"
:resources="resources"
@change="onChanged" @change="onChanged"
@moved="onMoved" @moved="onMoved"
@click:date="onDateChanged" @click-date="onDateChanged"
@click:interval="addEventMenu" @click-interval="addEventMenu"
@click:time="addEventMenu" @click-time="addEventMenu"
@click:day="addEventMenu" @click-day="addEventMenu"
@click:week="addEventMenu" @click-workweek="addEventMenu"
@click:resource="resourceClicked" @click-week="addEventMenu"
@click:resource:day="resourceDayClicked"
dayPadding="35px 2px" dayPadding="35px 2px"
> >
<template #day="{ timestamp }"> <template #day="{ scope: { timestamp } }">
<template v-for="(event, index) in getEvents(timestamp.date)"> <template v-for="(event, index) in getEvents(timestamp.date)" :key="index">
<q-badge <q-badge
style="width: 100%; cursor: pointer;" style="width: 100%; cursor: pointer;"
:class="badgeClasses(event, 'day')" :class="badgeClasses(event, 'day')"
:style="badgeStyles(event, 'day')" :style="badgeStyles(event, 'day')"
@click.stop.prevent="showEvent(event)" @click.stop.prevent="showEvent(event)"
:draggable="tools.isManager()" :draggable="tools.isManager()">
<!--
@dragstart.native="(e) => onDragStart(e, event)" @dragstart.native="(e) => onDragStart(e, event)"
@dragend.native="(e) => onDragEnd(e, event)" @dragend.native="(e) => onDragEnd(e, event)"
@dragenter.native="(e) => onDragEnter(e, event)" @dragenter.native="(e) => onDragEnter(e, event)"
@touchmove.native="(e) => {}" @touchmove.native="(e) => {}"-->
>
<span class="">{{ getTitleEv(event) }}</span> <span class="">{{ getTitleEv(event) }}</span>
</q-badge> </q-badge>
<div class="text-center"><img <div
:src="getImgEvent(event)" class="text-center">
class="text-center listaev__tdimg_small" :alt="event.title"> <img
:src="getImgEvent(event)"
class="text-center listaev__tdimg_small" :alt="event.title">
</div> </div>
</template> </template>
</template> </template>
<template #day-header="{ timestamp }"> <template #day-header="{ scope: { timestamp } }">
<div class="row justify-center"> <div class="row justify-center">
<template v-for="(event, index) in eventsMap[timestamp.date]"> <template v-for="(event, index) in eventsMap[timestamp.date]" :key="index">
<q-badge <q-badge
class="q-ma-xs" class="q-ma-xs"
:class="badgeClasses(event, 'header')" :class="badgeClasses(event, 'header')"
@@ -640,15 +643,15 @@ flat :label="$t('dialog.sendmsg')" color="primary"
</template> </template>
</div> </div>
</template> </template>
<template #day-body="{ timestamp, timeStartPos, timeDurationHeight }"> <template #day-body="{ scope: { timestamp, timeStartPos, timeDurationHeight } }">
<template v-for="(event, index) in getEvents(timestamp.date)"> <template v-for="(event, index) in getEvents(timestamp.date)" :key="index">
<div <div
:label="tools.getstrTime(event.dateTimeStart)" :label="tools.getstrTime(event.dateTimeStart)"
class="justify-start q-ma-sm shadow-5 bg-blue-grey-6" class="justify-start q-ma-sm shadow-5 bg-blue-grey-6"
> >
<div <div
v-if="getImgEvent(event)" class="row justify-center" v-if="getImgEvent(event)" class="row justify-center"
style="margin-top: 30px; width: 100%;"> style="margin-top: 30px; width: 100%;">
<q-avatar <q-avatar
style="margin-top: -25px; margin-bottom: 10px; font-size: 60px; max-height: 50px;"> style="margin-top: -25px; margin-bottom: 10px; font-size: 60px; max-height: 50px;">
<img :src="getImgEvent(event)" style="border: #a4edf6 solid 5px;"> <img :src="getImgEvent(event)" style="border: #a4edf6 solid 5px;">
@@ -658,8 +661,8 @@ v-if="getImgEvent(event)" class="row justify-center"
<strong>{{ tools.getstrTime(event.dateTimeStart) }}</strong> <strong>{{ tools.getstrTime(event.dateTimeStart) }}</strong>
</div> </div>
<div <div
v-if="getTitleEv(event)" class="col-12 q-px-xs text-white" v-if="getTitleEv(event)" class="col-12 q-px-xs text-white"
style="font-size: 0.75rem;"> style="font-size: 0.75rem;">
<q-badge <q-badge
:key="index" :key="index"
multi-line multi-line
@@ -667,12 +670,14 @@ v-if="getTitleEv(event)" class="col-12 q-px-xs text-white"
:class="badgeClasses(event, 'body')" :class="badgeClasses(event, 'body')"
:style="badgeStyles(event, 'body', timeStartPos, timeDurationHeight)" :style="badgeStyles(event, 'body', timeStartPos, timeDurationHeight)"
@click.stop.prevent="showEvent(event)" @click.stop.prevent="showEvent(event)"
:draggable="tools.isManager()" :draggable="tools.isManager()">
<!--
@dragstart.native="(e) => onDragStart(e, event)" @dragstart.native="(e) => onDragStart(e, event)"
@dragend.native="(e) => onDragEnd(e, event)" @dragend.native="(e) => onDragEnd(e, event)"
@dragenter.native="(e) => onDragEnter(e, event)" @dragenter.native="(e) => onDragEnter(e, event)"
@touchmove.native="(e) => {}" @touchmove.native="(e) => {}"-->
>
<span class="">{{ getTitleEv(event) }}</span> <br> <span class="">{{ getTitleEv(event) }}</span> <br>
</q-badge> </q-badge>
@@ -702,7 +707,7 @@ v-if="getTitleEv(event)" class="col-12 q-px-xs text-white"
</q-badge> --> </q-badge> -->
</template> </template>
</template> </template>
</q-calendar> </q-calendar-month>
</div> </div>
</q-page> </q-page>
@@ -718,24 +723,24 @@ v-if="getTitleEv(event)" class="col-12 q-px-xs text-white"
<q-markup-table wrap-cells bordered separator="horizontal" class="listaev__table"> <q-markup-table wrap-cells bordered separator="horizontal" class="listaev__table">
<tbody> <tbody>
<tr v-for="(event, index) in getEventList()" class="listaev listaev__table"> <tr v-for="(event, index) in getEventList()" class="listaev listaev__table" :key="index">
<td :class="clEvent(event)"> <td :class="clEvent(event)">
<div class="listaev__align_chips"> <div class="listaev__align_chips">
<img <img
:src="getImgEvent(event)" :src="getImgEvent(event)"
@click="selectEvent(event)" @click="selectEvent(event)"
class="text-left padding_cell listaev__tdimg listaev__img cursor-pointer q-mx-sm" class="text-left padding_cell listaev__tdimg listaev__img cursor-pointer q-mx-sm"
:style="getStyleByEvent(event, event === myevent)" :style="getStyleByEvent(event, event === myevent)"
:alt="event.title"> :alt="event.title">
<q-chip <q-chip
dense v-if="isAlreadyBooked(event)" class="cltexth4 chipbooked shadow-5 q-mb-md" dense v-if="isAlreadyBooked(event)" class="cltexth4 chipbooked shadow-5 q-mb-md"
color="green" text-color="white" color="green" text-color="white"
icon="event_available">{{ $t('cal.booked') }} icon="event_available">{{ $t('cal.booked') }}
</q-chip> </q-chip>
<q-chip <q-chip
v-if="event === myevent && !displayEvent && editable" v-if="event === myevent && !displayEvent && editable"
class="text-center shadow-5 glossy bg-blue chipmodif"> class="text-center shadow-5 glossy bg-blue chipmodif">
<q-btn v-if="editable" flat round color="white" icon="fas fa-copy"> <q-btn v-if="editable" flat round color="white" icon="fas fa-copy">
<q-menu <q-menu
@@ -755,27 +760,27 @@ v-if="event === myevent && !displayEvent && editable"
</q-menu> </q-menu>
</q-btn> </q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="delete" v-close-popup v-if="editable" flat round color="white" icon="delete" v-close-popup
@click="deleteEvent(myevent)"></q-btn> @click="deleteEvent(myevent)"></q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="edit" v-close-popup v-if="editable" flat round color="white" icon="edit" v-close-popup
@click="editEvent(myevent)"></q-btn> @click="editEvent(myevent)"></q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="cancel" v-if="editable" flat round color="white" icon="cancel"
@click="selectEvent(null)"></q-btn> @click="selectEvent(null)"></q-btn>
</q-chip> </q-chip>
<q-chip <q-chip
v-if="event.news" class="cltexth4 chipnews shadow-5 glossy text-right" v-if="event.news" class="cltexth4 chipnews shadow-5 glossy text-right"
color="red" color="red"
text-color="white" icon-right="star" icon="star" dense text-color="white" icon-right="star" icon="star" dense
style=""> style="">
{{ $t('event.news') }} {{ $t('event.news') }}
</q-chip> </q-chip>
</div> </div>
<div class="listaev__date listaev__align_center_mobile text-center"> <div class="listaev__date listaev__align_center_mobile text-center">
<span v-html="tools.getstrDateTimeEvent(mythis, event, true)"></span> <span v-html="tools.getstrDateTimeEvent($t, event, true)"></span>
</div> </div>
<div class="listaev__align_center_mobile"> <div class="listaev__align_center_mobile">
@@ -789,15 +794,15 @@ v-if="event.news" class="cltexth4 chipnews shadow-5 glossy text-right"
<div class="text-center"> <div class="text-center">
<!-- Se c'è un link, allora --> <!-- Se c'è un link, allora -->
<q-btn <q-btn
size="md" type="a" size="md" type="a"
class="text-center boldhigh" class="text-center boldhigh"
:to="`/event/${event.typol}/${event._id}`" :to="`/event/${event.typol}/${event._id}`"
target="_blank" target="_blank"
:style="`background-color: ${event.bgcolor} !important; color: white !important;`" :style="`background-color: ${event.bgcolor} !important; color: white !important;`"
ripple ripple
rounded rounded
:label="getTitleEv(event)" :label="getTitleEv(event)"
:color="event.bgcolor" text-color="white" glossy> :color="event.bgcolor" text-color="white" glossy>
</q-btn> </q-btn>
<!--<div v-if="tools.isMobile()" class="cltexth3 text-center"--> <!--<div v-if="tools.isMobile()" class="cltexth3 text-center"-->
@@ -852,8 +857,8 @@ size="md" type="a"
</span> </span>
<q-chip <q-chip
v-if="event.price && isShowPrice(event)" class="glossy" color="orange" v-if="event.price && isShowPrice(event)" class="glossy" color="orange"
text-color="white" icon-right="star"> text-color="white" icon-right="star">
<span class="cal__quota-content">{{ getPrice(event) }}</span> <span class="cal__quota-content">{{ getPrice(event) }}</span>
</q-chip> </q-chip>
</div> </div>
@@ -861,24 +866,24 @@ v-if="event.price && isShowPrice(event)" class="glossy" color="orange"
<div class="row centeritems"> <div class="row centeritems">
<q-btn <q-btn
v-if="event.linkpdf" size="md" type="a" v-if="event.linkpdf" size="md" type="a"
:href="`../../statics/` + event.linkpdf" :href="event.linkpdf"
target="_blank" rounded color="primary" icon="info" target="_blank" rounded color="primary" icon="info"
class="q-ma-sm" class="q-ma-sm"
:label="$t('cal.showpdf')"> :label="$t('cal.showpdf')">
</q-btn> </q-btn>
<q-btn <q-btn
rounded rounded
class="q-ma-sm" class="q-ma-sm"
color="primary" color="primary"
:to="`/event/${event.typol}/${event._id}`" :to="`/event/${event.typol}/${event._id}`"
:label="$t('event.openpage')"> :label="$t('event.openpage')">
</q-btn> </q-btn>
<q-btn <q-btn
rounded outline class="q-ma-sm" rounded outline class="q-ma-sm"
color="primary" @click="askForInfoEventMenu(event)" color="primary" @click="askForInfoEventMenu(event)"
:label="$t('event.askinfo')"> :label="$t('event.askinfo')">
</q-btn> </q-btn>
<!--<q-btn rounded outline class="q-ma-sm" <!--<q-btn rounded outline class="q-ma-sm"
v-if="!event.nobookable && !isAlreadyBooked(event) && static_data.functionality.BOOKING_EVENTS" v-if="!event.nobookable && !isAlreadyBooked(event) && static_data.functionality.BOOKING_EVENTS"
@@ -886,11 +891,11 @@ rounded outline class="q-ma-sm"
:label="$t('cal.booking')" :disable="!isEventEnabled(event)"> :label="$t('cal.booking')" :disable="!isEventEnabled(event)">
</q-btn>--> </q-btn>-->
<q-btn <q-btn
rounded outline class="q-ma-sm" rounded outline class="q-ma-sm"
v-if="!event.nobookable && isAlreadyBooked(event) && static_data.functionality.BOOKING_EVENTS" v-if="!event.nobookable && isAlreadyBooked(event) && static_data.functionality.BOOKING_EVENTS"
text-color="red" text-color="red"
@click.native="EditBookEvent(event)" @click="EditBookEvent(event)"
:label="$t('cal.modifybooking')"> :label="$t('cal.modifybooking')">
</q-btn> </q-btn>
<!-- <!--
<q-btn push rounded v-if="!event.nobookable && isAlreadyBooked(event)" color="positive" @click="BookEvent(event)" <q-btn push rounded v-if="!event.nobookable && isAlreadyBooked(event)" color="positive" @click="BookEvent(event)"
@@ -907,8 +912,8 @@ rounded outline class="q-ma-sm"
<div class="q-ma-lg text-center"> <div class="q-ma-lg text-center">
<q-btn <q-btn
rounded type="a" to="/calendario-eventi" color="primary" icon="event" size="lg" rounded type="a" to="/calendario-eventi" color="primary" icon="event" size="lg"
:label="$t('cal.showlastschedule')"> :label="$t('cal.showlastschedule')">
</q-btn> </q-btn>
</div> </div>
@@ -916,13 +921,13 @@ rounded type="a" to="/calendario-eventi" color="primary" icon="event" size="lg"
</div> </div>
<div v-else> <div v-else>
<CMySingleEvent <CMySingleEvent
:myevent="mysingleevent" calendarView="month" :iseditable="editable" :myevent="mysingleevent" calendarView="month" :iseditable="editable"
@duplicateEvent="duplicateEvent" @duplicateEvent="duplicateEvent"
@askForInfoEventMenu="askForInfoEventMenu" @askForInfoEventMenu="askForInfoEventMenu"
@deleteEvent="deleteEvent" @deleteEvent="deleteEvent"
@editEvent="editEvent" @editEvent="editEvent"
@addBookEventMenu="addBookEventMenu" @addBookEventMenu="addBookEventMenu"
@EditBookEvent="EditBookEvent"> @EditBookEvent="EditBookEvent">
</CMySingleEvent> </CMySingleEvent>
</div> </div>

2
src/components/CGridTableRec/CGridTableRec.ts
View File

@@ -642,7 +642,7 @@ export default defineComponent({
} }
function changeTable(mysel: any) { function changeTable(mysel: any) {
// console.log('changeTable') console.log('changeTable', tablesel.value)
if (tablesel.value === undefined || tablesel.value === '') if (tablesel.value === undefined || tablesel.value === '')
return return

2
src/components/CGridTableRec/CGridTableRec.vue
View File

@@ -97,7 +97,7 @@
<q-select <q-select
v-if="tablesList" v-if="tablesList"
:model-value="tablesel" v-model="tablesel"
rounded rounded
outlined outlined
dense dense

2
src/components/CMyFieldDb/CMyFieldDb.vue
View File

@@ -164,7 +164,7 @@
label="Ore" v-model:value="myvalue" label="Ore" v-model:value="myvalue"
optval="_id" optlab="label" optval="_id" optlab="label"
:useinput="false" :useinput="false"
o :options="tools.SelectHours"> :options="tools.SelectHours">
</CMySelect> </CMySelect>
</div> </div>
<div v-else-if="type === costanti.FieldType.binary"> <div v-else-if="type === costanti.FieldType.binary">

18
src/components/CMySelect/CMySelect.ts
View File

@@ -12,10 +12,6 @@ export default defineComponent({
required: true, required: true,
}, },
value: [String, Number, Array], value: [String, Number, Array],
type: {
type: Number,
required: true,
},
label: { label: {
type: String, type: String,
required: true, required: true,
@@ -25,10 +21,7 @@ export default defineComponent({
required: false, required: false,
default: '' default: ''
}, },
optlab: { optlab:[String, Function],
type: String,
required: true,
},
optval: { optval: {
type: String, type: String,
required: true, required: true,
@@ -50,11 +43,11 @@ export default defineComponent({
}, },
newvaluefunc: { newvaluefunc: {
type: Function, type: Function,
required: true, required: false,
}, },
funcgetvaluebyid: { funcgetvaluebyid: {
type: Function, type: Function,
required: true, required: false,
}, },
}, },
components: {}, components: {},
@@ -68,6 +61,7 @@ export default defineComponent({
function changeval(newval: any) { function changeval(newval: any) {
console.log('changeval', newval) console.log('changeval', newval)
myvalue.value = newval
emit('update:value', newval) emit('update:value', newval)
emit('changeval', newval) emit('changeval', newval)
} }
@@ -76,7 +70,9 @@ export default defineComponent({
const rec: any = props.options.find((myrec: any) => myrec[`${props.optval}`] === props.value) const rec: any = props.options.find((myrec: any) => myrec[`${props.optval}`] === props.value)
// console.log('rec', rec) // console.log('rec', rec)
if (!props.useinput) { if (!props.useinput) {
myvalue.value = props.value!.toString() if (props.value) {
myvalue.value = props.value.toString()
}
} else { } else {
if (rec) { if (rec) {
if (props.funcgetvaluebyid) if (props.funcgetvaluebyid)

8
src/components/CMySelect/CMySelect.vue
View File

@@ -6,7 +6,7 @@
rounded rounded
outlined outlined
:input-class="myclass" :input-class="myclass"
v-model="myvalue" :model-value="myvalue"
:use-input="useinput" :use-input="useinput"
input-debounce="0" input-debounce="0"
@new-value="newvaluefunc" @new-value="newvaluefunc"
@@ -14,7 +14,7 @@
:options="options" :options="options"
:option-value="optval" :option-value="optval"
:option-label="optlab" :option-label="optlab"
@input="changeval" @update:model-value="changeval"
:label="label" :label="label"
:dense="dense" :dense="dense"
> >
@@ -27,11 +27,11 @@
outlined outlined
:dense="dense" :dense="dense"
:input-class="myclass" :input-class="myclass"
v-model="myvalue" :model-value="myvalue"
:options="options" :options="options"
:option-value="optval" :option-value="optval"
:option-label="optlab" :option-label="optlab"
@input="changeval" @update:model-value="changeval"
:label="label" :label="label"
emit-value emit-value
map-options map-options

95
src/components/CMySingleEvent/CMySingleEvent.ts Executable file
View File

@@ -0,0 +1,95 @@
import { defineComponent, PropType, ref } from 'vue'
import { Logo } from '../../components/logo/index'
import { Footer } from '../../components/Footer/index'
import { tools } from '../../store/Modules/tools'
import { static_data } from '@src/db/static_data'
import { CImgText } from '../../components/CImgText/index'
import { CCard, CMyAvatar, CMyTeacher, CMyPage } from '@components'
import { IEvents, IOperators } from '@src/model'
import MixinEvents from '@/mixins/mixin-events'
export default defineComponent({
name: 'CMySingleEvent',
components: { Logo, Footer, CImgText, CCard, CMyPage, CMyAvatar, CMyTeacher },
props: {
myevent: {
type: Object as PropType<IEvents>,
required: true,
},
},
setup(props, { emit }) {
const selected = ref(false)
const { isShowPrice, getImgEvent, getStyleByEvent, isAlreadyBooked, getWhereIcon, getWhereName,
editable, getContribtypeById, getPrice, isEventEnabled, findEventIndex, UpdateDbByFields,
} = MixinEvents()
function selectEvent(eventparam: IEvents) {
selected.value = !selected.value
}
function getTextEvent(myevent: IEvents) {
if (myevent.bodytext === '') {
return myevent.details
} else {
return myevent.bodytext
}
}
function duplicateEvent(event: any, numgg: number) {
emit('duplicateEvent', event, numgg)
}
function askForInfoEventMenu(event: any) {
emit('askForInfoEventMenu', event)
}
function deleteEvent(event: any) {
emit('deleteEvent', event)
}
function editEvent(event: any) {
emit('editEvent', event)
}
function addBookEventMenu(event: any) {
emit('addBookEventMenu', event)
}
function EditBookEvent(event: any) {
emit('EditBookEvent', event)
}
return {
EditBookEvent,
addBookEventMenu,
editEvent,
deleteEvent,
askForInfoEventMenu,
duplicateEvent,
getTextEvent,
tools,
static_data,
selectEvent,
getImgEvent,
getStyleByEvent,
isAlreadyBooked,
getWhereIcon,
getWhereName,
editable,
getContribtypeById,
getPrice,
isShowPrice,
isEventEnabled,
findEventIndex,
UpdateDbByFields,
}
}
})

85
src/components/CMySingleEvent/CMySingleEvent.ts.off
View File

@@ -1,85 +0,0 @@
import Vue from 'vue'
import { Component, Prop, Watch } from 'vue-property-decorator'
import { CalendarStore, GlobalStore, UserStore } from '@store'
import { Logo } from '../../components/logo/index'
import { Footer } from '../../components/Footer/index'
import { tools } from '../../store/Modules/tools'
import { toolsext } from '@src/store/Modules/toolsext'
import { static_data } from '@src/db/static_data'
import { Screen } from 'quasar'
import { CImgText } from '../../components/CImgText/index'
import { CCard, CMyAvatar, CMyTeacher, CMyPage } from '@components'
import MixinOperator from '@src/mixins/mixin-operator'
import MixinEvents from '../../mixins/mixin-events'
import { IEvents } from '@src/model'
import MixinBase from '@src/mixins/mixin-base'
import MixinUsers from '@src/mixins/mixin-users'
@Component({
name: 'CMySingleEvent',
mixins: [MixinOperator, MixinBase, MixinEvents, MixinUsers],
components: { Logo, Footer, CImgText, CCard, CMyPage, CMyAvatar, CMyTeacher }
})
export default class CMySingleEvent extends MixinEvents {
@Prop({ required: true }) public myevent: IEvents
public $q
public $t
public selected: boolean = false
get mythis() {
return this
}
set mythis(aa) {
}
public selectEvent(eventparam: IEvents) {
this.selected = !this.selected
}
public getTextEvent(myevent: IEvents) {
if (myevent.bodytext === '') {
return myevent.details
} else {
return myevent.bodytext
}
}
public mounted() {
// console.log('MYSINGLEEVENT: myevent', this.myevent)
}
get static_data() {
return static_data
}
public duplicateEvent(event, numgg) {
this.$emit('duplicateEvent', event, numgg)
}
public askForInfoEventMenu(event) {
this.$emit('askForInfoEventMenu', event)
}
public deleteEvent(event) {
this.$emit('deleteEvent', event)
}
public editEvent(event) {
this.$emit('editEvent', event)
}
public addBookEventMenu(event) {
this.$emit('addBookEventMenu', event)
}
public EditBookEvent(event) {
this.$emit('EditBookEvent', event)
}
}

106
src/components/CMySingleEvent/CMySingleEvent.vue.off2 → src/components/CMySingleEvent/CMySingleEvent.vue
View File

@@ -1,21 +1,21 @@
<template> <template>
<div> <div>
<CMyPage <CMyPage
v-if="myevent" :imgbackground="myevent.img" :title="myevent.title" keywords="" description="" v-if="myevent" :imgbackground="myevent.img" :title="myevent.title" keywords="" description=""
nofooter="true"> nofooter="true">
<div class="q-mx-md"> <div class="q-mx-md">
<div class="listaev__align_chips q-ma-md"> <div class="listaev__align_chips q-ma-md">
<img <img
:src="getImgEvent(myevent)" :src="getImgEvent(myevent)"
@click="selectEvent(myevent)" @click="selectEvent(myevent)"
class="text-left padding_cell listaev__tdimg listaev__singleevimg cursor-pointer" class="text-left padding_cell listaev__tdimg listaev__singleevimg cursor-pointer"
:style="getStyleByEvent(myevent, true)" :style="getStyleByEvent(myevent, true)"
:alt="myevent.title"> :alt="myevent.title">
<q-chip <q-chip
dense v-if="isAlreadyBooked(myevent)" class="cltexth4 chipbooked shadow-5 q-mb-md" dense v-if="isAlreadyBooked(myevent)" class="cltexth4 chipbooked shadow-5 q-mb-md"
color="green" text-color="white" color="green" text-color="white"
icon="event_available">{{ $t('cal.booked') }} icon="event_available">{{ $t('cal.booked') }}
</q-chip> </q-chip>
<div v-if="selected"> <div v-if="selected">
<q-chip v-if="editable" class="text-center shadow-5 glossy bg-blue chipmodif"> <q-chip v-if="editable" class="text-center shadow-5 glossy bg-blue chipmodif">
@@ -38,27 +38,27 @@ dense v-if="isAlreadyBooked(myevent)" class="cltexth4 chipbooked shadow-5 q-mb-m
</q-menu> </q-menu>
</q-btn> </q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="delete" v-close-popup v-if="editable" flat round color="white" icon="delete" v-close-popup
@click="deleteEvent(myevent)"></q-btn> @click="deleteEvent(myevent)"></q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="edit" v-close-popup v-if="editable" flat round color="white" icon="edit" v-close-popup
@click="editEvent(myevent)"></q-btn> @click="editEvent(myevent)"></q-btn>
<q-btn <q-btn
v-if="editable" flat round color="white" icon="cancel" v-if="editable" flat round color="white" icon="cancel"
@click="selectEvent(null)"></q-btn> @click="selectEvent(null)"></q-btn>
</q-chip> </q-chip>
</div> </div>
<q-chip <q-chip
v-if="myevent.news" class="cltexth4 chipnews shadow-5 glossy text-right" color="red" v-if="myevent.news" class="cltexth4 chipnews shadow-5 glossy text-right" color="red"
text-color="white" icon-right="star" icon="star" dense text-color="white" icon-right="star" icon="star" dense
style=""> style="">
{{ $t('event.news') }} {{ $t('event.news') }}
</q-chip> </q-chip>
</div> </div>
<div class="listaev__date listaev__align_center_mobile"> <div class="listaev__date listaev__align_center_mobile">
<span v-html="tools.getstrDateTimeEvent(mythis, myevent, true)"></span> <span v-html="tools.getstrDateTimeEvent($t, myevent, true)"></span>
</div> </div>
<div class="listaev__align_center_mobile"> <div class="listaev__align_center_mobile">
@@ -68,25 +68,25 @@ v-if="myevent.news" class="cltexth4 chipnews shadow-5 glossy text-right" color="
<div class="q-pa-sm q-gutter-md text-center"> <div class="q-pa-sm q-gutter-md text-center">
<!-- Se c'è un link, allora --> <!-- Se c'è un link, allora -->
<q-btn <q-btn
class="text-center boldhigh" v-if="myevent.linkpdf" size="md" type="a" class="text-center boldhigh" v-if="myevent.linkpdf" size="md" type="a"
:href="`../../public/` + myevent.linkpdf" :href="`../../public/` + myevent.linkpdf"
target="_blank" target="_blank"
ripple rounded :label="myevent.title" ripple rounded :label="myevent.title"
:color="myevent.bgcolor" text-color="white" glossy> :color="myevent.bgcolor" text-color="white" glossy>
</q-btn> </q-btn>
<!-- altrimenti mostra solo Chip --> <!-- altrimenti mostra solo Chip -->
<div <div
v-else-if="tools.isMobile()" class="cltexth3 text-center boldhigh" v-else-if="tools.isMobile()" class="cltexth3 text-center boldhigh"
:style="`background-color: ${myevent.bgcolor} !important; color: white !important;`"> :style="`background-color: ${myevent.bgcolor} !important; color: white !important;`">
{{ myevent.title }} {{ myevent.title }}
</div> </div>
<q-chip <q-chip
v-else class="cltexth3 text-center boldhigh" v-else class="cltexth3 text-center boldhigh"
icon="bookmark" icon="bookmark"
:style="`background-color: ${myevent.bgcolor} !important; color: white !important;`" :style="`background-color: ${myevent.bgcolor} !important; color: white !important;`"
text-color="white" text-color="white"
dense>{{ myevent.title }} dense>{{ myevent.title }}
</q-chip> </q-chip>
</div> </div>
@@ -121,8 +121,8 @@ v-else class="cltexth3 text-center boldhigh"
alt="località"> alt="località">
</q-avatar> </q-avatar>
<q-avatar <q-avatar
v-else color="blue" font-size="20px" text-color="white" v-else color="blue" font-size="20px" text-color="white"
icon="home"> icon="home">
</q-avatar> </q-avatar>
<span <span
class="cal__teacher-content">{{ getWhereName(myevent.wherecode) }}</span> class="cal__teacher-content">{{ getWhereName(myevent.wherecode) }}</span>
@@ -142,8 +142,8 @@ v-else color="blue" font-size="20px" text-color="white"
</span> </span>
<q-chip <q-chip
v-if="myevent.price && isShowPrice(myevent)" class="glossy" color="orange" v-if="myevent.price && isShowPrice(myevent)" class="glossy" color="orange"
text-color="white" icon-right="star"> text-color="white" icon-right="star">
<span class="cal__quota-content">{{ getPrice(myevent) }}</span> <span class="cal__quota-content">{{ getPrice(myevent) }}</span>
</q-chip> </q-chip>
</div> </div>
@@ -151,11 +151,11 @@ v-if="myevent.price && isShowPrice(myevent)" class="glossy" color="orange"
<div class="row justify-start q-ma-md"> <div class="row justify-start q-ma-md">
<q-btn <q-btn
v-if="myevent.linkpdf" v-if="myevent.linkpdf"
size="md" type="a" :href="`../../public/` + myevent.linkpdf" size="md" type="a" :href="`../../public/` + myevent.linkpdf"
target="_blank" rounded outline target="_blank" rounded outline
color="primary" icon="info" color="primary" icon="info"
:label="$t('cal.showpdf')"> :label="$t('cal.showpdf')">
</q-btn> </q-btn>
<!--<q-btn v-if="myevent.bodytext" rounded outline class="q-mx-sm" <!--<q-btn v-if="myevent.bodytext" rounded outline class="q-mx-sm"
@@ -166,22 +166,22 @@ v-if="myevent.linkpdf"
</div> </div>
<div class="row text-center"> <div class="row text-center">
<q-btn <q-btn
rounded outline class="q-mx-sm" rounded outline class="q-mx-sm"
color="primary" @click="askForInfoEventMenu(myevent)" color="primary" @click="askForInfoEventMenu(myevent)"
:label="$t('event.askinfo')"> :label="$t('event.askinfo')">
</q-btn> </q-btn>
<q-btn <q-btn
rounded class="q-mx-sm" rounded class="q-mx-sm"
v-if="!myevent.nobookable && !isAlreadyBooked(myevent) && static_data.functionality.BOOKING_EVENTS" v-if="!myevent.nobookable && !isAlreadyBooked(myevent) && static_data.functionality.BOOKING_EVENTS"
color="primary" @click="addBookEventMenu(myevent)" color="primary" @click="addBookEventMenu(myevent)"
:label="$t('cal.booking')" :disable="!isEventEnabled(myevent)"> :label="$t('cal.booking')" :disable="!isEventEnabled(myevent)">
</q-btn> </q-btn>
<q-btn <q-btn
rounded outline class="q-mx-sm" rounded outline class="q-mx-sm"
v-if="!myevent.nobookable && isAlreadyBooked(myevent) && static_data.functionality.BOOKING_EVENTS" v-if="!myevent.nobookable && isAlreadyBooked(myevent) && static_data.functionality.BOOKING_EVENTS"
text-color="red" text-color="red"
@click="EditBookEvent(myevent)" @click="EditBookEvent(myevent)"
:label="$t('cal.modifybooking')"> :label="$t('cal.modifybooking')">
</q-btn> </q-btn>
<br> <br>
<!-- <!--

2
src/components/index.ts
View File

@@ -29,6 +29,8 @@ export * from './FormNewsletter'
export * from './Header' export * from './Header'
export * from './logo' export * from './logo'
export * from './testpao' export * from './testpao'
export * from './CEventsCalendar'
export * from './CMySingleEvent'
// export * from './PagePolicy' // export * from './PagePolicy'
export * from './CFacebookFrame' export * from './CFacebookFrame'
// export * from './CPreloadImages' // export * from './CPreloadImages'

31
src/db/static_data.ts
View File

@@ -451,6 +451,37 @@ const baseroutes: IListRoutes[] = [
isseparator: true, isseparator: true,
inmenu: true, inmenu: true,
}, },
{
active: true,
order: 80,
path: '/calendario-eventi',
materialIcon: 'event',
name: 'pages.calendarioeventi',
component: () => import('@/root/calendarioeventi/calendarioeventi.vue'),
extraclass: 'isCalendar',
inmenu: true,
infooter: true
},
{
active: true,
order: 90,
path: '/event/:typol/:eventid',
materialIcon: 'event',
name: 'pages.evento',
component: () => import('@/root/evento/evento.vue'),
inmenu: false,
infooter: false
},
{
active: true,
order: 110,
path: '/event/:typol',
materialIcon: 'event',
name: 'pages.eventodef',
component: () => import('@/root/evento/evento.vue'),
inmenu: false,
infooter: false
},
] ]

4
src/layouts/menuone/menuOne.ts
View File

@@ -24,7 +24,7 @@ export default defineComponent({
const path = computed(() => route.path) const path = computed(() => route.path)
function getmenu(): any { function getmenu(): any {
console.log('getmenu menuOne!') // console.log('getmenu menuOne!')
return globalStore.getmenu return globalStore.getmenu
} }
@@ -40,7 +40,7 @@ export default defineComponent({
const mymenu = globalStore.getmenu const mymenu = globalStore.getmenu
// console.log('watch:', mymenu) // console.log('watch:', mymenu)
Object.keys(mymenu).forEach((parentName: any) => { Object.keys(mymenu).forEach((parentName: any) => {
console.log('parentName', parentName) // console.log('parentName', parentName)
// @ts-ignore // @ts-ignore
setParentVisibilityBasedOnRoute(mymenu[parentName]) setParentVisibilityBasedOnRoute(mymenu[parentName])
}) })

2
src/mixins/mixin-users.ts
View File

@@ -59,7 +59,7 @@ export default function () {
const userStore = useUserStore() const userStore = useUserStore()
const ris = userStore.getImgByUsername(userStore.my.username) const ris = userStore.getImgByUsername(userStore.my.username)
const out = (ris !== '') ? `${ris}` : '' const out = (ris !== '') ? `${ris}` : ''
console.log('getMyImg = ', out) // console.log('getMyImg = ', out)
return out return out
} }

0
src/root/calendarioeventi/calendarioeventi.scss Executable file
View File

21
src/root/calendarioeventi/calendarioeventi.ts Executable file
View File

@@ -0,0 +1,21 @@
import { defineComponent } from 'vue'
import { CEventsCalendar } from '@/components/CEventsCalendar'
import { CMyPage } from '@/components/CMyPage'
import MixinMetaTags from '@/mixins/mixin-metatags'
import MixinBase from '@/mixins/mixin-base'
export default defineComponent({
name: 'Calendarioeventi',
components: { CEventsCalendar, CMyPage },
setup() {
const { setmeta } = MixinMetaTags()
const { getarrValDb } = MixinBase()
return {
setmeta,
getarrValDb
}
}
})

31
src/root/calendarioeventi/calendarioeventi.vue Executable file
View File

@@ -0,0 +1,31 @@
<template>
<CMyPage
title='Calendario Eventi' imgbackground="images/calendario_eventi.jpg"
sizes="max-height: 120px" styleadd="bottom: -16px !important;">
<span>{{
setmeta({
title: 'Calendario Eventi',
description: 'Calendario degli Eventi che si svolgono all\'Associazione Shen di Lugo (RA)',
keywords: 'calendario eventi centro olistico',
})
}}
</span>
<CEventsCalendar :mysingleevent="null">
</CEventsCalendar>
<br>
<p class="cltexth3 text-blue q-ma-md" v-for="(mycal, index) in getarrValDb('EVENTS_CAL')" :key="index">
<a :href="`../../statics/files/eventi/` + mycal.file" target="_blank">Calendario Eventi {{ mycal.label }}
(PDF)</a><br>
</p>
<br>
</CMyPage>
</template>
<script lang="ts" src="./calendarioeventi.ts">
</script>
<style lang="scss" scoped>
@import './calendarioeventi.scss';
</style>

86
src/root/evento/evento.scss Executable file
View File

@@ -0,0 +1,86 @@
.listaev {
color: black;
font-size: 0.75rem;
font-weight: 400;
line-height: 1.25rem;
letter-spacing: 0.03333em;
&__date {
font-weight: bold;
color: #2ba0fd;
font-size: 1rem;
}
&__title {
color: red;
font-weight: 700;
letter-spacing: 0.066em;
}
&__details {
color: black;
}
&__tdimg {
width: 150px;
height: 150px;
}
&__tdimg_small {
width: auto;
height: 50px !important;
@media (max-width: 800px) {
height: 40px !important;
}
}
&__table {
margin: 10px;
border: solid 1px #4198ef;
border-radius: 1rem;
padding: 2px;
}
&__table tr {
border: solid 1px #4198ef;
border-radius: 1rem;
}
&__align_center_mobile {
text-align: center;
display: flex;
flex-direction: column;
align-items: center;
}
&__align_chips {
text-align: center;
display: flex;
flex-direction: column-reverse;
align-items: center;
}
&__img {
padding: 0.25rem !important;
float: left;
width: 150px;
height: 150px;
border-radius: 1rem;
@media (max-width: 718px) {
// PER VERSIONE MOBILE
float: none;
text-align: center;
margin: 0 auto;
}
}
&__img:hover {
transition: transform .2s;
transform: scale(1.05);
border: inset;
border-color: blue;
border-width: 1px;
}
}

145
src/root/evento/evento.ts Executable file
View File

@@ -0,0 +1,145 @@
import { defineComponent, watch, onMounted, ref } from 'vue'
import { tools } from '../../store/Modules/tools'
import { CImgText } from '../../components/CImgText/index'
import MixinOperator from '@src/mixins/mixin-operator'
import MixinEvents from '../../mixins/mixin-events'
import { IEvents } from '@src/model'
import MixinBase from '@src/mixins/mixin-base'
import MixinUsers from '@src/mixins/mixin-users'
import { Logo } from '../../components/logo/index'
import { CCard } from '@/components/CCard'
import { CMyPage } from '@/components/CMyPage'
import { CMyAvatar } from '@/components/CMyAvatar'
import { CEventsCalendar } from '@/components/CEventsCalendar'
import { useRoute } from 'vue-router'
import { useCalendarStore } from '@store/CalendarStore'
import MixinMetaTags from '@/mixins/mixin-metatags'
export default defineComponent({
name: 'Evento',
components: { Logo, CImgText, CCard, CMyPage, CMyAvatar, CEventsCalendar },
setup() {
const myevent = ref(<IEvents | null | undefined> null)
const mylastevtypol = ref(<IEvents[]>[])
const selected = ref(false)
const calendarStore = useCalendarStore()
const { setmeta } = MixinMetaTags()
const $route = useRoute()
function changetypol() {
// mytypetransgroup = ''
const datenow = tools.addDays(tools.getDateNow(), -1)
mylastevtypol.value = calendarStore.eventlist.filter((rec: any) => ((rec.typol === $route.params.typol) && (new Date(rec.dateTimeEnd) >= datenow))).slice(-5)
console.log('[1] mylastevtypol.value', mylastevtypol.value)
if (mylastevtypol.value.length === 0) {
mylastevtypol.value = calendarStore.eventlist.filter((rec: any) => (rec.typol === $route.params.typol)).slice(-1)
}
// console.log('myevent', myevent, 'eventid=', $route.params.eventid)
}
watch(() => $route.params.typol, (value, oldval) => {
changetypol()
})
function nextevents() {
if (!!mylastevtypol.value && mylastevtypol.value.length > 1) {
return mylastevtypol.value
} else {
return []
}
}
function isnotmyevent(ev: any) {
if (!!$route.params.eventid)
return ev._id !== $route.params.eventid
else
return true
}
function changeevent() {
let eventid: any = null
if (!!$route.params.eventid)
eventid = $route.params.eventid
if (!!$route.query.eventid)
eventid = $route.query.eventid
console.log('changeevent', eventid)
// mytypetransgroup = ''
if (!!eventid) {
myevent.value = calendarStore.eventlist.find((rec) => rec._id === eventid)
} else {
if (!!mylastevtypol.value)
myevent.value = mylastevtypol.value[0]
}
}
watch(() => $route.params.eventid, (value, oldval) => {
changeevent()
})
function changeeventquery() {
// console.log('changeevent QUERY', $route.query.eventid)
// mytypetransgroup = ''
if (!!$route.query.eventid) {
myevent.value = calendarStore.eventlist.find((rec: any) => rec._id === $route.query.eventid)
} else {
if (!!mylastevtypol.value)
myevent.value = mylastevtypol.value[0]
}
}
watch(() => $route.query.eventid, (value, oldval) => {
changeeventquery()
})
function selectEvent(eventparam: IEvents) {
selected.value = !selected.value
}
function getTextEvent(myevent: IEvents) {
if (myevent.bodytext === '') {
return myevent.details
} else {
return myevent.bodytext
}
}
function mounted() {
changetypol()
changeevent()
// console.log('myevent', myevent)
}
function gettitle() {
if (!!myevent.value && (!!myevent.value.title))
return myevent.value.title
else
return ''
}
onMounted(mounted)
return {
gettitle,
nextevents,
getTextEvent,
selectEvent,
isnotmyevent,
setmeta,
myevent,
}
}
})

65
src/root/evento/evento.vue Executable file
View File

@@ -0,0 +1,65 @@
<template>
<div>
<CMyPage
imgbackground="images/calendario_eventi.jpg" :title="gettitle()" sizes="max-height: 110px;"
styleadd="bottom: -36px !important;">
<span>{{
setmeta({
title: gettitle(),
description: '',
keywords: '',
})
}}
</span>
<CEventsCalendar :mysingleevent="myevent" v-if="myevent">
</CEventsCalendar>
<q-separator>
</q-separator>
<div class="q-pa-md text-center" style="max-width: 380px; margin: auto auto 2px; " v-if="nextevents().length > 0">
<q-list bordered>
<q-item>
<q-item-section>
<q-item-label overline>PROSSIME DATE:</q-item-label>
</q-item-section>
</q-item>
<div
v-for="(ev, index) in nextevents()"
:key="index">
<q-item
v-if="isnotmyevent(ev)"
clickable v-ripple
:to="`/event/${ev.typol}/${ev._id}`"
>
<q-item-section avatar v-if="tools.getimgev(ev)">
<q-avatar>
<img :src="tools.getimgev(ev)" :alt="ev.title">
</q-avatar>
</q-item-section>
<q-item-section>{{ ev.title }}</q-item-section>
<q-item-section side top>{{ tools.getstrDateTimeEventShort($t, ev) }}</q-item-section>
</q-item>
</div>
</q-list>
</div>
<div class="q-ma-md text-center">
<q-btn
rounded outline type="a" to="/calendario-eventi" color="primary" icon="event"
:label="$t('pages.calendarioeventi')">
</q-btn>
</div>
</CMyPage>
</div>
</template>
<script lang="ts" src="./evento.ts">
</script>
<style lang="scss" scoped>
@import './evento.scss';
</style>

2
src/router/route-config.ts
View File

@@ -38,7 +38,7 @@ export const cfgrouter = {
tools.addRoute(arrroutes, route) tools.addRoute(arrroutes, route)
} }
console.log('getmenu', arrroutes) // console.log('getmenu', arrroutes)
return arrroutes return arrroutes
}, },

52
src/store/CalendarStore.ts
View File

@@ -1,5 +1,5 @@
import { Api } from '@api' import { Api } from '@api'
import { IBookedEvent, ICalendarState, IEvents } from 'model' import { IBookedEvent, ICalendarState, IEvents, IOperators } from 'model'
import { serv_constants } from './Modules/serv_constants' import { serv_constants } from './Modules/serv_constants'
import { tools } from './Modules/tools' import { tools } from './Modules/tools'
@@ -84,25 +84,6 @@ export const useCalendarStore = defineStore('CalendarStore', {
}, },
getOperatorByUsername: (mystate: ICalendarState) => (username: string) => {
const ctrec = mystate.operators.find((rec) => rec.username === username)
return (ctrec)
},
getImgTeacherByUsername: (mystate: ICalendarState) => (username: string): string => {
if (username === '')
return ''
// Check if is this User!
// @ts-ignore
const myop = this.getOperatorByUsername(username)
if (myop && !!myop.img && myop.img !== '' && myop.img !== 'undefined') {
return myop.img
} else {
return ''
}
},
getContribtypeById: (mystate: ICalendarState) => (id: string) => { getContribtypeById: (mystate: ICalendarState) => (id: string) => {
const ctrec = mystate.contribtype.find((mycontr) => mycontr._id === id) const ctrec = mystate.contribtype.find((mycontr) => mycontr._id === id)
return (ctrec) ? ctrec.label : '' return (ctrec) ? ctrec.label : ''
@@ -117,6 +98,23 @@ export const useCalendarStore = defineStore('CalendarStore', {
}, },
actions: { actions: {
getOperatorByUsername (username: string): IOperators | undefined {
const ctrec = this.operators.find((rec: IOperators) => rec.username === username)
return ctrec
},
getImgTeacherByUsername(username: string): string {
if (username === '')
return ''
// Check if is this User!
const myop = this.getOperatorByUsername(username)
if (myop && !!myop.img && myop.img !== '' && myop.img !== 'undefined') {
return myop.img
} else {
return ''
}
},
getparambyevent(bookevent: IBookedEvent) { getparambyevent(bookevent: IBookedEvent) {
const userStore = useUserStore() const userStore = useUserStore()
return { return {
@@ -135,7 +133,7 @@ export const useCalendarStore = defineStore('CalendarStore', {
} }
}, },
async BookEvent( bookevent: IBookedEvent) { async BookEvent(bookevent: IBookedEvent) {
console.log('BookEvent', bookevent) console.log('BookEvent', bookevent)
const param = this.getparambyevent(bookevent) const param = this.getparambyevent(bookevent)
@@ -167,12 +165,20 @@ export const useCalendarStore = defineStore('CalendarStore', {
}, },
async CancelEvent( { id }: { id: string }) { async CancelEvent({ id }: {id: string}) {
const globalStore = useGlobalStore() const globalStore = useGlobalStore()
return globalStore.DeleteRec({ table: costanti.TABEVENTS, id }) return globalStore.DeleteRec({ table: costanti.TABEVENTS, id })
}, },
async CancelBookingEvent( { ideventbook, notify }: { ideventbook: string, notify: string }) { intervalStart() {
return this.intervalRange.min * (1 / this.intervalRangeStep)
},
intervalCount() {
return (this.intervalRange.max - this.intervalRange.min) * (1 / this.intervalRangeStep)
},
async CancelBookingEvent({ ideventbook, notify }: {ideventbook: string, notify: string}) {
console.log('CALSTORE: CancelBookingEvent', ideventbook, notify) console.log('CALSTORE: CancelBookingEvent', ideventbook, notify)
return Api.SendReq('/booking/' + ideventbook + '/' + notify + '/' + process.env.APP_ID, 'DELETE', null) return Api.SendReq('/booking/' + ideventbook + '/' + notify + '/' + process.env.APP_ID, 'DELETE', null)

18
src/store/Modules/tools.ts
View File

@@ -2288,29 +2288,29 @@ export const tools = {
} }
}, },
getstrDateTimeEvent(mythis: any, myevent: IEvents, withhtml: boolean) { getstrDateTimeEvent($t: any, myevent: IEvents, withhtml: boolean) {
let mystr = '' let mystr = ''
// is same day? // is same day?
if (this.getstrDate(myevent.dateTimeStart) === this.getstrDate(myevent.dateTimeEnd)) { if (this.getstrDate(myevent.dateTimeStart) === this.getstrDate(myevent.dateTimeEnd)) {
if (withhtml) { if (withhtml) {
mystr += `<span class="cal__where-content">${this.getstrDateLong(myevent.dateTimeStart)}</span> mystr += `<span class="cal__where-content">${this.getstrDateLong(myevent.dateTimeStart)}</span>
<span class="cal__hours-content">${mythis.$t('cal.starttime')} ${this.getstrTime(myevent.dateTimeStart)} <span class="cal__hours-content">${$t('cal.starttime')} ${this.getstrTime(myevent.dateTimeStart)}
${mythis.$t('cal.endtime')} ${this.getstrTime(myevent.dateTimeEnd)}` ${$t('cal.endtime')} ${this.getstrTime(myevent.dateTimeEnd)}`
} else { } else {
mystr = `${this.getstrDateLong(myevent.dateTimeStart)} mystr = `${this.getstrDateLong(myevent.dateTimeStart)}
${mythis.$t('cal.starttime')} ${this.getstrTime(myevent.dateTimeStart)} ${$t('cal.starttime')} ${this.getstrTime(myevent.dateTimeStart)}
${mythis.$t('cal.endtime')} ${this.getstrTime(myevent.dateTimeEnd)}` ${$t('cal.endtime')} ${this.getstrTime(myevent.dateTimeEnd)}`
} }
} else { } else {
mystr = `<span class="cal__where-content">${this.getstrDateLong(myevent.dateTimeStart)}</span> mystr = `<span class="cal__where-content">${this.getstrDateLong(myevent.dateTimeStart)}</span>
<span class="cal__hours-content">${mythis.$t('cal.starttime')} ${this.getstrTime(myevent.dateTimeStart)} </span> <span class="cal__hours-content">${$t('cal.starttime')} ${this.getstrTime(myevent.dateTimeStart)} </span>
${mythis.$t('cal.enddate')} ${this.getstrDateLong(myevent.dateTimeEnd)} ${$t('cal.enddate')} ${this.getstrDateLong(myevent.dateTimeEnd)}
<span class="cal__hours-content">${mythis.$t('cal.endtime')} ${this.getstrTime(myevent.dateTimeEnd)} </span>` <span class="cal__hours-content">${$t('cal.endtime')} ${this.getstrTime(myevent.dateTimeEnd)} </span>`
} }
if (myevent.infoextra) { if (myevent.infoextra) {
mystr += `<span class="cal__hours"> mystr += `<span class="cal__hours">
<span class="cal__hours-title">${mythis.$t('cal.hours')}: </span> <span class="cal__hours-title">${$t('cal.hours')}: </span>
<span class="cal__hours-content">${myevent.infoextra} </span> <span class="cal__hours-content">${myevent.infoextra} </span>
</span> </span>
</span>` </span>`

6
src/views/login/signup/signup.ts
View File

@@ -10,15 +10,15 @@ export default defineComponent({
components: { CSignUp }, components: { CSignUp },
props: {}, props: {},
setup() { setup() {
const route = useRoute() const $route = useRoute()
const adult = ref(false) const adult = ref(false)
const invited = computed(() => route.params.invited) const invited = computed(() => $route.params.invited)
// @ts-ignore // @ts-ignore
watch(invited, (newval, oldval) => { watch(invited, (newval, oldval) => {
console.log('$route.params.invited') console.log('$route.params.invited')
adult.value = !!route.params.invited adult.value = !!$route.params.invited
}) })
function created() { function created() {

12
yarn.lock
View File

@@ -1690,6 +1690,18 @@
resolved "https://registry.yarnpkg.com/@quasar/fastclick/-/fastclick-1.1.4.tgz#21ed3e9a4387dcb43022a08af4ef08a5f1abf159" resolved "https://registry.yarnpkg.com/@quasar/fastclick/-/fastclick-1.1.4.tgz#21ed3e9a4387dcb43022a08af4ef08a5f1abf159"
integrity sha512-i9wbyV4iT+v4KhtHJynUFhH5LiEPvAEgSnwMqPN4hf/8uRe82nDl5qP5agrp2el1h0HzyBpbvHaW7NB0BPrtvA== integrity sha512-i9wbyV4iT+v4KhtHJynUFhH5LiEPvAEgSnwMqPN4hf/8uRe82nDl5qP5agrp2el1h0HzyBpbvHaW7NB0BPrtvA==
"@quasar/quasar-app-extension-qcalendar@^4.0.0-beta.6":
version "4.0.0-beta.6"
resolved "https://registry.yarnpkg.com/@quasar/quasar-app-extension-qcalendar/-/quasar-app-extension-qcalendar-4.0.0-beta.6.tgz#937afba2920b50cab7064750e08e38d8d837c65e"
integrity sha512-Kuv8qNXbO5tMUFC4dfz1/7uc3zsZ9UukgkXkJWGJaMOLjsa89mwP1NNFY4ry808nF7bDVEKoov+vkLsgV7NZ2w==
dependencies:
"@quasar/quasar-ui-qcalendar" "^4.0.0-beta.6"
"@quasar/quasar-ui-qcalendar@^4.0.0-beta.6":
version "4.0.0-beta.6"
resolved "https://registry.yarnpkg.com/@quasar/quasar-ui-qcalendar/-/quasar-ui-qcalendar-4.0.0-beta.6.tgz#451613e0b769d94bc9c3b842b3697642f0514435"
integrity sha512-cE8OO1sylWFrLPvUl9sfV1otouq7Njm0CguSGtkkIhGum/qS02WUL/pcdfQX02hQZUDrY07VEA5+S7vF779nuA==
"@quasar/ssr-helpers@2.1.1": "@quasar/ssr-helpers@2.1.1":
version "2.1.1" version "2.1.1"
resolved "https://registry.yarnpkg.com/@quasar/ssr-helpers/-/ssr-helpers-2.1.1.tgz#0b0ced671deaf918a4656a35057301b962287a8c" resolved "https://registry.yarnpkg.com/@quasar/ssr-helpers/-/ssr-helpers-2.1.1.tgz#0b0ced671deaf918a4656a35057301b962287a8c"