New page for all concerts

software/src/pages/bands/bandDetailPage/ratingSection.vue

@@ -1,9 +1,9 @@
 <script setup lang="ts">
 import { BandApiModel } from '@/data/models/acts/bandApiModel';
 import { RatingModel } from '@/data/models/acts/ratingModel';
-import { calcRating, calcRatingValues } from '@/scripts/concertScripts';
 
 defineProps({
+  rating: Number,
   ratings: {
     type: Array<RatingModel>,
     required: true
@@ -16,12 +16,12 @@ defineProps({
     <v-col>
       <div class="d-flex align-center justify-center flex-column" style="height: 100%;">
         <div class="text-h2 mt-5">
-          {{ calcRating(ratings).toFixed(1) }}
+          {{ rating.toFixed(1) }}
           <span class="text-h6 ml-n3">/5</span>
         </div>
     
         <v-rating
-          :model-value="calcRating(ratings)"
+          :model-value="rating"
           color="yellow-darken-3"
           half-increments
           size="x-large"
@@ -34,7 +34,7 @@ defineProps({
 
     <v-col>
       <v-list>
-        <v-list-item v-for="ratingValue in calcRatingValues(ratings)">
+        <v-list-item v-for="ratingValue in ratings">
           <template v-slot:prepend>
             <span>{{ ratingValue.value }}</span>
             <v-icon class="ml-3 mr-n3" icon="mdi-star" />

software/src/pages/bands/bandsPage/index.vue

@@ -2,5 +2,5 @@
 </script>
 
 <template>
-  
+  Bands
 </template>

software/src/pages/concerts/concertBookingPage/index.vue

@@ -50,7 +50,7 @@ getConcert(Number(router.currentRoute.value.params.id))
             >
               <template #description>
                 <p>{{ concertModel.location.name }}</p>
-                <p>{{ concertModel.event.band.name }} - {{ concertModel.event.name }}</p>
+                <!-- todo <p>{{ concertModel.event.band.name }} - {{ concertModel.event.name }}</p> -->
               </template>
             </concert-list-item>
           </v-col>
@@ -102,7 +102,7 @@ getConcert(Number(router.currentRoute.value.params.id))
         </v-row>
 
         <v-row class="pb-5">
-          <outlined-button
+          <!-- <outlined-button todo
             prepend-icon="mdi-basket-plus"
             @click="basketStore.moveSeatSelectionsToBasket(concertModel.event, concertModel.event.band); 
               router.push('/basket')"
@@ -110,7 +110,7 @@ getConcert(Number(router.currentRoute.value.params.id))
             block
           >
             {{ $t('addToBasket') }}
-          </outlined-button>
+          </outlined-button> -->
         </v-row>
       </v-col>
 

software/src/pages/concerts/concertsPage/index.vue

@@ -1,6 +1,69 @@
 <script setup lang="ts">
+import { useConcertStore } from '@/data/stores/concertStore';
+import concertListItem from '@/components/pageParts/concertListItem.vue';
+import { useFeedbackStore } from '@/data/stores/feedbackStore';
+import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
+import sectionDivider from '@/components/basics/sectionDivider.vue';
+
+const concertStore = useConcertStore()
+const feedbackStore = useFeedbackStore()
+
+concertStore.getConcerts()
 </script>
 
 <template>
-  Concerts
+  <v-container>
+    <v-row>
+      <v-spacer />
+
+      <v-col cols="10">
+        <v-row>
+          <v-col>
+            Filterbar
+            <!-- todo: Filterbar? -->
+          </v-col>
+        </v-row>
+
+        <v-row
+          v-if="feedbackStore.fetchDataFromServerInProgress"
+          v-for="i in 3"
+        >
+          <v-col>
+            <card-view-horizontal :loading="true" />        
+          </v-col>
+        </v-row>
+
+
+
+        <div
+          v-else-if="concertStore.concerts.length > 0"
+          v-for="(concert, index) of concertStore.concerts"
+        >
+          <v-row 
+            v-if="index == 0 || 
+            new Date(concertStore.concerts[index - 1].date).getMonth() != 
+            new Date(concertStore.concerts[index].date).getMonth()"
+          >
+            <v-col>
+              <section-divider
+                :title="new Date(concert.date).toLocaleString('default', { month: 'long' }) + ' ' + new Date(concert.date).getFullYear()"
+              />
+            </v-col>
+          </v-row>
+
+          <v-row>
+            <v-col>
+              <concert-list-item
+                :concert="concert"
+                :band="concert.band"
+                :location="concert.location"
+              />
+            </v-col>
+          </v-row>
+        </div>
+      </v-col>
+
+      <v-spacer />
+    </v-row>
+  </v-container>
 </template>

software/src/pages/events/eventsPage/index.vue

@@ -3,7 +3,6 @@ import filterBar from './filterBar.vue';
 import { useRoute } from 'vue-router';
 import { useShoppingStore } from '@/data/stores/shoppingStore';
 import { useFeedbackStore } from '@/data/stores/feedbackStore';
-import eventListItem from '../../../components/pageParts/eventListItem.vue';
 
 const route = useRoute()
 const shoppingStore = useShoppingStore()

software/src/pages/homePage/index.vue

@@ -7,29 +7,25 @@ import OutlinedButton from '@/components/basics/outlinedButton.vue';
 import { useRouter } from 'vue-router';
 import { useFeedbackStore } from '@/data/stores/feedbackStore';
 import { ref } from 'vue';
-import { EventModel } from '@/data/models/acts/eventModel';
-import { getTopEvents } from '@/data/api/eventApi';
 import { getTopLocations } from '@/data/api/locationApi';
 import { LocationApiModel } from '@/data/models/locations/locationApiModel';
-import { EventApiModel } from '@/data/models/acts/eventApiModel';
 
 const router = useRouter()
 const feedbackStore = useFeedbackStore()
-const topEvents = ref<Array<EventApiModel>>(Array.from({length: 4}, () => new EventApiModel()))
 const topLocations = ref<Array<LocationApiModel>>(Array.from({length: 8}, () => new LocationApiModel()))
 
 feedbackStore.fetchDataFromServerInProgress = true
 
-getTopEvents(4)
-  .then(events => {
-    topEvents.value = events.data
+// todo getTopEvents(4)
+//   .then(events => {
+//     topEvents.value = events.data
 
-    getTopLocations(8)
-      .then(locations => {
-        topLocations.value = locations.data
-        feedbackStore.fetchDataFromServerInProgress = false
-      })
-  })
+//     getTopLocations(8)
+//       .then(locations => {
+//         topLocations.value = locations.data
+//         feedbackStore.fetchDataFromServerInProgress = false
+//       })
+//   })
 </script>
 
 <template>
@@ -46,7 +42,7 @@ getTopEvents(4)
           </v-col>
         </v-row>
 
-        <v-row>
+        <!-- <v-row> todo
           <v-col v-for="i in 4" cols="3">
             <card-with-top-image
               :image="topEvents[i - 1].image"
@@ -58,7 +54,7 @@ getTopEvents(4)
               ab {{ lowestTicketPrice(topEvents[i - 1].concerts) }} €
             </card-with-top-image>
           </v-col>
-        </v-row>
+        </v-row> -->
 
         <v-row>
           <v-col>

software/src/pages/locations/locationDetailPage/index.vue

@@ -7,15 +7,15 @@ import { ref } from 'vue';
 import { useFeedbackStore } from '@/data/stores/feedbackStore';
 import heroImage from '@/components/pageParts/heroImage.vue';
 import concertListItem from '@/components/pageParts/concertListItem.vue';
-import { LocationApiModel } from '@/data/models/locations/locationApiModel';
+import { LocationDetailsApiModel } from '@/data/models/locations/locationDetailsApiModel';
 
 const router = useRouter()
 const feedbackStore = useFeedbackStore()
-const location = ref<LocationApiModel>(new LocationApiModel())
+const location = ref<LocationDetailsApiModel>(new LocationDetailsApiModel())
 
 feedbackStore.fetchDataFromServerInProgress = true
 
-getLocation(String(router.currentRoute.value.params.locationName))
+getLocation(String(router.currentRoute.value.params.name))
   .then(result => {
     location.value = result.data
     feedbackStore.fetchDataFromServerInProgress = false
@@ -61,11 +61,11 @@ getLocation(String(router.currentRoute.value.params.locationName))
           <v-col>
             <concert-list-item
               :concert="concert"
-              :title="concert.event.name"
-              :onClick="() => router.push('/bands/' + concert.event.band.name.replaceAll(' ', '-').toLowerCase())"
+              :title="concert.name"
+              :onClick="() => router.push('/bands/' + concert.band.name.replaceAll(' ', '-').toLowerCase())"
             >
               <template #description>
-                {{ concert.event.band.name }}
+                {{ concert.band.name }}
               </template>
             </concert-list-item>
           </v-col>
@@ -97,6 +97,7 @@ getLocation(String(router.currentRoute.value.params.locationName))
           <v-col>
             <seat-plan-map
               :location="location"
+              :seat-groups="location.seatGroups"
             />
           </v-col>
         </v-row>

software/src/pages/locations/locationsPage/index.vue

@@ -1,14 +1,14 @@
 <script setup lang="ts">
 import sectionDivider from '@/components/basics/sectionDivider.vue';
 import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
-import { useShoppingStore } from '@/data/stores/shoppingStore';
 import { useFeedbackStore } from '@/data/stores/feedbackStore';
 import locationListItem from '@/components/pageParts/locationListItem.vue';
+import { useLocationStore } from '@/data/stores/locationStore';
 
-const shoppingStore = useShoppingStore()
+const locationStore = useLocationStore()
 const feedbackStore = useFeedbackStore()
 
-shoppingStore.getCities()
+locationStore.getLocations()
 </script>
 
 <template>
@@ -37,23 +37,31 @@ shoppingStore.getCities()
 
         <!-- When all data are downloaded -->
         <div
-          v-else
-          v-for="city in shoppingStore.cities"
+          v-else-if="locationStore.locations.length > 0"
+          v-for="city in locationStore.cities"
         >
           <v-row>
             <v-col>
-              <section-divider 
-                :title="city.name"
-              />
-            </v-col>
-          </v-row>
+              <v-row>
+                <v-col>
+                  <section-divider 
+                    :title="city.name"
+                  />
+                </v-col>
+              </v-row>
+
+              <v-row>
+                <v-col
+                  v-for="location in locationStore.getLocationsByCity(city.name)"
+                  cols="3"
+                >
+                  <location-list-item
+                    :location="location"
+                    :nrOfConcerts="location.nrOfConcerts"
+                  />
+                </v-col>
+              </v-row>
 
-          <v-row>
-            <v-col v-for="location in city.locations" cols="3">
-              <location-list-item
-                :location="location"
-                :concerts="location.concerts"
-              />
             </v-col>
           </v-row>
         </div>
@@ -61,8 +69,5 @@ shoppingStore.getCities()
 
       <v-spacer />
     </v-row>
-
-
-    
   </v-container>
 </template>

software/src/pages/misc/searchPage/index.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import searchBar from './searchBar.vue';
-import eventListItem from '@/components/pageParts/eventListItem.vue';
 import sectionDivider from '@/components/basics/sectionDivider.vue';
 import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
 import locationListItem from '@/components/pageParts/locationListItem.vue';
@@ -45,7 +44,7 @@ const searchStore = useSearchStore()
             <v-col>
               <band-list-item
                 :band="band"
-                :events="band.events"
+                :concerts="band.concerts"
                 :genres="band.genres"
                 :loading="searchStore.searchInProgress"
               />