Add all prev/next buttons - naive implementation for navigating to next game... could be improved

This commit is contained in:
Peter 2024-11-10 21:15:20 -06:00
parent 228ccd2f3d
commit 885d905c5c

View File

@ -4,24 +4,32 @@
<!-- Teams and Score -->
<div class="row">
<div class="col-sm-3">
<div class="row">
<RouterLink v-if="adjacentGames?.team1prevGame" :to="{
name: 'games', params: {
seasonNumber: adjacentGames!.team1prevGame!.season,
weekNumber: adjacentGames!.team1prevGame!.week,
gameNumber: adjacentGames!.team1prevGame!.game_num,
team1Abbreviation: adjacentGames!.team1prevGame!.away_team.abbrev,
team2Abbreviation: adjacentGames!.team1prevGame!.home_team.abbrev
}
}">
PREVIOUS
</RouterLink>
<RouterLink v-if="awayTeamAbbreviation && awayTeamThumbnail"
:to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: awayTeamAbbreviation } }">
<img id="thumbnail" height="90" style="float:right; vertical-align:middle; max-height:100%;"
:src="awayTeamThumbnail" />
</RouterLink>
</div>
<RouterLink v-if="adjacentGames?.team1prevGame" :to="{
name: 'games', params: {
seasonNumber: adjacentGames!.team1prevGame!.season,
weekNumber: adjacentGames!.team1prevGame!.week,
gameNumber: adjacentGames!.team1prevGame!.game_num,
team1Abbreviation: adjacentGames!.team1prevGame!.away_team.abbrev,
team2Abbreviation: adjacentGames!.team1prevGame!.home_team.abbrev
}
}">
Previous {{ awayTeamAbbreviation }} Game
</RouterLink>
<RouterLink v-if="awayTeamAbbreviation && awayTeamThumbnail"
:to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: awayTeamAbbreviation } }">
<img id="thumbnail" height="90" style="vertical-align:middle; max-height:100%;" :src="awayTeamThumbnail" />
</RouterLink>
<RouterLink v-if="adjacentGames?.team1nextGame" :to="{
name: 'games', params: {
seasonNumber: adjacentGames!.team1nextGame!.season,
weekNumber: adjacentGames!.team1nextGame!.week,
gameNumber: adjacentGames!.team1nextGame!.game_num,
team1Abbreviation: adjacentGames!.team1nextGame!.away_team.abbrev,
team2Abbreviation: adjacentGames!.team1nextGame!.home_team.abbrev
}
}">
Next {{ awayTeamAbbreviation }} Game
</RouterLink>
</div>
<div class="col-sm-6">
<h1 class="text-center">{{ finalScore }}</h1>
@ -30,10 +38,31 @@
</h2>
</div>
<div class="col-sm-3">
<RouterLink v-if="adjacentGames?.team2prevGame" :to="{
name: 'games', params: {
seasonNumber: adjacentGames!.team2prevGame!.season,
weekNumber: adjacentGames!.team2prevGame!.week,
gameNumber: adjacentGames!.team2prevGame!.game_num,
team1Abbreviation: adjacentGames!.team2prevGame!.away_team.abbrev,
team2Abbreviation: adjacentGames!.team2prevGame!.home_team.abbrev
}
}">
Previous {{ homeTeamAbbreviation }} Game
</RouterLink>
<RouterLink v-if="homeTeamAbbreviation && homeTeamThumbnail"
:to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: homeTeamAbbreviation } }">
<img id="thumbnail" height="90" style="float:left; vertical-align:middle; max-height:100%;"
:src="homeTeamThumbnail" />
<img id="thumbnail" height="90" style="vertical-align:middle; max-height:100%;" :src="homeTeamThumbnail" />
</RouterLink>
<RouterLink v-if="adjacentGames?.team2nextGame" :to="{
name: 'games', params: {
seasonNumber: adjacentGames!.team2nextGame!.season,
weekNumber: adjacentGames!.team2nextGame!.week,
gameNumber: adjacentGames!.team2nextGame!.game_num,
team1Abbreviation: adjacentGames!.team2nextGame!.away_team.abbrev,
team2Abbreviation: adjacentGames!.team2nextGame!.home_team.abbrev
}
}">
Next {{ homeTeamAbbreviation }} Game
</RouterLink>
</div>
</div>