fixed day view visual bug

This commit is contained in:
Kyle 2026-02-19 20:38:11 +08:00
parent a352a50b63
commit d5080f59af

View File

@ -1,4 +1,4 @@
import { useState } from 'react';
import { useState, useRef } from 'react';
import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
import { toast } from 'sonner';
import FullCalendar from '@fullcalendar/react';
@ -12,6 +12,7 @@ import EventForm from './EventForm';
export default function CalendarPage() {
const queryClient = useQueryClient();
const calendarRef = useRef<FullCalendar>(null);
const [showForm, setShowForm] = useState(false);
const [editingEvent, setEditingEvent] = useState<CalendarEvent | null>(null);
const [selectedStart, setSelectedStart] = useState<string | null>(null);
@ -130,6 +131,9 @@ export default function CalendarPage() {
};
const handleDateSelect = (selectInfo: DateSelectArg) => {
// Clear the selection mirror immediately so it doesn't vanish
// jarringly when the user clicks into the form's title field
calendarRef.current?.getApi().unselect();
setSelectedStart(selectInfo.startStr);
setSelectedEnd(selectInfo.endStr);
setSelectedAllDay(selectInfo.allDay);
@ -153,6 +157,7 @@ export default function CalendarPage() {
<div className="flex-1 overflow-y-auto p-6">
<div className="bg-card rounded-lg border p-4">
<FullCalendar
ref={calendarRef}
plugins={[dayGridPlugin, timeGridPlugin, interactionPlugin]}
initialView="dayGridMonth"
headerToolbar={{