fix: 清理未使用代码

InvestmentPlanningCenter.tsx | 移除 activeTab / setActiveTab state 和 Context PlansPanel.tsx | 移除 FiPlus、FiTarget，统一使用 FiFileText ReviewsPanel.tsx | 移除未使用的 FiPlus 导入 investment.ts | 移除 activeTab / setActiveTab 类型定义
2025-12-05 11:09:49 +08:00
parent 20994cfb13
commit 90a59e031c
5 changed files with 108 additions and 107 deletions
--- a/src/types/investment.ts
+++ b/src/types/investment.ts
@@ -115,11 +115,11 @@ export interface PlanningContextValue {
  /** 设置加载状态 */
  setLoading: React.Dispatch<React.SetStateAction<boolean>>;

-  /** 当前激活的标签页索引 (0: 日历, 1: 计划, 2: 复盘) */
-  activeTab: number;
+  /** 打开新建计划模态框的触发计数器 */
+  openPlanModalTrigger?: number;

-  /** 设置激活的标签页 */
-  setActiveTab: React.Dispatch<React.SetStateAction<number>>;
+  /** 打开新建复盘模态框的触发计数器 */
+  openReviewModalTrigger?: number;

  /** Chakra UI Toast 实例 */
  toast: {
--- a/src/views/Dashboard/components/CalendarPanel.tsx
+++ b/src/views/Dashboard/components/CalendarPanel.tsx
@@ -258,20 +258,6 @@ export const CalendarPanel: React.FC = () => {

  return (
    <Box>
-      <Flex justify="flex-end" mb={4}>
-        <Button
-          size="sm"
-          colorScheme="purple"
-          leftIcon={<FiPlus />}
-          onClick={() => {
-            if (!selectedDate) setSelectedDate(dayjs());
-            onAddOpen();
-          }}
-        >
-          添加计划
-        </Button>
-      </Flex>
-
      {loading ? (
        <Center h="560px">
          <Spinner size="xl" color="purple.500" />
--- a/src/views/Dashboard/components/InvestmentPlanningCenter.tsx
+++ b/src/views/Dashboard/components/InvestmentPlanningCenter.tsx
@@ -33,11 +33,15 @@ import {
  TabPanel,
  Spinner,
  Center,
+  Button,
+  ButtonGroup,
 } from '@chakra-ui/react';
 import {
  FiCalendar,
  FiTarget,
  FiFileText,
+  FiList,
+  FiPlus,
 } from 'react-icons/fi';

 import { PlanningDataProvider } from './PlanningContext';
@@ -82,7 +86,10 @@ const InvestmentPlanningCenter: React.FC = () => {
  // 全局数据状态
  const [allEvents, setAllEvents] = useState<InvestmentEvent[]>([]);
  const [loading, setLoading] = useState<boolean>(false);
-  const [activeTab, setActiveTab] = useState<number>(0);
+  const [viewMode, setViewMode] = useState<'calendar' | 'list'>('list');
+  const [listTab, setListTab] = useState<number>(0); // 0: 我的计划, 1: 我的复盘
+  const [openPlanModalTrigger, setOpenPlanModalTrigger] = useState<number>(0);
+  const [openReviewModalTrigger, setOpenReviewModalTrigger] = useState<number>(0);

  /**
   * 加载所有事件数据（日历事件 + 计划 + 复盘）
@@ -124,8 +131,8 @@ const InvestmentPlanningCenter: React.FC = () => {
    loadAllData,
    loading,
    setLoading,
-    activeTab,
-    setActiveTab,
+    openPlanModalTrigger,
+    openReviewModalTrigger,
    toast,
    bgColor,
    borderColor,
@@ -147,53 +154,85 @@ const InvestmentPlanningCenter: React.FC = () => {
              <Icon as={FiTarget} color="purple.500" boxSize={5} />
              <Heading size="md">投资规划中心</Heading>
            </HStack>
+            {/* 视图切换按钮组 */}
+            <ButtonGroup size="sm" isAttached variant="outline">
+              <Button
+                leftIcon={<Icon as={FiList} />}
+                colorScheme={viewMode === 'list' ? 'purple' : 'gray'}
+                variant={viewMode === 'list' ? 'solid' : 'outline'}
+                onClick={() => setViewMode('list')}
+              >
+                列表视图
+              </Button>
+              <Button
+                leftIcon={<Icon as={FiCalendar} />}
+                colorScheme={viewMode === 'calendar' ? 'purple' : 'gray'}
+                variant={viewMode === 'calendar' ? 'solid' : 'outline'}
+                onClick={() => setViewMode('calendar')}
+              >
+                日历视图
+              </Button>
+            </ButtonGroup>
          </Flex>
        </CardHeader>
        <CardBody pt={0}>
-          <Tabs
-            index={activeTab}
-            onChange={setActiveTab}
-            variant="enclosed"
-            colorScheme="purple"
-          >
-            <TabList>
-              <Tab>
-                <Icon as={FiCalendar} mr={2} />
-                日历视图
-              </Tab>
-              <Tab>
-                <Icon as={FiTarget} mr={2} />
-                我的计划 ({planCount})
-              </Tab>
-              <Tab>
-                <Icon as={FiFileText} mr={2} />
-                我的复盘 ({reviewCount})
-              </Tab>
-            </TabList>
+          {viewMode === 'calendar' ? (
+            /* 日历视图 */
+            <Suspense fallback={<PanelLoadingFallback />}>
+              <CalendarPanel />
+            </Suspense>
+          ) : (
+            /* 列表视图：我的计划 / 我的复盘 切换 */
+            <Tabs
+              index={listTab}
+              onChange={setListTab}
+              variant="enclosed"
+              colorScheme="purple"
+            >
+              <Flex justify="space-between" align="center" mb={4}>
+                <TabList mb={0} borderBottom="none">
+                  <Tab>
+                    <Icon as={FiTarget} mr={2} />
+                    我的计划 ({planCount})
+                  </Tab>
+                  <Tab>
+                    <Icon as={FiFileText} mr={2} />
+                    我的复盘 ({reviewCount})
+                  </Tab>
+                </TabList>
+                <Button
+                  size="sm"
+                  colorScheme="purple"
+                  leftIcon={<Icon as={FiPlus} />}
+                  onClick={() => {
+                    if (listTab === 0) {
+                      setOpenPlanModalTrigger(prev => prev + 1);
+                    } else {
+                      setOpenReviewModalTrigger(prev => prev + 1);
+                    }
+                  }}
+                >
+                  {listTab === 0 ? '新建计划' : '新建复盘'}
+                </Button>
+              </Flex>

-            <TabPanels>
-              {/* 日历视图面板 */}
-              <TabPanel px={0}>
-                <Suspense fallback={<PanelLoadingFallback />}>
-                  <CalendarPanel />
-                </Suspense>
-              </TabPanel>
+              <TabPanels>
+                {/* 计划列表面板 */}
+                <TabPanel px={0}>
+                  <Suspense fallback={<PanelLoadingFallback />}>
+                    <PlansPanel />
+                  </Suspense>
+                </TabPanel>

-              {/* 计划列表面板 */}
-              <TabPanel px={0}>
-                <Suspense fallback={<PanelLoadingFallback />}>
-                  <PlansPanel />
-                </Suspense>
-              </TabPanel>
-
-              {/* 复盘列表面板 */}
-              <TabPanel px={0}>
-                <Suspense fallback={<PanelLoadingFallback />}>
-                  <ReviewsPanel />
-                </Suspense>
-              </TabPanel>
-            </TabPanels>
-          </Tabs>
+                {/* 复盘列表面板 */}
+                <TabPanel px={0}>
+                  <Suspense fallback={<PanelLoadingFallback />}>
+                    <ReviewsPanel />
+                  </Suspense>
+                </TabPanel>
+              </TabPanels>
+            </Tabs>
+          )}
        </CardBody>
      </Card>
    </PlanningDataProvider>
--- a/src/views/Dashboard/components/PlansPanel.tsx
+++ b/src/views/Dashboard/components/PlansPanel.tsx
@@ -3,7 +3,7 @@
 * 显示、编辑和管理投资计划
 */

-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import {
  Box,
  Button,
@@ -40,11 +40,10 @@ import {
  TagCloseButton,
 } from '@chakra-ui/react';
 import {
-  FiPlus,
  FiEdit2,
  FiTrash2,
  FiSave,
-  FiTarget,
+  FiFileText,
  FiCalendar,
  FiTrendingUp,
  FiHash,
@@ -85,6 +84,7 @@ export const PlansPanel: React.FC = () => {
    secondaryText,
    cardBg,
    borderColor,
+    openPlanModalTrigger,
  } = usePlanningData();

  const { isOpen, onOpen, onClose } = useDisclosure();
@@ -104,6 +104,13 @@ export const PlansPanel: React.FC = () => {
  // 筛选计划列表（排除系统事件）
  const plans = allEvents.filter(event => event.type === 'plan' && event.source !== 'future');

+  // 监听外部触发打开新建模态框
+  useEffect(() => {
+    if (openPlanModalTrigger && openPlanModalTrigger > 0) {
+      handleOpenModal(null);
+    }
+  }, [openPlanModalTrigger]);
+
  // 打开编辑/新建模态框
  const handleOpenModal = (item: InvestmentEvent | null = null): void => {
    if (item) {
@@ -263,7 +270,7 @@ export const PlansPanel: React.FC = () => {
            <Flex justify="space-between" align="start">
              <VStack align="start" spacing={1} flex={1}>
                <HStack>
-                  <Icon as={FiTarget} color="purple.500" />
+                  <Icon as={FiFileText} color="purple.500" />
                  <Text fontWeight="bold" fontSize="lg">
                    {item.title}
                  </Text>
@@ -337,17 +344,6 @@ export const PlansPanel: React.FC = () => {
  return (
    <Box>
      <VStack align="stretch" spacing={4}>
-        <Flex justify="flex-end">
-          <Button
-            size="sm"
-            colorScheme="purple"
-            leftIcon={<FiPlus />}
-            onClick={() => handleOpenModal(null)}
-          >
-            新建计划
-          </Button>
-        </Flex>
-
        {loading ? (
          <Center py={8}>
            <Spinner size="xl" color="purple.500" />
@@ -357,14 +353,6 @@ export const PlansPanel: React.FC = () => {
            <VStack spacing={3}>
              <Icon as={FiTarget} boxSize={12} color="gray.300" />
              <Text color={secondaryText}>暂无投资计划</Text>
-              <Button
-                size="sm"
-                colorScheme="purple"
-                leftIcon={<FiPlus />}
-                onClick={() => handleOpenModal(null)}
-              >
-                创建第一个计划
-              </Button>
            </VStack>
          </Center>
        ) : (
--- a/src/views/Dashboard/components/ReviewsPanel.tsx
+++ b/src/views/Dashboard/components/ReviewsPanel.tsx
@@ -3,7 +3,7 @@
 * 显示、编辑和管理投资复盘
 */

-import React, { useState } from 'react';
+import React, { useState, useEffect } from 'react';
 import {
  Box,
  Button,
@@ -40,7 +40,6 @@ import {
  TagCloseButton,
 } from '@chakra-ui/react';
 import {
-  FiPlus,
  FiEdit2,
  FiTrash2,
  FiSave,
@@ -85,6 +84,7 @@ export const ReviewsPanel: React.FC = () => {
    secondaryText,
    cardBg,
    borderColor,
+    openReviewModalTrigger,
  } = usePlanningData();

  const { isOpen, onOpen, onClose } = useDisclosure();
@@ -104,6 +104,13 @@ export const ReviewsPanel: React.FC = () => {
  // 筛选复盘列表（排除系统事件）
  const reviews = allEvents.filter(event => event.type === 'review' && event.source !== 'future');

+  // 监听外部触发打开新建模态框
+  useEffect(() => {
+    if (openReviewModalTrigger && openReviewModalTrigger > 0) {
+      handleOpenModal(null);
+    }
+  }, [openReviewModalTrigger]);
+
  // 打开编辑/新建模态框
  const handleOpenModal = (item: InvestmentEvent | null = null): void => {
    if (item) {
@@ -337,17 +344,6 @@ export const ReviewsPanel: React.FC = () => {
  return (
    <Box>
      <VStack align="stretch" spacing={4}>
-        <Flex justify="flex-end">
-          <Button
-            size="sm"
-            colorScheme="green"
-            leftIcon={<FiPlus />}
-            onClick={() => handleOpenModal(null)}
-          >
-            新建复盘
-          </Button>
-        </Flex>
-
        {loading ? (
          <Center py={8}>
            <Spinner size="xl" color="green.500" />
@@ -357,14 +353,6 @@ export const ReviewsPanel: React.FC = () => {
            <VStack spacing={3}>
              <Icon as={FiFileText} boxSize={12} color="gray.300" />
              <Text color={secondaryText}>暂无投资复盘</Text>
-              <Button
-                size="sm"
-                colorScheme="green"
-                leftIcon={<FiPlus />}
-                onClick={() => handleOpenModal(null)}
-              >
-                创建第一个复盘
-              </Button>
            </VStack>
          </Center>
        ) : (