1.0 KiB
1.0 KiB
TradeDetail.vue
路径:src/views/TradeDetail.vue
路由:/trade-detail/:id,name: trade-detail
功能用途
交易详情页,展示单个市场的分时图、订单簿、Comments/Top Holders/Activity 标签页,以及右侧交易组件(Buy/Sell、Merge/Split)。支持桌面端与移动端布局,移动端使用底部 Yes/No 栏 + 弹窗。
核心能力
- 分时图:ECharts 渲染,支持 Past、时间粒度切换
- 订单簿:
OrderBook组件 - 交易:
TradeComponent,传入market、initialOption - 移动端:底部栏 +
v-bottom-sheet嵌入TradeComponent - Merge/Split:通过
TradeComponent或底部菜单触发
使用方式
- 从首页卡片点击进入,或直接访问
/trade-detail/123 - 路由参数
id为 Event ID,用于findPmEvent
扩展方式
- 实时数据:订单簿、分时图接入 WebSocket
- Comments:对接评论接口,替换 placeholder
- Top Holders:对接持仓接口
- Activity:对接交易活动接口,替换 mock 数据