cal/sba-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #33 from pgiro/bullpen-view

Browse Source 
Bullpen view
This commit is contained in:
Peter 2024-11-09 12:16:00 -06:00 committed by GitHub
commit 05bb0b579e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
6 changed files with 153 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
components.d.ts vendored
View File

@ -9,6 +9,7 @@ export {}
declare module '@vue/runtime-core' {
export interface GlobalComponents {
BullpenTable: typeof import('./src/components/BullpenTable.vue')['default']
CardImagesDisplay: typeof import('./src/components/CardImagesDisplay.vue')['default']
ExtendedStandingsTable: typeof import('./src/components/ExtendedStandingsTable.vue')['default']
IconCommunity: typeof import('./src/components/icons/IconCommunity.vue')['default']

126
src/components/BullpenTable.vue Normal file
View File

@ -0,0 +1,126 @@
<template>
<div class="bullpen-table">
<div class="row">
<h3>Bullpen
<button @click.stop="setVisiblity(!showBullpen)"
class="btn btn-sm btn-primary mb-2">
{{ showBullpen ? 'Hide' : 'Show' }}
</button>
</h3>
</div>
<div class="row" v-if="showBullpen">
<div class="table-responsive-xl">
<table class="table table-sm table-striped">
<thead class="thead-dark">
<tr>
<th>Name</th>
<th>Positions</th>
<th>W{{weekNumber - 1}}G1</th>
<th>W{{weekNumber - 1}}G2</th>
<th>W{{weekNumber - 1}}G3</th>
<th>W{{weekNumber - 1}}G4</th>
<th v-if="weekNumber - 1 > 18">W{{weekNumber - 1}}G5</th>
<th v-if="weekNumber - 1 > 19">W{{weekNumber - 1}}G6</th>
<th v-if="weekNumber - 1 > 19">W{{weekNumber - 1}}G7</th>
<th>W{{weekNumber}}G1</th>
<th>W{{weekNumber}}G2</th>
<th>W{{weekNumber}}G3</th>
<th>W{{weekNumber}}G4</th>
<th v-if="weekNumber > 18">W{{weekNumber}}G5</th>
<th v-if="weekNumber > 19">W{{weekNumber}}G6</th>
<th v-if="weekNumber > 19">W{{weekNumber}}G7</th>
</tr>
</thead>
<tbody>
<tr v-for="player in sortedPlayers" :key="player.name">
<td :title="player.il_return ? `Injured until ${player.il_return}` : ''">
{{ player.il_return ? '🏥' : '' }}
<RouterLink :to="{ name: 'player', params: { seasonNumber: seasonNumber, playerName: player.name } }">
{{ player.name }}
</RouterLink>
{{ player.il_return ? '🏥' : '' }}
</td>
<td>
{{ allPositions(player) }}
</td>
<td>{{getStatForPitcherGame(player, weekNumber - 1, 1)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber - 1, 2)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber - 1, 3)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber - 1, 4)}}</td>
<td v-if="weekNumber - 1 > 18">{{getStatForPitcherGame(player, weekNumber - 1, 5)}}</td>
<td v-if="weekNumber - 1 > 19">{{getStatForPitcherGame(player, weekNumber - 1, 6)}}</td>
<td v-if="weekNumber - 1 > 19">{{getStatForPitcherGame(player, weekNumber - 1, 7)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber, 1)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber, 2)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber, 3)}}</td>
<td>{{getStatForPitcherGame(player, weekNumber, 4)}}</td>
<td v-if="weekNumber > 18">{{getStatForPitcherGame(player, weekNumber, 5)}}</td>
<td v-if="weekNumber > 19">{{getStatForPitcherGame(player, weekNumber, 6)}}</td>
<td v-if="weekNumber > 19">{{getStatForPitcherGame(player, weekNumber, 7)}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</template>
<script lang="ts">
import { type Game } from '@/services/apiResponseTypes'
import { fetchPitchingStatsForLastTwoWeeksByTeam, type PitchingStat } from '@/services/pitchingStatsService'
import { fetchPlayersByTeam, type Player } from '@/services/playersService'
export default {
name: 'BullpenTable',
data() {
return {
pitcherStatsByNameWeekGame: {} as Record<string, PitchingStat>,
sortedPlayers: [] as Player[],
showBullpen: false as boolean
}
},
props: {
seasonNumber: { type: Number, required: true },
weekNumber: { type: Number, required: true },
teamId: { type: Number, required: true },
},
created() {
this.fetchData()
},
methods: {
async fetchData(): Promise<void> {
const pitcherStatsByGame: PitchingStat[] = await fetchPitchingStatsForLastTwoWeeksByTeam(this.seasonNumber, this.weekNumber, this.teamId)
const players: Player[] = await fetchPlayersByTeam(this.seasonNumber, this.teamId)
this.sortedPlayers = players.filter(p => ['SP', 'RP'].includes(p.pos_1)).sort(this.sortPitchers)
this.pitcherStatsByNameWeekGame = Object.fromEntries(pitcherStatsByGame.map(stat => [this.recordKeySelector(stat), stat]))
},
//sorts SP above RP and more expensive players up top
sortPitchers(p1: Player, p2: Player): number {
if (p1.pos_1 === p2.pos_1) return p2.wara - p1.wara
return p1.pos_1 === 'SP' ? -1 : 1
},
allPositions(player: Player): string {
let positions = []
positions.push(player.pos_1, player.pos_2, player.pos_3, player.pos_4, player.pos_5, player.pos_6, player.pos_7)
return positions.filter(p => p).join(' ')
},
recordKeySelector(stat: PitchingStat): string {
return `${stat.player.name}-${(stat.game as Game).week}-${(stat.game as Game).game_num}`
},
alternateRecordKeySelector(player: Player, weekNumber: number, gameNumber: number): string {
return `${player.name}-${weekNumber}-${gameNumber}`
},
getStatForPitcherGame(player: Player, weekNumber: number, gameNumber: number): string {
const key = this.alternateRecordKeySelector(player, weekNumber, gameNumber)
const stat: PitchingStat = this.pitcherStatsByNameWeekGame[key]
if (!stat) return '-'
return `${stat.ip.toFixed(1)}IP`
},
setVisiblity(state: boolean): void {
this.showBullpen = state
}
}
}
</script>

6
src/components/PlayerCareerBattingTable.vue
View File

@ -36,7 +36,7 @@
</tr>
</thead>
<tbody id="career-batting-table">
<tr v-for="stat in sortedRegularAndPostSeasonBatting">
<tr v-for="stat in sortedRegularAndPostSeasonBatting" :key="`${stat.seasonNumber}-${stat.isRegularSeason}`">
<td>S{{ stat.seasonNumber }}{{ stat.isRegularSeason ? '' : ' / Playoffs' }}</td>
<td>{{ stat.pa }}</td>
<td>{{ stat.ab }}</td>
@ -67,7 +67,7 @@
</tr>
</tbody>
<tfoot>
<tr v-for="(stat, idx) in careerBattingStats">
<tr v-for="(stat, idx) in careerBattingStats" :key="idx">
<th>Career{{ idx > 0 ? ' / Playoffs' : '' }}</th>
<th>{{ stat.pa }}</th>
<th>{{ stat.ab }}</th>
@ -112,7 +112,7 @@ interface BattingStatWithSeason extends BattingStat {
}
export default {
name: "PlayerCareerBattingTable",
name: 'PlayerCareerBattingTable',
props: {
regularSeasonBattingStats: { type: Array<BattingStat>, required: true },
postSeasonBattingStats: { type: Array<BattingStat>, required: true },

20
src/services/pitchingStatsService.ts
View File

@ -241,6 +241,22 @@ export async function fetchPitchingStatsForLastFourGamesBySeasonAndPlayerId(seas
return pitchingStatsResponse.stats.map(normalizePitchingStat)
}
export async function fetchPitchingStatsForLastTwoWeeksByTeam(seasonNumber: number, weekNumber: number, teamId: number): Promise<PitchingStat[]> {
// no support for pre-modern games yet
if (seasonNumber < MODERN_STAT_ERA_START) {
return []
}
const response = await fetch(`${SITE_URL}/api/v3/plays/pitching?season=${seasonNumber}&week_start=${weekNumber - 1}&week_end=${weekNumber}&team_id=${teamId}&group_by=playergame`)
const pitchingStatsResponse: {
count: number
stats: PitchingStatRaw[]
} = await response.json()
return pitchingStatsResponse.stats.map(normalizePitchingStat)
}
export async function fetchPitchingStatsBySeries(seasonNumber: number, weekNumber: number, homeTeamId: number, awayTeamId: number): Promise<PitchingStat[]> {
// no support for pre-modern games yet
if (seasonNumber < MODERN_STAT_ERA_START) {
@ -251,10 +267,10 @@ export async function fetchPitchingStatsBySeries(seasonNumber: number, weekNumbe
const pitchingStatsResponse: {
count: number
stats: PitchingStat[]
stats: PitchingStatRaw[]
} = await response.json()
return pitchingStatsResponse.stats
return pitchingStatsResponse.stats.map(normalizePitchingStat)
}
export function aggregatePitchingStats(pitchingStats: PitchingStat[]): PitchingStat {

6
src/views/TeamView.vue
View File

@ -155,6 +155,8 @@
</div>
</div>
<BullpenTable v-if="weekNumber && team?.id" :season-number="seasonNumber" :week-number="weekNumber" :team-id="team.id" />
<!-- Schedule -->
<TeamScheduleTable v-if="!isFreeAgentTeam && team" :season-number="seasonNumber" :team-id="team.id" />
@ -191,10 +193,12 @@ import TeamScheduleTable from '@/components/TeamScheduleTable.vue'
import TeamPitchingTable from '@/components/TeamPitchingTable.vue'
import TeamBattingTable from '@/components/TeamBattingTable.vue'
import TeamFieldingTable from '@/components/TeamFieldingTable.vue'
import BullpenTable from '@/components/BullpenTable.vue'
export default {
name: 'TeamView',
components: {
BullpenTable,
TeamScheduleTable,
TeamPitchingTable,
TeamBattingTable,
@ -309,7 +313,7 @@ export default {
allPositions(player: Player): string {
let positions = []
positions.push(player.pos_1, player.pos_2, player.pos_3, player.pos_4, player.pos_5, player.pos_6, player.pos_7)
return positions.join(' ')
return positions.filter(p => p).join(' ')
},
swarTotal(players: Player[]): number {
return players.map(p => p.wara).reduce((prev, curr) => prev + curr, 0)

2
src/views/TransactionsView.vue
View File

@ -150,9 +150,7 @@ export default {
},
async fetchData(): Promise<void> {
this.weekTransactions = await fetchTransactionsByWeek(this.seasonNumber, this.selectedWeekNumber)
console.log('curr', this.weekTransactions)
this.nextWeekTransactions = await fetchTransactionsByWeek(this.seasonNumber, this.selectedWeekNumber + 1)
console.log('next', this.nextWeekTransactions)
}
}
}