Improve filterBar on eventsPage, improve API access from frontend

software/src/data/stores/concertStore.ts

@@ -29,15 +29,15 @@ export const useConcertStore = defineStore("concertStore", {
     async fetchAllTours() {
       await getAllTours()
         .then(result => {
-          this.tours = result.data
+          // this.tours = result.data
 
-          this.tours.sort((a, b) => {
-            return new Date(a.concerts[0].date) < new Date(b.concerts[0].date) ? -1 : 1
-          })
+          // this.tours.sort((a, b) => {
+          //   return new Date(a.concerts[0].date) < new Date(b.concerts[0].date) ? -1 : 1
+          // })
 
-          this.filteredTours = this.tours
+          // this.filteredTours = this.tours
 
-          this.filterTours()
+          // this.filterTours()
         })
 
       await getAllBands()
@@ -47,7 +47,6 @@ export const useConcertStore = defineStore("concertStore", {
 
       await getAllLocations() 
         .then(result => {
-          console.log(result.data)
           this.locations = result.data
         })
 

software/src/data/stores/shoppingStore.ts

@@ -2,18 +2,43 @@ import { defineStore } from "pinia";
 import { ref } from "vue";
 import { EventModel } from "../models/acts/eventModel";
 import { fetchEvents } from "../api/eventApi";
+import { fetchAllCities } from "../api/cityApi";
+import { CityModel } from "../models/locations/cityModel";
+import { GenreModel } from "../models/acts/genreModel";
+import { fetchAllGenres } from "../api/genreApi";
 
 export const useShoppingStore = defineStore("shoppingStore", {
   state: () => ({
-    events: ref<Array<EventModel>>([])
+    events: ref<Array<EventModel>>([ new EventModel() ]),
+    cities: ref<Array<CityModel>>([ new CityModel() ]),
+    genres: ref<Array<GenreModel>>([ new GenreModel() ]),
+    cityFilterName: ref<String>(),
+    genreFilterName: ref<String>()
   }),
 
   actions: {
-    getEvents(city: string = "", genre: string = "") {
-      fetchEvents(city, genre)
+    async getEvents() {
+      await fetchEvents(
+        this.cityFilterName != null ? this.cityFilterName : "",
+        this.genreFilterName != null ? this.genreFilterName : ""
+      )
         .then(result => {
           this.events = result.data
         })
+    },
+
+    async getCities() {
+      await fetchAllCities()
+        .then(result => {
+          this.cities = result.data
+        })
+    },
+
+    async getGenres() {
+      await fetchAllGenres()
+        .then(result => {
+          this.genres = result.data
+        })
     }
   }
 })