JandL_gitea/jandl-taskmanager-app
1
0 Fork 0
mirror of https://bitbucket.org/studiotem/jandl-taskmanager-app.git synced 2026-10-21 14:29:34 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'main' of https://bitbucket.org/studiotem/jandl-taskmanager-app

Browse Source
This commit is contained in:
romankko2 committed 2022-12-16 15:23:32 +01:00
2 parents 22c37d64ef df1b881c0f
commit 9d70fe378d
2 files changed
+249 -160
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/src/plugins/app@vendor/vue-cal/event.vue
+248 -159
View File
@@ -1,40 +1,43 @@
<template lang="pug"> <template lang="pug">
.vuecal__event( .vuecal__event(
:class="eventClasses" :class="eventClasses",
:style="eventStyles" :style="eventStyles",
:eventId="`event-id-${event.id}`" :eventId="`event-id-${event.id}`",
tabindex="0" tabindex="0",
@focus="focusEvent" @focus="focusEvent",
@keypress.enter.stop="onEnterKeypress" @keypress.enter.stop="onEnterKeypress",
@mouseenter="onMouseEnter" @mouseenter="onMouseEnter",
@mouseleave="onMouseLeave" @mouseleave="onMouseLeave",
@touchstart.stop="onTouchStart" @touchstart.stop="onTouchStart",
@mousedown="onMouseDown($event) /* Don't stop mousedown propagation. See in onMouseDown(). */" @mousedown="onMouseDown($event) /* Don't stop mousedown propagation. See in onMouseDown(). */",
@mouseup="onMouseUp" @mouseup="onMouseUp",
@touchend="onMouseUp" @touchend="onMouseUp",
@touchmove="onTouchMove" @touchmove="onTouchMove",
@dblclick="onDblClick" @dblclick="onDblClick",
:draggable="draggable" :draggable="draggable",
@dragstart="draggable && onDragStart($event)" @dragstart="draggable && onDragStart($event)",
@dragend="draggable && onDragEnd()") @dragend="draggable && onDragEnd()"
)
.vuecal__event-delete( .vuecal__event-delete(
v-if="vuecal.editEvents.delete && event.deletable" v-if="vuecal.editEvents.delete && event.deletable",
@click.stop="deleteEvent" @click.stop="deleteEvent",
@touchstart.stop="touchDeleteEvent") {{ vuecal.texts.deleteEvent }} @touchstart.stop="touchDeleteEvent"
slot(name="event" :event="event" :view="view.id") ) {{ vuecal.texts.deleteEvent }}
slot(name="event", :event="event", :view="view.id")
//- Force contenteditable="false" for new events without content. //- Force contenteditable="false" for new events without content.
.vuecal__event-resize-handle( .vuecal__event-resize-handle(
v-if="resizable" v-if="resizable",
contenteditable="false" contenteditable="false",
@mousedown.stop.prevent="onResizeHandleMouseDown" @mousedown.stop.prevent="onResizeHandleMouseDown",
@touchstart.stop.prevent="onResizeHandleMouseDown") @touchstart.stop.prevent="onResizeHandleMouseDown"
)
</template> </template>
<script> <script>
export default { export default {
inject: ['vuecal', 'utils', 'modules', 'view', 'domEvents', 'editEvents'], inject: ["vuecal", "utils", "modules", "view", "domEvents", "editEvents"],
props: { props: {
cellFormattedDate: { type: String, default: '' }, cellFormattedDate: { type: String, default: "" },
event: { type: Object, default: () => ({}) }, event: { type: Object, default: () => ({}) },
cellEvents: { type: Array, default: () => [] }, cellEvents: { type: Array, default: () => [] },
overlaps: { type: Array, default: () => [] }, overlaps: { type: Array, default: () => [] },
@@ -42,7 +45,7 @@ export default {
// one starting first to the last. (See utils/event.js > checkCellOverlappingEvents) // one starting first to the last. (See utils/event.js > checkCellOverlappingEvents)
eventPosition: { type: Number, default: 0 }, eventPosition: { type: Number, default: 0 },
overlapsStreak: { type: Number, default: 0 }, overlapsStreak: { type: Number, default: 0 },
allDay: { type: Boolean, default: false } // Is the event displayed in the all-day bar. allDay: { type: Boolean, default: false }, // Is the event displayed in the all-day bar.
}, },
data: () => ({ data: () => ({
@@ -53,8 +56,8 @@ export default {
startY: 0, startY: 0,
// Detect if the event touch start + touch end was a drag or a tap. // Detect if the event touch start + touch end was a drag or a tap.
// If it was a drag, don't call the event-click handler. // If it was a drag, don't call the event-click handler.
dragged: false dragged: false,
} },
}), }),
methods: { methods: {
@@ -62,30 +65,34 @@ export default {
* On event mousedown. * On event mousedown.
* Do not prevent propagation to trigger cell mousedown which highlights the cell if not highlighted. * Do not prevent propagation to trigger cell mousedown which highlights the cell if not highlighted.
*/ */
onMouseDown (e, touch = false) { onMouseDown(e, touch = false) {
// Prevent a double mouse down on touch devices. // Prevent a double mouse down on touch devices.
if ('ontouchstart' in window && !touch) return false if ("ontouchstart" in window && !touch) return false;
const { clickHoldAnEvent, focusAnEvent, resizeAnEvent, dragAnEvent } = this.domEvents const { clickHoldAnEvent, focusAnEvent, resizeAnEvent, dragAnEvent } =
this.domEvents;
// If the delete button is already out and event is on focus then delete event. // If the delete button is already out and event is on focus then delete event.
// Return true so the event-click function (if any) is not called. // Return true so the event-click function (if any) is not called.
if (focusAnEvent._eid === this.event._eid && clickHoldAnEvent._eid === this.event._eid) { if (
return true focusAnEvent._eid === this.event._eid &&
clickHoldAnEvent._eid === this.event._eid
) {
return true;
} }
// Focus the clicked event. // Focus the clicked event.
this.focusEvent() this.focusEvent();
clickHoldAnEvent._eid = null // Reinit click hold on each click. clickHoldAnEvent._eid = null; // Reinit click hold on each click.
// Show event delete button. // Show event delete button.
if (this.vuecal.editEvents.delete && this.event.deletable) { if (this.vuecal.editEvents.delete && this.event.deletable) {
clickHoldAnEvent.timeoutId = setTimeout(() => { clickHoldAnEvent.timeoutId = setTimeout(() => {
if (!resizeAnEvent._eid && !dragAnEvent._eid) { if (!resizeAnEvent._eid && !dragAnEvent._eid) {
clickHoldAnEvent._eid = this.event._eid clickHoldAnEvent._eid = this.event._eid;
this.event.deleting = true this.event.deleting = true;
} }
}, clickHoldAnEvent.timeout) }, clickHoldAnEvent.timeout);
} }
}, },
@@ -95,199 +102,248 @@ export default {
* All mouseup on event, should be put there to avoid conflicts with other cases. * All mouseup on event, should be put there to avoid conflicts with other cases.
* This function is also called on touchend on the event. * This function is also called on touchend on the event.
*/ */
onMouseUp (e) { onMouseUp(e) {
// Don't allow mouseup to be fired on different event than mousedown for the onEventClick function. // Don't allow mouseup to be fired on different event than mousedown for the onEventClick function.
if (this.domEvents.focusAnEvent._eid === this.event._eid && !this.touch.dragged) { if (
this.domEvents.focusAnEvent._eid === this.event._eid &&
!this.touch.dragged
) {
// This is used in the global mouseup handler. // This is used in the global mouseup handler.
this.domEvents.focusAnEvent.mousedUp = true this.domEvents.focusAnEvent.mousedUp = true;
} }
this.touch.dragged = false // After the touchend happens, reset the dragged flag. this.touch.dragged = false; // After the touchend happens, reset the dragged flag.
}, },
onMouseEnter (e) { onMouseEnter(e) {
e.preventDefault() e.preventDefault();
this.vuecal.emitWithEvent('event-mouse-enter', this.event) this.vuecal.emitWithEvent("event-mouse-enter", this.event);
}, },
onMouseLeave (e) { onMouseLeave(e) {
e.preventDefault() e.preventDefault();
this.vuecal.emitWithEvent('event-mouse-leave', this.event) this.vuecal.emitWithEvent("event-mouse-leave", this.event);
}, },
// Detect if user taps on an event or drags it. If dragging, don't fire the event-click handler (if any). // Detect if user taps on an event or drags it. If dragging, don't fire the event-click handler (if any).
onTouchMove (e) { onTouchMove(e) {
// Skip the maths if there is no event click handler. // Skip the maths if there is no event click handler.
if (typeof this.vuecal.onEventClick !== 'function') return if (typeof this.vuecal.onEventClick !== "function") return;
const { clientX, clientY } = e.touches[0] const { clientX, clientY } = e.touches[0];
const { startX, startY, dragThreshold } = this.touch const { startX, startY, dragThreshold } = this.touch;
if (Math.abs(clientX - startX) > dragThreshold || Math.abs(clientY - startY) > dragThreshold) { if (
this.touch.dragged = true Math.abs(clientX - startX) > dragThreshold ||
Math.abs(clientY - startY) > dragThreshold
) {
this.touch.dragged = true;
} }
}, },
onTouchStart (e) { onTouchStart(e) {
this.touch.startX = e.touches[0].clientX this.touch.startX = e.touches[0].clientX;
this.touch.startY = e.touches[0].clientY this.touch.startY = e.touches[0].clientY;
this.onMouseDown(e, true) this.onMouseDown(e, true);
}, },
onEnterKeypress (e) { onEnterKeypress(e) {
if (typeof this.vuecal.onEventClick === 'function') return this.vuecal.onEventClick(this.event, e) if (typeof this.vuecal.onEventClick === "function")
return this.vuecal.onEventClick(this.event, e);
}, },
onDblClick (e) { onDblClick(e) {
if (typeof this.vuecal.onEventDblclick === 'function') return this.vuecal.onEventDblclick(this.event, e) if (typeof this.vuecal.onEventDblclick === "function")
return this.vuecal.onEventDblclick(this.event, e);
}, },
onDragStart (e) { onDragStart(e) {
this.dnd && this.dnd.eventDragStart(e, this.event) console.log(`ID from dragStart: ${this.event.id}`)
this.event.draggingStatic = false
this.dnd && this.dnd.eventDragStart(e, this.event);
}, },
onDragEnd () { onDragEnd() {
this.dnd && this.dnd.eventDragEnd(this.event) this.dnd && this.dnd.eventDragEnd(this.event);
}, },
onResizeHandleMouseDown () { onResizeHandleMouseDown() {
this.focusEvent() this.focusEvent();
this.domEvents.dragAnEvent._eid = null this.domEvents.dragAnEvent._eid = null;
this.domEvents.resizeAnEvent = Object.assign(this.domEvents.resizeAnEvent, { this.domEvents.resizeAnEvent = Object.assign(
this.domEvents.resizeAnEvent,
{
_eid: this.event._eid, _eid: this.event._eid,
start: (this.segment || this.event).start, start: (this.segment || this.event).start,
split: this.event.split || null, split: this.event.split || null,
segment: !!this.segment && this.utils.date.formatDateLite(this.segment.start), segment:
!!this.segment &&
this.utils.date.formatDateLite(this.segment.start),
originalEnd: new Date((this.segment || this.event).end), originalEnd: new Date((this.segment || this.event).end),
originalEndTimeMinutes: this.event.endTimeMinutes originalEndTimeMinutes: this.event.endTimeMinutes,
}) }
);
this.event.resizing = true this.event.resizing = true;
}, },
deleteEvent (touch = false) { deleteEvent(touch = false) {
// Prevent a double mouse down on touch devices. // Prevent a double mouse down on touch devices.
if ('ontouchstart' in window && !touch) return false if ("ontouchstart" in window && !touch) return false;
this.utils.event.deleteAnEvent(this.event) this.utils.event.deleteAnEvent(this.event);
}, },
touchDeleteEvent (event) { touchDeleteEvent(event) {
this.deleteEvent(true) this.deleteEvent(true);
}, },
cancelDeleteEvent () { cancelDeleteEvent() {
this.event.deleting = false this.event.deleting = false;
}, },
focusEvent () { focusEvent() {
const { focusAnEvent } = this.domEvents const { focusAnEvent } = this.domEvents;
const focusedEvent = focusAnEvent._eid const focusedEvent = focusAnEvent._eid;
// If event is already focus cancel refocusing. // If event is already focus cancel refocusing.
if (focusedEvent === this.event._eid) return if (focusedEvent === this.event._eid) return;
// Unfocus previous event if any. // Unfocus previous event if any.
else if (focusedEvent) { else if (focusedEvent) {
const event = this.view.events.find(e => e._eid === focusedEvent) const event = this.view.events.find((e) => e._eid === focusedEvent);
if (event) event.focused = false if (event) event.focused = false;
} }
// Cancel delete on previous event if any. // Cancel delete on previous event if any.
this.vuecal.cancelDelete() this.vuecal.cancelDelete();
this.vuecal.emitWithEvent('event-focus', this.event) this.vuecal.emitWithEvent("event-focus", this.event);
focusAnEvent._eid = this.event._eid focusAnEvent._eid = this.event._eid;
this.event.focused = true this.event.focused = true;
} },
}, },
computed: { computed: {
eventDimensions () { eventDimensions() {
const { startTimeMinutes, endTimeMinutes } = this.segment || this.event const { startTimeMinutes, endTimeMinutes } = this.segment || this.event;
// Top of event. // Top of event.
let minutesFromTop = startTimeMinutes - this.vuecal.timeFrom let minutesFromTop = startTimeMinutes - this.vuecal.timeFrom;
const top = Math.max(Math.round(minutesFromTop * this.vuecal.timeCellHeight / this.vuecal.timeStep), 0) const top = Math.max(
Math.round(
(minutesFromTop * this.vuecal.timeCellHeight) / this.vuecal.timeStep
),
0
);
// Bottom of event. // Bottom of event.
minutesFromTop = Math.min(endTimeMinutes, this.vuecal.timeTo) - this.vuecal.timeFrom minutesFromTop =
const bottom = Math.round(minutesFromTop * this.vuecal.timeCellHeight / this.vuecal.timeStep) Math.min(endTimeMinutes, this.vuecal.timeTo) - this.vuecal.timeFrom;
const bottom = Math.round(
(minutesFromTop * this.vuecal.timeCellHeight) / this.vuecal.timeStep
);
const height = Math.max(bottom - top, 5) // Min height is 5px. const height = Math.max(bottom - top, 5); // Min height is 5px.
return { top, height } return { top, height };
}, },
eventStyles () { eventStyles() {
if (this.event.allDay || !this.vuecal.time || !this.event.endTimeMinutes || this.view.id === 'month' || this.allDay) return {} if (
this.event.allDay ||
!this.vuecal.time ||
!this.event.endTimeMinutes ||
this.view.id === "month" ||
this.allDay
)
return {};
// let width = 100 / Math.min(this.overlaps.length + 1, this.overlapsStreak) // let width = 100 / Math.min(this.overlaps.length + 1, this.overlapsStreak)
// let left = (100 - ((this.overlaps.length + 1) * 10 )) * this.eventPosition // let left = (100 - ((this.overlaps.length + 1) * 10 )) * this.eventPosition
let width = 100 - (this.eventPosition * 10) let width = 100 - this.eventPosition * 10;
let left = 10 * this.eventPosition / 2 let left = (10 * this.eventPosition) / 2;
let zIdnex = (this.eventPosition + 1) * 10 let zIdnex = (this.eventPosition + 1) * 10;
let background = this.event.master_task_color let background = this.event.master_task_color;
if (this.vuecal.minEventWidth && width < this.vuecal.minEventWidth) { if (this.vuecal.minEventWidth && width < this.vuecal.minEventWidth) {
width = this.vuecal.minEventWidth width = this.vuecal.minEventWidth;
left = ((100 - this.vuecal.minEventWidth) / this.overlaps.length) * this.eventPosition left =
((100 - this.vuecal.minEventWidth) / this.overlaps.length) *
this.eventPosition;
} }
const { top, height } = this.eventDimensions const { top, height } = this.eventDimensions;
return { return {
"background": background, background: background,
"z-index": `${zIdnex}`, "z-index": `${zIdnex}`,
top: `${top}px`, top: `${top}px`,
height: `${height}px`, height: `${height}px`,
width: `${width}%`, width: `${width}%`,
left: (this.event.left && `${this.event.left}px`) || `${left}%` left: (this.event.left && `${this.event.left}px`) || `${left}%`,
} };
}, },
// Don't rely on global variables otherwise whenever it would change all the events would be redrawn. // Don't rely on global variables otherwise whenever it would change all the events would be redrawn.
eventClasses () { eventClasses() {
const { isFirstDay, isLastDay } = this.segment || {} const { isFirstDay, isLastDay } = this.segment || {};
return { return {
[this.event.class]: !!this.event.class, [this.event.class]: !!this.event.class,
'event-blocker': this.event.is_blocker, "event-blocker": this.event.is_blocker,
'vuecal__event--focus': this.event.focused, "vuecal__event--focus": this.event.focused,
'vuecal__event--resizing': this.event.resizing, "vuecal__event--resizing": this.event.resizing,
'vuecal__event--background': this.event.background, "vuecal__event--background": this.event.background,
'vuecal__event--deletable': this.event.deleting, "vuecal__event--deletable": this.event.deleting,
'vuecal__event--all-day': this.event.allDay, "vuecal__event--all-day": this.event.allDay,
// Only apply the dragging class on the event copy that is being dragged. // Only apply the dragging class on the event copy that is being dragged.
'vuecal__event--dragging': !this.event.draggingStatic && this.event.dragging, "vuecal__event--dragging":
!this.event.draggingStatic && this.event.dragging,
// Only apply the static class on the event original that remains static while a copy is being dragged. // Only apply the static class on the event original that remains static while a copy is being dragged.
// Sometimes when dragging fast the static class would get stuck and events stays invisible, // Sometimes when dragging fast the static class would get stuck and events stays invisible,
// So if dragging is false disable the static class as well. // So if dragging is false disable the static class as well.
'vuecal__event--static': this.event.dragging && this.event.draggingStatic, "vuecal__event--static":
this.event.dragging && this.event.draggingStatic,
// Multiple days events. // Multiple days events.
'vuecal__event--multiple-days': !!this.segment, "vuecal__event--multiple-days": !!this.segment,
'event-start': this.segment && isFirstDay && !isLastDay, "event-start": this.segment && isFirstDay && !isLastDay,
'event-middle': this.segment && !isFirstDay && !isLastDay, "event-middle": this.segment && !isFirstDay && !isLastDay,
'event-end': this.segment && isLastDay && !isFirstDay "event-end": this.segment && isLastDay && !isFirstDay,
} };
}, },
// When multiple-day events, a segment is a portion of event spanning on 1 day. // When multiple-day events, a segment is a portion of event spanning on 1 day.
segment () { segment() {
return (this.event.segments && this.event.segments[this.cellFormattedDate]) || null return (
(this.event.segments && this.event.segments[this.cellFormattedDate]) ||
null
);
}, },
draggable () { draggable() {
const { draggable, background, daysCount } = this.event const { draggable, background, daysCount } = this.event;
return this.vuecal.editEvents.drag && draggable && !background && daysCount === 1 return (
this.vuecal.editEvents.drag &&
draggable &&
!background &&
daysCount === 1
);
}, },
resizable () { resizable() {
const { editEvents, time } = this.vuecal const { editEvents, time } = this.vuecal;
return (editEvents.resize && this.event.resizable && time && !this.allDay && return (
(!this.segment || (this.segment && this.segment.isLastDay)) && this.view.id !== 'month') editEvents.resize &&
this.event.resizable &&
time &&
!this.allDay &&
(!this.segment || (this.segment && this.segment.isLastDay)) &&
this.view.id !== "month"
);
}, },
// Drag & drop module. // Drag & drop module.
dnd () { dnd() {
return this.modules.dnd return this.modules.dnd;
} },
} },
} };
</script> </script>
<style lang="scss"> <style lang="scss">
@@ -300,17 +356,25 @@ export default {
width: 100%; width: 100%;
z-index: 1; z-index: 1;
transition: box-shadow 0.3s, left 0.3s, width 0.3s; transition: box-shadow 0.3s, left 0.3s, width 0.3s;
overflow: hidden;// For sliding delete button. overflow: hidden; // For sliding delete button.
// If nothing is shown inside, still make the event visible. // If nothing is shown inside, still make the event visible.
.vuecal--no-time & {min-height: 8px;} .vuecal--no-time & {
min-height: 8px;
}
.vuecal:not(.vuecal--dragging-event) &:hover {z-index: 2;} .vuecal:not(.vuecal--dragging-event) &:hover {
z-index: 2;
}
// Reactivate user selection in events. // Reactivate user selection in events.
.vuecal__cell & * {user-select: text;} .vuecal__cell & * {
user-select: text;
}
.vuecal--view-with-time &:not(&--all-day) {position: absolute;} .vuecal--view-with-time &:not(&--all-day) {
position: absolute;
}
.vuecal--view-with-time .vuecal__bg &--all-day { .vuecal--view-with-time .vuecal__bg &--all-day {
position: absolute; position: absolute;
@@ -327,16 +391,30 @@ export default {
left: 0; left: 0;
} }
&--background {z-index: 0;} &--background {
&--focus, &:focus {box-shadow: 1px 1px 6px rgba(0,0,0,0.2);z-index: 3;outline: none;} z-index: 0;
}
&--focus,
&:focus {
box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
z-index: 3;
outline: none;
}
&.vuecal__event--dragging {opacity: 0.7;} &.vuecal__event--dragging {
&.vuecal__event--static {opacity: 0;transition: opacity 0.1s;} opacity: 0.7;
}
&.vuecal__event--static {
opacity: 0;
transition: opacity 0.1s;
}
} }
// Firefox sets a half opacity already, so don't dim the element being dragged. // Firefox sets a half opacity already, so don't dim the element being dragged.
@-moz-document url-prefix() { @-moz-document url-prefix() {
.vuecal__event.vuecal__event--dragging {opacity: 1;} .vuecal__event.vuecal__event--dragging {
opacity: 1;
}
} }
.vuecal__event-resize-handle { .vuecal__event-resize-handle {
@@ -354,8 +432,13 @@ export default {
.vuecal__event:hover &, .vuecal__event:hover &,
.vuecal__event:focus &, .vuecal__event:focus &,
.vuecal__event--focus &, .vuecal__event--focus &,
.vuecal__event--resizing & {opacity: 1;transform: translateY(0);} .vuecal__event--resizing & {
.vuecal__event--dragging & {display: none;} opacity: 1;
transform: translateY(0);
}
.vuecal__event--dragging & {
display: none;
}
} }
.vuecal__event-delete { .vuecal__event-delete {
@@ -375,21 +458,26 @@ export default {
cursor: pointer; cursor: pointer;
transform: translateY(-110%); transform: translateY(-110%);
transition: 0.3s; transition: 0.3s;
.vuecal__event & {user-select: none;} .vuecal__event & {
user-select: none;
}
.vuecal--full-height-delete & { .vuecal--full-height-delete & {
height: auto; height: auto;
bottom: 0; bottom: 0;
&:before { &:before {
content: ''; content: "";
width: 1.7em; width: 1.7em;
height: 1.8em; height: 1.8em;
display: block; display: block;
background-image: url('data:image/svg+xml;utf8,<svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.5a10.5 10.5 0 100 21 10.5 10.5 0 000-21zm5 14.1c.2 0 .2.2.2.2l-.1.3-1 1-.3.1h-.2L12 13.5l-3.5 3.6h-.3-.3l-1-1v-.4-.2l3.6-3.6-3.6-3.5A.4.4 0 017 8l1-1 .3-.2c.1 0 .2 0 .2.2l3.6 3.5L15.6 7l.2-.2c.1 0 .2 0 .3.2l1 1v.5L13.5 12z" fill="%23fff" opacity=".9"/></svg>'); background-image: url('data:image/svg+xml;utf8,<svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg"><path d="M12 1.5a10.5 10.5 0 100 21 10.5 10.5 0 000-21zm5 14.1c.2 0 .2.2.2.2l-.1.3-1 1-.3.1h-.2L12 13.5l-3.5 3.6h-.3-.3l-1-1v-.4-.2l3.6-3.6-3.6-3.5A.4.4 0 017 8l1-1 .3-.2c.1 0 .2 0 .2.2l3.6 3.5L15.6 7l.2-.2c.1 0 .2 0 .3.2l1 1v.5L13.5 12z" fill="%23fff" opacity=".9"/></svg>');
} }
} }
.vuecal__event--deletable & {transform: translateY(0);z-index: 1;} .vuecal__event--deletable & {
transform: translateY(0);
z-index: 1;
}
.vuecal__event--deletable.vuecal__event--dragging & { .vuecal__event--deletable.vuecal__event--dragging & {
opacity: 0; opacity: 0;
transition: none; transition: none;
@@ -425,7 +513,8 @@ export default {
outline: none; outline: none;
width: 100%; width: 100%;
&:hover, &:focus { &:hover,
&:focus {
border-color: rgba(0, 0, 0, 0.4); border-color: rgba(0, 0, 0, 0.4);
background-position: 99% 0.15em; background-position: 99% 0.15em;
background-size: 1.2em; background-size: 1.2em;
app/src/plugins/tm@dashboard/tasks/tasks.vue
+1 -1
View File
@@ -80,7 +80,7 @@ export default {
}, },
async onEventMoved(event) { async onEventMoved(event) {
console.log(event) console.log(`ID from dragStop: ${event.event.id}`)
// try { // try {
// await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: event.event.start, end: event.event.end}) // await this.$axios.post_auth_data(`v1/overview/tasks/${event.event.id}`, {start: event.event.start, end: event.event.end})
// } catch(error) { // } catch(error) {