diff --git a/src/components/LeaderboardTeamBattingTable.vue b/src/components/LeaderboardTeamBattingTable.vue
index 4b0db65..353a712 100644
--- a/src/components/LeaderboardTeamBattingTable.vue
+++ b/src/components/LeaderboardTeamBattingTable.vue
@@ -5,7 +5,7 @@
- | Team |
+ Team |
PA |
AB |
R |
@@ -111,6 +111,7 @@
import { aggregateBattingStats, fetchTeamBattingStatsBySeason, type BattingStat } from '@/services/battingStatsService'
interface ExtendedBattingStat extends BattingStat {
+ teamName: string
kPct: string
}
@@ -122,7 +123,7 @@ export default {
data() {
return {
battingStats: [] as ExtendedBattingStat[],
- sortKey: 'team' as keyof ExtendedBattingStat,
+ sortKey: 'teamName' as keyof ExtendedBattingStat,
sortOrder: 1
}
},
@@ -152,18 +153,13 @@ export default {
async fetchData(): Promise {
const unsortedBattingStats: BattingStat[] = await fetchTeamBattingStatsBySeason(this.seasonNumber)
this.battingStats = unsortedBattingStats
- .map(s => ({...s, kPct: this.calculateStrikeoutPercent(s)}))
- .sort((s1, s2) => s2.team.sname < s1.team.sname ? 1 : -1)
+ .map(s => ({...s, teamName: s.team.sname, kPct: this.calculateStrikeoutPercent(s)}))
+ .sort((s1, s2) => s2.teamName < s1.teamName ? 1 : -1)
},
sortBy(stat: keyof ExtendedBattingStat): void {
this.setKey(stat)
-
- if (stat == 'team') {
- this.battingStats.sort((s1, s2) => s2.team.sname < s1.team.sname ? this.sortOrder : -1 * this.sortOrder)
- return
- }
- this.battingStats.sort((s1, s2) => s2[stat] < s1[stat] ? -1 * this.sortOrder : this.sortOrder)
+ this.battingStats.sort((s1, s2) => s2[stat] < s1[stat] ? this.sortOrder : -1 * this.sortOrder)
},
setKey(stat: keyof ExtendedBattingStat): void {
if (this.sortKey === stat) {
@@ -171,11 +167,11 @@ export default {
this.sortOrder *= -1
} else {
this.sortKey = stat
- this.sortOrder = 1
+ this.sortOrder = stat === 'teamName' ? 1 : -1
}
},
getArrow(stat: keyof ExtendedBattingStat): string {
- if (this.sortKey !== stat) return ''
+ if (this.sortKey !== stat) return 'faux-arrow'
return this.sortOrder > 0 ? 'up' : 'down'
},
@@ -194,4 +190,8 @@ export default {
.down::after {
content: "▿"
}
+.faux-arrow::after {
+ opacity: 0;
+ content: "▿"
+}
diff --git a/src/components/LeaderboardTeamPitchingTable.vue b/src/components/LeaderboardTeamPitchingTable.vue
index 9eb6fbb..1151e40 100644
--- a/src/components/LeaderboardTeamPitchingTable.vue
+++ b/src/components/LeaderboardTeamPitchingTable.vue
@@ -5,7 +5,7 @@
- | Team |
+ Team |
W |
L |
W-L% |
@@ -118,6 +118,7 @@ import { aggregatePitchingStats, fetchTeamPitchingStatsBySeason, type PitchingSt
import { outsToInnings, winPercentage, hitsPer9, hrsPer9 } from '@/services/utilities'
interface ExtendedPitchingStat extends PitchingStat {
+ teamName: string
winPct: string
irsPct: string
hPer9: string
@@ -132,7 +133,7 @@ export default {
data() {
return {
pitchingStats: [] as ExtendedPitchingStat[],
- sortKey: 'team' as keyof ExtendedPitchingStat,
+ sortKey: 'teamName' as keyof ExtendedPitchingStat,
sortOrder: 1
}
},
@@ -164,22 +165,18 @@ export default {
this.pitchingStats = unsortedPitchingStats
.map(s => (
{...s,
+ teamName: s.team.sname,
winPct: this.winPercentage(s),
irsPct: this.formatIRSPercentage(s),
hPer9: this.hitsPer9(s),
hrPer9: this.hrsPer9(s)
}))
- .sort((s1, s2) => s2.team.sname < s1.team.sname ? 1 : -1)
+ .sort((s1, s2) => s2.teamName < s1.teamName ? 1 : -1)
},
sortBy(stat: keyof ExtendedPitchingStat): void {
this.setKey(stat)
-
- if (stat == 'team') {
- this.pitchingStats.sort((s1, s2) => s2.team.sname < s1.team.sname ? this.sortOrder : -1 * this.sortOrder)
- return
- }
- this.pitchingStats.sort((s1, s2) => s2[stat] < s1[stat] ? -1 * this.sortOrder : this.sortOrder)
+ this.pitchingStats.sort((s1, s2) => s2[stat] < s1[stat] ? this.sortOrder : -1 * this.sortOrder)
},
setKey(stat: keyof ExtendedPitchingStat): void {
if (this.sortKey === stat) {
@@ -187,11 +184,11 @@ export default {
this.sortOrder *= -1
} else {
this.sortKey = stat
- this.sortOrder = 1
+ this.sortOrder = stat === 'teamName' ? 1 : -1
}
},
getArrow(stat: keyof ExtendedPitchingStat): string {
- if (this.sortKey !== stat) return ''
+ if (this.sortKey !== stat) return 'faux-arrow'
return this.sortOrder > 0 ? 'up' : 'down'
},
@@ -223,4 +220,8 @@ export default {
.down::after {
content: "▿"
}
+.faux-arrow::after {
+ opacity: 0;
+ content: "▿"
+}