Improve Snackbar

This commit is contained in:
2024-11-14 09:33:45 +01:00
parent c0d110f386
commit ae577dc023
12 changed files with 192 additions and 209 deletions

View File

@@ -88,16 +88,6 @@ account.post("/", async (req: Request, res: Response) => {
.then(account => {
// Status: 201 Created
res.status(201).json(account)
// Check exercise in table
Exercise.update(
{ solved: true },
{
where: {
nameEn: "Register"
}
}
)
}).catch(reason => {
// Status: 409 Conflict
res.status(409).json({

View File

@@ -1,15 +1,14 @@
<script setup lang="ts">
import { useTheme } from 'vuetify/lib/framework.mjs';
import { i18n } from './plugins/i18n';
import { watch } from 'vue';
import navigationAppendItems from './components/navigation/navigationAppendItems.vue';
import navigationPrependItems from './components/navigation/navigationPrependItems.vue';
import { ref, watch } from 'vue';
import { usePreferencesStore } from './stores/preferences.store';
import { useFeedbackStore } from './stores/feedback.store';
import companyFooter from './components/navigation/companyFooter.vue';
import urlBar from './components/navigation/urlBar.vue';
import { useRouter } from 'vue-router';
import NavigationBar from './components/navigation/navigationBar.vue';
import { BannerStateEnum } from './data/enums/bannerStateEnum';
const preferencesStore = usePreferencesStore()
const feedbackStore = useFeedbackStore()
@@ -27,6 +26,7 @@ watch(() => preferencesStore.language, () => {
// Watch for theme change
watch(() => preferencesStore.theme, () => {
theme.global.name.value = preferencesStore.theme
feedbackStore.addSnackbar(BannerStateEnum.ERROR)
})
// Watch for 404 page directions
@@ -36,6 +36,17 @@ watch(() => feedbackStore.notFound, () => {
router.push("/404")
}
})
// Watch for snackbar disappear
watch(() => feedbackStore.showSnackbar, () => {
if (!feedbackStore.showSnackbar) {
feedbackStore.snackbars = []
}
})
function calcMargin(i) {
return (i * 60) + 10 + 'px'
}
</script>
<template>
@@ -50,22 +61,18 @@ watch(() => feedbackStore.notFound, () => {
<v-main>
<!-- Snackbar in the top right corner for user feedback -->
<v-snackbar
v-model="feedbackStore.showBanner"
v-for="(s, i) in feedbackStore.snackbars"
v-model="feedbackStore.showSnackbar"
:key="i"
timeout="3000"
location="top right"
:color="feedbackStore.color"
:color="s.color"
:style="{ 'margin-top': calcMargin(i) }"
:icon="s.icon"
close
>
<v-icon :icon="feedbackStore.icon" />
{{ feedbackStore.title }}
<template v-slot:actions>
<v-btn
variant="text"
@click="feedbackStore.showBanner = false"
icon="mdi-close"
/>
</template>
<v-icon :icon="s.icon" />
{{ s.text }}
</v-snackbar>
<!-- Here changes the router the content -->

View File

@@ -24,7 +24,13 @@ function confirmPressed() {
v-model="showDialog"
persistent
>
{{ description }}
<v-container>
<v-row>
<v-col>
{{ description }}
</v-col>
</v-row>
</v-container>
<template #actions>
<outlined-button

View File

@@ -170,6 +170,7 @@
"wrongLogin": "Falscher Username oder falsches Passwort!",
"error": "Es ist ein Fehler aufgetreten...",
"databaseResetSuccessful": "Datenbank erfolgreich zurück gesetzt!",
"exerciseProgressResetSuccessful": "Aufgabenfortschritt erfolgreich zurück gesetzt!",
"registerSuccessful": "Account erfolgreich erstellt!",
"usernameInUse": "Der Accountname ist bereits vergeben!",
"accountUpdated": "Account erfolgreich aktualisiert",

View File

@@ -170,6 +170,7 @@
"wrongLogin": "Wrong username or wrong password!",
"error": "There is some error...",
"databaseResetSuccessful": "Database successfully resetted!",
"exerciseProgressResetSuccessful": "Exercise progress successfully resetted!",
"registerSuccessful": "Account successfully created!",
"usernameInUse": "The username is already in use!",
"accountUpdated": "Account successfully updated",

View File

@@ -9,6 +9,7 @@ import { PaymentModel } from "../data/models/user/paymentModel";
import { AccountApiModel } from "../data/models/user/accountApiModel";
import { ref } from "vue";
import { defineStore } from "pinia";
import { useExerciseStore } from "./exercise.store";
export const useAccountStore = defineStore("accountStore", {
state: () => ({
@@ -21,7 +22,7 @@ export const useAccountStore = defineStore("accountStore", {
/** User input on login screen */
// todo: Remove JSON!
loginData: ref<{ username: String, password: String}>(
{ username: "duranduran", password: "H4nn0ver" }
{ username: "", password: "" }
),
/** Buffer for register data */
@@ -55,31 +56,31 @@ export const useAccountStore = defineStore("accountStore", {
if (this.loginData.username == null || this.loginData.username.length == 0 ||
this.loginData.password == null || this.loginData.password.length == 0
) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINWRONGLOGIN)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTLOGINWRONGLOGIN)
this.fetchInProgress = false
return false
}
else
{
await loginAccount(this.loginData.username, this.loginData.password)
.then(async result => {
this.userAccount = result.data
.then(async result => {
this.userAccount = result.data
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTLOGINSUCCESSFUL)
this.fetchInProgress = false
return true
})
.catch(error => {
if (error.status == 400) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINERROR)
} else if (error.status == 401) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGINWRONGLOGIN)
}
this.fetchInProgress = false
return true
})
.catch(error => {
if (error.status == 400) {
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTLOGINERROR)
} else if (error.status == 401) {
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTLOGINWRONGLOGIN)
}
this.fetchInProgress = false
return false
})
this.fetchInProgress = false
return false
})
}
},
@@ -91,12 +92,14 @@ export const useAccountStore = defineStore("accountStore", {
*/
async registerAccount(): Promise<boolean> {
const feedbackStore = useFeedbackStore()
const exerciseStore = useExerciseStore()
this.fetchInProgress = true
await registerAccount(this.registerData)
.then(async res => {
if (res.status == 201) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL)
exerciseStore.solveExercise(0, 1)
}
this.loginData = {
@@ -108,9 +111,9 @@ export const useAccountStore = defineStore("accountStore", {
})
.catch((error) => {
if (error.status == 400) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTREGISTERERROR)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERERROR)
} else if (error.status == 409) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE)
}
this.fetchInProgress = false
@@ -129,7 +132,7 @@ export const useAccountStore = defineStore("accountStore", {
await updateAccount(this.userAccount)
.then(res => {
if (res.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTUPDATESUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTUPDATESUCCESSFUL)
}
})
},
@@ -143,7 +146,7 @@ export const useAccountStore = defineStore("accountStore", {
this.userAccount = new AccountModel()
this.loggedIn = false
feedbackStore.changeBanner(BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL)
},
/**

View File

@@ -102,24 +102,24 @@ export const useBandStore = defineStore("bandStore", {
postBand(this.band)
.then(result => {
if (result.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.BANDSAVEDSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.BANDSAVEDSUCCESSFUL)
this.getBands()
this.showEditDialog = false
} else {
feedbackStore.changeBanner(BannerStateEnum.BANDSAVEDERROR)
feedbackStore.addSnackbar(BannerStateEnum.BANDSAVEDERROR)
}
})
} else {
patchBand(this.band)
.then(result => {
if (result.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.BANDSAVEDSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.BANDSAVEDSUCCESSFUL)
this.getBands()
this.showEditDialog = false
} else {
feedbackStore.changeBanner(BannerStateEnum.BANDSAVEDERROR)
feedbackStore.addSnackbar(BannerStateEnum.BANDSAVEDERROR)
}
})
}

View File

@@ -53,7 +53,7 @@ export const useBasketStore = defineStore('basketStore', {
*/
removeItemFromBasket(item: BasketItemModel) {
const feedbackStore = useFeedbackStore()
feedbackStore.changeBanner(BannerStateEnum.BASKETPRODUCTREMOVED)
feedbackStore.addSnackbar(BannerStateEnum.BASKETPRODUCTREMOVED)
this.itemsInBasket = this.itemsInBasket.filter((basketItemModel: BasketItemModel) =>
basketItemModel.concert.id != item.concert.id
@@ -110,12 +110,12 @@ export const useBasketStore = defineStore('basketStore', {
await accountStore.refreshOrders()
this.itemsInBasket = []
feedbackStore.changeBanner(BannerStateEnum.ORDERPLACESUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.ORDERPLACESUCCESSFUL)
// Exercise 0.2 is solved
exerciseStore.solveExercise(0, 2)
} else {
feedbackStore.changeBanner(BannerStateEnum.ERROR)
feedbackStore.addSnackbar(BannerStateEnum.ERROR)
}
})
}

View File

@@ -107,7 +107,7 @@ export const useExerciseStore = defineStore("exerciseStore", {
}
}
feedbackStore.changeBanner(bannerState)
feedbackStore.addSnackbar(bannerState)
this.getAllExercises()
}
})

View File

@@ -9,8 +9,10 @@ import { Composer } from 'vue-i18n';
*/
export const useFeedbackStore = defineStore("feedbackStore", {
state: () => ({
snackbars: ref<Array<{text: string, color: string, icon: string }>>([]),
/** Show notification banner in top right corner */
showBanner: ref(false),
showSnackbar: ref(false),
/** Text in the notification banner */
title: ref(""),
@@ -35,162 +37,148 @@ export const useFeedbackStore = defineStore("feedbackStore", {
},
actions: {
/**
* Change the state of the banner, displays it immediately
*
* @param bannerState New banner state
*/
changeBanner(bannerState: BannerStateEnum) {
// Banner message
addSnackbar(bannerState: BannerStateEnum) {
this.snackbars.push({
text: this.getSnackbarText(bannerState),
color: this.getSnackbarColor(bannerState),
icon: this.getSnackbarIcon(bannerState)
})
this.showSnackbar = true
},
getSnackbarText(bannerState: BannerStateEnum) {
switch (bannerState) {
////////// System feedback //////////
case BannerStateEnum.ERROR: {
this.title = this.i18n.t('bannerMessages.error'); break;
}
case BannerStateEnum.ERROR:
return this.i18n.t('bannerMessages.error')
case BannerStateEnum.BASKETPRODUCTADDED: {
this.title = this.i18n.t('bannerMessages.basketTicketAdded'); break;
}
case BannerStateEnum.BASKETPRODUCTADDED:
return this.i18n.t('bannerMessages.basketTicketAdded')
case BannerStateEnum.BASKETPRODUCTREMOVED: {
this.title = this.i18n.t("bannerMessages.basketTicketRemoved"); break;
}
case BannerStateEnum.BASKETPRODUCTREMOVED:
return this.i18n.t("bannerMessages.basketTicketRemoved")
////////// Exercise feedback //////////
case BannerStateEnum.EXERCISESOLVED01: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [0, 1]); break;
}
case BannerStateEnum.EXERCISESOLVED01:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [0, 1])
case BannerStateEnum.EXERCISESOLVED02: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [0, 2]); break;
}
case BannerStateEnum.EXERCISESOLVED02:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [0, 2])
case BannerStateEnum.EXERCISESOLVED11: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [1, 1]); break;
}
case BannerStateEnum.EXERCISESOLVED11:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [1, 1])
case BannerStateEnum.EXERCISESOLVED12: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [1, 2]); break;
}
case BannerStateEnum.EXERCISESOLVED12:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [1, 2])
case BannerStateEnum.EXERCISESOLVED13: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [1, 3]); break;
}
case BannerStateEnum.EXERCISESOLVED13:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [1, 3])
case BannerStateEnum.EXERCISESOLVED21: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 1]); break;
}
case BannerStateEnum.EXERCISESOLVED21:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 1])
case BannerStateEnum.EXERCISESOLVED22: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 2]); break;
}
case BannerStateEnum.EXERCISESOLVED22:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 2])
case BannerStateEnum.EXERCISESOLVED23: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 3]); break;
}
case BannerStateEnum.EXERCISESOLVED23:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [2, 3])
case BannerStateEnum.EXERCISESOLVED31: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [3, 1]); break;
}
case BannerStateEnum.EXERCISESOLVED31:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [3, 1])
case BannerStateEnum.EXERCISESOLVED32: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [3, 2]); break;
}
case BannerStateEnum.EXERCISESOLVED32:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [3, 2])
case BannerStateEnum.EXERCISESOLVED33: {
this.title = this.i18n.t("bannerMessages.exerciseSolvedNr", [3, 3]); break;
}
case BannerStateEnum.EXERCISESOLVED33:
return this.i18n.t("bannerMessages.exerciseSolvedNr", [3, 3])
////////// API Endpoint /api //////////
case BannerStateEnum.DATABASERESETSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.databaseResetSuccessful'); break;
}
case BannerStateEnum.DATABASERESETSUCCESSFUL:
return this.i18n.t('bannerMessages.databaseResetSuccessful')
case BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL:
return this.i18n.t('bannerMessages.exerciseProgressResetSuccessful')
////////// API Endpoint /accounts //////////
case BannerStateEnum.ACCOUNTLOGINSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.loginSuccessful'); break;
}
case BannerStateEnum.ACCOUNTLOGINSUCCESSFUL:
return this.i18n.t('bannerMessages.loginSuccessful')
case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN: {
this.title = this.i18n.t('bannerMessages.wrongLogin'); break;
}
case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN:
return this.i18n.t('bannerMessages.wrongLogin')
case BannerStateEnum.ACCOUNTLOGINERROR: {
this.title = this.i18n.t('bannerMessages.error'); break;
}
case BannerStateEnum.ACCOUNTLOGINERROR:
return this.i18n.t('bannerMessages.error')
case BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL: {
this.title = this.i18n.t("bannerMessages.registerSuccessful"); break;
}
case BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL:
return this.i18n.t("bannerMessages.registerSuccessful")
case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE: {
this.title = this.i18n.t("bannerMessages.usernameInUse"); break;
}
case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE:
return this.i18n.t("bannerMessages.usernameInUse")
case BannerStateEnum.ACCOUNTUPDATESUCCESSFUL: {
this.title = this.i18n.t("bannerMessages.accountUpdated"); break;
}
case BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.logoutSuccessful'); break;
}
case BannerStateEnum.ACCOUNTUPDATESUCCESSFUL:
return this.i18n.t("bannerMessages.accountUpdated")
case BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL:
return this.i18n.t('bannerMessages.logoutSuccessful')
////////// API Endpoint /orders //////////
case BannerStateEnum.ORDERPLACESUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.orderPlaceSuccessfull'); break;
}
case BannerStateEnum.ORDERPLACESUCCESSFUL:
return this.i18n.t('bannerMessages.orderPlaceSuccessfull')
////////// API Endpoint /bands //////////
case BannerStateEnum.BANDDELETEERROR: {
this.title = this.i18n.t('bannerMessages.bandDeleteError'); break;
}
case BannerStateEnum.BANDDELETEERROR:
return this.i18n.t('bannerMessages.bandDeleteError')
case BannerStateEnum.BANDDELETESUCCESSFUL:
return this.i18n.t('bannerMessages.bandDeleteSuccessful')
case BannerStateEnum.BANDDELETESUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.bandDeleteSuccessful'); break;
}
case BannerStateEnum.BANDSAVEDERROR: {
this.title = this.i18n.t('bannerMessages.bandSavedError'); break;
}
case BannerStateEnum.BANDSAVEDSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.bandSavedSuccessful'); break;
}
case BannerStateEnum.BANDSAVEDERROR:
return this.i18n.t('bannerMessages.bandSavedError')
case BannerStateEnum.BANDSAVEDSUCCESSFUL:
return this.i18n.t('bannerMessages.bandSavedSuccessful')
////////// API Endpoint /genres //////////
case BannerStateEnum.GENREDELETEERROR: {
this.title = this.i18n.t('bannerMessages.genreDeleteError'); break;
}
case BannerStateEnum.GENREDELETEERROR:
return this.i18n.t('bannerMessages.genreDeleteError')
case BannerStateEnum.GENREDELETESUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.genreDeleteSuccessful'); break;
}
case BannerStateEnum.GENREDELETESUCCESSFUL:
return this.i18n.t('bannerMessages.genreDeleteSuccessful')
case BannerStateEnum.GENRESAVEDERROR:
return this.i18n.t('bannerMessages.genreSavedError')
case BannerStateEnum.GENRESAVEDERROR: {
this.title = this.i18n.t('bannerMessages.genreSavedError'); break;
}
case BannerStateEnum.GENRESAVEDSUCCESSFUL: {
this.title = this.i18n.t('bannerMessages.genreSavedSuccessful'); break;
}
case BannerStateEnum.GENRESAVEDSUCCESSFUL:
return this.i18n.t('bannerMessages.genreSavedSuccessful')
}
},
// Banner color
getSnackbarColor(bannerState: BannerStateEnum) {
switch (bannerState) {
case BannerStateEnum.ERROR:
case BannerStateEnum.ACCOUNTLOGINERROR:
@@ -201,8 +189,7 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.BANDSAVEDERROR:
case BannerStateEnum.GENREDELETEERROR:
case BannerStateEnum.GENRESAVEDERROR:
this.color = "red"
break;
return "red"
case BannerStateEnum.BASKETPRODUCTADDED:
case BannerStateEnum.DATABASERESETSUCCESSFUL:
@@ -216,8 +203,7 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL:
case BannerStateEnum.GENREDELETESUCCESSFUL:
case BannerStateEnum.GENRESAVEDSUCCESSFUL:
this.color = "green"
break;
return "green"
case BannerStateEnum.EXERCISESOLVED01:
case BannerStateEnum.EXERCISESOLVED02:
@@ -230,27 +216,24 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.EXERCISESOLVED31:
case BannerStateEnum.EXERCISESOLVED32:
case BannerStateEnum.EXERCISESOLVED33:
this.color = "purple"
break;
return "purple"
case BannerStateEnum.BASKETPRODUCTREMOVED:
this.color = "blue"
return "blue"
}
},
// Banner icon
getSnackbarIcon(bannerState: BannerStateEnum) {
switch (bannerState) {
case BannerStateEnum.ERROR:
this.icon = "mdi-alert-circle"
break;
return "mdi-alert-circle"
case BannerStateEnum.ACCOUNTLOGINERROR:
case BannerStateEnum.ACCOUNTLOGINWRONGLOGIN:
case BannerStateEnum.ACCOUNTREGISTERERROR:
case BannerStateEnum.ACCOUNTREGISTERUSERNAMEINUSE:
this.icon = "mdi-account"
break;
return "mdi-account"
case BannerStateEnum.EXERCISESOLVED01:
case BannerStateEnum.EXERCISESOLVED02:
@@ -263,56 +246,43 @@ export const useFeedbackStore = defineStore("feedbackStore", {
case BannerStateEnum.EXERCISESOLVED31:
case BannerStateEnum.EXERCISESOLVED32:
case BannerStateEnum.EXERCISESOLVED33:
this.icon = "mdi-check-circle-outline"
break;
return "mdi-check-circle-outline"
case BannerStateEnum.DATABASERESETSUCCESSFUL:
case BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL:
this.icon = "mdi-database-refresh"
break;
return "mdi-database-refresh"
case BannerStateEnum.BASKETPRODUCTADDED:
case BannerStateEnum.BASKETPRODUCTREMOVED:
this.icon = "mdi-basket"
break;
return "mdi-basket"
case BannerStateEnum.ORDERPLACESUCCESSFUL:
this.icon = "mdi-basket-check"
break;
return "mdi-basket-check"
case BannerStateEnum.ACCOUNTLOGOUTSUCCESSFUL:
this.icon = "mdi-logout"
break;
return "mdi-logout"
case BannerStateEnum.ACCOUNTLOGINSUCCESSFUL:
this.icon = "mdi-login"
break;
return "mdi-login"
case BannerStateEnum.ACCOUNTREGISTERSUCCESSFUL:
this.icon = "mdi-account-plus"
break;
return "mdi-account-plus"
case BannerStateEnum.ACCOUNTUPDATESUCCESSFUL:
this.icon = "mdi-account-reactivate"
break;
return "mdi-account-reactivate"
case BannerStateEnum.BANDDELETEERROR:
case BannerStateEnum.BANDDELETESUCCESSFUL:
case BannerStateEnum.BANDSAVEDERROR:
case BannerStateEnum.BANDSAVEDSUCCESSFUL:
this.icon = "mdi-guitar-electric"
break;
return "mdi-guitar-electric"
case BannerStateEnum.GENREDELETEERROR:
case BannerStateEnum.GENREDELETESUCCESSFUL:
case BannerStateEnum.GENRESAVEDERROR:
case BannerStateEnum.GENRESAVEDSUCCESSFUL:
this.icon = "mdi-music-clef-treble"
break;
return "mdi-music-clef-treble"
}
this.showBanner = true
}
}
})

View File

@@ -67,11 +67,11 @@ export const useGenreStore = defineStore("genreStore", {
postGenre(this.genre)
.then(response => {
if (response.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.GENRESAVEDSUCCESSFUL)
this.getGenres()
this.showEditDialog = false
} else {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDERROR)
feedbackStore.addSnackbar(BannerStateEnum.GENRESAVEDERROR)
}
})
} else {
@@ -79,11 +79,11 @@ export const useGenreStore = defineStore("genreStore", {
patchGenre(this.genre)
.then(response => {
if (response.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.GENRESAVEDSUCCESSFUL)
this.getGenres()
this.showEditDialog = false
} else {
feedbackStore.changeBanner(BannerStateEnum.GENRESAVEDERROR)
feedbackStore.addSnackbar(BannerStateEnum.GENRESAVEDERROR)
}
})
}
@@ -101,10 +101,10 @@ export const useGenreStore = defineStore("genreStore", {
deleteGenre(genre)
.then(response => {
if (response.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.GENREDELETESUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.GENREDELETESUCCESSFUL)
this.getGenres()
} else {
feedbackStore.changeBanner(BannerStateEnum.GENREDELETEERROR)
feedbackStore.addSnackbar(BannerStateEnum.GENREDELETEERROR)
}
})
}

View File

@@ -8,6 +8,7 @@ import { ServerStateEnum } from "@/data/enums/serverStateEnum";
import { BannerStateEnum } from "@/data/enums/bannerStateEnum";
import { useFeedbackStore } from "./feedback.store";
import { useBasketStore } from "./basket.store";
import { useExerciseStore } from "./exercise.store";
export const usePreferencesStore = defineStore('preferencesStore', {
state: () => ({
@@ -76,7 +77,7 @@ export const usePreferencesStore = defineStore('preferencesStore', {
await resetDatabase()
.then(result => {
if (result.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.DATABASERESETSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.DATABASERESETSUCCESSFUL)
this.serverState = ServerStateEnum.ONLINE
}
@@ -90,14 +91,18 @@ export const usePreferencesStore = defineStore('preferencesStore', {
*/
async resetExerciseProg() {
const feedbackStore = useFeedbackStore()
const exerciseStore = useExerciseStore()
this.serverState = ServerStateEnum.PENDING
this.fetchInProgress = true
await resetExerciseProgress()
.then(result => {
if (result.status == 200) {
feedbackStore.changeBanner(BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL)
feedbackStore.addSnackbar(BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL)
this.serverState = ServerStateEnum.ONLINE
exerciseStore.getAllExercises()
}
this.fetchInProgress = false