4.2 KiB
4.2 KiB
赛事中心赛程、直播、赔率组件设计
目标
赛事中心在当前页面内提供“赛程 / 直播 / 赔率”三个内容 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.vueuniapp/src/packages_match/components/MatchCenterTabsPanel.vueuniapp/src/api/match.tsserver/app/api/controller/MatchController.phpserver/app/common/service/match/MatchLiveService.php- 赔率通用查询相关服务或控制器辅助方法
业务进度管理.md设计稿映射.md
不修改数据库表结构，不新增页面路由。
验收标准
- 赛事中心默认显示赛程内容。
- 点击赛程、直播、赔率只切换当前页面列表区域。
- 三个 Tab 切换时不出现世界杯主题头部。
- 赛程保持现有赛事列表、运动分类、联赛筛选和分页行为。
- 直播展示通用赛事直播，不局限于世界杯。
- 赔率保留盘口分类和联赛/球队搜索筛选。
- 世界杯专题卡仍能进入原世界杯专题页。
- 原世界杯专题页的赛程、直播、赔率等功能不受影响。