Streamlined stores

This commit is contained in:
2024-10-22 18:47:27 +02:00
parent 780ab85a9e
commit 9140765772
45 changed files with 384 additions and 387 deletions

View File

@@ -4,8 +4,8 @@ import { i18n } from './plugins/i18n';
import { watch } from 'vue';
import navigationAppendItems from './components/navigation/navigationAppendItems.vue';
import navigationPrependItems from './components/navigation/navigationPrependItems.vue';
import { usePreferencesStore } from './stores/preferencesStore';
import { useFeedbackStore } from './stores/feedbackStore';
import { usePreferencesStore } from './stores/preferences.store';
import { useFeedbackStore } from './stores/feedback.store';
import footerItems from './components/navigation/footerItems.vue';
import urlBar from './components/navigation/urlBar.vue';

View File

@@ -6,10 +6,10 @@ export async function fetchAllBands() {
return await axios.get(BASE_URL)
}
export async function getBand(bandName: string) {
export async function fetchBandByName(bandName: string) {
return await axios.get(BASE_URL + '/band/' + bandName)
}
export async function searchBand(searchTerm: string) {
export async function fetchBandsBySearchTerm(searchTerm: string) {
return await axios.get(BASE_URL + '/search?value=' + searchTerm)
}

View File

@@ -2,13 +2,6 @@ import axios from "axios"
const BASE_URL = "http://localhost:3000/cities"
/**
* @deprecated Use fetchAllCities
*/
export async function getAllCities() {
return await axios.get(BASE_URL)
}
export async function fetchAllCities() {
return await axios.get(BASE_URL)
}

View File

@@ -2,11 +2,11 @@ import axios from "axios"
let BASE_URL = "http://localhost:3000/concerts"
export async function fetchConcerts() {
export async function fetchAllConcerts() {
return await axios.get(BASE_URL)
}
export async function fetchConcert(id: number) {
export async function fetchConcertById(id: number) {
if (id != undefined) {
return await axios.get(BASE_URL + "/concert/" + id)
} else {
@@ -27,6 +27,6 @@ export async function fetchUpcomingConcerts(nrOfConcerts: number) {
return await axios.get(url)
}
export async function searchConcert(searchTerm: string) {
export async function fetchConcertsBySearchTerm(searchTerm: string) {
return await axios.get(BASE_URL + '/search?value=' + searchTerm)
}

View File

@@ -2,13 +2,6 @@ import axios from "axios"
let BASE_URL = "http://localhost:3000/genres"
/**
* @deprecated Use fetchAllGenres()
*/
export async function getAllGenres() {
return await axios.get(BASE_URL)
}
export async function fetchAllGenres() {
return await axios.get(BASE_URL)
}

View File

@@ -6,7 +6,7 @@ export async function fetchAllLocations() {
return await axios.get(BASE_URL)
}
export async function getLocation(locationName: string) {
export async function fetchLocationByName(locationName: string) {
return await axios.get(BASE_URL + "/location/" + locationName)
}
@@ -16,6 +16,6 @@ export async function fetchTopLocations(nrOfLocations: number) {
return await axios.get(url)
}
export async function searchLocation(searchTerm: string) {
export async function fetchLocationsBySearchTerm(searchTerm: string) {
return await axios.get(BASE_URL + "/search?value=" + searchTerm)
}

View File

@@ -2,9 +2,8 @@ import axios from "axios"
const BASE_URL = "http://localhost:3000/api"
export function getServerState() {
export function fetchServerState() {
return axios.get(BASE_URL)
}
export function resetDatabase() {

View File

@@ -3,7 +3,7 @@ import { BasketItemModel } from "../models/ordering/basketItemModel"
const BASE_URL = "http://localhost:3000/orders"
export async function getUserOrders(userId: number) {
export async function fetchUserOrders(userId: number) {
return axios.get(BASE_URL + "/" + userId)
}
@@ -25,8 +25,6 @@ export async function createOrder(
}
}
console.log(tickets)
return axios.post(BASE_URL, {
accountId: accountId,
tickets: tickets,

View File

@@ -5,7 +5,7 @@ import vuetify from './plugins/vuetify'
import router from './plugins/router'
import pinia from './plugins/pinia'
import { i18n } from './plugins/i18n'
import { useFeedbackStore } from './stores/feedbackStore'
import { useFeedbackStore } from './stores/feedback.store'
createApp(App)
.use(vuetify)

View File

@@ -1,7 +1,7 @@
<script setup lang="ts">
import cardView from '@/components/basics/cardView.vue';
import { useAccountStore } from '@/stores/account.store';
import { useFeedbackStore } from '@/stores/feedbackStore';
import { useFeedbackStore } from '@/stores/feedback.store';
const accountStore = useAccountStore()
const feedbackStore = useFeedbackStore()

View File

@@ -6,20 +6,7 @@ import { useAccountStore } from '@/stores/account.store';
import { ref } from 'vue';
const showConfirmDialog = ref(false)
const updateInProgress = ref(false)
const accountStore = useAccountStore()
function deleteAccount() {
// todo
}
async function updateAccount() {
updateInProgress.value = true
await accountStore.updateAccount()
updateInProgress.value = false
}
</script>
<template>
@@ -32,6 +19,7 @@ async function updateAccount() {
<outlined-button
prepend-icon="mdi-delete"
color="red"
:loading="accountStore.fetchInProgress"
@click="showConfirmDialog = true"
>
{{ $t("account.delete") }}
@@ -42,7 +30,8 @@ async function updateAccount() {
<outlined-button
prepend-icon="mdi-content-save"
color="green"
@click="updateAccount"
:loading="accountStore.fetchInProgress"
@click="accountStore.updateAccount()"
>
{{ $t("save") }}
</outlined-button>
@@ -54,6 +43,6 @@ async function updateAccount() {
v-model="showConfirmDialog"
:title="$t('dialog.deleteAccount.title')"
:description="$t('dialog.deleteAccount.description')"
:onConfirm="deleteAccount"
/>
<!-- todo :onConfirm="deleteAccount" -->
</template>

View File

@@ -1,5 +1,4 @@
<script setup lang="ts">
import { ref } from 'vue';
import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useAccountStore } from '@/stores/account.store';
@@ -7,37 +6,15 @@ import { useRouter } from 'vue-router';
const accountStore = useAccountStore()
const showRegisterCard = defineModel("showRegisterCard", { type: Boolean, default: false })
const loginInProgress = ref(false)
const username = ref("duranduran")
const password = ref("H4nn0ver")
const usernameWrong = ref(false)
const passwordWrong = ref(false)
const router = useRouter()
async function startLogin() {
loginInProgress.value = true
usernameWrong.value = false
passwordWrong.value = false
if (username.value == null || username.value.length == 0) {
usernameWrong.value = true
}
if (password.value == null || password.value.length == 0) {
passwordWrong.value = true
}
if (username.value != null && username.value.length > 0 &&
password.value != null && password.value.length > 0)
{
await accountStore.login(username.value, password.value)
if (accountStore.userAccount.id != undefined) {
router.push("/account/home")
}
}
loginInProgress.value = false
accountStore.login()
.then(result => {
if (accountStore.userAccount.id != undefined) {
router.push("/account/home")
}
})
}
</script>
@@ -52,8 +29,7 @@ async function startLogin() {
<v-text-field
:label="$t('account.username')"
prepend-icon="mdi-account"
v-model="username"
:error="usernameWrong"
v-model="accountStore.loginData.username"
clearable
/>
</v-col>
@@ -65,8 +41,7 @@ async function startLogin() {
:label="$t('account.password')"
prepend-icon="mdi-key"
type="password"
v-model="password"
:error="passwordWrong"
v-model="accountStore.loginData.password"
clearable
/>
</v-col>
@@ -76,7 +51,7 @@ async function startLogin() {
<outlined-button
@click="showRegisterCard = true"
prepend-icon="mdi-plus"
:disabled="loginInProgress"
:loading="accountStore.fetchInProgress"
>
{{ $t('account.noAccountRegister') }}
</outlined-button>
@@ -84,7 +59,7 @@ async function startLogin() {
<outlined-button
append-icon="mdi-arrow-right"
@click="startLogin"
:loading="loginInProgress"
:loading="accountStore.fetchInProgress"
>
{{ $t('login') }}
</outlined-button>

View File

@@ -1,21 +1,21 @@
<script setup lang="ts">
import { AccountModel } from '@/data/models/user/accountModel';
import { ref } from 'vue';
import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/basics/outlinedButton.vue';
import { useAccountStore } from '@/stores/account.store';
import { getEmailRules, getPasswordRules, getStringRules } from '@/scripts/validationRules';
import { useRouter } from 'vue-router';
const newUser = ref(new AccountModel())
const showRegisterCard = defineModel("showRegisterCard", { type: Boolean, default: false })
const accountStore = useAccountStore()
const registerInProgress = ref(false)
const router = useRouter()
async function registerAccount() {
registerInProgress.value = true
await accountStore.registerAccount(newUser.value)
registerInProgress.value = false
accountStore.registerAccount()
.then(result => {
if (result) {
router.push("/account/home")
}
})
}
</script>
@@ -29,7 +29,7 @@ async function registerAccount() {
<v-text-field
:label="$t('account.username')"
prepend-icon="mdi-account"
v-model="newUser.username"
v-model="accountStore.registerData.username"
clearable
:rules="getStringRules()"
/>
@@ -42,7 +42,7 @@ async function registerAccount() {
:label="$t('account.password')"
prepend-icon="mdi-key"
type="password"
v-model="newUser.password"
v-model="accountStore.registerData.password"
clearable
:rules="getPasswordRules()"
/>
@@ -54,7 +54,7 @@ async function registerAccount() {
<v-text-field
:label="$t('account.email')"
prepend-icon="mdi-mail"
v-model="newUser.email"
v-model="accountStore.registerData.email"
:rules="getEmailRules()"
clearable
/>
@@ -65,7 +65,7 @@ async function registerAccount() {
<outlined-button
prepend-icon="mdi-arrow-left"
@click="showRegisterCard = false"
:disabled="registerInProgress"
:disabled="accountStore.fetchInProgress"
>
{{ $t('account.backToLogin') }}
</outlined-button>
@@ -73,7 +73,7 @@ async function registerAccount() {
<outlined-button
prepend-icon="mdi-account-plus"
@click="registerAccount"
:loading="registerInProgress"
:loading="accountStore.fetchInProgress"
>
{{ $t('account.register') }}
</outlined-button>

View File

@@ -1,9 +1,9 @@
<script setup lang="ts">
import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
import { useFeedbackStore } from '@/stores/feedbackStore';
import { BandApiModel } from '@/data/models/acts/bandApiModel';
import { useBandStore } from '@/stores/band.store';
const feedbackStore = useFeedbackStore()
const bandStore = useBandStore()
defineProps({
band: {
@@ -14,7 +14,7 @@ defineProps({
</script>
<template>
<v-row v-if="feedbackStore.fetchDataFromServerInProgress" >
<v-row v-if="bandStore.fetchInProgress" >
<v-col cols="3" v-for="i in 4">
<card-with-top-image :loading="true" />
</v-col>

View File

@@ -3,7 +3,7 @@ import concertListItem from '@/components/pageParts/concertListItem.vue';
import { BandApiModel } from '@/data/models/acts/bandApiModel';
import { ConcertApiModel } from '@/data/models/acts/concertApiModel';
import CardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import { useConcertStore } from '@/stores/concertStore';
import { useConcertStore } from '@/stores/concert.store';
const concertStore = useConcertStore()

View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import { BandModel } from '@/data/models/acts/bandModel';
import { useBandStore } from '@/stores/bandStore';
import { useBandStore } from '@/stores/band.store';
const bandStore = useBandStore()

View File

@@ -6,7 +6,7 @@ import gallerySection from './gallerySection.vue';
import concertSection from './concertSection.vue';
import heroImage from '@/components/pageParts/heroImage.vue';
import sectionDivider from '@/components/basics/sectionDivider.vue';
import { useBandStore } from '@/stores/bandStore';
import { useBandStore } from '@/stores/band.store';
const router = useRouter()
const bandStore = useBandStore()

View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { useBandStore } from '@/stores/bandStore';
import { useBandStore } from '@/stores/band.store';
import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import bandListItem from '@/components/pageParts/bandListItem.vue';

View File

@@ -5,7 +5,7 @@ import sectionDivider from '@/components/basics/sectionDivider.vue';
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';
import { useConcertStore } from '@/stores/concert.store';
const router = useRouter()
const basketStore = useBasketStore()
@@ -93,7 +93,7 @@ concertStore.getConcert(Number(router.currentRoute.value.params.id))
<v-row class="pb-5">
<outlined-button todo
prepend-icon="mdi-basket-plus"
@click="basketStore.moveSeatSelectionsToBasket(concertStore.concert, concertStore.concert.band);
@click="basketStore.moveSeatSelectionsToBasket(concertStore.concert.band);
router.push('/basket')"
:disabled="basketStore.selectedSeats.length == 0"
block

View File

@@ -1,5 +1,5 @@
<script setup lang="ts">
import { useConcertStore } from '@/stores/concertStore';
import { useConcertStore } from '@/stores/concert.store';
import concertListItem from '@/components/pageParts/concertListItem.vue';
import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import sectionDivider from '@/components/basics/sectionDivider.vue';

View File

@@ -1,12 +1,9 @@
<script setup lang="ts">
import OutlinedButton from '@/components/basics/outlinedButton.vue';
import { useShoppingStore } from '@/stores/shoppingStore';
import { useRouter } from 'vue-router';
const shoppingStore = useShoppingStore()
const router = useRouter()
shoppingStore.getEvents()
</script>
<template>

View File

@@ -2,12 +2,11 @@
import highlightCarousel from './highlightCarousel.vue';
import sectionDivider from '@/components/basics/sectionDivider.vue';
import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
import { lowestTicketPrice } from '@/scripts/concertScripts';
import OutlinedButton from '@/components/basics/outlinedButton.vue';
import { useRouter } from 'vue-router';
import { useConcertStore } from '@/stores/concertStore';
import { useLocationStore } from '@/stores/locationStore';
import { useBandStore } from '@/stores/bandStore';
import { useConcertStore } from '@/stores/concert.store';
import { useLocationStore } from '@/stores/location.store';
import { useBandStore } from '@/stores/band.store';
const router = useRouter()
const concertStore = useConcertStore()

View File

@@ -2,38 +2,30 @@
import { useRouter } from 'vue-router';
import sectionDivider from '@/components/basics/sectionDivider.vue';
import seatPlanMap from '@/components/seatPlanMap/seatPlanMap.vue';
import { getLocation } from '@/data/api/locationApi';
import { ref } from 'vue';
import { useFeedbackStore } from '@/stores/feedbackStore';
import heroImage from '@/components/pageParts/heroImage.vue';
import concertListItem from '@/components/pageParts/concertListItem.vue';
import { LocationDetailsApiModel } from '@/data/models/locations/locationDetailsApiModel';
import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import { useLocationStore } from '@/stores/location.store';
const router = useRouter()
const feedbackStore = useFeedbackStore()
const location = ref<LocationDetailsApiModel>(new LocationDetailsApiModel())
const locationStore = useLocationStore()
feedbackStore.fetchDataFromServerInProgress = true
getLocation(String(router.currentRoute.value.params.name))
.then(result => {
location.value = result.data
feedbackStore.fetchDataFromServerInProgress = false
})
locationStore.getLocationByName(String(router.currentRoute.value.params.name))
</script>
<template>
<hero-image
:title="location.name"
:image="location.imageIndoor"
:description="location.address + location.city.name"
:loading="feedbackStore.fetchDataFromServerInProgress"
:logo="location.imageOutdoor"
:title="locationStore.location.name"
:image="locationStore.location.imageIndoor"
:description="locationStore.location.address + locationStore.location.city.name"
:loading="locationStore.fetchInProgress"
:logo="locationStore.location.imageOutdoor"
>
<template #description>
<p class="text-h6">{{ location.address }}</p>
<p class="text-h6">{{ location.city.name }}</p>
<p class="text-h6">{{ locationStore.location.address }}</p>
<p class="text-h6">{{ locationStore.location.city.name }}</p>
</template>
</hero-image>
@@ -48,21 +40,21 @@ getLocation(String(router.currentRoute.value.params.name))
</v-col>
</v-row>
<v-row v-if="feedbackStore.fetchDataFromServerInProgress" v-for="i in 3">
<v-row v-if="locationStore.fetchInProgress" v-for="i in 3">
<v-col class="text-center">
<card-view-horizontal :loading="true" />
</v-col>
</v-row>
<v-row
v-else-if="location.concerts.length > 0"
v-for="concert of location.concerts"
v-else-if="locationStore.location.concerts.length > 0"
v-for="concert of locationStore.location.concerts"
>
<v-col>
<concert-list-item
:concert="concert"
:band="concert.band"
:location="location"
:location="locationStore.location"
:title="concert.name"
>
<template #description>
@@ -88,7 +80,7 @@ getLocation(String(router.currentRoute.value.params.name))
</v-col>
</v-row>
<div v-if="feedbackStore.fetchDataFromServerInProgress">
<div v-if="locationStore.fetchInProgress">
<v-col class="text-center">
<v-progress-circular indeterminate :size="128" :width="12" color="primary" />
</v-col>
@@ -97,8 +89,8 @@ getLocation(String(router.currentRoute.value.params.name))
<v-row v-else>
<v-col>
<seat-plan-map
:location="location"
:seat-groups="location.seatGroups"
:location="locationStore.location"
:seat-groups="locationStore.location.seatGroups"
/>
</v-col>
</v-row>

View File

@@ -1,12 +1,10 @@
<script setup lang="ts">
import sectionDivider from '@/components/basics/sectionDivider.vue';
import cardWithTopImage from '@/components/basics/cardViewTopImage.vue';
import { useFeedbackStore } from '@/stores/feedbackStore';
import locationListItem from '@/components/pageParts/locationListItem.vue';
import { useLocationStore } from '@/stores/locationStore';
import { useLocationStore } from '@/stores/location.store';
const locationStore = useLocationStore()
const feedbackStore = useFeedbackStore()
locationStore.getLocations()
</script>
@@ -21,7 +19,7 @@ locationStore.getLocations()
<v-col cols="10">
<!-- During fetching -->
<div v-if="feedbackStore.fetchDataFromServerInProgress" v-for="i in 2">
<div v-if="locationStore.fetchInProgress" v-for="i in 2">
<v-row>
<v-col>
<section-divider :loading="true" />

View File

@@ -26,7 +26,6 @@ async function doOrder() {
}
if (basketStore.usedAddress != null && basketStore.usedPayment != null) {
await basketStore.takeOrder()
showDialog.value = false
}

View File

@@ -2,24 +2,21 @@
import { getAllExerciseGroups } from '@/data/api/exerciseApi';
import scoreCard from './scoreCard.vue';
import { ref } from 'vue';
import { useFeedbackStore } from '@/stores/feedbackStore';
import { ExerciseGroupApiModel } from '@/data/models/exercises/exerciseGroupApiModel';
import { usePreferencesStore } from '@/stores/preferences.store';
const exerciseGroups = ref<Array<ExerciseGroupApiModel>>([])
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
const preferencesStore = usePreferencesStore()
getAllExerciseGroups()
.then(result => {
exerciseGroups.value = result.data
feedbackStore.fetchDataFromServerInProgress = false
})
</script>
<template>
<v-container max-width="1000">
<v-row v-if="feedbackStore.fetchDataFromServerInProgress" v-for="i in 3">
<v-row v-if="preferencesStore.fetchInProgress" v-for="i in 3">
<v-col>
<score-card :loading="true"
/>

View File

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

View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import { BannerStateEnum } from '@/data/enums/bannerStateEnum';
import { useFeedbackStore } from '@/stores/feedbackStore';
import { useFeedbackStore } from '@/stores/feedback.store';
import cardView from '@/components/basics/cardView.vue';
import outlinedButton from '@/components/basics/outlinedButton.vue';
import { ref } from 'vue';
import confirmDialog from '@/components/basics/confirmDialog.vue';
import { getServerState, resetDatabase, resetExerciseProgress } from '@/data/api/mainApi';
import { fetchServerState, resetDatabase, resetExerciseProgress } from '@/data/api/mainApi';
import { ServerStateEnum } from '@/data/enums/serverStateEnum';
import packageJson from './../../../../package.json'
@@ -14,7 +14,7 @@ const showConfirmDeleteDbDialog = ref(false)
const showConfirmDeleteExerciseProgressDialog = ref(false)
const serverOnline = ref(ServerStateEnum.PENDING)
getServerState()
fetchServerState()
.then(result => {
if (result.status == 200) {
serverOnline.value = ServerStateEnum.ONLINE

View File

@@ -5,7 +5,8 @@ import cardViewHorizontal from '@/components/basics/cardViewHorizontal.vue';
import locationListItem from '@/components/pageParts/locationListItem.vue';
import cardViewTopImage from '@/components/basics/cardViewTopImage.vue';
import bandListItem from '@/components/pageParts/bandListItem.vue';
import { useSearchStore } from '@/stores/searchStore';
import { useSearchStore } from '@/stores/search.store';
import ConcertListItem from '@/components/pageParts/concertListItem.vue';
const searchStore = useSearchStore()
</script>
@@ -30,7 +31,7 @@ const searchStore = useSearchStore()
</v-row>
<v-row
v-if="searchStore.searchInProgress"
v-if="searchStore.fetchInProgress"
v-for="i in 2"
>
<v-col>
@@ -46,7 +47,7 @@ const searchStore = useSearchStore()
:band="band"
:concerts="band.concerts"
:genres="band.genres"
:loading="searchStore.searchInProgress"
:loading="searchStore.fetchInProgress"
/>
</v-col>
</v-row>
@@ -62,6 +63,46 @@ const searchStore = useSearchStore()
<!-- Section Concert results -->
<v-row>
<v-col>
<section-divider :title="$t('event', 2)" />
</v-col>
</v-row>
<v-row
v-if="searchStore.fetchInProgress"
v-for="i in 2"
>
<v-col>
<card-view-horizontal :loading="true" />
</v-col>
</v-row>
<v-row
v-else-if="searchStore.concerts.length > 0"
v-for="concert in searchStore.concerts"
>
<v-col>
<concert-list-item
:concert="concert"
:band="concert.band"
:location="concert.location"
/>
</v-col>
</v-row>
<v-row v-else >
<v-col>
<v-empty-state
:title="$t('noEventsFound')"
icon="mdi-party-popper"
/>
</v-col>
</v-row>
<!-- Section Location results -->
<v-row>
<v-col>
@@ -70,7 +111,7 @@ const searchStore = useSearchStore()
</v-row>
<v-row
v-if="searchStore.searchInProgress"
v-if="searchStore.fetchInProgress"
>
<v-col v-for="i in 4">
<card-view-top-image :loading="true" />
@@ -82,11 +123,11 @@ const searchStore = useSearchStore()
>
<v-col
cols="3"
v-for="locaiton in searchStore.locations"
v-for="location in searchStore.locations"
>
<location-list-item
:location="locaiton"
:concerts="locaiton.concerts"
:location="location"
:nr-of-concerts="location.concerts.length"
/>
</v-col>
</v-row>
@@ -99,49 +140,7 @@ const searchStore = useSearchStore()
/>
</v-col>
</v-row>
<!-- Section Event results -->
<v-row>
<v-col>
<section-divider :title="$t('event', 2)" />
</v-col>
</v-row>
<v-row
v-if="searchStore.searchInProgress"
v-for="i in 2"
>
<v-col>
<card-view-horizontal :loading="true" />
</v-col>
</v-row>
<!-- <v-row
v-else-if="searchStore.events.length > 0"
v-for="event in searchStore.events"
>
<v-col>
<event-list-item
:event="event"
:band="event.band"
:concerts="event.concerts"
:loading="searchStore.searchInProgress"
/>
</v-col>
</v-row> -->
<v-row v-else >
<v-col>
<v-empty-state
:title="$t('noEventsFound')"
icon="mdi-party-popper"
/>
</v-col>
</v-row>
</div>
</v-col>
<v-spacer />

View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import cardView from '@/components/basics/cardView.vue';
import { useSearchStore } from '@/stores/searchStore';
import { useSearchStore } from '@/stores/search.store';
const searchStore = useSearchStore()
</script>

View File

@@ -1,4 +1,4 @@
import { useFeedbackStore } from "@/stores/feedbackStore"
import { useFeedbackStore } from "@/stores/feedback.store"
/**
* Check a string for no numbers and more than four digits

View File

@@ -2,9 +2,9 @@ import { useLocalStorage } from "@vueuse/core";
import { defineStore } from "pinia";
import { AccountModel } from "../data/models/user/accountModel";
import { OrderModel } from "../data/models/ordering/orderModel";
import { useFeedbackStore } from "./feedbackStore";
import { useFeedbackStore } from "./feedback.store";
import { loginAccount, registerAccount, updateAccount } from "../data/api/accountApi";
import { getUserOrders } from "../data/api/orderApi";
import { fetchUserOrders } from "../data/api/orderApi";
import { BannerStateEnum } from "../data/enums/bannerStateEnum";
import { AddressModel } from "../data/models/user/addressModel";
import { PaymentModel } from "../data/models/user/paymentModel";
@@ -17,27 +17,49 @@ export const useAccountStore = defineStore("accountStore", {
/** Useraccount which is currently logged in */
userAccount: useLocalStorage("hackmycart/accountStore/userAccount", new AccountApiModel()),
/** User input on login screen */
loginData: ref<{ username: String, password: String}>(
{ username: "duranduran", password: "H4nn0ver" }
),
/** */
registerData: ref<AccountModel>(new AccountModel()),
/** All orders of the user */
orders: ref<Array<OrderApiModel>>([])
orders: ref<Array<OrderApiModel>>([]),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
actions: {
/**
* Start the login process
*
* @param username Account username
* @param password Account password
* @returns True on success
*/
async login(username: string, password: string) {
async login(): Promise<boolean> {
const feedbackStore = useFeedbackStore()
this.fetchInProgress = true
await loginAccount(username, password)
// Validate
if (this.loginData.username == null || this.loginData.username.length == 0 ||
this.loginData.password == null || this.loginData.password.length == 0
) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINWRONGLOGIN)
this.fetchInProgress = false
return false
}
else
{
await loginAccount(this.loginData.username, this.loginData.password)
.then(async result => {
this.userAccount = result.data
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINSUCCESSFUL)
this.refreshOrders()
this.fetchInProgress = false
return true
})
.catch(error => {
if (error.status == 400) {
@@ -45,22 +67,39 @@ export const useAccountStore = defineStore("accountStore", {
} else if (error.status == 401) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINWRONGLOGIN)
}
this.fetchInProgress = false
return false
})
}
},
/**
* Register a new account to the database
* Log in on success
*
* @param userAccount New account dataset
* @returns True on success
*/
async registerAccount(userAccount: AccountModel) {
async registerAccount(): Promise<boolean> {
const feedbackStore = useFeedbackStore()
this.fetchInProgress = true
await registerAccount(userAccount)
.then(res => {
await registerAccount(this.registerData)
.then(async res => {
if (res.status == 201) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL)
}
this.loginData = {
username: this.registerData.username,
password: this.registerData.password
}
await this.login()
.then(result => {
this.fetchInProgress = false
return true
})
})
.catch((error) => {
if (error.status == 400) {
@@ -68,9 +107,17 @@ export const useAccountStore = defineStore("accountStore", {
} else if (error.status == 409) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE)
}
this.fetchInProgress = false
return false
})
return false
},
/**
* Update values of an existing account on server
*/
async updateAccount() {
const feedbackStore = useFeedbackStore()
@@ -82,6 +129,9 @@ export const useAccountStore = defineStore("accountStore", {
})
},
/**
* Logout user
*/
logout() {
const feedbackStore = useFeedbackStore()
@@ -95,9 +145,12 @@ export const useAccountStore = defineStore("accountStore", {
* Get all orders from current user
*/
async refreshOrders() {
await getUserOrders(this.userAccount.id)
this.fetchInProgress = true
await fetchUserOrders(this.userAccount.id)
.then(result => {
this.orders = result.data
this.fetchInProgress = false
})
},

View File

@@ -1,13 +1,18 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { BandApiModel } from "../data/models/acts/bandApiModel";
import { fetchAllBands, getBand } from "../data/api/bandApi";
import { fetchAllBands, fetchBandByName } from "../data/api/bandApi";
import { BandDetailsApiModel } from "../data/models/acts/bandDetailsApiModel";
export const useBandStore = defineStore("bandStore", {
state: () => ({
/** All available bands */
bands: ref<Array<BandApiModel>>([]),
/** All information about a single band */
band: ref<BandDetailsApiModel>(new BandDetailsApiModel()),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
@@ -25,7 +30,7 @@ export const useBandStore = defineStore("bandStore", {
async getBand(name: string) {
this.fetchInProgress = true
getBand(name)
fetchBandByName(name)
.then(result => {
this.band = result.data
this.fetchInProgress = false

View File

@@ -1,7 +1,7 @@
import { defineStore } from "pinia";
import { useLocalStorage } from "@vueuse/core";
import { BasketItemModel } from "../data/models/ordering/basketItemModel";
import { useFeedbackStore } from "./feedbackStore";
import { useFeedbackStore } from "./feedback.store";
import { BannerStateEnum } from "../data/enums/bannerStateEnum";
import { AddressModel } from "../data/models/user/addressModel";
import { PaymentModel } from "../data/models/user/paymentModel";
@@ -15,9 +15,16 @@ import { createOrder } from "@/data/api/orderApi";
export const useBasketStore = defineStore('basketStore', {
state: () => ({
itemsInBasket: useLocalStorage<Array<BasketItemModel>>("hackmycart/basketStore/productsInBasket", []),
/** Items in customers basket */
itemsInBasket: useLocalStorage<Array<BasketItemModel>>("hackmycart/basketStore/itemsInBasket", []),
/** Address used in the order dialog */
usedAddress: useLocalStorage("hackmycart/basketStore/usedAddress", new AddressModel()),
/** Payment method used in the order dialog */
usedPayment: useLocalStorage("hackmycart/basketStore/usedPayment", new PaymentModel()),
/** Selected seats in the booking page */
selectedSeats: ref<Array<SelectedSeatModel>>([])
}),
@@ -53,9 +60,16 @@ export const useBasketStore = defineStore('basketStore', {
)
},
moveSeatSelectionsToBasket(concert: ConcertModel, band: BandModel) {
/**
* Move all selected seats from selectedSeats to itemsInBasket variable
*
* @param band Band of the concert
*/
moveSeatSelectionsToBasket(band: BandModel) {
for (let selectedSeat of this.selectedSeats) {
let itemInBasket: BasketItemModel = this.itemsInBasket.find((basketItem: BasketItemModel) => {
let itemInBasket: BasketItemModel =
this.itemsInBasket.find((basketItem: BasketItemModel) =>
{
return basketItem.concert.id == selectedSeat.concert.id
})
@@ -77,13 +91,19 @@ export const useBasketStore = defineStore('basketStore', {
},
/**
* Take an order to the server. Sends all articles in the basket and creates an order entry in the backend database
* Take an order to the server. Sends all articles in the basket and
* creates an order entry in the backend database
*/
async takeOrder() {
const accountStore = useAccountStore()
const feedbackStore = useFeedbackStore()
await createOrder(accountStore.userAccount.id, this.itemsInBasket, this.usedPayment.id, this.usedAddress.id)
await createOrder(
accountStore.userAccount.id,
this.itemsInBasket,
this.usedPayment.id,
this.usedAddress.id
)
.then(async result => {
if (result.status == 201) {
await accountStore.refreshOrders()

View File

@@ -1,14 +1,21 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { ConcertApiModel } from "../data/models/acts/concertApiModel";
import { fetchConcert, fetchConcerts, fetchUpcomingConcerts } from "../data/api/concertApi";
import { fetchConcertById, fetchAllConcerts, fetchUpcomingConcerts } from "../data/api/concertApi";
import { ConcertDetailsApiModel } from "../data/models/acts/concertDetailsApiModel";
export const useConcertStore = defineStore("concertStore", {
state: () => ({
/** All available concerts */
concerts: ref<Array<ConcertApiModel>>([]),
/** Next upcoming concerts */
upcomingConcerts: ref<Array<ConcertApiModel>>([]),
/** Enhanced data about a specific concert */
concert: ref<ConcertDetailsApiModel>(new ConcertDetailsApiModel()),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
@@ -19,23 +26,31 @@ export const useConcertStore = defineStore("concertStore", {
async getConcerts() {
this.fetchInProgress = true
fetchConcerts()
fetchAllConcerts()
.then(result => {
this.concerts = result.data
this.fetchInProgress = false
})
},
/**
* Get all data about a specific concert
*
* @param id ID of the concert in the database
*/
async getConcert(id: number) {
this.fetchInProgress = true
fetchConcert(id)
fetchConcertById(id)
.then(result => {
this.concert = result.data
this.fetchInProgress = false
})
},
/**
* Download the next four upcoming concerts from server
*/
async getUpcomingConcerts() {
this.fetchInProgress = true

View File

@@ -3,13 +3,16 @@ import { ref } from "vue";
import { BannerStateEnum } from "../data/enums/bannerStateEnum";
import { Composer } from 'vue-i18n';
/**
* Logic of the bubble notifications
* Includes an i18n object for translation
*/
export const useFeedbackStore = defineStore("feedbackStore", {
state: () => ({
showBanner: ref(false),
title: ref(""),
color: ref(""),
icon: ref(""),
fetchDataFromServerInProgress: ref(false),
$i18n: {}
}),
@@ -50,21 +53,27 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.ACCOUNTLOGINSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.loginSuccessful'); break;
}
case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN: {
this.title = this.i18n.t('bannerMessages.wrongLogin'); break;
}
case BannerStateEnum.ACCOUNTLOGINERROR: {
this.title = this.i18n.t('bannerMessages.error'); break;
}
case BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL: {
this.title = this.i18n.t("bannerMessages.registerSuccessful"); break;
}
case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE: {
this.title = this.i18n.t("bannerMessages.usernameInUse"); break;
}
case BannerStateEnum.ACCOUNTUPDATESUCCESSFUL: {
this.title = this.i18n.t("bannerMessages.accountUpdated"); break;
}
case BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.logoutSuccessful'); break;
}
@@ -75,12 +84,15 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.CATEGORYCREATESUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.categoryCreateSuccessful'); break;
}
case BannerStateEnum.CATEGORYDELETESUCESSFUL: {
this.title = this.i18n.t('bannerMessages.categoryDeleteSuccessful'); break;
}
case BannerStateEnum.CATEGORYCREATEERROR: {
this.title = this.i18n.t('bannerMessages.categoryCreateError'); break;
}
case BannerStateEnum.CATEGORYDELETEERROR: {
this.title = this.i18n.t('bannerMessages.categoryDeleteError'); break;
}
@@ -98,17 +110,21 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.PRODUCTCREATESUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.productCreateSuccessful'); break;
}
case BannerStateEnum.PRODUCTCREATEERROR: {
this.title = this.i18n.t('bannerMessages.productCreateError'); break;
}
case BannerStateEnum.PRODUCTDELETESUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.productDeleteSuccessful'); break;
}
case BannerStateEnum.PRODUCTDELETEERROR: {
this.title = this.i18n.t('bannerMessages.productDeleteError'); break;
}
}
// Banner color
switch (bannerState) {
@@ -201,9 +217,6 @@ export const useFeedbackStore = defineStore("feedbackStore", {
break;
}
this.showBanner = true
}
}

View File

@@ -1,15 +1,26 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { fetchAllLocations, fetchTopLocations } from "../data/api/locationApi";
import { fetchAllLocations, fetchLocationByName, fetchTopLocations } from "../data/api/locationApi";
import { LocationApiModel } from "../data/models/locations/locationApiModel";
import { CityModel } from "../data/models/locations/cityModel";
import { fetchAllCities } from "../data/api/cityApi";
import { LocationDetailsApiModel } from "@/data/models/locations/locationDetailsApiModel";
export const useLocationStore = defineStore("locationStore", {
state: () => ({
/** All available locations */
locations: ref<Array<LocationApiModel>>([]),
/** Locations with the most concerts */
topLocations: ref<Array<LocationApiModel>>([]),
/** Enhanced data about a specific location */
location: ref<LocationDetailsApiModel>(),
/** All available cities */
cities: ref<Array<CityModel>>([]),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
@@ -32,6 +43,16 @@ export const useLocationStore = defineStore("locationStore", {
})
},
getLocationByName(name: string) {
this.fetchInProgress = true
fetchLocationByName(name)
.then(result => {
this.location = result.data
this.fetchInProgress = false
})
},
/**
* Get all locations in a specific city
*
@@ -46,6 +67,9 @@ export const useLocationStore = defineStore("locationStore", {
},
/**
* Fetch top 8 locations from server
*/
async getTopLocations() {
await fetchTopLocations(8)
.then(result => {

View File

@@ -2,10 +2,17 @@ import { defineStore } from "pinia";
import { useLocalStorage } from "@vueuse/core";
import { ThemeEnum } from "../data/enums/themeEnums";
import { LanguageEnum } from "../data/enums/languageEnum";
import { ref } from "vue";
export const usePreferencesStore = defineStore('preferencesStore', {
state: () => ({
/** Selected theme by user */
theme: useLocalStorage<ThemeEnum>("hackmycart/preferencesStore/theme", ThemeEnum.DARKBLUE),
language: useLocalStorage<LanguageEnum>("hackmycart/preferencesStore/language", LanguageEnum.GERMAN)
/** Selected language by user */
language: useLocalStorage<LanguageEnum>("hackmycart/preferencesStore/language", LanguageEnum.GERMAN),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
})

View File

@@ -0,0 +1,55 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { fetchBandsBySearchTerm } from "../data/api/bandApi";
import { fetchLocationsBySearchTerm } from "../data/api/locationApi";
import { fetchConcertsBySearchTerm } from "../data/api/concertApi";
import { ConcertApiModel } from "@/data/models/acts/concertApiModel";
export const useSearchStore = defineStore("searchStore", {
state: () => ({
/** Search term */
searchTerm: ref(""),
/** Band results */
bands: ref(),
/** Location results */
locations: ref(),
/** Concert results */
concerts: ref<Array<ConcertApiModel>>([]),
/** One or more searches are already performed */
alreadySearched: ref(false),
/** Request to server sent, waiting for data response */
fetchInProgress: ref(false)
}),
actions: {
/**
* Search for the term in all bands, locations, events
*/
async startSearch() {
this.alreadySearched = true
this.fetchInProgress = true
await fetchBandsBySearchTerm(this.searchTerm)
.then(result => {
this.bands = result.data
})
await fetchLocationsBySearchTerm(this.searchTerm)
.then(result => {
this.locations = result.data
})
await fetchConcertsBySearchTerm(this.searchTerm)
.then(result => {
this.concerts = result.data
})
this.fetchInProgress = false
}
}
})

View File

@@ -1,43 +0,0 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { searchBand } from "../data/api/bandApi";
import { searchLocation } from "../data/api/locationApi";
import { searchConcert } from "../data/api/concertApi";
export const useSearchStore = defineStore("searchStore", {
state: () => ({
searchTerm: ref(""),
bands: ref(),
locations: ref(),
concerts: ref(),
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
}
}
})

View File

@@ -1,60 +0,0 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { ConcertApiModel } from "../data/models/acts/concertApiModel";
import { BandApiModel } from "../data/models/acts/bandApiModel";
import { CityApiModel } from "../data/models/locations/cityApiModel";
import { GenreApiModel } from "../data/models/acts/genreApiModel";
import { searchBand } from "../data/api/bandApi";
import { searchLocation } from "../data/api/locationApi";
import { fetchConcerts, searchConcert } from "../data/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

@@ -1,48 +0,0 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { fetchAllCities } from "../data/api/cityApi";
import { fetchAllGenres } from "../data/api/genreApi";
import { useFeedbackStore } from "./feedbackStore";
import { CityApiModel } from "../data/models/locations/cityApiModel";
import { GenreApiModel } from "../data/models/acts/genreApiModel";
/**
* @deprecated
*/
export const useShoppingStore = defineStore("shoppingStore", {
state: () => ({
cities: ref<Array<CityApiModel>>([]),
genres: ref<Array<GenreApiModel>>([]),
cityFilterName: ref<string>(),
genreFilterName: ref<string>()
}),
actions: {
async getEvents() {
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
},
async getCities() {
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
await fetchAllCities()
.then(result => {
this.cities = result.data
feedbackStore.fetchDataFromServerInProgress = false
})
},
async getGenres() {
const feedbackStore = useFeedbackStore()
feedbackStore.fetchDataFromServerInProgress = true
await fetchAllGenres()
.then(result => {
this.genres = result.data
feedbackStore.fetchDataFromServerInProgress = false
})
}
}
})