Files
sbnews/docs/赛事中心赛程直播赔率组件设计.md
T
2026-07-31 16:13:31 +08:00

99 lines
4.3 KiB
Markdown

# 赛事中心赛程、直播、赔率组件设计
## 目标
赛事中心在当前页面内提供“赛程 / 直播 / 赔率”三个内容 Tab。点击 Tab 只切换赛事列表区域,不再切换到世界杯主题组件。
蓝色世界杯专题卡继续保留,点击专题卡仍可进入原世界杯专题页;本次不删除或改变世界杯专题页原有功能。
## 页面结构
`MatchCenterPanel.vue` 保留赛事中心标题、AI 助手入口和世界杯专题卡。
新增通用赛事中心内容组件 `MatchCenterTabsPanel.vue`,统一负责:
- 赛程、直播、赔率 Tab 状态。
- 赛程 Tab 的运动分类和联赛筛选。
- 三类数据的加载、空状态和错误提示。
- 赛事详情、直播播放等交互。
世界杯专题卡与三个内容 Tab 分离:只有专题卡触发 `open-worldcup`,三个内容 Tab 不再向 `MatchShellPage.vue` 发送世界杯视图切换事件。
## 赛程 Tab
- 默认选中赛程。
- 沿用当前赛事中心的赛事列表样式和分组方式。
- 保留运动分类、联赛筛选、进行中/未开始/已结束分组、折叠状态和已结束赛事分页加载。
- 点击赛事卡继续进入现有比赛详情页。
## 直播 Tab
- 新增通用赛事直播接口,不复用只过滤世界杯的 `worldCupLiveCards`
-`la_match_live` 的有效抓取状态和播放地址为准;赛事关联仅用于补充赛事信息,不作为显示前提。
- 不显示运动分类或联赛分类筛选,直接展示当前可用的全部直播。
- 直播卡保留赛事名称、主播、观看数、关注数、公告、封面和播放地址。
- H5、App 的视频播放和海报模式继续复用现有世界杯直播卡的兼容处理。
## 赔率 Tab
- 新增通用赛事赔率接口,不再依赖世界杯赛事映射。
- 继续读取 `la_match_odds`,保留滚球盘、今日盘、早盘筛选。
- 保留联赛/球队关键词搜索。
- 不显示赛程的运动分类或联赛分类筛选。
- 仅保留盘口类型筛选,以及按联赛名、主队、客队进行关键词搜索。
- 赔率记录与站内普通赛事匹配成功时补充赛事 ID、队徽、比分和状态,允许进入比赛详情;未匹配时只展示赔率。
- 继续过滤没有任何有效盘口值的空赔率记录。
## 后端接口
在现有 `MatchController` 和赛事服务中增加通用接口:
- `GET /api/match/liveCards`
- 参数:`sport_type``league_name`
- 返回通用直播卡列表。
- `GET /api/match/odds`
- 参数:`sport_type``league_name``show_type``source_site``keyword``include_special``limit`
- 返回按比赛聚合的赔率列表。
世界杯原接口继续保留,避免影响世界杯专题页:
- `/api/match/worldCupLiveCards`
- `/api/match/worldCupOdds`
通用与世界杯接口复用服务层的查询、格式化和赛事匹配方法,避免复制赔率盘口组装与直播地址解析逻辑。
世界杯直播接口不再强制按世界杯赛事过滤,和通用直播接口一样展示当前有效直播流。
## 状态与交互
- 切换 Tab 时按需加载对应数据,已加载数据可缓存,筛选条件改变后重新请求。
- 赛程、直播、赔率分别展示独立加载状态和空状态。
- 接口失败时保留当前筛选条件并展示无数据/提示,不影响切回其他 Tab。
- 赔率搜索确认、清除关键词和盘口切换均只刷新赔率数据。
## 改动范围
预计涉及:
- `uniapp/src/packages_match/components/MatchCenterPanel.vue`
- `uniapp/src/packages_match/components/MatchCenterTabsPanel.vue`
- `uniapp/src/api/match.ts`
- `server/app/api/controller/MatchController.php`
- `server/app/common/service/match/MatchLiveService.php`
- 赔率通用查询相关服务或控制器辅助方法
- `业务进度管理.md`
- `设计稿映射.md`
不修改数据库表结构,不新增页面路由。
## 验收标准
1. 赛事中心默认显示赛程内容。
2. 点击赛程、直播、赔率只切换当前页面列表区域。
3. 三个 Tab 切换时不出现世界杯主题头部。
4. 赛程保持现有赛事列表、运动分类、联赛筛选和分页行为。
5. 直播展示通用赛事直播,不局限于世界杯。
6. 赔率保留盘口分类和联赛/球队搜索筛选。
7. 世界杯专题卡仍能进入原世界杯专题页。
8. 原世界杯专题页的赛程、直播、赔率等功能不受影响。