vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
569 Commits 30 Branches 1 Tag
d3b980b3ca42ce2bbeb72dfb19cbae06184719d9
Commit Graph

18 Commits

Author SHA1 Message Date
zzlgreat
d3b980b3ca update ui 2025-11-13 23:06:19 +08:00
zzlgreat
6113a3fefd update ui 2025-11-13 22:57:24 +08:00
zzlgreat
f0bb00a2ce update ui 2025-11-13 22:35:33 +08:00
zdl
44b8c64907 feat(community): 列表模式事件卡片高度自适应 2025-11-07 19:25:10 +08:00
zzlgreat
83cd875690 事件中心UI优化 2025-11-07 11:20:45 +08:00
zzlgreat
25d3bf4d95 事件中心UI优化 2025-11-07 11:08:06 +08:00
zzlgreat
3eff0554f9 事件中心UI优化 2025-11-07 10:56:08 +08:00
zdl
ad933e9fb2 feat: UI调整 2025-11-05 23:54:43 +08:00
zdl
612b58c983 feat: feat: 优化事件卡片 UI 和交互体验 
修复 useColorModeValue 调用位置（提升到顶层）
优化分页和滚动逻辑
动态 indicatorSize 支持（detail/list 模式）
 2025-11-05 19:15:36 +08:00
zdl
ca52d3bd87 feat: 纵向列表（HorizontalDynamicNewsEventCard.js:105-133） - 添加 Tooltip 提示 
平铺列表（DynamicNewsEventCard.js:232） - 修改行数限制
 2025-11-05 16:40:35 +08:00
zdl
62ae2e0803 feat: 提取 ImportanceBadge 组件 2025-11-05 16:15:18 +08:00
zdl
aa1a93c65b feat: 重要性徽章样式优化（圆形设计） 2025-11-05 15:19:02 +08:00
zdl
e0cfa6fab2 feat: 创建纵向模式的横向卡片组件 2025-11-05 08:26:05 +08:00
zdl
7e32dda2df feat本次提交包含的优化 
✅ StockChangeIndicators 组件优化

  - 调整 padding 使布局更紧凑
  - 修复窄卡片中的折行问题
  - 自动根据内容调整宽度

  ✅ 重要性等级视觉优化

  - 统一使用红色系（S→A→B→C：从深红到浅红）
  - 添加 badgeBg 字段支持新的角标样式

  ✅ DynamicNewsEventCard 卡片改版

  - 左上角矩形角标显示重要性（镂空边框样式）
  - 悬浮显示所有等级说明
  - 标题限制两行显示

  ✅ Mock 数据完整性

  - 添加缺失的 related_week_chg 字段
  - 确保三个涨跌幅指标数据完整
 2025-11-03 15:38:30 +08:00
zdl
6cde2175db feat: 实现实时要闻事件卡片点击高亮效果 
功能新增：
- 点击事件卡片后显示高亮状态
- 当前选中的卡片有明显的视觉反馈

视觉效果：
- 选中状态：蓝色浅背景 (blue.50) + 蓝色粗边框 (2px, blue.500) + 大阴影 (lg)
- 未选中状态：原样式（白色/灰色交替背景 + 细边框 + 小阴影）
- 过渡动画：0.3s 平滑过渡
- 悬停效果：选中卡片悬停时边框变为 blue.600，阴影增强为 xl

技术实现：
1. DynamicNewsCard.js:
   - 传递 isSelected prop 给 DynamicNewsEventCard
   - 判断逻辑：isSelected={selectedEvent?.id === event.id}

2. DynamicNewsEventCard.js:
   - 添加 isSelected 参数（默认 false）
   - 根据 isSelected 动态调整 Card 样式：
     - 背景色：选中 blue.50 / 未选中 原样式
     - 边框：选中 2px blue.500 / 未选中 1px 原颜色
     - 阴影：选中 lg / 未选中 sm

用户体验提升：
- 清晰显示当前查看的事件
- 与下方详情面板形成呼应
- 视觉反馈明确，交互友好

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

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-03 11:28:03 +08:00
zdl
c372832f1f feat: 新增实时要闻·动态追踪与市场复盘功能，优化导航体验 
新增功能：
- 实时要闻·动态追踪横向滚动卡片（DynamicNewsCard）
- 动态新闻事件卡片组件（DynamicNewsEventCard）
- 市场复盘卡片组件（MarketReviewCard）
- 股票涨跌幅指标组件（StockChangeIndicators）
- 交易时间工具函数（tradingTimeUtils）
- Mock API 支持动态新闻数据生成

UI 优化：
- EventFollowButton 改用 react-icons 星星图标，实现真正的空心/实心效果
- 关注按钮添加半透明白色背景（whiteAlpha.500），悬停效果更明显
- 事件卡片标题添加右侧留白，防止关注按钮遮挡文字

性能优化：
- 禁用 Router v7_startTransition 特性，解决路由切换延迟 2 秒问题
- 调整导航菜单点击顺序（先跳转后关闭），提升响应速度

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

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-10-31 14:11:03 +08:00
zdl
ff9f1fe2a1 feat: 创建组合组件（Molecules） 
- EventHeader: 标题头部组件（100行）                                                                                             │ │
│ │ - CompactEventCard: 紧凑模式卡片（160行）                                                                                        │ │
│ │ - DetailedEventCard: 详细模式卡片（170行）                                                                                       │ │
│ │ - index.js: EventCard 统一入口（60行）
 2025-10-30 12:15:03 +08:00
zdl
a39d57f9de feat: 创建原子组件（Atoms） - EventTimeline: 时间轴显示（60行） │ │ 
│ │ - EventImportanceBadge: 重要性等级标签（100行）                                                                                  │ │
│ │ - EventStats: 统计信息组件（60行）                                                                                               │ │
│ │ - EventFollowButton: 关注按钮（40行）                                                                                            │ │
│ │ - EventPriceDisplay: 价格变动显示（130行）                                                                                       │ │
│ │ - EventDescription: 描述文本组件（60行）
 2025-10-30 12:14:27 +08:00