New page for all concerts

This commit is contained in:
2024-10-12 19:40:12 +02:00
parent f8bdb54c33
commit 6c33de3d87
56 changed files with 531 additions and 405 deletions

View File

@@ -43,7 +43,7 @@ export const sequelize = new Sequelize({
})
export function startDatabase() {
let recreateDb = true
let recreateDb = false
// Create database and tables
sequelize.sync({ force: recreateDb })

View File

@@ -8,16 +8,16 @@ import { Concert } from "./concert.model";
@Table({ timestamps: false })
export class Band extends Model {
@Column
name: String
name: string
@Column
foundingYear: Number
foundingYear: number
@Column
descriptionEn: String
descriptionEn: string
@Column
descriptionDe: String
descriptionDe: string
@Column({
type: DataType.STRING,
@@ -28,13 +28,13 @@ export class Band extends Model {
this.setDataValue('images', value.join(';'))
}
})
images: Array<String>
images: Array<string>
@Column
imageMembers: String
imageMembers: string
@Column
logo: String
logo: string
// Relations

View File

@@ -6,34 +6,37 @@ import { Band } from "./band.model";
@Table({ timestamps: false })
export class Concert extends Model {
@Column
date: String
date: string
@Column
name: String
name: string
@Column
price: Number
price: number
@Column
image: String
image: string
@Column
inStock: Number
inStock: number
@Column
offered: Boolean
offered: boolean
@ForeignKey(() => Band)
@Column
bandId: Number
bandId: number
@ForeignKey(() => Location)
@Column
locationId: Number
locationId: number
// Relations
@BelongsTo(() => Band)
band: Band
@BelongsTo(() => Location)
location: Location

View File

@@ -5,7 +5,7 @@ import { BandGenre } from "./bandGenre.model";
@Table({ timestamps: false })
export class Genre extends Model {
@Column
name: String
name: string
// Relations

View File

@@ -4,14 +4,14 @@ import { Band } from "./band.model";
@Table({ timestamps: false })
export class Member extends Model {
@Column
name: String
name: string
@ForeignKey(() => Band)
@Column
bandId: Number
bandId: number
@Column
image: String
image: string
// Relations

View File

@@ -7,14 +7,14 @@ export class Rating extends Model {
@ForeignKey(() => Account)
@Column
accountId: Number
accountId: number
@Column
rating: Number
rating: number
@ForeignKey(() => Band)
@Column
bandId: Number
bandId: number
// Relations

View File

@@ -4,26 +4,26 @@ import { ExerciseGroup } from "./exerciseGroup.model";
@Table({ timestamps: false })
export class Exercise extends Model {
@Column
nameDe: String
nameDe: string
@Column
nameEn: String
nameEn: string
@Column
exerciseNr: Number
exerciseNr: number
@Column
descriptionDe: String
descriptionDe: string
@Column
descriptionEn: String
descriptionEn: string
@Column
solved: Boolean
solved: boolean
@ForeignKey(() => ExerciseGroup)
@Column
exerciseGroupId: Number
exerciseGroupId: number
// Relations

View File

@@ -4,13 +4,13 @@ import { Exercise } from "./exercise.model";
@Table({ timestamps: false })
export class ExerciseGroup extends Model {
@Column
nameDe: String
nameDe: string
@Column
nameEn: String
nameEn: string
@Column
groupNr: Number
groupNr: number
// Relations

View File

@@ -4,10 +4,10 @@ import { Location } from "./location.model";
@Table({ timestamps: false })
export class City extends Model {
@Column
name: String
name: string
@Column
country: String
country: string
// Relations

View File

@@ -9,20 +9,20 @@ export class Location extends Model {
urlName: string
@Column
name: String
name: string
@Column
address: String
address: string
@ForeignKey(() => City)
@Column
cityId: Number
cityId: number
@Column
imageIndoor: String
imageIndoor: string
@Column
imageOutdoor: String
imageOutdoor: string
/**
* Layout identifier of the location
@@ -31,7 +31,7 @@ export class Location extends Model {
* 3 = Stage in the middle of the stay area, seat places all around
*/
@Column
layout: Number
layout: number
// Relations

View File

@@ -9,7 +9,7 @@ export class Seat extends Model {
@ForeignKey(() => SeatRow)
@Column
seatRowId: Number
seatRowId: number
// Relations

View File

@@ -5,21 +5,21 @@ import { SeatRow } from "./seatRow.model";
@Table({ timestamps: false })
export class SeatGroup extends Model {
@Column
name: String
name: string
@Column
surcharge: Number
surcharge: number
@Column
capacity: Number
capacity: number
@Default(false)
@Column
standingArea: Boolean
standingArea: boolean
@ForeignKey(() => Location)
@Column
locationId: Number
locationId: number
// Relations

View File

@@ -7,44 +7,41 @@ import { Concert } from "../models/acts/concert.model";
import { Location } from "../models/locations/location.model";
import { City } from "../models/locations/city.model";
import { Op } from "sequelize";
import { calcOverallRating, calcRatingValues } from "../scripts/calcScripts";
export const band = Router()
// Get all bands
band.get("/", (req: Request, res: Response) => {
Band.findAll({
include: [
{
model: Member,
attributes: {
exclude: [ "id", "bandId" ]
}
},
include: [
{
model: Rating,
attributes: {
exclude: [ "id", "bandId" ]
}
},
{
model: Concert,
include: [
{
model: Location,
include: [ City ],
attributes: {
exclude: [ "id" ]
}
}
],
model: Genre,
attributes: {
exclude: [ "id", "tourId", "locationId" ]
exclude: [ "id" ]
}
},
Genre
Concert
]
})
.then(bands => {
for (let band of bands) {
band.dataValues["nrOfConcerts"] = band.dataValues.concerts.length
band.dataValues["rating"] = calcOverallRating(band.dataValues.ratings)
// Delete unnecessary Arrays
delete band.dataValues.ratings
delete band.dataValues.concerts
for (let genre of band.dataValues.genres) {
delete genre.dataValues.BandGenre
}
}
res.status(200).json(bands)
})
})
@@ -90,6 +87,16 @@ band.get("/band/:name", (req: Request, res: Response) => {
}
})
.then(band => {
band.dataValues["rating"] = calcOverallRating(band.dataValues.ratings)
band.dataValues["ratingValues"] = calcRatingValues(band.dataValues.ratings)
// Delete unnecessary Arrays
delete band.dataValues.ratings
for (let genre of band.dataValues.genres) {
delete genre.dataValues.BandGenre
}
res.status(200).json(band)
})
})

View File

@@ -1,26 +1,11 @@
import { Location } from "../models/locations/location.model";
import { City } from "../models/locations/city.model";
import { Request, Response, Router } from "express";
import { Concert } from "../models/acts/concert.model";
export const city = Router()
city.get("/", (req: Request, res: Response) => {
City.findAll({
include: [
{
model: Location,
include: [ Concert ]
}
]
})
City.findAll()
.then(cities => {
// for (let city of cities) {
// for (let location of city.dataValues.locations) {
// location.dataValues.nrOfConcerts = location.dataValues.concerts.length
// delete location.dataValues.concerts
// }
// }
res.status(200).json(cities)
})
})

View File

@@ -7,10 +7,23 @@ import { SeatRow } from "../models/locations/seatRow.model";
import { Seat } from "../models/locations/seat.model";
import { Ticket } from "../models/ordering/ticket.model";
import { Band } from "../models/acts/band.model";
import { Op } from "sequelize";
export const concert = Router()
concert.get("/", (req: Request, res: Response) => {
Concert.findAll({
include: [ Band, Location ],
order: [
[ 'date', 'ASC' ]
]
})
.then(concerts => {
res.status(200).json(concerts)
})
})
concert.get("/concert/:id", (req: Request, res: Response) => {
Concert.findByPk(req.params.id, {
include: [

View File

@@ -20,15 +20,6 @@ location.get("/", (req: Request, res: Response) => {
{
model: Concert,
include: [ Band ],
},
{
model: SeatGroup,
include: [
{
model: SeatRow,
include: [ Seat ]
}
]
}
],
attributes: {
@@ -46,6 +37,12 @@ location.get("/", (req: Request, res: Response) => {
})
}
for (let location of locations) {
location.dataValues["nrOfConcerts"] = location.dataValues.concerts.length
delete location.dataValues.concerts
}
// Limit number of items
if (count != undefined) {
locations.splice(Number(count))
}
@@ -86,7 +83,6 @@ location.get("/location/:urlName", (req: Request, res: Response) => {
}
}
res.status(200).json(location)
})
})

View File

@@ -0,0 +1,41 @@
import { Rating } from "../models/acts/rating.model";
/**
* Calculate the average of an Array of ratings
*
* @param ratings Array of ratings
*
* @returns Average rating as number
*/
export function calcOverallRating(ratings: Array<Rating>): number {
let sum = 0
for (let rating of ratings) {
sum += rating.dataValues.rating
}
return sum / ratings.length
}
/**
* Classifies a bunch of ratings to groups from 1 to 5 stars
*
* @param ratings Array of RatingModels
*
* @returns Array of Objects: { value: number[1-5], count: number }
*/
export function calcRatingValues(ratings: Array<Rating>) {
let ratingValues = [
{ value: 1, count: 0 },
{ value: 2, count: 0 },
{ value: 3, count: 0 },
{ value: 4, count: 0 },
{ value: 5, count: 0 }
]
for (let rating of ratings) {
ratingValues[rating.dataValues.rating - 1].count += 1
}
return ratingValues
}

View File

@@ -29,9 +29,9 @@ const path = require('path')
app.use('/static', express.static(path.join(__dirname, 'images')))
// Add delay for more realistic response times
app.use((req, res, next) => {
setTimeout(next, Math.floor((Math.random () * 2000) + 100))
})
// app.use((req, res, next) => {
// setTimeout(next, Math.floor((Math.random () * 2000) + 100))
// })
// Routes
app.use("/api", api)

View File

@@ -10,19 +10,29 @@
<v-divider vertical />
<v-btn
to="/events"
to="/bands"
prepend-icon="mdi-guitar-electric"
height="100%"
:rounded="false"
>
{{ $t('allBands', 2) }}
</v-btn>
<v-divider vertical />
<v-btn
to="/concerts"
prepend-icon="mdi-ticket"
height="100%"
:rounded="false"
>
{{ $t('allEvents', 2) }}
{{ $t('allConcerts', 2) }}
</v-btn>
<v-divider vertical />
<v-btn
variant="text"
to="/locations"
prepend-icon="mdi-city"
height="100%"

View File

@@ -1,11 +1,10 @@
<script setup lang="ts">
import { BandModel } from '@/data/models/acts/bandModel';
import { lowestTicketPrice, lowestTicketPriceEvents } from '@/scripts/concertScripts';
import { lowestTicketPrice } from '@/scripts/concertScripts';
import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import { EventModel } from '@/data/models/acts/eventModel';
import { useRouter } from 'vue-router';
import { GenreModel } from '@/data/models/acts/genreModel';
import { EventApiModel } from '@/data/models/acts/eventApiModel';
import { ConcertModel } from '@/data/models/acts/concertModel';
const router = useRouter()
@@ -16,9 +15,8 @@ defineProps({
required: true
},
/** Events where the band participate */
events: {
type: Array<EventApiModel>,
concerts: {
type: Array<ConcertModel>,
required: true
},
@@ -37,7 +35,7 @@ defineProps({
v-if="!loading"
:title="band.name"
:image="'http://localhost:3000/static/' + band.logo"
@click="router.push('/bands/' + band.name.replaceAll(' ', '-').toLowerCase())"
@click="router.push('/bands/details/' + band.name.replaceAll(' ', '-').toLowerCase())"
>
<template #content>
<div>
@@ -54,12 +52,12 @@ defineProps({
<template #append>
<div>
<div class="text-secondary font-weight-medium text-h6 pb-1">
{{ $t('from') + ' ' + lowestTicketPriceEvents(events) + ' €' }}
{{ $t('from') + ' ' + lowestTicketPrice(concerts) + ' €' }}
</div>
<div>
<v-btn variant="flat" color="secondary">
{{ events.length }} {{ $t('event', events.length) }}
{{ concerts.length }} {{ $t('event', concerts.length) }}
</v-btn>
</div>
</div>

View File

@@ -1,6 +1,11 @@
<script setup lang="ts">
import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import { BandModel } from '@/data/models/acts/bandModel';
import { ConcertModel } from '@/data/models/acts/concertModel';
import { LocationModel } from '@/data/models/locations/locationModel';
import { useRouter } from 'vue-router';
const router = useRouter()
defineProps({
/** Concert to display */
@@ -9,8 +14,15 @@ defineProps({
required: true
},
/** Card title */
title: String,
band: {
type: BandModel,
required: true
},
location: {
type: LocationModel,
required: true
},
/** Display text parts as skeleton */
loading: Boolean,
@@ -19,19 +31,16 @@ defineProps({
showButton: {
type: Boolean,
default: true
},
/** Behaviour if user clicks on button or card */
onClick: Function
}
})
</script>
<template>
<card-view-horizontal
:title="title"
:title="concert.name"
v-if="!loading"
:link="showButton && concert.inStock > 0"
@click="showButton && concert.inStock > 0 ? onClick() : () => {}"
@click="showButton && concert.inStock > 0 ? router.push('/concerts/booking/' + concert.id) : () => {}"
>
<template #prepend>
<div>
@@ -50,7 +59,13 @@ defineProps({
</template>
<template #content>
<slot name="description" />
<div>
{{ band.name }}
</div>
<div>
{{ location.name }}
</div>
</template>
<template #append>

View File

@@ -1,86 +0,0 @@
<script setup lang="ts">
import { createDateRangeString, lowestTicketPrice } from '@/scripts/concertScripts';
import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import { EventModel } from '@/data/models/acts/eventModel';
import { useRouter } from 'vue-router';
import { BandModel } from '@/data/models/acts/bandModel';
import { ConcertModel } from '@/data/models/acts/concertModel';
const router = useRouter()
defineProps({
/** Event to display */
event: {
type: EventModel,
required: true
},
/** Band which plays the event */
band: {
type: BandModel,
required: true
},
/** All concerts in the event */
concerts: {
type: Array<ConcertModel>,
required: true
},
/** Display text parts as skeleton */
loading: Boolean
})
</script>
<template>
<card-view-horizontal
v-if="!loading"
:title="band.name + ' - ' + event.name"
:image="'http://localhost:3000/static/' + event.image"
@click="router.push('/bands/' + band.name.replaceAll(' ', '-').toLowerCase())"
>
<template #content>
<div class="oneLine my-2 pr-4 text-disabled" >
{{ band.descriptionDe }}
<!-- todo: Englisch text -->
</div>
<div class="text-disabled oneLine">
{{ createDateRangeString(concerts) }} - {{ concerts.length }}
{{ $t('concert', concerts.length) }}
</div>
</template>
<template #append>
<div>
<div class="text-secondary font-weight-medium text-h6 pb-1">
{{ $t('from') + ' ' + lowestTicketPrice(concerts) + ' €' }}
</div>
<div>
<v-btn variant="flat" color="secondary">
{{ concerts.length }} {{ $t('concert', concerts.length) }}
</v-btn>
</div>
</div>
</template>
</card-view-horizontal>
<card-view-horizontal
:loading="loading"
v-else
>
<v-skeleton-loader
type="text" />
</card-view-horizontal>
</template>
<style scoped>
.oneLine {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 1; /* number of lines to show */
line-clamp: 1;
-webkit-box-orient: vertical;
}
</style>

View File

@@ -2,7 +2,6 @@
import cardViewTopImage from '../basics/cardViewTopImage.vue';
import { useRouter } from 'vue-router';
import { LocationModel } from '@/data/models/locations/locationModel';
import { ConcertModel } from '@/data/models/acts/concertModel';
const router = useRouter()
@@ -11,9 +10,8 @@ defineProps({
type: LocationModel,
required: true
},
concerts: {
type: Array<ConcertModel>,
required: true
nrOfConcerts: {
type: Number
}
})
</script>
@@ -22,10 +20,10 @@ defineProps({
<card-view-top-image
:image="location.imageOutdoor"
:title="location.name"
@click="router.push('locations/' + location.name.replaceAll(' ', '-').toLowerCase())"
@click="router.push('locations/details/' + location.name.replaceAll(' ', '-').toLowerCase())"
>
<div>
{{ concerts.length }} {{ $t('concert', concerts.length) }}
{{ nrOfConcerts }} {{ $t('concert', nrOfConcerts) }}
</div>
</card-view-top-image>
</template>

View File

@@ -2,7 +2,6 @@
import { ConcertModel } from '@/data/models/acts/concertModel';
import cardWithLeftImage from '../basics/cardViewHorizontal.vue';
import { dateStringToHumanReadableString } from '@/scripts/dateTimeScripts';
import { EventModel } from '@/data/models/acts/eventModel';
import { BandModel } from '@/data/models/acts/bandModel';
import { LocationModel } from '@/data/models/locations/locationModel';
import { CityModel } from '@/data/models/locations/cityModel';
@@ -13,11 +12,6 @@ defineProps({
required: true
},
event: {
type: EventModel,
required: true
},
band: {
type: BandModel,
required: true
@@ -54,7 +48,7 @@ defineProps({
:image="'http://localhost:3000/static/' + image"
:link="false"
color-header="primary"
:title="band.name + ' - ' + event.name"
:title="band.name + ' - ' + concert.name"
>
<template #content>
<div class="text-caption">

View File

@@ -2,10 +2,14 @@
import { SeatGroupModel } from '@/data/models/locations/seatGroupModel';
import seatGroupSheet from './seatGroupSheet.vue';
import { ConcertModel } from '@/data/models/acts/concertModel';
import { LocationApiModel } from '@/data/models/locations/locationApiModel';
import { LocationModel } from '@/data/models/locations/locationModel';
let props = defineProps({
location: LocationApiModel,
location: LocationModel,
seatGroups: {
type: Array<SeatGroupModel>,
required: true
},
concert: {
type: ConcertModel,
default: new ConcertModel()
@@ -13,7 +17,7 @@ let props = defineProps({
})
function findSeatCategory(name: string): SeatGroupModel {
return props.location.seatGroups.find(category =>
return props.seatGroups.find(category =>
category.name == name
)
}

View File

@@ -2,6 +2,10 @@ import axios from "axios"
let BASE_URL = "http://localhost:3000/concerts"
export async function fetchConcerts() {
return await axios.get(BASE_URL)
}
export async function getConcert(id: number) {
if (id != undefined) {
return await axios.get(BASE_URL + "/concert/" + id)
@@ -9,3 +13,7 @@ export async function getConcert(id: number) {
return null
}
}
export async function searchConcert(searchTerm: string) {
return await axios.get(BASE_URL + '/search?value=' + searchTerm)
}

View File

@@ -2,11 +2,12 @@ import axios from "axios"
const BASE_URL = "http://localhost:3000/locations"
export async function getAllLocations() {
export async function fetchAllLocations() {
return await axios.get(BASE_URL)
}
export async function getLocation(locationName: string) {
console.log(locationName)
return await axios.get(BASE_URL + "/location/" + locationName)
}

View File

@@ -1,12 +1,11 @@
import { BandModel } from "./bandModel";
import { EventApiModel } from "./eventApiModel";
import { GenreModel } from "./genreModel"
import { MemberModel } from "./memberModel"
import { RatingModel } from "./ratingModel"
/**
* Replica of the API endpoint /bands
*/
export class BandApiModel extends BandModel {
ratings: Array<RatingModel> = []
members: Array<MemberModel> = []
genres: Array<GenreModel> = []
events: Array<EventApiModel> = []
rating: number = 0
nrOfConcerts: number = 0
}

View File

@@ -0,0 +1,15 @@
import { BandModel } from "./bandModel";
import { ConcertApiModel } from "./concertApiModel";
import { GenreModel } from "./genreModel"
import { MemberModel } from "./memberModel";
import { RatingModel } from "./ratingModel"
/**
* Replica of the API endpoint /bands/band/:name
*/
export class BandDetailsApiModel extends BandModel {
members: Array<MemberModel> = []
ratingValues: Array<RatingModel> = []
genres: Array<GenreModel> = []
concerts: Array<ConcertApiModel> = []
}

View File

@@ -7,4 +7,5 @@ export class BandModel {
images: Array<string> = []
imageMembers: string = ""
logo: string = ""
rating: number = 0
}

View File

@@ -1,8 +1,8 @@
import { LocationApiModel } from "../locations/locationApiModel"
import { BandModel } from "./bandModel"
import { ConcertModel } from "./concertModel"
import { EventApiModel } from "./eventApiModel"
export class ConcertApiModel extends ConcertModel {
location: LocationApiModel = new LocationApiModel()
event: EventApiModel = new EventApiModel()
band: BandModel = new BandModel()
}

View File

@@ -1,6 +1,9 @@
export class ConcertModel {
id: number = -1
inStock: number = 0
date: string = ""
name: string = ""
price: number = 0
image: string = ""
inStock: number = 0
offered: boolean = true
}

View File

@@ -1,8 +0,0 @@
import { EventModel } from "./eventModel";
import { BandModel } from "./bandModel"
import { ConcertApiModel } from "./concertApiModel";
export class EventApiModel extends EventModel {
concerts: Array<ConcertApiModel> = []
band: BandModel = new BandModel()
}

View File

@@ -1,6 +0,0 @@
export class EventModel {
id: number = -1
name: string = ""
offered: boolean = true
image: string = ""
}

View File

@@ -1,4 +1,4 @@
export class RatingModel {
id: number = -1
rating: number = 1
value: number = 0
count: number = 0
}

View File

@@ -1,13 +1,10 @@
import { ConcertApiModel } from "../acts/concertApiModel"
import { CityModel } from "./cityModel"
import { LocationModel } from "./locationModel"
import { SeatGroupModel } from "./seatGroupModel"
/**
* Replica of the API endpoint /locations
*/
export class LocationApiModel extends LocationModel {
city: CityModel = new CityModel()
concerts: Array<ConcertApiModel> = []
seatGroups: Array<SeatGroupModel> = []
nrOfConcerts: number = 0
}

View File

@@ -0,0 +1,13 @@
import { ConcertApiModel } from "../acts/concertApiModel"
import { CityModel } from "./cityModel"
import { LocationModel } from "./locationModel"
import { SeatGroupModel } from "./seatGroupModel"
/**
* Replica of the API endpoint /locations/location/:name
*/
export class LocationDetailsApiModel extends LocationModel {
city: CityModel = new CityModel()
concerts: Array<ConcertApiModel> = []
seatGroups: Array<SeatGroupModel> = []
}

View File

@@ -8,7 +8,6 @@ import { PaymentModel } from "../models/user/paymentModel";
import { ref } from "vue";
import { SelectedSeatModel } from "../models/ordering/selectedSeatModel";
import { calcPrice } from "@/scripts/concertScripts";
import { EventModel } from "../models/acts/eventModel";
import { BandModel } from "../models/acts/bandModel";
export const useBasketStore = defineStore('basketStore', {
@@ -51,28 +50,29 @@ export const useBasketStore = defineStore('basketStore', {
)
},
moveSeatSelectionsToBasket(event: EventModel, band: BandModel) {
for (let selectedSeat of this.selectedSeats) {
let itemInBasket: BasketItemModel = this.itemsInBasket.find((basketItem: BasketItemModel) => {
return basketItem.concert.id == selectedSeat.concert.id
})
moveSeatSelectionsToBasket(event, band: BandModel) {
// todo
// for (let selectedSeat of this.selectedSeats) {
// let itemInBasket: BasketItemModel = this.itemsInBasket.find((basketItem: BasketItemModel) => {
// return basketItem.concert.id == selectedSeat.concert.id
// })
if (itemInBasket != undefined) {
itemInBasket.seats.push(selectedSeat.seat)
} else {
this.itemsInBasket.push(
new BasketItemModel(
selectedSeat.concert,
event,
band,
selectedSeat.seat,
selectedSeat.concert.price
)
)
}
}
// if (itemInBasket != undefined) {
// itemInBasket.seats.push(selectedSeat.seat)
// } else {
// this.itemsInBasket.push(
// new BasketItemModel(
// selectedSeat.concert,
// event,
// band,
// selectedSeat.seat,
// selectedSeat.concert.price
// )
// )
// }
// }
this.selectedSeats = []
// this.selectedSeats = []
},
/**

View File

@@ -0,0 +1,24 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { ConcertApiModel } from "../models/acts/concertApiModel";
import { useFeedbackStore } from "./feedbackStore";
import { fetchConcerts } from "../api/concertApi";
export const useConcertStore = defineStore("concertStore", {
state: () => ({
concerts: ref<Array<ConcertApiModel>>([])
}),
actions: {
async getConcerts() {
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
await fetchConcerts()
.then(result => {
this.concerts = result.data
feedbackStore.fetchDataFromServerInProgress = false
})
}
}
})

View File

@@ -0,0 +1,36 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { useFeedbackStore } from "./feedbackStore";
import { fetchAllLocations } from "../api/locationApi";
import { LocationApiModel } from "../models/locations/locationApiModel";
import { CityModel } from "../models/locations/cityModel";
import { fetchAllCities } from "../api/cityApi";
export const useLocationStore = defineStore("locationStore", {
state: () => ({
locations: ref<Array<LocationApiModel>>([]),
cities: ref<Array<CityModel>>([])
}),
actions: {
async getLocations() {
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
await fetchAllLocations()
.then(result => {
this.locations = result.data
})
await fetchAllCities()
.then(result => {
this.cities = result.data
feedbackStore.fetchDataFromServerInProgress = false
})
},
getLocationsByCity(city: string): Array<LocationApiModel> {
return this.locations.filter(location => location.city.name == city)
}
},
})

View File

@@ -0,0 +1,60 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { ConcertApiModel } from "../models/acts/concertApiModel";
import { BandApiModel } from "../models/acts/bandApiModel";
import { CityApiModel } from "../models/locations/cityApiModel";
import { GenreApiModel } from "../models/acts/genreApiModel";
import { searchBand } from "../api/bandApi";
import { searchLocation } from "../api/locationApi";
import { fetchConcerts, searchConcert } from "../api/concertApi";
import { useFeedbackStore } from "./feedbackStore";
export const useShopStore = defineStore("shopStore", {
state: () => ({
concertsFiltered: ref<Array<ConcertApiModel>>([]),
bandsFiltered: ref<Array<BandApiModel>>([]),
cities: ref<Array<CityApiModel>>([]),
cityFilterName: ref<string>(),
genreFilterName: ref<string>(),
genres: ref<Array<GenreApiModel>>([]),
alreadySearched: ref(false),
searchInProgress: ref(false)
}),
actions: {
/**
* Search for the termin in all bands, locations, events
*/
async startSearch() {
this.alreadySearched = true
this.searchInProgress = true
await searchBand(this.searchTerm)
.then(result => {
this.bands = result.data
})
await searchLocation(this.searchTerm)
.then(result => {
this.locations = result.data
})
await searchConcert(this.searchTerm)
.then(result => {
this.concerts = result.data
})
this.searchInProgress = false
},
async getConcerts() {
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
await fetchConcerts()
.then(result => {
this.concerts = result.data
})
}
}
})

View File

@@ -5,12 +5,10 @@ import { fetchAllCities } from "../api/cityApi";
import { fetchAllGenres } from "../api/genreApi";
import { useFeedbackStore } from "./feedbackStore";
import { CityApiModel } from "../models/locations/cityApiModel";
import { EventApiModel } from "../models/acts/eventApiModel";
import { GenreApiModel } from "../models/acts/genreApiModel";
export const useShoppingStore = defineStore("shoppingStore", {
state: () => ({
events: ref<Array<EventApiModel>>([]),
cities: ref<Array<CityApiModel>>([]),
genres: ref<Array<GenreApiModel>>([]),
cityFilterName: ref<string>(),

View File

@@ -173,5 +173,7 @@
"selectedConcert": "Ausgewähltes Konzert",
"enterSomeKeywords": "Füge Schlagworte ein um nach Bands, Events, Konzerten und Veranstaltungsorten zu suchen",
"noBandFound": "Keine Band gefunden",
"noLocationsFound": "Keine Veranstaltungsorte gefunden"
"noLocationsFound": "Keine Veranstaltungsorte gefunden",
"allBands": "Alle Bands",
"allConcerts": "Alle Konzerte"
}

View File

@@ -173,5 +173,7 @@
"selectedConcert": "Selected Concert",
"enterSomeKeywords": "Enter keywords to search for bands, events, concerts and locations",
"noBandFound": "No band found",
"noLocationsFound": "No location found"
"noLocationsFound": "No location found",
"allBands": "All Bands",
"allConcerts": "All Concerts"
}

View File

@@ -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" />

View File

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

View File

@@ -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>

View File

@@ -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>

View File

@@ -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()

View File

@@ -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>

View File

@@ -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>

View File

@@ -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>

View File

@@ -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"
/>

View File

@@ -30,7 +30,7 @@ const routes = [
// Bands
{ path: '/bands', component: BandsPage },
{ path: '/bands/detail/:name', component: BandDetailPage },
{ path: '/bands/details/:name', component: BandDetailPage },
// Concerts
{ path: '/concerts', component: ConcertsPage },
@@ -38,7 +38,7 @@ const routes = [
// Locations
{ path: '/locations', component: LocationsPage },
{ path: '/locations/detail/:name', name: 'locationDetails', component: LocationDetailPage },
{ path: '/locations/details/:name', name: 'locationDetails', component: LocationDetailPage },
// Misc
{ path: '/search', component: SearchPage },

View File

@@ -1,8 +1,5 @@
import { RatingModel } from "@/data/models/acts/ratingModel"
import { dateToHumanReadableString } from "./dateTimeScripts"
import { ConcertModel } from "@/data/models/acts/concertModel"
import { EventModel } from "@/data/models/acts/eventModel"
import { EventApiModel } from "@/data/models/acts/eventApiModel"
/**
* Calculate a price based on parameters
@@ -18,48 +15,6 @@ export function calcPrice(price: number, quantity: number = 1): number {
}
/**
* Calculate the average of an Array of ratings
*
* @param ratings Array of ratings
*
* @returns Average rating as number
*/
export function calcRating(ratings: Array<RatingModel>) {
let sum = 0
for (let rating of ratings) {
sum += rating.rating
}
return sum / ratings.length
}
/**
* Classifies a bunch of ratings to groups from 1 to 5 stars
*
* @param ratings Array of RatingModels
*
* @returns Array of Objects: { value: number[1-5], count: number }
*/
export function calcRatingValues(ratings: Array<RatingModel>) {
let ratingValues = [
{ value: 1, count: 0 },
{ value: 2, count: 0 },
{ value: 3, count: 0 },
{ value: 4, count: 0 },
{ value: 5, count: 0 }
]
for (let rating of ratings) {
ratingValues[rating.rating - 1].count += 1
}
return ratingValues
}
/**
* Create a date range string of all concerts from an Event
*
@@ -104,24 +59,6 @@ export function lowestTicketPrice(concerts: Array<ConcertModel>): string {
priceArray.sort()
try {
return priceArray[0].toFixed(2)
} catch(e) {
return "0"
}
}
export function lowestTicketPriceEvents(events: Array<EventApiModel>) {
const priceArray : Array<number> = []
for (let event of events) {
for (let concert of event.concerts) {
priceArray.push(concert.price)
}
}
priceArray.sort()
try {
return priceArray[0].toFixed(2)
} catch(e) {