Transactions created, need link from nav
This commit is contained in:
Peter
parent
0e48d01417
commit
96cb56c9e0
@ -52,6 +52,12 @@ export const routes: RouteRecordRaw[] = [
|
||||
component: () => import('../views/ScheduleView.vue'),
|
||||
props: castScheduleRouteParams
|
||||
},
|
||||
{
|
||||
path: '/transactions/:seasonNumber?/:weekNumber?',
|
||||
name: 'transactions',
|
||||
component: () => import('../views/TransactionsView.vue'),
|
||||
props: castTransactionsRouteParams
|
||||
},
|
||||
{
|
||||
path: '/managers/:managerName?',
|
||||
name: 'managers',
|
||||
@ -87,6 +93,13 @@ function castScheduleRouteParams(route: { params: { seasonNumber: string, weekNu
|
||||
}
|
||||
}
|
||||
|
||||
function castTransactionsRouteParams(route: { params: { seasonNumber: string, weekNumber: string } }) {
|
||||
return {
|
||||
seasonNumber: Number.isNaN(Number.parseInt(route.params.seasonNumber)) ? undefined : Number(route.params.seasonNumber),
|
||||
weekNumber: Number.isNaN(Number.parseInt(route.params.weekNumber)) ? undefined : Number(route.params.weekNumber)
|
||||
}
|
||||
}
|
||||
|
||||
function castManagersRouteParams(route: { params: { managerName: string } }) {
|
||||
return {
|
||||
managerName: route.params.managerName
|
||||
|
||||
@ -25,6 +25,17 @@ export async function fetchTransactionsByTeamAndWeek(seasonNumber: number, teamA
|
||||
return transactionsResponse.transactions
|
||||
}
|
||||
|
||||
export async function fetchTransactionsByWeek(seasonNumber: number, weekNumber: number): Promise<Transaction[]> {
|
||||
const response = await fetch(`${SITE_URL}/api/v3/transactions?season=${seasonNumber}&week_start=${weekNumber}&week_end=${weekNumber}`)
|
||||
|
||||
const transactionsResponse: {
|
||||
count: number
|
||||
transactions: Transaction[]
|
||||
} = await response.json()
|
||||
|
||||
return transactionsResponse.transactions
|
||||
}
|
||||
|
||||
export async function fetchTransactionsForCurrentSeasonByPlayerName(playerName: string): Promise<Transaction[]> {
|
||||
const response = await fetch(`${SITE_URL}/api/v3/transactions?season=${CURRENT_SEASON}&player_name=${playerName}`)
|
||||
|
||||
|
||||
@ -0,0 +1,159 @@
|
||||
<template>
|
||||
<div class="transactions-view centerDiv">
|
||||
<!-- Transaction Header -->
|
||||
<div class="row">
|
||||
<div class="col-sm-12">
|
||||
<h1>Season {{seasonNumber}} Transactions</h1>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Week Buttons -->
|
||||
<div class="row">
|
||||
<div class="col-sm">
|
||||
<button v-if="selectedWeekNumber > 1" class="btn btn-outline-primary m-1"
|
||||
@click="$router.push({ name: 'transactions', params: { seasonNumber: seasonNumber, weekNumber: selectedWeekNumber - 1 } })">
|
||||
<< Week {{ selectedWeekNumber - 1 }}
|
||||
</button>
|
||||
<button class="btn btn-primary m-1">
|
||||
Week {{ selectedWeekNumber }}
|
||||
</button>
|
||||
<!-- TODO might want to do regular season week + post season week amount here -->
|
||||
<button v-if="selectedWeekNumber < 21" class="btn btn-outline-primary m-1"
|
||||
@click="$router.push({ name: 'transactions', params: { seasonNumber: seasonNumber, weekNumber: selectedWeekNumber + 1 } })">
|
||||
Week {{ selectedWeekNumber + 1 }} >>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Transaction tables for selected week and the next -->
|
||||
<div class="row">
|
||||
<div class="col-sm-6">
|
||||
<h3 id="week1-heading">Week {{ selectedWeekNumber }}</h3>
|
||||
<div class="table-responsive-xl">
|
||||
<table class="table table-sm table-striped" id="week1">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Week</th>
|
||||
<th>Player</th>
|
||||
<th>Old Team</th>
|
||||
<th>New Team</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="curr-week-table">
|
||||
<tr v-for="transaction in weekTransactions" :key="transaction.id">
|
||||
<td>{{ selectedWeekNumber }}</td>
|
||||
<td>
|
||||
<RouterLink :to="{ name: 'player', params: { seasonNumber: seasonNumber, playerName: transaction.player.name } }">
|
||||
{{ transaction.player.name }}
|
||||
</RouterLink>
|
||||
</td>
|
||||
<td>
|
||||
<RouterLink :to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: transaction.oldteam.abbrev } }">
|
||||
{{ transaction.oldteam.sname }}
|
||||
</RouterLink>
|
||||
</td>
|
||||
<td>
|
||||
<RouterLink :to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: transaction.newteam.abbrev } }">
|
||||
{{ transaction.newteam.sname }}
|
||||
</RouterLink>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="selectedWeekNumber < 21" class="col-sm-6">
|
||||
<h3 id="week2-heading">Week {{ selectedWeekNumber + 1 }}</h3>
|
||||
<div class="table-responsive-xl">
|
||||
<table class="table table-sm table-striped" id="week2">
|
||||
<thead class="thead-dark">
|
||||
<tr>
|
||||
<th>Week</th>
|
||||
<th>Player</th>
|
||||
<th>Old Team</th>
|
||||
<th>New Team</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="next-week-table">
|
||||
<tr v-for="transaction in nextWeekTransactions" :key="transaction.id">
|
||||
<td>{{ selectedWeekNumber + 1 }}</td>
|
||||
<td>
|
||||
<RouterLink :to="{ name: 'player', params: { seasonNumber: seasonNumber, playerName: transaction.player.name } }">
|
||||
{{ transaction.player.name }}
|
||||
</RouterLink>
|
||||
</td>
|
||||
<td>
|
||||
<RouterLink :to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: transaction.oldteam.abbrev } }">
|
||||
{{ transaction.oldteam.sname }}
|
||||
</RouterLink>
|
||||
</td>
|
||||
<td>
|
||||
<RouterLink :to="{ name: 'team', params: { seasonNumber: seasonNumber, teamAbbreviation: transaction.newteam.abbrev } }">
|
||||
{{ transaction.newteam.sname }}
|
||||
</RouterLink>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { type LeagueInfo, fetchCurrentLeagueInfo } from '@/services/currentService'
|
||||
import { fetchTransactionsByWeek, type Transaction } from '@/services/transactionsService'
|
||||
import { CURRENT_SEASON } from '@/services/utilities'
|
||||
|
||||
export default {
|
||||
name: 'TransactionsView',
|
||||
data() {
|
||||
return {
|
||||
currentWeekNumber: 0,
|
||||
weekTransactions: [] as Transaction[],
|
||||
nextWeekTransactions: [] as Transaction[]
|
||||
}
|
||||
},
|
||||
props: {
|
||||
seasonNumber: { type: Number, default: CURRENT_SEASON },
|
||||
weekNumber: { type: Number, required: false }
|
||||
},
|
||||
created() {
|
||||
this.fetchCurrentWeekNumber()
|
||||
this.fetchData()
|
||||
},
|
||||
computed: {
|
||||
selectedWeekNumber(): number {
|
||||
if (this.weekNumber || this.weekNumber === 0) return this.weekNumber
|
||||
return this.currentWeekNumber
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
seasonNumber(newValue, oldValue) {
|
||||
if (newValue !== oldValue){
|
||||
this.weekTransactions = []
|
||||
this.nextWeekTransactions = []
|
||||
this.fetchData()
|
||||
}
|
||||
},
|
||||
selectedWeekNumber(newValue, oldValue) {
|
||||
if (newValue !== oldValue) {
|
||||
this.weekTransactions = []
|
||||
this.nextWeekTransactions = []
|
||||
this.fetchData()
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async fetchCurrentWeekNumber(): Promise<void> {
|
||||
const leagueInfo: LeagueInfo = await fetchCurrentLeagueInfo()
|
||||
this.currentWeekNumber = leagueInfo.week
|
||||
},
|
||||
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)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Loading…
Reference in New Issue
Block a user