adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-16 20:22:15 +01:00
Code Issues Packages Projects Releases Wiki Activity

keep calendar event data while resizing event

Browse Source
This commit is contained in:
Gregor Vostrak
2026-03-03 15:00:46 +01:00
parent 452acca942
commit 02f6436fd0
2 changed files with 23 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/js/packages/ui/src/FullCalendar/FullCalendarEventContent.vue
View File

@@ -51,7 +51,7 @@ const formattedDuration = computed(() =>
<div v-if="clientName" class="opacity-85"> <div v-if="clientName" class="opacity-85">
{{ clientName }} {{ clientName }}
</div> </div>
<div class="opacity-90"> <div class="opacity-90" data-duration>
{{ formattedDuration }} {{ formattedDuration }}
</div> </div>
</div> </div>

23
resources/js/packages/ui/src/FullCalendar/useVisualSnap.ts
View File

@@ -38,6 +38,21 @@ export function useVisualSnap({
return { mirror, harness }; return { mirror, harness };
} }
/**
* Copy the Vue-rendered event content from the original event into the
* FC mirror element (which only gets FC's default time-only rendering).
*/
function copyEventContentToMirror(calendarEl: HTMLElement, mirror: HTMLElement) {
const originalEvent = calendarEl.querySelector(
'.fc-event-resizing:not(.fc-event-mirror), .fc-event-dragging:not(.fc-event-mirror)'
) as HTMLElement | null;
if (!originalEvent) return;
const originalMain = originalEvent.querySelector('.fc-event-main') as HTMLElement | null;
const mirrorMain = mirror.querySelector('.fc-event-main') as HTMLElement | null;
if (!originalMain || !mirrorMain) return;
mirrorMain.innerHTML = originalMain.innerHTML;
}
function updateMirrorDurationLabel( function updateMirrorDurationLabel(
mirror: HTMLElement, mirror: HTMLElement,
snappedTop: number, snappedTop: number,
@@ -46,7 +61,7 @@ export function useVisualSnap({
) { ) {
const snappedDurationMin = Math.round((snappedEnd - snappedTop) / snapPx) * snapMinutes(); const snappedDurationMin = Math.round((snappedEnd - snappedTop) / snapPx) * snapMinutes();
const durationText = formatDuration(snappedDurationMin * 60); const durationText = formatDuration(snappedDurationMin * 60);
const durationEl = mirror.querySelector('.fc-event-main')?.querySelector('div:last-child'); const durationEl = mirror.querySelector('[data-duration]');
if (durationEl) { if (durationEl) {
durationEl.textContent = durationText; durationEl.textContent = durationText;
} }
@@ -115,11 +130,17 @@ export function useVisualSnap({
let initialTop: number | null = null; let initialTop: number | null = null;
let initialEnd: number | null = null; let initialEnd: number | null = null;
let resizeEdge: 'top' | 'bottom' | null = null; let resizeEdge: 'top' | 'bottom' | null = null;
let contentCopied = false;
startLoop((calendarEl, snapPx) => { startLoop((calendarEl, snapPx) => {
const { mirror, harness } = findMirrorHarness(calendarEl); const { mirror, harness } = findMirrorHarness(calendarEl);
if (!harness) return; if (!harness) return;
if (mirror && !contentCopied) {
copyEventContentToMirror(calendarEl, mirror);
contentCopied = true;
}
const top = parseFloat(harness.style.top) || 0; const top = parseFloat(harness.style.top) || 0;
const endPos = -(parseFloat(harness.style.bottom) || 0); const endPos = -(parseFloat(harness.style.bottom) || 0);