refactor(Center): 重构投资规划中心日历与事件管理

src/views/Center/components/EventPanel.tsx

@@ -24,11 +24,12 @@ import { FiFileText } from 'react-icons/fi';
 import { useAppDispatch, useAppSelector } from '@/store/hooks';
 import {
   fetchAllEvents,
-  deleteEvent,
+  removeEvent,
   selectPlans,
   selectReviews,
   selectPlanningLoading,
 } from '@/store/slices/planningSlice';
+import { getApiBase } from '@/utils/apiConfig';
 import { EventFormModal } from './EventFormModal';
 import { FUIEventCard } from './FUIEventCard';
 import type { InvestmentEvent } from '@/types';
@@ -104,22 +105,37 @@ export const EventPanel: React.FC<EventPanelProps> = ({
     setEditingItem(null);
   };
 
-  // 删除数据 - 使用 Redux action
+  // 删除数据 - 乐观更新模式
   const handleDelete = async (id: number): Promise<void> => {
     if (!window.confirm('确定要删除吗？')) return;
 
+    // ① 立即从 UI 移除
+    dispatch(removeEvent(id));
+
+    // ② 后台发送 API 请求
     try {
-      await dispatch(deleteEvent(id)).unwrap();
-      logger.info('EventPanel', `删除${label}成功`, { itemId: id });
-      toast({
-        title: '删除成功',
-        status: 'success',
-        duration: 2000,
+      const base = getApiBase();
+      const response = await fetch(`${base}/api/account/investment-plans/${id}`, {
+        method: 'DELETE',
+        credentials: 'include',
       });
+
+      if (response.ok) {
+        logger.info('EventPanel', `删除${label}成功`, { itemId: id });
+        toast({
+          title: '删除成功',
+          status: 'success',
+          duration: 2000,
+        });
+      } else {
+        throw new Error('删除失败');
+      }
     } catch (error) {
-      logger.error('EventPanel', 'handleDelete', error, { itemId: id });
+      // ③ 失败回滚 - 重新加载数据
+      dispatch(fetchAllEvents());
+      logger.error('EventPanel', 'handleDelete rollback', error, { itemId: id });
       toast({
-        title: '删除失败',
+        title: '删除失败，请重试',
         status: 'error',
         duration: 3000,
       });