From 8b425e723e65818e9e3972ed320f109fbb0751a2 Mon Sep 17 00:00:00 2001 From: Ferdinand Thiessen Date: Mon, 15 Nov 2021 10:25:21 +0100 Subject: [PATCH] [calendar] Allow creating events by clicking on the date. --- src/components/management/EditEvent.vue | 15 ++++++---- src/components/overview/AgendaView.vue | 40 +++++++++++++++---------- src/pages/Management.vue | 11 +++++-- src/routes/index.ts | 6 ++++ 4 files changed, 50 insertions(+), 22 deletions(-) diff --git a/src/components/management/EditEvent.vue b/src/components/management/EditEvent.vue index d0f895e..01a0a4c 100644 --- a/src/components/management/EditEvent.vue +++ b/src/components/management/EditEvent.vue @@ -16,7 +16,7 @@ map-options clearable :disable="templates.length == 0" - @update:modelValue="fromTemplate" + @update:model-value="fromTemplate" @clear="reset()" /> - + undefined, type: Object as PropType, }, + date: { + required: false, + default: '', + type: String + } }, emits: { done: (val: boolean) => typeof val === 'boolean', @@ -126,8 +131,8 @@ export default defineComponent({ const emptyJob = { id: NaN, - start: new Date(), - end: date.addToDate(new Date(), { hours: 1 }), + start: date.adjustDate(new Date(props.date), {hours: (new Date()).getHours()}), + end: date.addToDate(date.adjustDate(new Date(props.date), {hours: (new Date()).getHours()}), {hours: 1}), services: [], required_services: 2, type: store.jobTypes[0], @@ -135,7 +140,7 @@ export default defineComponent({ const emptyEvent = { id: NaN, - start: new Date(), + start: new Date(props.date), jobs: [Object.assign({}, emptyJob)], type: store.eventTypes[0], is_template: false, diff --git a/src/components/overview/AgendaView.vue b/src/components/overview/AgendaView.vue index 2834fb5..a090467 100644 --- a/src/components/overview/AgendaView.vue +++ b/src/components/overview/AgendaView.vue @@ -38,7 +38,7 @@ label="OK" color="primary" flat - @click="saveNewSelectedDate(proxyDate)" + @click="saveNewSelectedDate" /> @@ -48,16 +48,16 @@
- +
+ @@ -92,7 +102,7 @@ import Eventslot from './slots/EventSlot.vue'; import { date } from 'quasar'; import { startOfWeek } from '@flaschengeist/api'; import EditEvent from '../management/EditEvent.vue'; -import { QCalendarAgenda } from '@quasar/quasar-ui-qcalendar' +import { QCalendarAgenda } from '@quasar/quasar-ui-qcalendar'; export default defineComponent({ name: 'AgendaView', @@ -108,7 +118,7 @@ export default defineComponent({ const calendarRealView = computed(() => (calendarDays.value != 7 ? 'day' : 'week')); const calendarDays = computed(() => // <= 1023 is the breakpoint for sm to md - calendarView.value == 'day' ? 1 : (windowWidth.value <= 1023 ? 3 : 7) + calendarView.value == 'day' ? 1 : windowWidth.value <= 1023 ? 3 : 7 ); const events = ref({}); const editor = ref(undefined); diff --git a/src/pages/Management.vue b/src/pages/Management.vue index dc3622d..de17a2b 100644 --- a/src/pages/Management.vue +++ b/src/pages/Management.vue @@ -32,7 +32,7 @@ animated > - + @@ -56,6 +56,13 @@ import { Screen } from 'quasar'; export default defineComponent({ name: 'EventManagement', components: { EditEvent, ManageTypes }, + props: { + date: { + type: String, + required: false, + default: undefined + } + }, setup() { const tabs = computed(() => [ { name: 'create', label: 'Veranstaltungen' }, @@ -64,6 +71,7 @@ export default defineComponent({ ]); const drawer = ref(false); + const tab = ref('create'); const showDrawer = computed({ get: () => { @@ -74,7 +82,6 @@ export default defineComponent({ }, }); - const tab = ref('create'); return { showDrawer, diff --git a/src/routes/index.ts b/src/routes/index.ts index 23203af..517400c 100644 --- a/src/routes/index.ts +++ b/src/routes/index.ts @@ -31,6 +31,7 @@ export const innerRoutes: FG_Plugin.MenuRoute[] = [ path: 'schedule-management', name: 'schedule-management', component: () => import('../pages/Management.vue'), + props: (route) => ({date: route.query.date}), }, }, { @@ -48,6 +49,11 @@ export const innerRoutes: FG_Plugin.MenuRoute[] = [ ]; export const privateRoutes: FG_Plugin.NamedRouteRecordRaw[] = [ + { + name: 'new-event', + path: 'new-event', + redirect: {name: 'schedule-management'} + }, { name: 'events-edit', path: 'schedule/:id/edit',