Major new version #2
@ -2,12 +2,6 @@
|
||||
const props = defineProps({
|
||||
day: Object,
|
||||
})
|
||||
|
||||
const emit = defineEmits(['event-click'])
|
||||
|
||||
const handleEventClick = (eventId) => {
|
||||
emit('event-click', { id: eventId, instanceId: eventId, occurrenceIndex: 0 })
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -34,18 +28,6 @@ const handleEventClick = (eventId) => {
|
||||
{{ props.day.holiday.name }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<!-- Simple event display for now -->
|
||||
<div v-if="props.day.events && props.day.events.length > 0" class="day-events">
|
||||
<div
|
||||
v-for="event in props.day.events.slice(0, 3)"
|
||||
:key="event.id"
|
||||
class="event-dot"
|
||||
:class="`event-color-${event.colorId}`"
|
||||
:title="event.title"
|
||||
@click.stop="handleEventClick(event.id)"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -147,26 +129,4 @@ const handleEventClick = (eventId) => {
|
||||
overflow: hidden;
|
||||
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.day-events {
|
||||
position: absolute;
|
||||
top: 1.5em;
|
||||
right: 0.1em;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.1em;
|
||||
}
|
||||
|
||||
.event-dot {
|
||||
width: 0.6em;
|
||||
height: 0.6em;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
opacity: 0.8;
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.event-dot:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
@ -59,7 +59,6 @@ const handleEventClick = (payload) => {
|
||||
@touchstart="handleDayTouchStart(day.date)"
|
||||
@touchmove="handleDayTouchMove(day.date)"
|
||||
@touchend="handleDayTouchEnd(day.date)"
|
||||
@event-click="handleEventClick"
|
||||
/>
|
||||
<EventOverlay :week="props.week" @event-click="handleEventClick" />
|
||||
</div>
|
||||
|
Loading…
x
Reference in New Issue
Block a user