From 6c0984825c41f3ea2b04f2e68d6d7f1f43e03ef5 Mon Sep 17 00:00:00 2001 From: John Cardinal Date: Sat, 18 Sep 2021 00:11:43 +0000 Subject: [PATCH] --- ayanova/src/views/home-schedule.vue | 94 +++++++++++++++++++++++------ 1 file changed, 75 insertions(+), 19 deletions(-) diff --git a/ayanova/src/views/home-schedule.vue b/ayanova/src/views/home-schedule.vue index 8a3b375f..309026e1 100644 --- a/ayanova/src/views/home-schedule.vue +++ b/ayanova/src/views/home-schedule.vue @@ -72,7 +72,9 @@ @change="fetchEvents" @mousedown:event="startDrag" @mousedown:time="startTime" - @mousemove:time="mouseMove" + @mousemove:time="mouseMoveDayView" + @mousemove:day="mouseMoveMonthView" + @mouseup:day="endDragExtend" @mouseup:time="endDragExtend" @mouseleave.native="cancelDrag" :event-more-text="$ay.t('More')" @@ -266,25 +268,36 @@ SETTINGS: https://vuetifyjs.com/en/components/calendars/#drag-and-drop https://vuetifyjs.com/en/components/floating-action-buttons/#speed-dial + Speed dial create wo + issues: drag/extend should not affect locked workorders!! Add canModify or something to event data so no need to even start the op if it can't be done + week view drag works to another day if you do it quickly (<100ms event fucking it up maybe?) + but it works properly in same day, what's up with that? duelling events maybe?? + alt-key modifier to drag if conflicting events or WTF horizontal vs vertical? - + settings form persist to server + reminders (create / modify) + reviews (can't create from here but can modify / open) - TESTING: - overlapping sched items that start or end outside of view this is a test of the query in schedulecontroller at server + TESTING: + drag/extend in all views working? touch mode still can do all ops ultimately test on devices + + + Move common functionality out of home-schedule to be re-used in svc-schedule and also potentially other scheds like customer view of workorders or visual calendar view of work for a single customer for techs etc + the more I can move out of it the easier to do more scheds in other places + + DOCS: + how to use the schedule reporting - make it happen could just default to regular reporting list, doesn't absolutely need to be a calendar at least at first as long as it has all appointments consolidated in single list -FUTURE NOT INITIAL RELEASE - (these might be required for service-schedule view for moving around/planning etc visually which is needed there, not necessarily here) - Drag and drop and extend - controls to change time/date etc + */ @@ -348,9 +361,10 @@ export default { }, methods: { startDrag({ event, timed }) { - console.log("startDrag"); + // console.log("startDrag", event); //TODO: IF event is not editable then just return here to prevent the drag - if (event && timed) { + //if (event && timed) { + if (event) { //My work around to disambiguate dragging and clicking clearTimeout(this.dragTimeout); this.dragged = false; @@ -364,7 +378,7 @@ export default { } }, extendBottom(event) { - console.log("extendBottom", event); + // console.log("extendBottom", event); //TODO: if event is not editable then just return here to prevent extend //My work around to disambiguate extending and clicking @@ -428,10 +442,10 @@ export default { window.$gz.errorHandler.handleFormError(error, this); } } else if (this.createStart && !this.dragEvent && !this.extendEvent) { - console.log( - "endDragExtend: event is CREATE for new event", - new Date(this.createStart).toString() - ); + // console.log( + // "endDragExtend: event is CREATE for new event", + // new Date(this.createStart).toString() + // ); } this.dragTime = null; @@ -443,11 +457,11 @@ export default { cancelDrag() { // console.log("cancelDrag"); if (this.extendEvent) { - console.log("Cancel drag A path (cancel?)"); + // console.log("Cancel drag A path (cancel?)"); if (this.extendOriginal) { this.extendEvent.end = this.extendOriginal; } else { - console.log("Cancel drag B path (do it?)"); + //console.log("Cancel drag B path (do it?)"); const i = this.events.indexOf(this.extendEvent); if (i !== -1) { this.events.splice(i, 1); @@ -460,10 +474,16 @@ export default { this.dragTime = null; this.dragEvent = null; }, - mouseMove(tms) { + + mouseMoveDayView(tms) { + //no event being dragged or exgtended? + if (!this.dragEvent && !this.extendEvent) { + return; + } const mouse = this.toTime(tms); if (this.dragEvent && this.dragTime !== null) { //# DRAGGING PATH + //console.log("mouseMoveDayView tms:", JSON.stringify(tms)); const start = this.dragEvent.start; const end = this.dragEvent.end; const duration = end - start; @@ -472,10 +492,11 @@ export default { const newEnd = newStart + duration; this.dragEvent.start = newStart; this.dragEvent.end = newEnd; + //console.log("DRAG DAY VIEW:", { mouse: mouse, tms: tms }); } else if (this.extendEvent && this.createStart !== null) { //# EXTENDING PATH const mouseRounded = this.roundTime(mouse, false); - //console.log("mouseMove mouseRounded:", mouseRounded); + //console.log("mouseMoveDayView mouseRounded:", mouseRounded); const min = Math.min(mouseRounded, this.createStart); const max = Math.max(mouseRounded, this.createStart); @@ -483,6 +504,41 @@ export default { this.extendEvent.end = max; } }, + mouseMoveMonthView(dd) { + if (!this.dragEvent) { + return; + } + // console.log( + // "mouseMoveMonthView:", + // JSON.stringify({ + // dd: dd, + // dragEvent: this.dragEvent + // }) + // ); + /* + NOTE: dd Date is the actual start of the event being dragged helpfully, NOT the mouse itself so I can just use that date as the appointment start date as it starts with that date but on + release it ends with whatever date is dragged to + mouseMoveMonthView: { + "dd":{"date":"2021-11-10","time":"","year":2021,"month":11,"day":10,"weekday":3,"hour":0,"minute":0,"hasDay":true,"hasTime":false,"past":false,"present":false,"future":true}, + "dragEvent":{"start":1636515000000,"end":1636523100000,"timed":true,"name":"6 Parker, Ryan and Denesik","color":"#00ccff","textColor":"black","type":41,"id":33} + } + */ + //# DRAGGING PATH MONTH VIEW + //need to get the actual start time as it isn't in the mouse date + const dragEventStartDate = new Date(this.dragEvent.start); + // console.log("eventStartDate", eventStartDate); + const mouseDate = new Date( + dd.year, + dd.month - 1, + dd.day, + dragEventStartDate.getHours(), + dragEventStartDate.getMinutes() + ).getTime(); + const moveDelta = mouseDate - this.dragEvent.start; + this.dragEvent.start = mouseDate; + this.dragEvent.end = this.dragEvent.end + moveDelta; + }, + startTime(tms) { //console.log("startTime", tms); const mouse = this.toTime(tms);