diff --git a/src/views/Community/components/HeroPanel.js b/src/views/Community/components/HeroPanel.js
index ce151016..98803ca1 100644
--- a/src/views/Community/components/HeroPanel.js
+++ b/src/views/Community/components/HeroPanel.js
@@ -12,9 +12,16 @@ import {
Text,
Heading,
useColorModeValue,
+ useDisclosure,
Icon,
Spinner,
Center,
+ Modal,
+ ModalOverlay,
+ ModalContent,
+ ModalHeader,
+ ModalBody,
+ ModalCloseButton,
} from '@chakra-ui/react';
import { AlertCircle, Clock, TrendingUp, Info } from 'lucide-react';
import ReactECharts from 'echarts-for-react';
@@ -532,14 +539,14 @@ const FlowingConcepts = () => {
};
/**
- * 详细使用说明提示框
+ * 使用说明弹窗组件
*/
-const InfoTooltip = () => {
- const [isOpen, setIsOpen] = useState(false);
+const InfoModal = () => {
+ const { isOpen, onOpen, onClose } = useDisclosure();
return (
-
- {/* 触发器：小标签 */}
+ <>
+ {/* 触发按钮 */}
{
_hover={{
bg: 'rgba(255,215,0,0.15)',
borderColor: 'rgba(255,215,0,0.4)',
+ transform: 'scale(1.02)',
}}
- onMouseEnter={() => setIsOpen(true)}
- onMouseLeave={() => setIsOpen(false)}
- onClick={() => setIsOpen(!isOpen)}
+ onClick={onOpen}
>
@@ -563,132 +569,137 @@ const InfoTooltip = () => {
- {/* 悬浮提示框 */}
- setIsOpen(true)}
- onMouseLeave={() => setIsOpen(false)}
- >
- {/* 小箭头 */}
-
-
-
- {/* 标题 */}
-
- 📖 事件中心使用指南
-
-
- {/* 1. SABC重要度说明 */}
-
-
-
- 1️⃣ 重要度等级 (SABC)
-
-
-
-
- 重要度由 AI大模型
- 基于事件本身的影响范围和重大程度来判定，
- 并非收益率预测策略。
- S级表示影响范围广、关注度高的重大事件，C级表示影响较小的普通事件。
-
-
-
-
- {/* 2. 利好利空并存说明 */}
-
-
-
- 2️⃣ 事件筛选机制
-
-
-
-
- 事件列表中利好和
- 利空并存，需自行判断。
- 建议在「历史相关事件」中查看：
-
-
- • 历史上类似事件的市场反应
- • 事件的超预期程度
- • 综合判断事件的投资价值
-
-
-
-
- {/* 3. 数据延迟提醒 */}
-
+
+
+
-
-
-
- 3️⃣ 数据延迟提醒
+
+
+
+
+
+ 事件中心使用指南
-
- 由于模型需要通过算法检索和分析历史数据，事件结果和发生时间会有
- 2-3分钟 左右的延迟。
- 切勿追高！
-
-
+
+
- {/* 4. 盘前新闻经验 */}
-
-
-
-
- 4️⃣ 实用经验分享
-
-
-
- 一个比较有效的经验是在
- 9:20左右
- 研究上一交易日收盘后至盘前的新闻事件，
- 往往能发现一些当日主线题材。
-
-
+
+
+ {/* 1. SABC重要度说明 */}
+
+
+
+ 1️⃣ 重要度等级 (SABC)
+
+
+
+
+ 重要度由 AI大模型
+ 基于事件本身的影响范围和重大程度来判定，
+ 并非收益率预测策略。
+ S级表示影响范围广、关注度高的重大事件，C级表示影响较小的普通事件。
+
+
+
- {/* 操作提示 */}
-
-
- 💡 点击事件卡片查看详情 · K线图支持滚轮缩放
-
-
-
-
-
+ {/* 2. 利好利空并存说明 */}
+
+
+
+ 2️⃣ 事件筛选机制
+
+
+
+
+ 事件列表中利好和
+ 利空并存，需自行判断。
+ 建议在「历史相关事件」中查看：
+
+
+ • 历史上类似事件的市场反应
+ • 事件的超预期程度
+ • 综合判断事件的投资价值
+
+
+
+
+ {/* 3. 数据延迟提醒 */}
+
+
+
+
+ 3️⃣ 数据延迟提醒
+
+
+
+ 由于模型需要通过算法检索和分析历史数据，事件结果和发生时间会有
+ 2-3分钟 左右的延迟。
+ 切勿追高！
+
+
+
+ {/* 4. 盘前新闻经验 */}
+
+
+
+
+ 4️⃣ 实用经验分享
+
+
+
+ 一个比较有效的经验是在
+ 9:20左右
+ 研究上一交易日收盘后至盘前的新闻事件，
+ 往往能发现一些当日主线题材。
+
+
+
+ {/* 操作提示 */}
+
+
+ 💡 点击事件卡片查看详情 · K线图支持滚轮缩放和拖动
+
+
+
+
+
+
+
);
};
@@ -748,8 +759,8 @@ const HeroPanel = () => {
事件中心
- {/* 使用说明 - 悬浮提示 */}
-
+ {/* 使用说明 - 弹窗 */}
+
{/* 右侧：交易状态 */}