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

Fix order process

Browse Source
This commit is contained in:
Tobias Zoghaib
2024-10-21 14:57:03 +02:00
parent 18a7814747
commit b1b731f3d3
17 changed files with 212 additions and 213 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
software/src/components/basics/actionDialog.vue
View File

@@ -1,5 +1,6 @@
<script setup lang="ts">
import { ModelRef } from 'vue';
import cardView from './cardView.vue';
const showDialog: ModelRef<boolean> = defineModel()
@@ -16,16 +17,17 @@ defineProps({
<template>
<v-dialog max-width="1200" v-model="showDialog">
<v-card
<card-view
:title="title"
:subtitle="subtitle"
:prepend-icon="icon"
:icon="icon"
:tonal="false"
>
<slot></slot>
<template #actions>
<slot name="actions"></slot>
</template>
</v-card>
</card-view>
</v-dialog>
</template>

8
software/src/components/basics/cardView.vue
View File

@@ -9,12 +9,18 @@ defineProps({
loading: {
type: Boolean,
default: false
},
tonal: {
type: Boolean,
default: true
}
})
</script>
<template>
<v-card variant="tonal" >
<v-card
:variant="tonal ? 'tonal' : 'elevated'"
>
<v-card-title v-if="title || loading" color="primary" class="pa-0">
<v-sheet color="primary">
<v-skeleton-loader

4
software/src/components/navigation/navigationAppendItems.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import { useAccountStore } from '@/stores/account.store';
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
const accountStore = useAccountStore()
const basketStore = useBasketStore()
@@ -10,7 +10,7 @@ const basketStore = useBasketStore()
<v-btn variant="plain" icon="mdi-magnify" to="/search" />
<v-btn v-if="accountStore.userAccount.id == undefined" variant="plain" icon="mdi-account" to="/account/login" />
<v-btn v-else variant="plain" icon="mdi-account" to="/account/home" />
<v-btn v-else variant="plain" icon="mdi-account-check" to="/account/home" />
<div>
<v-badge

2
software/src/components/seatPlanMap/seatGroupTable.vue
View File

@@ -4,7 +4,7 @@ import { SeatGroupModel } from '@/data/models/locations/seatGroupModel';
import { SeatModel } from '@/data/models/locations/seatModel';
import { SeatRowModel } from '@/data/models/locations/seatRowModel';
import { SelectedSeatModel } from '@/data/models/ordering/selectedSeatModel';
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
const basketStore = useBasketStore()

2
software/src/components/seatPlanMap/standingArea.vue
View File

@@ -2,7 +2,7 @@
import { ConcertModel } from '@/data/models/acts/concertModel';
import { SeatGroupModel } from '@/data/models/locations/seatGroupModel';
import { SelectedSeatModel } from '@/data/models/ordering/selectedSeatModel';
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
const basketStore = useBasketStore()

26
software/src/data/api/orderApi.ts
View File

@@ -7,25 +7,29 @@ export async function getUserOrders(userId: number) {
return axios.get(BASE_URL + "/" + userId)
}
export async function addOrder(
export async function createOrder(
accountId: number,
basketItems: Array<BasketItemModel>,
basketItem: Array<BasketItemModel>,
paymentId: number,
addressId: number
) {
let orderItems = []
let tickets = []
// for (let basketItem of basketItems) {
// orderItems.push({
// productId: basketItem.product.id,
// quantity: basketItem.quantity,
// orderPrice: calcPrice(basketItem.product.price, basketItem.product.discount)
// })
// }
for (let item of basketItem) {
for (let seat of item.seats) {
tickets.push({
concertId: item.concert.id,
orderPrice: item.price,
seatId: seat.id
})
}
}
console.log(tickets)
return axios.post(BASE_URL, {
accountId: accountId,
orderItems: orderItems,
tickets: tickets,
paymentId: paymentId,
addressId: addressId
})

6
software/src/data/models/ordering/basketItemModel.ts
View File

@@ -1,19 +1,15 @@
import { BandApiModel } from "../acts/bandApiModel"
import { BandModel } from "../acts/bandModel"
import { ConcertModel } from "../acts/concertModel"
import { EventModel } from "../acts/eventModel"
import { SeatModel } from "../locations/seatModel"
export class BasketItemModel {
concert: ConcertModel
event: EventModel
band: BandModel = new BandModel()
seats: Array<SeatModel> = []
price: number
constructor(concert: ConcertModel, event: EventModel, band: BandModel, seat: SeatModel, price: number) {
constructor(concert: ConcertModel, band: BandModel, seat: SeatModel, price: number) {
this.concert = concert
this.event = event
this.band = band
this.seats = [ seat ]
this.price = price

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

@@ -177,5 +177,6 @@
"allBands": "Alle Bands",
"allConcerts": "Alle Konzerte",
"more": "Mehr",
"upcomingConcerts": "Nächste Konzerte"
"upcomingConcerts": "Nächste Konzerte",
"pleaseLogin": "Bitte anmelden"
}

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

@@ -177,5 +177,6 @@
"allBands": "All Bands",
"allConcerts": "All Concerts",
"more": "More",
"upcomingConcerts": "Upcoming Concerts"
"upcomingConcerts": "Upcoming Concerts",
"pleaseLogin": "Please login"
}

2
software/src/pages/concerts/concertBookingPage/index.vue
View File

@@ -2,7 +2,7 @@
import seatPlanMap from '@/components/seatPlanMap/seatPlanMap.vue';
import { useRouter } from 'vue-router';
import sectionDivider from '@/components/basics/sectionDivider.vue';
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
import concertListItem from '@/components/pageParts/concertListItem.vue';
import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useConcertStore } from '@/stores/concertStore';

6
software/src/pages/misc/basketPage/index.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
import cardView from '@/components/basics/cardView.vue';
import orderingDialog from './orderingDialog.vue';
import outlinedButton from '@/components/basics/outlinedButton.vue';
@@ -24,9 +24,7 @@ const showOrderingDialog = ref()
icon="mdi-cart"
>
<!-- Display items if basket is not empty -->
<div v-if="basketStore.itemsInBasket.length > 0">
<tickets-table />
</div>
<tickets-table v-if="basketStore.itemsInBasket.length > 0"/>
<!-- Display empty state if card is empty -->
<v-empty-state v-else

32
software/src/pages/misc/basketPage/orderingDialog.vue
View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import actionDialog from '@/components/basics/actionDialog.vue';
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
import outlinedButton from '@/components/basics/outlinedButton.vue';
import { ModelRef, ref } from 'vue';
import { useAccountStore } from '@/stores/account.store';
@@ -43,14 +43,12 @@ async function doOrder() {
max-width="800"
persistent
>
<v-row>
<v-col>
<v-list class="pa-0">
<v-list-subheader>
{{ $t('account.address', accountStore.userAccount.addresses.length) }}
</v-col>
</v-row>
<v-row>
<v-col>
</v-list-subheader>
<v-list-item>
<v-radio-group
v-model="basketStore.usedAddress"
:error="addressError"
@@ -62,17 +60,13 @@ async function doOrder() {
/>
</v-radio-group>
</v-col>
</v-row>
</v-list-item>
<v-row>
<v-col>
<v-list-subheader>
{{ $t('account.payment', accountStore.userAccount.payments.length) }}
</v-col>
</v-row>
<v-row>
<v-col>
</v-list-subheader>
<v-list-item>
<v-radio-group
v-model="basketStore.usedPayment"
>
@@ -83,8 +77,8 @@ async function doOrder() {
:error="paymentError"
/>
</v-radio-group>
</v-col>
</v-row>
</v-list-item>
</v-list>
<template #actions>
<outlined-button

10
software/src/pages/misc/basketPage/ticketsTable.vue
View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { useBasketStore } from '@/stores/basketStore';
import { useBasketStore } from '@/stores/basket.store';
import { BasketItemModel } from '@/data/models/ordering/basketItemModel';
import { calcPrice } from '@/scripts/concertScripts';
@@ -15,7 +15,7 @@ function removeFromBasket(basketItem: BasketItemModel) {
<thead>
<tr>
<th>{{ $t('band') }}</th>
<th>{{ $t('event') }}</th>
<th>{{ $t('concert') }}</th>
<th class="text-center">{{ $t('quantity') }}</th>
<th class="text-right">{{ $t('product.productPrice') }}</th>
<th class="text-right">{{ $t('totalPrice') }}</th>
@@ -30,9 +30,9 @@ function removeFromBasket(basketItem: BasketItemModel) {
{{ basketItem.band.name }}
</td>
<!-- Event name -->
<!-- Concert name -->
<td>
{{ basketItem.event.name }}
{{ basketItem.concert.name }}
</td>
<!-- Quantity -->
@@ -52,7 +52,7 @@ function removeFromBasket(basketItem: BasketItemModel) {
{{ (calcPrice(basketItem.concert.price, basketItem.seats.length)).toFixed(2) }} €
</td>
<td>
<td class="text-right">
<v-btn
icon="mdi-delete"
@click="removeFromBasket(basketItem)"

2
software/src/stores/account.store.ts
View File

@@ -10,7 +10,7 @@ import { AddressModel } from "../data/models/user/addressModel";
import { PaymentModel } from "../data/models/user/paymentModel";
import { AccountApiModel } from "../data/models/user/accountApiModel";
import { ref } from "vue";
import { OrderApiModel } from "@/data/models/ordering/orderApiModel";
import { OrderApiModel } from "@/data/models/apiEndpoints/orderApiModel";
export const useAccountStore = defineStore("accountStore", {
state: () => ({

67
software/src/stores/basketStore.ts → software/src/stores/basket.store.ts
View File

@@ -10,6 +10,8 @@ import { SelectedSeatModel } from "../data/models/ordering/selectedSeatModel";
import { calcPrice } from "@/scripts/concertScripts";
import { BandModel } from "../data/models/acts/bandModel";
import { ConcertModel } from "../data/models/acts/concertModel";
import { useAccountStore } from "./account.store";
import { createOrder } from "@/data/api/orderApi";
export const useBasketStore = defineStore('basketStore', {
state: () => ({
@@ -52,51 +54,46 @@ export const useBasketStore = defineStore('basketStore', {
},
moveSeatSelectionsToBasket(concert: ConcertModel, band: BandModel) {
// todo
// for (let selectedSeat of this.selectedSeats) {
// let itemInBasket: BasketItemModel = this.itemsInBasket.find((basketItem: BasketItemModel) => {
// return basketItem.concert.id == selectedSeat.concert.id
// })
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,
band,
selectedSeat.seat,
selectedSeat.concert.price
)
)
}
}
// this.selectedSeats = []
this.selectedSeats = []
},
/**
* Take an order to the server. Sends all articles in the basket and creates an order entry in the backend database
*/
async takeOrder() {
// todo
// const accountStore = useAccountStore()
// const productStore = useProductStore()
// const feedbackStore = useFeedbackStore()
const accountStore = useAccountStore()
const feedbackStore = useFeedbackStore()
// await addOrder(accountStore.userAccount.id, this.itemsInBasket, this.usedPayment.id, this.usedAddress.id)
// .then(async result => {
// if (result.status == 201) {
// await accountStore.refreshOrders()
// await productStore.fetchAllProducts()
await createOrder(accountStore.userAccount.id, this.itemsInBasket, this.usedPayment.id, this.usedAddress.id)
.then(async result => {
if (result.status == 201) {
await accountStore.refreshOrders()
// this.itemsInBasket = []
// feedbackStore.changeBanner(BannerStateEnum.ORDERPLACESUCCESSFUL)
// } else {
// feedbackStore.changeBanner(BannerStateEnum.ERROR)
// }
// })
this.itemsInBasket = []
feedbackStore.changeBanner(BannerStateEnum.ORDERPLACESUCCESSFUL)
} else {
feedbackStore.changeBanner(BannerStateEnum.ERROR)
}
})
}
}
})