diff --git a/server/app/common/service/match/MatchLiveService.php b/server/app/common/service/match/MatchLiveService.php index b449198..6493791 100644 --- a/server/app/common/service/match/MatchLiveService.php +++ b/server/app/common/service/match/MatchLiveService.php @@ -112,6 +112,11 @@ class MatchLiveService 'live.match_id', 'live.title', 'live.source_url', + 'live.anchor_name', + 'live.anchor_avatar', + 'live.room_view_count', + 'live.room_focus_count', + 'live.room_notice', 'live.play_url_m3u8', 'live.play_url_hd_m3u8', 'live.play_url_flv', @@ -155,6 +160,11 @@ class MatchLiveService 'match_id' => (int) $row['match_id'], 'title' => (string) ($row['title'] ?? ''), 'source_url' => (string) ($row['source_url'] ?? ''), + 'anchor_name' => (string) ($row['anchor_name'] ?? ''), + 'anchor_avatar' => (string) ($row['anchor_avatar'] ?? ''), + 'room_view_count' => (int) ($row['room_view_count'] ?? 0), + 'room_focus_count' => (int) ($row['room_focus_count'] ?? 0), + 'room_notice' => (string) ($row['room_notice'] ?? ''), 'play_url' => (string) $row['default_play_url'], 'default_play_url' => (string) $row['default_play_url'], 'stream_options' => $row['stream_options'], diff --git a/uniapp/src/api/match.ts b/uniapp/src/api/match.ts index 49089a3..02c299e 100644 --- a/uniapp/src/api/match.ts +++ b/uniapp/src/api/match.ts @@ -54,6 +54,11 @@ export interface WorldCupLiveCardItem { match_id: number title?: string source_url?: string + anchor_name?: string + anchor_avatar?: string + room_view_count?: number | string + room_focus_count?: number | string + room_notice?: string play_url: string default_play_url?: string stream_options?: MatchLiveStreamOption[] diff --git a/uniapp/src/packages_match/components/WorldCupPanel.vue b/uniapp/src/packages_match/components/WorldCupPanel.vue index e3844e5..a7acf2e 100644 --- a/uniapp/src/packages_match/components/WorldCupPanel.vue +++ b/uniapp/src/packages_match/components/WorldCupPanel.vue @@ -48,7 +48,19 @@ - {{ matchMetaText(live, 0) }} + + + + + + {{ liveAnchorName(live) }} + + + 观看 {{ formatLiveCount(live.room_view_count) }} + 关注 {{ formatLiveCount(live.room_focus_count) }} + + 公告 {{ liveRoomNotice(live) }} @@ -425,6 +437,27 @@ const liveLineTitle = (live: WorldCupLiveCardItem) => { return normalizeLiveText(live.title) || '直播线路' } +const liveAnchorAvatar = (live: WorldCupLiveCardItem) => { + return normalizeLiveText(live.anchor_avatar) +} + +const liveAnchorName = (live: WorldCupLiveCardItem) => { + return normalizeLiveText(live.anchor_name) || '主播' +} + +const liveRoomNotice = (live: WorldCupLiveCardItem) => { + return normalizeLiveText(live.room_notice) || '暂无公告' +} + +const formatLiveCount = (value: unknown) => { + const count = Number(value || 0) + if (!Number.isFinite(count) || count <= 0) return '0' + if (count >= 10000) { + return `${(count / 10000).toFixed(count >= 100000 ? 0 : 1).replace(/\.0$/, '')}万` + } + return String(Math.floor(count)) +} + const buildWorldCupLiveVideoId = (live: WorldCupLiveCardItem) => { return `worldcup-live-${live.live_id || live.id || 0}` } @@ -1020,8 +1053,7 @@ onMounted(() => { display: block; } -.worldcup-live-card__top, -.worldcup-live-card__meta { +.worldcup-live-card__top { display: flex; align-items: center; justify-content: space-between; @@ -1042,12 +1074,75 @@ onMounted(() => { font-weight: 700; } -.worldcup-live-card__count, -.worldcup-live-card__meta { +.worldcup-live-card__count { font-size: 22rpx; color: #64748b; } +.worldcup-live-card__meta { + display: flex; + flex-direction: column; + align-items: stretch; + gap: 8rpx; + min-width: 0; + font-size: 22rpx; + color: #64748b; +} + +.worldcup-live-card__anchor, +.worldcup-live-card__stats { + display: flex; + align-items: center; + min-width: 0; +} + +.worldcup-live-card__anchor { + gap: 8rpx; +} + +.worldcup-live-card__avatar { + width: 34rpx; + height: 34rpx; + border-radius: 50%; + flex-shrink: 0; + background: #e2e8f0; +} + +.worldcup-live-card__avatar--empty { + display: flex; + align-items: center; + justify-content: center; + color: #64748b; + font-size: 18rpx; +} + +.worldcup-live-card__anchor-name { + flex: 1; + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + color: #334155; + font-weight: 600; +} + +.worldcup-live-card__stats { + flex-wrap: wrap; + gap: 8rpx 12rpx; +} + +.worldcup-live-card__stat { + white-space: nowrap; +} + +.worldcup-live-card__notice { + display: block; + min-width: 0; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} + .worldcup-live-card__teams { display: flex; align-items: center;