diff --git a/src/views/Dashboard/components/CalendarPanel.tsx b/src/views/Dashboard/components/CalendarPanel.tsx index 3f0a3730..230dd4d2 100644 --- a/src/views/Dashboard/components/CalendarPanel.tsx +++ b/src/views/Dashboard/components/CalendarPanel.tsx @@ -25,11 +25,6 @@ import { Center, Tooltip, Icon, - Input, - FormControl, - FormLabel, - Textarea, - Select, Tag, TagLabel, TagLeftIcon, @@ -50,23 +45,13 @@ import dayjs, { Dayjs } from 'dayjs'; import 'dayjs/locale/zh-cn'; import { usePlanningData } from './PlanningContext'; -import type { InvestmentEvent, EventType } from '@/types'; +import { EventFormModal } from './EventFormModal'; +import type { InvestmentEvent } from '@/types'; import { logger } from '@/utils/logger'; import { getApiBase } from '@/utils/apiConfig'; dayjs.locale('zh-cn'); -/** - * 新事件表单数据类型 - */ -interface NewEventForm { - title: string; - description: string; - type: EventType; - importance: number; - stocks: string; -} - /** * FullCalendar 事件类型 */ @@ -96,18 +81,13 @@ export const CalendarPanel: React.FC = () => { secondaryText, } = usePlanningData(); + // 详情弹窗 const { isOpen, onOpen, onClose } = useDisclosure(); - const { isOpen: isAddOpen, onOpen: onAddOpen, onClose: onAddClose } = useDisclosure(); + // 添加弹窗状态 + const [isAddModalOpen, setIsAddModalOpen] = useState(false); const [selectedDate, setSelectedDate] = useState(null); const [selectedDateEvents, setSelectedDateEvents] = useState([]); - const [newEvent, setNewEvent] = useState({ - title: '', - description: '', - type: 'plan', - importance: 3, - stocks: '', - }); // 转换数据为 FullCalendar 格式 const calendarEvents: CalendarEvent[] = allEvents.map(event => ({ @@ -149,61 +129,15 @@ export const CalendarPanel: React.FC = () => { onOpen(); }; - // 添加新事件 - const handleAddEvent = async (): Promise => { - try { - const base = getApiBase(); + // 打开添加弹窗 + const handleOpenAddModal = (): void => { + onClose(); // 先关闭详情弹窗 + setIsAddModalOpen(true); + }; - const eventData = { - ...newEvent, - event_date: (selectedDate ? selectedDate.format('YYYY-MM-DD') : dayjs().format('YYYY-MM-DD')), - stocks: newEvent.stocks.split(',').map(s => s.trim()).filter(s => s), - }; - - const response = await fetch(base + '/api/account/calendar/events', { - method: 'POST', - headers: { - 'Content-Type': 'application/json', - }, - credentials: 'include', - body: JSON.stringify(eventData), - }); - - if (response.ok) { - const data = await response.json(); - if (data.success) { - logger.info('CalendarPanel', '添加事件成功', { - eventTitle: eventData.title, - eventDate: eventData.event_date - }); - toast({ - title: '添加成功', - description: '投资计划已添加', - status: 'success', - duration: 3000, - }); - onAddClose(); - loadAllData(); - setNewEvent({ - title: '', - description: '', - type: 'plan', - importance: 3, - stocks: '', - }); - } - } - } catch (error) { - logger.error('CalendarPanel', 'handleAddEvent', error, { - eventTitle: newEvent?.title - }); - toast({ - title: '添加失败', - description: '无法添加投资计划', - status: 'error', - duration: 3000, - }); - } + // 关闭添加弹窗 + const handleCloseAddModal = (): void => { + setIsAddModalOpen(false); }; // 删除事件 @@ -300,10 +234,7 @@ export const CalendarPanel: React.FC = () => { size="sm" colorScheme="purple" leftIcon={} - onClick={() => { - onClose(); - onAddOpen(); - }} + onClick={handleOpenAddModal} > 添加投资计划 @@ -397,88 +328,24 @@ export const CalendarPanel: React.FC = () => { )} - {/* 添加投资计划 Modal */} - {isAddOpen && ( - - - - - 添加投资计划 - - - - - - 标题 - setNewEvent({ ...newEvent, title: e.target.value })} - placeholder="例如:关注半导体板块" - /> - - - - 描述 -