Laying the groundwork for schedule, need to add tables with data now

src/router/index.ts

@@ -36,6 +36,12 @@ export const routes: RouteRecordRaw[] = [
     name: 'rules',
     component: () => import('../views/RulesView.vue')
   },
+  {
+    path: '/schedule/:seasonNumber?/:weekNumber?',
+    name: 'schedule',
+    component: () => import('../views/ScheduleView.vue'),
+    props: castScheduleRouteParams
+  },
 ]
 
 function castTeamsRouteParams(route: any) {
@@ -52,6 +58,13 @@ function castPlayersRouteParams(route: any) {
   }
 }
 
+function castScheduleRouteParams(route: any) {
+  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)
+  }
+}
+
 export const router = createRouter({
   history: createWebHistory(), //import.meta.env.BASE_URL),
   routes,

src/services/utilities.ts

@@ -6,6 +6,8 @@ export const MODERN_STAT_ERA_START = 8
 
 export const GAMES_PER_SEASON = 72
 
+export const WEEKS_PER_SEASON = 18
+
 export const POS_MAP = {
   'P': 1,
   'C': 2,

src/views/ScheduleView.vue

@@ -0,0 +1,73 @@
+<template>
+  <div class="schedule-view">
+
+    <div class="centerDiv">
+      <div class="row">
+        <h1>Season {{ seasonNumber }} Schedule</h1>
+      </div>
+
+      <div class="row">
+        <div class="col-sm-7">
+          <div class="row">
+            <h2 id="week-num">Week {{ selectedWeekNumber }}</h2>
+          </div>
+
+          <div class="row">
+            🚧 Coming Soon 🚧
+          </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: 'schedule', params: { seasonNumber: seasonNumber, weekNumber: selectedWeekNumber - 1 } })">
+                &lt;&lt; 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 < 18" class="btn btn-outline-primary m-1"
+                @click="$router.push({ name: 'schedule', params: { seasonNumber: seasonNumber, weekNumber: selectedWeekNumber + 1 } })">
+                Week {{ selectedWeekNumber + 1 }} &gt;&gt;
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { type LeagueInfo, fetchCurrentLeagueInfo } from '@/services/currentService'
+import { CURRENT_SEASON } from '@/services/utilities'
+
+
+export default {
+  name: "ScheduleView",
+  data() {
+    return {
+      currentWeekNumber: 0,
+    }
+  },
+  props: {
+    seasonNumber: { type: Number, default: CURRENT_SEASON },
+    weekNumber: { type: Number, required: false }
+  },
+  created() {
+    this.fetchData()
+  },
+  computed: {
+    selectedWeekNumber(): number {
+      if (this.weekNumber || this.weekNumber === 0) return this.weekNumber
+      return this.currentWeekNumber
+    }
+  },
+  methods: {
+    async fetchData(): Promise<void> {
+      const leagueInfo: LeagueInfo = await fetchCurrentLeagueInfo()
+      this.currentWeekNumber = leagueInfo.week
+    }
+  }
+}
+</script>