haha/sbnews
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

deploy: auto commit repo-root changes 2026-06-21 19:30:16

Browse Source
This commit is contained in:
hajimi
2026-06-21 19:30:17 +08:00
parent 980b019809
commit f6d967869d
4 changed files with 186 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files
uniapp/src/packages_match/components/WorldCupPanel.vue
+59 -117
View File
@@ -32,32 +32,47 @@
<scroll-view scroll-y scroll-with-animation class="worldcup-scroll"
:scroll-into-view="activeTab === 'schedule' ? scheduleScrollIntoView : ''">
<block v-if="activeTab === 'live'">
<view v-if="liveMatches.length" class="worldcup-live-grid">
<view v-if="liveCards.length" class="worldcup-live-grid">
<view
v-for="match in liveMatches"
:key="`live-${match.id || match.match_id}`"
v-for="live in liveCards"
:key="`live-${live.live_id}`"
class="worldcup-live-card"
@tap="openWorldCupLive(match)"
@tap="goMatchDetail(live)"
>
<view class="worldcup-live-card__top">
<text class="worldcup-live-card__badge">直播</text>
<text class="worldcup-live-card__count">{{ getMatchLiveLines(match).length }}条线路</text>
<text class="worldcup-live-card__count">{{ liveStatusText(live) }}</text>
</view>
<view class="worldcup-live-card__player-wrap" @tap.stop>
<video
:id="`worldcup-live-${live.live_id}`"
class="worldcup-live-card__player"
:src="live.play_url"
:poster="live.home_icon || live.away_icon || ''"
:autoplay="true"
:muted="true"
:controls="true"
:show-play-btn="true"
:show-fullscreen-btn="true"
object-fit="cover"
/>
</view>
<view class="worldcup-live-card__teams">
<text class="worldcup-live-card__team">{{ match.home_team }}</text>
<text class="worldcup-live-card__team">{{ live.home_team }}</text>
<text class="worldcup-live-card__vs">VS</text>
<text class="worldcup-live-card__team">{{ match.away_team }}</text>
<text class="worldcup-live-card__team">{{ live.away_team }}</text>
</view>
<view class="worldcup-live-card__meta">
<text>{{ matchMetaText(match, 0) }}</text>
<text>{{ formatMatchTime(match.match_time) }}</text>
<text>{{ matchMetaText(live, 0) }}</text>
<text>{{ formatMatchTime(live.match_time) }}</text>
</view>
<view class="worldcup-live-card__footer">
<text class="worldcup-live-card__line">{{ getPrimaryLiveLineTitle(match) }}</text>
<text class="worldcup-live-card__switch" @tap.stop="openLiveLinePopup(match)">切换线路</text>
<text class="worldcup-live-card__line">{{ liveLineTitle(live) }}</text>
<text class="worldcup-live-card__switch">进入详情</text>
</view>
</view>
</view>
@@ -228,13 +243,6 @@
</view>
</view>
</scroll-view>
<MatchLivePopup
v-model:show="showLivePopup"
:match-title="livePopupMatchTitle"
:lines="livePopupLines"
@close="handleLivePopupClose"
/>
</view>
</template>
@@ -243,14 +251,14 @@ import { computed, nextTick, onMounted, ref, watch } from 'vue'
import RankingNav from '../pages/worldcup/components/ranking/RankingNav.vue'
import StandingsPanel from '../pages/worldcup/components/ranking/StandingsPanel.vue'
import PlayerRankingPanel from '../pages/worldcup/components/ranking/PlayerRankingPanel.vue'
import MatchLivePopup from '@/components/match-live-popup/match-live-popup.vue'
import TranslatedArticleCard from '@/components/translated-article-card/translated-article-card.vue'
import { getArticleCate, getArticleList } from '@/api/news'
import {
getWorldCupLiveCards,
getWorldCupRankings,
getWorldCupSchedule,
getWorldCupStandings,
type MatchLiveLineItem,
type WorldCupLiveCardItem,
} from '@/api/match'
import { getLocalMatchDate } from '@/utils/match-time'
@@ -294,9 +302,9 @@ const rankingMode = ref<RankingMode>('standings')
const scheduleSort = ref<ScheduleSort>('time')
const activeBracketTab = ref<BracketTabKey>(bracketTabs[0].key)
const scheduleScrollIntoView = ref('')
const showLivePopup = ref(false)
const livePopupMatch = ref<any | null>(null)
const statusBarHeight = ref(0)
const liveCards = ref<WorldCupLiveCardItem[]>([])
const liveCardsLoaded = ref(false)
const scheduleData = ref<any>({
current_round_name: '',
@@ -435,62 +443,15 @@ const resolveBracketTeamIcon = (rawValue: any, fallback = '') => {
const normalizeLiveText = (value: unknown) => String(value || '').trim()
const getMatchLiveLines = (match: any): MatchLiveLineItem[] => {
return Array.isArray(match?.live_list) ? match.live_list : []
const liveLineTitle = (live: WorldCupLiveCardItem) => {
return normalizeLiveText(live.title) || '直播线路'
}
const collectLineUrls = (line: MatchLiveLineItem) => {
const candidates: string[] = []
const seen = new Set<string>()
const push = (value: unknown) => {
const url = normalizeLiveText(value)
if (!url || seen.has(url)) return
seen.add(url)
candidates.push(url)
const liveStatusText = (live: WorldCupLiveCardItem) => {
if ((live.status ?? 0) === 1) {
return normalizeLiveText(live.current_minute) || '进行中'
}
push(line.default_play_url)
if (Array.isArray(line.stream_options)) {
line.stream_options.forEach((option) => {
push(option.default_play_url)
push(option.play_url_m3u8)
push(option.play_url_hd_m3u8)
push(option.play_url_flv)
push(option.play_url_hd_flv)
push(option.play_url)
push(option.url)
push(option.live_url)
})
}
push(line.play_url_m3u8)
push(line.play_url_hd_m3u8)
push(line.play_url_flv)
push(line.play_url_hd_flv)
push(line.play_url)
return candidates
}
const getLineDirectUrl = (line: MatchLiveLineItem) => collectLineUrls(line)[0] || ''
const getLineSourceUrl = (line: MatchLiveLineItem) => normalizeLiveText(line.source_url || line.live_url)
const getPrimaryLiveLine = (match: any) => {
return getMatchLiveLines(match).find((line) => getLineDirectUrl(line) || getLineSourceUrl(line)) || null
}
const getPrimaryLiveLineTitle = (match: any) => {
const line = getPrimaryLiveLine(match)
if (!line) return '点击进入直播'
return (
normalizeLiveText(line.title) ||
normalizeLiveText(line.name) ||
normalizeLiveText(line.label) ||
normalizeLiveText(line.live_tag) ||
normalizeLiveText(line.source_name) ||
'点击进入直播'
)
return '未开赛'
}
const flattenScheduleMatches = computed(() => {
@@ -507,13 +468,6 @@ const flattenScheduleMatches = computed(() => {
return matches.sort((a, b) => (a.match_time || 0) - (b.match_time || 0))
})
const liveMatches = computed(() => {
return flattenScheduleMatches.value.filter((match) => {
if ((match?.status ?? 0) === 2) return false
return !!getPrimaryLiveLine(match)
})
})
const scheduleGroups = computed(() => {
const groups: Array<{ key: string; label: string; items: any[] }> = []
@@ -577,13 +531,12 @@ const initLayout = () => {
const scheduleGroupAnchorId = (key: string) => `worldcup-schedule-group-${key}`
const livePopupLines = computed(() => getMatchLiveLines(livePopupMatch.value))
const livePopupMatchTitle = computed(() => {
const match = livePopupMatch.value
if (!match) return '切换线路'
return `${match.home_team || ''} VS ${match.away_team || ''}`.trim() || '切换线路'
})
const fetchWorldCupLiveCards = async () => {
if (liveCardsLoaded.value) return
const data = await getWorldCupLiveCards()
liveCards.value = Array.isArray(data?.list) ? data.list : []
liveCardsLoaded.value = true
}
const fetchSchedule = async () => {
scheduleData.value = await getWorldCupSchedule() || { current_round_name: '', bracket_rounds: [], schedule_rounds: [] }
@@ -631,7 +584,9 @@ const fetchNews = async () => {
}
const ensureTabData = async (tab: MainTab) => {
if (tab === 'live' || tab === 'schedule') {
if (tab === 'live') {
await fetchWorldCupLiveCards()
} else if (tab === 'schedule') {
await fetchSchedule()
} else if (tab === 'rank') {
if (rankingMode.value === 'standings') {
@@ -658,33 +613,6 @@ const toggleScheduleSort = () => {
scheduleSort.value = scheduleSort.value === 'time' ? 'group' : 'time'
}
const navigateToWebview = (url: string) => {
uni.navigateTo({ url: `/pages/webview/webview?url=${encodeURIComponent(url)}` })
}
const openWorldCupLive = (match: any) => {
const primaryLine = getPrimaryLiveLine(match)
const url = primaryLine ? (getLineDirectUrl(primaryLine) || getLineSourceUrl(primaryLine)) : ''
if (!url) {
uni.showToast({ title: '暂无可用直播线路', icon: 'none' })
return
}
navigateToWebview(url)
}
const openLiveLinePopup = (match: any) => {
if (!getMatchLiveLines(match).length) {
uni.showToast({ title: '暂无直播线路', icon: 'none' })
return
}
livePopupMatch.value = match
showLivePopup.value = true
}
const handleLivePopupClose = () => {
livePopupMatch.value = null
}
const goBack = () => {
emit('back')
}
@@ -1049,6 +977,20 @@ onMounted(() => {
box-shadow: 0 10rpx 28rpx rgba(37, 99, 235, 0.08);
}
.worldcup-live-card__player-wrap {
width: 100%;
height: 210rpx;
border-radius: 18rpx;
overflow: hidden;
background: #0f172a;
}
.worldcup-live-card__player {
width: 100%;
height: 100%;
display: block;
}
.worldcup-live-card__top,
.worldcup-live-card__meta,
.worldcup-live-card__footer {