vf_react

Files

zdl 03159f90dd feat: 增强历史事件对比卡片交互，支持点击跳转事件详情

功能新增：
- 点击事件卡片跳转到事件详情页（/event-detail/:eventId）
- 点击事件标题跳转到事件详情页（带下划线 hover 效果）
- "相关股票"按钮独立触发弹窗，不影响卡片跳转

组件修改：
- HistoricalEvents.js:
  * 导入 useNavigate hook 用于路由跳转
  * 添加 handleCardClick 函数处理跳转逻辑
  * 事件卡片添加 cursor="pointer" 和 onClick 事件
  * 优化卡片 hover 效果（阴影、边框色、上浮动画）
  * 标题添加独立的点击事件和下划线 hover 效果
  * "相关股票"按钮添加 stopPropagation 阻止事件冒泡

交互优化：
- 卡片 hover: boxShadow 从 md → lg，边框从 blue.300 → blue.400
- 卡片 hover: 添加 translateY(-2px) 上浮效果
- 标题 hover: 添加下划线提示可点击
- 光标样式: 卡片和标题都显示 pointer

事件冒泡控制：
- 标题点击: stopPropagation 后再触发跳转（保持一致性）
- 相关股票按钮: stopPropagation 防止触发卡片跳转
- 确保各个点击区域互不干扰

用户体验提升：
- 多种点击方式提供便利性（整个卡片、标题）
- 更明显的视觉反馈（hover 效果、光标变化）
- 精确的交互控制，避免误触发

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

2025-11-03 13:08:07 +08:00