tobias/eventmaster
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

Ticket Component

Browse Source
This commit is contained in:
Tobias Zoghaib
2024-10-06 19:30:12 +02:00
parent c050560fba
commit 4a62c7a96b
47 changed files with 365 additions and 219 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
software/backend/data/orders.json
View File

@@ -23,11 +23,13 @@
"tickets": [ "tickets": [
{ {
"concertId": 0, "concertId": 0,
"orderPrice": 184 "orderPrice": 184,
"seatId": 2
}, },
{ {
"concertId": 0, "concertId": 0,
"orderPrice": 184 "orderPrice": 184,
"seatId": 3
} }
] ]
}, },
@@ -40,7 +42,8 @@
"tickets": [ "tickets": [
{ {
"concertId": 0, "concertId": 0,
"orderPrice": 184 "orderPrice": 184,
"seatId": 3
} }
] ]
} }

2
software/backend/models/ordering/ticket.model.ts
View File

@@ -26,7 +26,7 @@ export class Ticket extends Model {
order: Order order: Order
@BelongsTo(() => Concert) @BelongsTo(() => Concert)
product: Concert concert: Concert
@BelongsTo(() => Seat) @BelongsTo(() => Seat)
seat: Seat seat: Seat

18
software/backend/routes/order.routes.ts
View File

@@ -7,6 +7,10 @@ import { Address } from "../models/user/address.model";
import { Band } from "../models/acts/band.model"; import { Band } from "../models/acts/band.model";
import { Location } from "../models/locations/location.model"; import { Location } from "../models/locations/location.model";
import { Event } from "../models/acts/event.model"; import { Event } from "../models/acts/event.model";
import { City } from "../models/locations/city.model";
import { Seat } from "../models/locations/seat.model";
import { SeatRow } from "../models/locations/seatRow.model";
import { SeatGroup } from "../models/locations/seatGroup.model";
export const order = Router() export const order = Router()
@@ -25,7 +29,10 @@ order.get("/:id", (req: Request, res: Response) => {
model: Event, model: Event,
include: [ Band ] include: [ Band ]
}, },
Location {
model: Location,
include: [ City ]
}
], ],
attributes: { attributes: {
exclude: [ exclude: [
@@ -34,6 +41,15 @@ order.get("/:id", (req: Request, res: Response) => {
] ]
} }
}, },
{
model: Seat,
include: [
{
model: SeatRow,
include: [ SeatGroup ]
}
]
}
] ]
}, },
Payment, Payment,

1
software/src/components/actionDialog.vue → software/src/components/basics/actionDialog.vue
View File

@@ -1,6 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { ModelRef } from 'vue'; import { ModelRef } from 'vue';
import cardView from './cardView.vue';
const showDialog: ModelRef<boolean> = defineModel() const showDialog: ModelRef<boolean> = defineModel()

0
software/src/components/cardView.vue → software/src/components/basics/cardView.vue
View File

85
software/src/components/basics/cardViewLeftImage.vue Normal file
View File

@@ -0,0 +1,85 @@
<script setup lang="ts">
defineProps({
/** Image to display on the left side */
image: String,
/** Title in the top bar */
title: String,
/** Make the CardView click- and hoverable */
link: {
type: Boolean,
default: true
},
/** Displays a Skeleton Loader if true */
loading: Boolean,
/** Height of the card, default 140px */
height: {
type: Number,
default: 200
},
colorHeader: String
})
</script>
<template>
<v-card
variant="tonal"
:link="link"
>
<v-card-title v-if="title" color="primary" class="pa-0">
<v-sheet color="primary" class="pl-2 py-1">
{{ title }}
</v-sheet>
</v-card-title>
<v-row :height="height">
<!-- First col for image -->
<v-col
cols="3"
>
<v-skeleton-loader
type="image"
:loading="loading"
>
<v-img
:src="image"
:height="height"
:width="100"
aspect-ratio="1"
cover
/>
</v-skeleton-loader>
</v-col>
<!-- Second col for main content -->
<v-col
cols="7"
class="text-h5"
>
<v-skeleton-loader
:loading="loading"
type="sentences"
class="my-2"
>
<div>
<slot name="content" />
</div>
</v-skeleton-loader>
</v-col>
<v-divider vertical class="mt-3" />
<!-- Third col for append content after the divider -->
<v-col
cols="2"
class="text-center pr-5 text-h5 d-flex justify-center align-center"
>
<slot name="append"></slot>
</v-col>
</v-row>
</v-card>
</template>

0
software/src/components/cardWithTopImage.vue → software/src/components/basics/cardViewTopImage.vue
View File

4
software/src/components/confirmDialog.vue → software/src/components/basics/confirmDialog.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { ModelRef } from 'vue'; import { ModelRef } from 'vue';
import actionDialog from './actionDialog.vue'; import actionDialog from './../basics/actionDialog.vue';
import outlinedButton from './outlinedButton.vue'; import outlinedButton from './../basics/outlinedButton.vue';
const showDialog: ModelRef<boolean> = defineModel() const showDialog: ModelRef<boolean> = defineModel()

0
software/src/components/outlinedButton.vue → software/src/components/basics/outlinedButton.vue
View File

27
software/src/components/sectionDivider.vue → software/src/components/basics/sectionDivider.vue
View File

@@ -7,32 +7,7 @@ defineProps({
</script> </script>
<template> <template>
<div v-if="image" class="pt-1"> <v-row class="pt-3">
<v-img
:src="'http://localhost:3000/static/' + image"
height="120"
gradient="to top right, rgba(0,0,0,.5), rgba(0,0,0,.7)"
cover
class="rounded-t-xl"
>
<v-container
height="100%"
class="d-flex justify-center align-center"
>
<v-row>
<v-spacer />
<v-col class="v-col-auto">
<span class="text-h4" style="color: white;">{{ title }}</span>
</v-col>
<v-spacer />
</v-row>
</v-container>
</v-img>
</div>
<v-row v-else class="pt-3">
<v-col class="d-flex justify-center align-center"> <v-col class="d-flex justify-center align-center">
<v-sheet height="12" width="100%" color="primary" class="rounded-s-lg" /> <v-sheet height="12" width="100%" color="primary" class="rounded-s-lg" />
</v-col> </v-col>

68
software/src/components/cardWithLeftImage.vue
View File

@@ -1,68 +0,0 @@
<script setup lang="ts">
defineProps({
image: String,
title: String,
link: {
type: Boolean,
default: true
},
loading: Boolean
})
</script>
<template>
<v-card
variant="tonal"
:link="link"
>
<v-row>
<v-col cols="auto" class="pr-0">
<v-skeleton-loader
type="image"
:loading="loading"
width="140"
>
<v-img
:src="image"
aspect-ratio="1"
width="140"
cover
/>
</v-skeleton-loader>
</v-col>
<v-col class="pl-0" cols="7">
<v-skeleton-loader
:loading="loading"
type="heading"
>
<v-card-title v-if="title">
{{ title }}
</v-card-title>
</v-skeleton-loader>
<div class="px-4 pb-4" v-if="$slots.default">
<v-skeleton-loader
:loading="loading"
type="sentences"
>
<slot></slot>
</v-skeleton-loader>
</div>
</v-col>
<v-spacer />
<v-divider vertical height="100%" />
<v-col
cols="2"
height="100%"
style="flex-wrap: nowrap; align-self: center;"
class="text-h5 text-center mr-3"
>
<slot name="append"></slot>
</v-col>
</v-row>
</v-card>
</template>

37
software/src/components/pageParts/concertListItem.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import cardWithLeftImage from '../cardWithLeftImage.vue'; import cardWithLeftImage from '../basics/cardViewLeftImage.vue';
defineProps({ defineProps({
/** Image to print on the left side */
image: String, image: String,
title: String, title: String,
description: String,
loading: Boolean, loading: Boolean,
appendIcon: { appendIcon: {
type: String, type: String,
@@ -29,25 +29,23 @@ defineProps({
:image="'http://localhost:3000/static/' + image" :image="'http://localhost:3000/static/' + image"
:link="link" :link="link"
> >
<div class="text-body-1 font-weight-bold"> <template #content>
<div v-if="!$slots.description"> <div>
{{ description }} <slot name="content" />
</div> </div>
</template>
<div v-else>
<slot name="description" />
</div>
</div>
<template #append> <template #append>
<div> <div>
<v-icon <div>
:icon="appendIcon" <v-icon
:color="appendIconColor" :icon="appendIcon"
size="x-large" :color="appendIconColor"
/> size="x-large"
/>
</div>
<slot name="append-text"></slot>
</div> </div>
<slot name="append-text"></slot>
</template> </template>
</card-with-left-image> </card-with-left-image>
</v-col> </v-col>
@@ -61,9 +59,4 @@ defineProps({
</card-with-left-image> </card-with-left-image>
</v-col> </v-col>
</v-row> </v-row>
</template> </template>
<style scoped>
.v-card--variant-tonal {
}
</style>

103
software/src/components/pageParts/ticketListItem.vue Normal file
View File

@@ -0,0 +1,103 @@
<script setup lang="ts">
import { ConcertModel } from '@/data/models/acts/concertModel';
import cardWithLeftImage from '../basics/cardViewLeftImage.vue';
import { dateStringToHumanReadableString, dateToHumanReadableString } from '@/scripts/dateTimeScripts';
defineProps({
concert: ConcertModel,
/** Image to print on the left side */
image: String,
/** Event series name */
eventName: String,
seatGroup: String,
seatRow: Number,
seat: Number,
standingArea: {
type: Boolean,
default: false
}
})
</script>
<template>
<card-with-left-image
:image="'http://localhost:3000/static/' + image"
:link="false"
color-header="primary"
:title="concert.event.band.name + ' - ' + concert.event.name"
>
<template #content>
<div class="text-caption">
{{ $t('date') }}
</div>
<div>
{{ dateStringToHumanReadableString(concert.date) }}
</div>
<div class="text-caption">
{{ $t('location') }}
</div>
<div>
{{ concert.location.name }}, {{ concert.location.city.name }}
</div>
<div class="text-caption">
{{ $t('price') }}
</div>
<div>
{{ concert.price }} €
</div>
</template>
<template #append>
<v-row>
<v-col>
<v-card variant="outlined" class="my-1" >
<div class="text-caption">
{{ $t('seatGroup') }}
</div>
<div>
{{ seatGroup }}
</div>
<div v-if="standingArea" class="text-caption">
{{ $t('standingArea') }}
</div>
</v-card>
<div v-if="!standingArea">
<v-card variant="outlined" class="my-1" >
<div class="text-caption">
{{ $t('seatRow') }}
</div>
<div>
{{ seatRow }}
</div>
</v-card>
<v-card variant="outlined" class="my-1" >
<div class="text-caption">
{{ $t('seat') }}
</div>
<div>
{{ seat }}
</div>
</v-card>
</div>
</v-col>
</v-row>
</template>
</card-with-left-image>
</template>

8
software/src/data/models/ordering/orderItemModel.ts
View File

@@ -1,8 +0,0 @@
import { ConcertModel } from "../acts/concertModel"
export class OrderItemModel {
orderId: number = -1
quantity: number = 1
orderPrice: number = 0
product: ConcertModel
}

4
software/src/data/models/ordering/orderModel.ts
View File

@@ -1,12 +1,12 @@
import { AddressModel } from "../user/addressModel" import { AddressModel } from "../user/addressModel"
import { OrderItemModel } from "./orderItemModel"
import { PaymentModel } from "../user/paymentModel" import { PaymentModel } from "../user/paymentModel"
import { TicketModel } from "./ticketModel"
export class OrderModel { export class OrderModel {
id: number id: number
accountId: number accountId: number
shippingProgress: number shippingProgress: number
orderItems: Array<OrderItemModel> tickets: Array<TicketModel>
orderedAt: string orderedAt: string
payment: PaymentModel payment: PaymentModel
address: AddressModel address: AddressModel

20
software/src/data/models/ordering/ticketModel.ts Normal file
View File

@@ -0,0 +1,20 @@
import { ConcertModel } from "../acts/concertModel"
import { SeatModel } from "../locations/seatModel"
export class TicketModel {
id: number
orderId: number = -1
orderPrice: number = 0
concert: ConcertModel
seat: {
seatNr: number,
seatRow: {
row: number,
seatGroup: {
name: string,
surcharge: number,
standingArea: boolean
}
}
}
}

3
software/src/data/stores/accountStore.ts
View File

@@ -11,8 +11,7 @@ import { PaymentModel } from "../models/user/paymentModel";
export const useAccountStore = defineStore("accountStore", { export const useAccountStore = defineStore("accountStore", {
state: () => ({ state: () => ({
userAccount: useLocalStorage("hackmycart/accountStore/userAccount", new AccountModel()), userAccount: useLocalStorage("hackmycart/accountStore/userAccount", new AccountModel())
orders: useLocalStorage<Array<OrderModel>>("hackmycart/accountStore/orders", [ new OrderModel() ])
}), }),
actions: { actions: {

8
software/src/locales/de.json
View File

@@ -153,5 +153,11 @@
"orderedAt": "Bestellt am", "orderedAt": "Bestellt am",
"logout": "Ausloggen", "logout": "Ausloggen",
"logoutDescription": "Aktuellen Useraccount ausloggen", "logoutDescription": "Aktuellen Useraccount ausloggen",
"login": "Login" "login": "Login",
"seatRow": "Sitzreihe",
"seat": "Sitz",
"seatGroup": "Kategorie",
"date": "Datum",
"price": "Preis",
"standingArea": "Stehbereich"
} }

8
software/src/locales/en.json
View File

@@ -153,5 +153,11 @@
"orderedAt": "Ordered at", "orderedAt": "Ordered at",
"logout": "Logout", "logout": "Logout",
"logoutDescription": "Logout current account", "logoutDescription": "Logout current account",
"login": "Login" "login": "Login",
"seatRow": "Seat Row",
"seat": "Seat",
"seatGroup": "Category",
"date": "Date",
"price": "Price",
"standingArea": "Standing Area"
} }

2
software/src/pages/account/accountDataPage/accountDataCard.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';

6
software/src/pages/account/accountDataPage/accountManagingCard.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import confirmDialog from '@/components/confirmDialog.vue'; import confirmDialog from '@/components/basics/confirmDialog.vue';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import { ref } from 'vue'; import { ref } from 'vue';

5
software/src/pages/account/accountDataPage/addressesCard.vue
View File

@@ -1,9 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { AddressModel } from '@/data/models/user/addressModel'; import { AddressModel } from '@/data/models/user/addressModel';
import { useFeedbackStore } from '@/data/stores/feedbackStore';
import { getNumberStartRules, getPostalRules, getStringRules } from '@/scripts/validationRules'; import { getNumberStartRules, getPostalRules, getStringRules } from '@/scripts/validationRules';
const accountStore = useAccountStore() const accountStore = useAccountStore()

2
software/src/pages/account/accountDataPage/index.vue
View File

@@ -3,7 +3,7 @@ import accountDataCard from './accountDataCard.vue';
import accountManagingCard from './accountManagingCard.vue'; import accountManagingCard from './accountManagingCard.vue';
import addressesCard from './addressesCard.vue'; import addressesCard from './addressesCard.vue';
import paymentsCard from './paymentsCard.vue'; import paymentsCard from './paymentsCard.vue';
import OutlinedButton from '@/components/outlinedButton.vue'; import OutlinedButton from '@/components/basics/outlinedButton.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
const router = useRouter() const router = useRouter()

4
software/src/pages/account/accountDataPage/paymentsCard.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { PaymentModel } from '@/data/models/user/paymentModel'; import { PaymentModel } from '@/data/models/user/paymentModel';
import { getIbanRules, getStringRules } from '@/scripts/validationRules'; import { getIbanRules, getStringRules } from '@/scripts/validationRules';

2
software/src/pages/account/accountHomePage/index.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
const accountStore = useAccountStore() const accountStore = useAccountStore()

10
software/src/pages/account/loginPage/loginForm.vue
View File

@@ -1,8 +1,9 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref } from 'vue'; import { ref } from 'vue';
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import { useRouter } from 'vue-router';
const accountStore = useAccountStore() const accountStore = useAccountStore()
const showRegisterCard = defineModel("showRegisterCard", { type: Boolean, default: false }) const showRegisterCard = defineModel("showRegisterCard", { type: Boolean, default: false })
@@ -11,6 +12,7 @@ const username = ref("duranduran")
const password = ref("H4nn0ver") const password = ref("H4nn0ver")
const usernameWrong = ref(false) const usernameWrong = ref(false)
const passwordWrong = ref(false) const passwordWrong = ref(false)
const router = useRouter()
async function startLogin() { async function startLogin() {
loginInProgress.value = true loginInProgress.value = true
@@ -29,6 +31,10 @@ async function startLogin() {
password.value != null && password.value.length > 0) password.value != null && password.value.length > 0)
{ {
await accountStore.login(username.value, password.value) await accountStore.login(username.value, password.value)
if (accountStore.userAccount.id != undefined) {
router.push("/account/home")
}
// todo: Route to account home page // todo: Route to account home page
} }

4
software/src/pages/account/loginPage/registerForm.vue
View File

@@ -1,8 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
import { AccountModel } from '@/data/models/user/accountModel'; import { AccountModel } from '@/data/models/user/accountModel';
import { ref } from 'vue'; import { ref } from 'vue';
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';
import { getEmailRules, getPasswordRules, getStringRules } from '@/scripts/validationRules'; import { getEmailRules, getPasswordRules, getStringRules } from '@/scripts/validationRules';

37
software/src/pages/account/ordersPage/index.vue
View File

@@ -1,31 +1,20 @@
<script setup lang="ts"> <script setup lang="ts">
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import ordersCard from './orderItem.vue'; import orderItem from './orderItem.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { getUserOrders } from '@/data/api/orderApi';
import { ref } from 'vue';
import { OrderModel } from '@/data/models/ordering/orderModel';
const accountStore = useAccountStore() const accountStore = useAccountStore()
const router = useRouter() const router = useRouter()
const orders = ref<Array<OrderModel>>([])
function getDotColor(order, step: number) { getUserOrders(accountStore.userAccount.id)
if (order.shippingProgress == step) .then(result => {
{ orders.value = result.data
return "orange" })
} else if (order.shippingProgress >= step)
{
return "green"
} else
{
return "grey"
}
}
function formatDateTimeString(string: string) {
let date = new Date(string)
return date.getDate() + '.' + (date.getMonth() + 1) + '.' + date.getFullYear() + ', ' +
date.getHours() + ':' + date.getMinutes()
}
</script> </script>
<template> <template>
@@ -39,11 +28,11 @@ function formatDateTimeString(string: string) {
</v-row> </v-row>
<v-row <v-row
v-if="accountStore.orders.length > 0" v-if="orders.length > 0"
v-for="order in accountStore.orders" v-for="order in orders"
> >
<v-col> <v-col>
<orders-card :order="order" /> <order-item :order="order" />
</v-col> </v-col>
</v-row> </v-row>

35
software/src/pages/account/ordersPage/orderItem.vue
View File

@@ -1,13 +1,17 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import { OrderModel } from '@/data/models/ordering/orderModel'; import { OrderModel } from '@/data/models/ordering/orderModel';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import concertListItem from '@/components/pageParts/concertListItem.vue'; import ticketListItem from '@/components/pageParts/ticketListItem.vue';
const accountStore = useAccountStore() const accountStore = useAccountStore()
defineProps({ defineProps({
order: OrderModel order: OrderModel,
loading: {
type: Boolean,
default: false
}
}) })
function formatDateTimeString(string: string) { function formatDateTimeString(string: string) {
@@ -21,7 +25,7 @@ function formatDateTimeString(string: string) {
<template> <template>
<card-view <card-view
:title="$t('orderedAt') + ' ' + formatDateTimeString(order.orderedAt) + ' ' + $t('oclock')" :title="$t('orderedAt') + ' ' + formatDateTimeString(order.orderedAt) + ' ' + $t('oclock')"
:subtitle="$t('totalPrice') + ': ' + accountStore.getOrderTotalPrice(order.id) + ' €'" variant="outlined"
> >
<v-row> <v-row>
<v-col> <v-col>
@@ -48,18 +52,29 @@ function formatDateTimeString(string: string) {
</v-col> </v-col>
</v-row> </v-row>
<v-row> <v-row v-for="ticket of order.tickets">
<v-col>
<ticket-list-item
:concert="ticket.concert"
:image="ticket.concert.event.image"
:seat-group="ticket.seat.seatRow.seatGroup.name"
:seat-row="ticket.seat.seatRow.row"
:seat="ticket.seat.seatNr"
:standing-area="ticket.seat.seatRow.seatGroup.standingArea"
/>
</v-col>
</v-row> </v-row>
<v-row> <!-- <v-row>
<v-col> <v-col>
<v-table class="bg-surface-light"> <v-table class="bg-surface-light">
<thead> <thead>
<tr> <tr>
<th>{{ $t('quantity') }}</th> <th>{{ $t('quantity') }}</th>
<th>{{ $t('product.brand') }}</th> <th>{{ $t('event') }}</th>
<th>{{ $t('product.productName') }}</th> <th>{{ $t('seatGroup') }}</th>
<th>{{ $t('seatRow') }}</th>
<th>{{ $t('seat') }}</th>
<th>{{ $t('product.productPrice') }}</th> <th>{{ $t('product.productPrice') }}</th>
</tr> </tr>
</thead> </thead>
@@ -73,6 +88,6 @@ function formatDateTimeString(string: string) {
</tbody> </tbody>
</v-table> </v-table>
</v-col> </v-col>
</v-row> </v-row> -->
</card-view> </card-view>
</template> </template>

2
software/src/pages/admin/brandsPage/index.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
// import { useProductStore } from '@/data/stores/productStore'; // import { useProductStore } from '@/data/stores/productStore';
// const productStore = useProductStore() // const productStore = useProductStore()

2
software/src/pages/admin/categoriesPage/index.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
const headers = [ const headers = [
{ title: "Name", value: "name" }, { title: "Name", value: "name" },

2
software/src/pages/admin/productsPage/index.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import productEditDialog from './productEditDialog.vue'; import productEditDialog from './productEditDialog.vue';
import { ref } from 'vue'; import { ref } from 'vue';

4
software/src/pages/admin/productsPage/productEditDialog.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import actionDialog from '@/components/actionDialog.vue'; import actionDialog from '@/components/basics/actionDialog.vue';
import { ProductModel } from '@/data/models/productModel'; import { ProductModel } from '@/data/models/productModel';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useProductStore } from '@/data/stores/productStore'; import { useProductStore } from '@/data/stores/productStore';
import { ModelRef } from 'vue'; import { ModelRef } from 'vue';

4
software/src/pages/basketPage/index.vue
View File

@@ -1,8 +1,8 @@
<script setup lang="ts"> <script setup lang="ts">
import { useBasketStore } from '@/data/stores/basketStore'; import { useBasketStore } from '@/data/stores/basketStore';
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import orderingDialog from './orderingDialog.vue'; import orderingDialog from './orderingDialog.vue';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { ref } from 'vue'; import { ref } from 'vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';
import concertListItem from '@/components/pageParts/concertListItem.vue'; import concertListItem from '@/components/pageParts/concertListItem.vue';

4
software/src/pages/basketPage/orderingDialog.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import actionDialog from '@/components/actionDialog.vue'; import actionDialog from '@/components/basics/actionDialog.vue';
import { useBasketStore } from '@/data/stores/basketStore'; import { useBasketStore } from '@/data/stores/basketStore';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { ModelRef, ref } from 'vue'; import { ModelRef, ref } from 'vue';
import { useAccountStore } from '@/data/stores/accountStore'; import { useAccountStore } from '@/data/stores/accountStore';

2
software/src/pages/events/bandDetailPage/bandMemberSection.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { BandModel } from '@/data/models/acts/bandModel'; import { BandModel } from '@/data/models/acts/bandModel';
import cardWithTopImage from '@/components/cardWithTopImage.vue'; import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';
const feedbackStore = useFeedbackStore() const feedbackStore = useFeedbackStore()

2
software/src/pages/events/bandDetailPage/index.vue
View File

@@ -6,7 +6,7 @@ import bandMemberSection from './bandMemberSection.vue';
import gallerySection from './gallerySection.vue'; import gallerySection from './gallerySection.vue';
import concertSection from './concertSection.vue'; import concertSection from './concertSection.vue';
import heroImage from '@/components/pageParts/heroImage.vue'; import heroImage from '@/components/pageParts/heroImage.vue';
import sectionDivider from '@/components/sectionDivider.vue'; import sectionDivider from '@/components/basics/sectionDivider.vue';
import { useShoppingStore } from '@/data/stores/shoppingStore'; import { useShoppingStore } from '@/data/stores/shoppingStore';
import { ref } from 'vue'; import { ref } from 'vue';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';

4
software/src/pages/events/eventsPage/filterBar.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { GenreModel } from '@/data/models/acts/genreModel'; import { GenreModel } from '@/data/models/acts/genreModel';
import { CityModel } from '@/data/models/locations/cityModel'; import { CityModel } from '@/data/models/locations/cityModel';
import { useShoppingStore } from '@/data/stores/shoppingStore'; import { useShoppingStore } from '@/data/stores/shoppingStore';

16
software/src/pages/events/eventsPage/index.vue
View File

@@ -35,12 +35,20 @@ shoppingStore.getEvents()
v-else-if="shoppingStore.events.length > 0" v-else-if="shoppingStore.events.length > 0"
v-for="event of shoppingStore.events" v-for="event of shoppingStore.events"
:image="event.image" :image="event.image"
:title="event.band.name + ' - ' + event.name"
@click="router.push('/bands/' + event.band.name.replaceAll(' ', '-').toLowerCase())" @click="router.push('/bands/' + event.band.name.replaceAll(' ', '-').toLowerCase())"
> >
<template #description> <template #content>
{{ createDateRangeString(event) }} <div class="text-h4">
<div>{{ event.concerts.length }} {{ $t('concert', event.concerts.length) }}</div> {{ event.band.name + ' - ' + event.name }}
</div>
<div class="text-h5">
{{ createDateRangeString(event) }}
</div>
<div class="text-h5">
{{ event.concerts.length }} {{ $t('concert', event.concerts.length) }}
</div>
</template> </template>
<template #append-text> <template #append-text>

4
software/src/pages/events/ticketOrderPage/index.vue
View File

@@ -5,12 +5,12 @@ import { SeatGroupModel } from '@/data/models/locations/seatGroupModel';
import { getConcert } from '@/data/api/concertApi'; import { getConcert } from '@/data/api/concertApi';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import sectionDivider from '@/components/sectionDivider.vue'; import sectionDivider from '@/components/basics/sectionDivider.vue';
import { useBasketStore } from '@/data/stores/basketStore'; import { useBasketStore } from '@/data/stores/basketStore';
import concertListItem from '@/components/pageParts/concertListItem.vue'; import concertListItem from '@/components/pageParts/concertListItem.vue';
import { ConcertModel } from '@/data/models/acts/concertModel'; import { ConcertModel } from '@/data/models/acts/concertModel';
import { dateStringToHumanReadableString } from '@/scripts/dateTimeScripts'; import { dateStringToHumanReadableString } from '@/scripts/dateTimeScripts';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
const router = useRouter() const router = useRouter()
const seatGroups = ref<Array<SeatGroupModel>>() const seatGroups = ref<Array<SeatGroupModel>>()

4
software/src/pages/homePage/highlightCarousel.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import OutlinedButton from '@/components/outlinedButton.vue'; import OutlinedButton from '@/components/basics/outlinedButton.vue';
import { useConcertStore } from '@/data/stores/concertStore'; import { useConcertStore } from '@/data/stores/concertStore';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
@@ -32,7 +32,7 @@ const router = useRouter()
<v-carousel-item <v-carousel-item
v-for="band in concertStore.bands" v-for="band in concertStore.bands"
:src="'http://localhost:3000/static/bands/' + band.imageMembers" :src="'http://localhost:3000/static/' + band.imageMembers"
cover cover
> >
<v-card <v-card

6
software/src/pages/homePage/index.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { useConcertStore } from '@/data/stores/concertStore'; import { useConcertStore } from '@/data/stores/concertStore';
import highlightCarousel from './highlightCarousel.vue'; import highlightCarousel from './highlightCarousel.vue';
import sectionDivider from '@/components/sectionDivider.vue'; import sectionDivider from '@/components/basics/sectionDivider.vue';
import cardWithTopImage from '@/components/cardWithTopImage.vue'; import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
import { lowestTicketPrice } from '@/scripts/concertScripts'; import { lowestTicketPrice } from '@/scripts/concertScripts';
import OutlinedButton from '@/components/outlinedButton.vue'; import OutlinedButton from '@/components/basics/outlinedButton.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';
import { ref } from 'vue'; import { ref } from 'vue';

2
software/src/pages/locations/locationDetailPage/index.vue
View File

@@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { LocationModel } from '@/data/models/locations/locationModel'; import { LocationModel } from '@/data/models/locations/locationModel';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import sectionDivider from '@/components/sectionDivider.vue'; import sectionDivider from '@/components/basics/sectionDivider.vue';
import { dateStringToHumanReadableString } from '@/scripts/dateTimeScripts'; import { dateStringToHumanReadableString } from '@/scripts/dateTimeScripts';
import seatPlanMap from '@/components/seatPlanMap/seatPlanMap.vue'; import seatPlanMap from '@/components/seatPlanMap/seatPlanMap.vue';
import { useShoppingStore } from '@/data/stores/shoppingStore'; import { useShoppingStore } from '@/data/stores/shoppingStore';

4
software/src/pages/locations/locationsPage/index.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import sectionDivider from '@/components/sectionDivider.vue'; import sectionDivider from '@/components/basics/sectionDivider.vue';
import cardWithTopImage from '@/components/cardWithTopImage.vue'; import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useShoppingStore } from '@/data/stores/shoppingStore'; import { useShoppingStore } from '@/data/stores/shoppingStore';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';

2
software/src/pages/system/helpPage/scoreCard.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
const props = defineProps({ const props = defineProps({
exerciseGroup: String, exerciseGroup: String,

2
software/src/pages/system/preferencesPage/pageSetup.vue
View File

@@ -2,7 +2,7 @@
import { ThemeEnum } from '@/data/enums/themeEnums'; import { ThemeEnum } from '@/data/enums/themeEnums';
import { useTheme } from 'vuetify/lib/framework.mjs'; import { useTheme } from 'vuetify/lib/framework.mjs';
import { i18n } from '@/plugins/i18n'; import { i18n } from '@/plugins/i18n';
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import { usePreferencesStore } from '@/data/stores/preferencesStore'; import { usePreferencesStore } from '@/data/stores/preferencesStore';
const preferencesStore = usePreferencesStore() const preferencesStore = usePreferencesStore()

6
software/src/pages/system/preferencesPage/systemSetup.vue
View File

@@ -1,10 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { BannerStateEnum } from '@/data/enums/bannerStateEnum'; import { BannerStateEnum } from '@/data/enums/bannerStateEnum';
import { useFeedbackStore } from '@/data/stores/feedbackStore'; import { useFeedbackStore } from '@/data/stores/feedbackStore';
import cardView from '@/components/cardView.vue'; import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/outlinedButton.vue'; import outlinedButton from '@/components/basics/outlinedButton.vue';
import { ref } from 'vue'; import { ref } from 'vue';
import confirmDialog from '@/components/confirmDialog.vue'; import confirmDialog from '@/components/basics/confirmDialog.vue';
import { getServerState, resetDatabase } from '@/data/api/mainApi'; import { getServerState, resetDatabase } from '@/data/api/mainApi';
import { ServerStateEnum } from '@/data/enums/serverStateEnum'; import { ServerStateEnum } from '@/data/enums/serverStateEnum';