Bold final score of winning team on team's schedule table

This commit is contained in:
Peter 2024-11-01 10:36:38 -05:00
parent e92655fb62
commit e3aeea1e7b

View File

@ -40,30 +40,30 @@
<td>
<RouterLink v-if="isPlayed(row.game1)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game1!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game1) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game1) ? 'bold' : 'normal' }">{{ makeGameScore(row.game1) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
<td>
<RouterLink v-if="isPlayed(row.game2)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game2!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game2) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game2) ? 'bold' : 'normal' }">{{ makeGameScore(row.game2) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
<td>
<RouterLink v-if="isPlayed(row.game3)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game3!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game3) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game3) ? 'bold' : 'normal' }">{{ makeGameScore(row.game3) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
<td>
<RouterLink v-if="isPlayed(row.game4)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game4!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game4) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game4) ? 'bold' : 'normal' }">{{ makeGameScore(row.game4) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
</tr>
</tbody>
@ -106,30 +106,30 @@
<td>
<RouterLink v-if="isPlayed(row.game1)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game1!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game1) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game1) ? 'bold' : 'normal' }">{{ makeGameScore(row.game1) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
<td>
<RouterLink v-if="isPlayed(row.game2)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game2!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game2) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game2) ? 'bold' : 'normal' }">{{ makeGameScore(row.game2) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
<td>
<RouterLink v-if="isPlayed(row.game3)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game3!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game3) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game3) ? 'bold' : 'normal' }">{{ makeGameScore(row.game3) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
<td>
<RouterLink v-if="isPlayed(row.game4)"
:to="{ name: 'games', params: { seasonNumber: seasonNumber, weekNumber: row.week, gameNumber: row.game4!.game_num, team1Abbreviation: row.awayTeam.abbrev, team2Abbreviation: row.homeTeam.abbrev } }">
{{ makeGameScore(row.game4) }}
<div :style="{ 'font-weight': selectedTeamWon(row.game4) ? 'bold' : 'normal' }">{{ makeGameScore(row.game4) }}</div>
</RouterLink>
<template v-else>-</template>
<div v-else>-</div>
</td>
</tr>
</tbody>
@ -222,6 +222,15 @@ export default {
if (!game || (!game.away_score && !game.home_score)) return '-'
return `${game.away_team.abbrev} ${game.away_score}-${game.home_score} ${game.home_team.abbrev}`
},
selectedTeamWon(game: Game | undefined): boolean {
if (!game || (!game.away_score && !game.home_score)) return false
if (this.teamId === game.home_team.id) {
return game.home_score > game.away_score
}
return game.away_score > game.home_score
},
async fetchData(): Promise<void> {
this.schedule = await fetchGamesBySeasonAndTeamId(this.seasonNumber, this.teamId)
}