Files
PolyHermes/frontend
WrBug 19508dcd19 feat: 实现 Polymarket Activity WebSocket 双重监听方案
主要功能:
- 新增 PolymarketActivityWsService:通过 Activity WebSocket 实时监听 Leader 交易(延迟 < 100ms)
- 实现双重监听机制:Activity WS(低延迟)+ On-Chain WS(高可靠性)
- 支持动态添加/移除 Leader 监听
- 地址筛选忽略大小写

修复和改进:
- 修复订阅消息格式:使用 'action' 而不是 'type'(与 @polymarket/real-time-data-client 保持一致)
- 修复 PING 消息格式:使用小写 'ping'(与官方客户端保持一致)
- 添加 outcomeIndex 字段支持:优先使用消息中的 outcomeIndex,fallback 到从 outcome 解析
- 添加 connection_id 字段到 DTO
- 改进日志记录:增加 INFO 级别日志以便调试

代码重构:
- JsonUtils 重构:将 fromJson 和 toJson 改为扩展方法
- 更新后端开发规范:JSON 解析和 Data Class 规范

前端修复:
- 修复 InputNumber parser 类型错误:返回 number 而不是 string

文档:
- 添加双重监听方案文档
- 添加 Polymarket Activity WebSocket API 格式文档
2026-01-09 10:41:15 +08:00
..
2025-12-07 16:15:59 +08:00
2025-12-07 16:15:59 +08:00

Polymarket 跟单系统前端

技术栈

  • 框架: React 18 + TypeScript
  • 构建工具: Vite
  • UI 库: Ant Design + Ant Design Mobile
  • HTTP 客户端: axios
  • 状态管理: Zustand
  • 路由: React Router
  • 以太坊库: ethers.js

功能特性

  • 账户管理(通过私钥导入,支持多账户)
  • Leader 管理(被跟单者管理)
  • 跟单配置管理
  • 订单管理
  • 统计信息
  • 移动端适配

开发

# 安装依赖
npm install

# 启动开发服务器
npm run dev

# 构建生产版本
npm run build

项目结构

frontend/
├── src/
│   ├── components/      # 公共组件
│   │   └── Layout.tsx   # 布局组件(支持移动端)
│   ├── pages/           # 页面组件
│   │   ├── AccountList.tsx
│   │   ├── AccountImport.tsx
│   │   ├── LeaderList.tsx
│   │   ├── LeaderAdd.tsx
│   │   ├── ConfigPage.tsx
│   │   ├── OrderList.tsx
│   │   └── Statistics.tsx
│   ├── services/        # API 服务
│   │   └── api.ts
│   ├── store/           # 状态管理
│   │   └── accountStore.ts
│   ├── types/           # TypeScript 类型定义
│   │   └── index.ts
│   ├── utils/           # 工具函数
│   │   └── ethers.ts
│   ├── styles/          # 样式文件
│   │   └── index.css
│   ├── App.tsx          # 根组件
│   └── main.tsx         # 入口文件
├── index.html
├── package.json
├── tsconfig.json
└── vite.config.ts

移动端适配

  • 使用 react-responsive 检测设备类型
  • 移动端使用 Ant Design Mobile 组件
  • 响应式布局(移动端 < 768px,桌面端 >= 768px
  • 触摸友好的按钮尺寸(>= 44x44px