diff --git a/ayanova/src/views/home-schedule.vue b/ayanova/src/views/home-schedule.vue index c0688032..eb20dfbb 100644 --- a/ayanova/src/views/home-schedule.vue +++ b/ayanova/src/views/home-schedule.vue @@ -73,7 +73,7 @@ @mousedown:event="startDrag" @mousedown:time="startTime" @mousemove:time="mouseMove" - @mouseup:time="endDrag" + @mouseup:time="endDragExtend" @mouseleave.native="cancelDrag" :event-more-text="$ay.t('More')" > @@ -267,7 +267,9 @@ SETTINGS: https://vuetifyjs.com/en/components/floating-action-buttons/#speed-dial issues: - drag losing end time for event + drag/extend needs to actually update the work order + 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 Test: overlapping sched items that start or end outside of view @@ -344,7 +346,8 @@ export default { }, methods: { startDrag({ event, timed }) { - //console.log("startDrag"); + console.log("startDrag"); + //TODO: IF event is not editable then just return here to prevent the drag if (event && timed) { //My work around to disambiguate dragging and clicking clearTimeout(this.dragTimeout); @@ -358,39 +361,71 @@ export default { this.extendOriginal = null; } }, - startTime(tms) { - //console.log("startTime", tms); - const mouse = this.toTime(tms); - - if (this.dragEvent && this.dragTime === null) { - //const start = new Date(this.dragEvent.start).getTime(); - const start = this.dragEvent.start; - - this.dragTime = mouse - start; - //console.log("startTime dragTime is", this.dragTime); - } else { - this.createStart = this.roundTime(mouse); - console.log( - "startTime::STUB Create new element, popup FAB speeddial here" - ); - // //console.log("startTime, create start:", this.createStart); - // this.createEvent = { - // name: `Event #${this.events.length}`, - // color: this.rndElement(this.colors), - // start: this.createStart, - // end: this.createStart, - // timed: true - // }; - // //console.log("startTime, pushing event:", this.createEvent); - // this.events.push(this.createEvent); - } - }, 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 + clearTimeout(this.dragTimeout); + this.dragged = false; + this.dragTimeout = setTimeout(() => { + this.dragged = true; + }, 100); // Minimal delay to be regarded as extend instead of click + + //this.dragEvent = event; this.createEvent = event; this.createStart = event.start; this.extendOriginal = event.end; }, + endDragExtend() { + //On drag then dragEvent and dragTime are set + //on extend then createEvent (actual event), extendOriginal and createStart are set + //on create then createStart is only value set, dragEvent is null and createEvent is null + + if (this.dragEvent) { + console.log("endDragExtend: event is DRAG of existing event"); + } + if (this.createEvent) { + console.log("endDragExtend: event is EXTEND of existing event"); + } + if (this.createStart && !this.dragEvent && !this.createEvent) { + console.log("endDragExtend: event is CREATE for new event"); + } + + // console.log("endDragExtend, deets: ", { + // dragEvent: this.dragEvent, + // dragTime: this.dragTime, + // createEvent: this.createEvent, + // createStart: this.createStart, + // extendOriginal: this.extendOriginal + // }); + + this.dragTime = null; + this.dragEvent = null; + this.createEvent = null; + this.createStart = null; + this.extendOriginal = null; + }, + cancelDrag() { + // console.log("cancelDrag"); + if (this.createEvent) { + console.log("Cancel drag A path (cancel?)"); + if (this.extendOriginal) { + this.createEvent.end = this.extendOriginal; + } else { + console.log("Cancel drag B path (do it?)"); + const i = this.events.indexOf(this.createEvent); + if (i !== -1) { + this.events.splice(i, 1); + } + } + } + + this.createEvent = null; + this.createStart = null; + this.dragTime = null; + this.dragEvent = null; + }, mouseMove(tms) { // //console.log("moustMove", tms); const mouse = this.toTime(tms); @@ -398,10 +433,9 @@ export default { //console.log("mouseMove got time:", mouse); if (this.dragEvent && this.dragTime !== null) { - // console.log("mosueMove:A", { - // dragEvent: JSON.stringify(this.dragEvent), - // dragTime: JSON.stringify(this.dragTime) - // }); + //# DRAGGING PATH + console.log("MouseMove: DRAGGING"); + //new Date(this.dragEvent.start).getTime(); const start = this.dragEvent.start; const end = this.dragEvent.end; @@ -421,7 +455,8 @@ export default { this.dragEvent.start = newStart; this.dragEvent.end = newEnd; } else if (this.createEvent && this.createStart !== null) { - // console.log("mosueMove:B"); + //# EXTENDING PATH + console.log("mosueMove: EXTENDING"); const mouseRounded = this.roundTime(mouse, false); //console.log("mouseMove mouseRounded:", mouseRounded); const min = Math.min(mouseRounded, this.createStart); @@ -431,32 +466,34 @@ export default { this.createEvent.end = max; } }, - endDrag() { - // console.log("endDrag"); + startTime(tms) { + //console.log("startTime", tms); + const mouse = this.toTime(tms); - this.dragTime = null; - this.dragEvent = null; - this.createEvent = null; - this.createStart = null; - this.extendOriginal = null; - }, - cancelDrag() { - // console.log("cancelDrag"); - if (this.createEvent) { - if (this.extendOriginal) { - this.createEvent.end = this.extendOriginal; - } else { - const i = this.events.indexOf(this.createEvent); - if (i !== -1) { - this.events.splice(i, 1); - } - } + if (this.dragEvent && this.dragTime === null) { + //const start = new Date(this.dragEvent.start).getTime(); + const start = this.dragEvent.start; + + this.dragTime = mouse - start; + //note: this captures once at start of drag + // console.log("startTime dragTime is", this.dragTime); + } else { + this.createStart = this.roundTime(mouse); + //TODO: implement speed dial create new item here + console.log( + "startTime::STUB Create new element, popup FAB speeddial here" + ); + // //console.log("startTime, create start:", this.createStart); + // this.createEvent = { + // name: `Event #${this.events.length}`, + // color: this.rndElement(this.colors), + // start: this.createStart, + // end: this.createStart, + // timed: true + // }; + // //console.log("startTime, pushing event:", this.createEvent); + // this.events.push(this.createEvent); } - - this.createEvent = null; - this.createStart = null; - this.dragTime = null; - this.dragEvent = null; }, roundTime(time, down = true) { //console.log("roundtime...");