Global color schema, remove name and register number access in preferences, add alert in first startup wizard

src/App.vue

@@ -26,7 +26,6 @@ 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
@@ -98,8 +97,9 @@ function calcMargin(i) {
     </v-main>
   </v-app>
 
+  <!-- Test Environment sticker in bottom right corner -->
   <v-sheet
-    color="red-darken-4"
+    color="error"
     position="fixed" 
     location="bottom right" 
     class="pa-3 mb-12 mr-n16 text-center text-h5"

src/components/basics/confirmDialog.vue

@@ -36,7 +36,7 @@ function confirmPressed() {
       <outlined-button
         @click="showDialog = false" 
         prepend-icon="mdi-close"
-        color="orange"
+        color="warning"
         :loading="loading"
       >
         {{ $t("misc.actions.cancel") }}
@@ -45,7 +45,7 @@ function confirmPressed() {
       <outlined-button
         @click="confirmPressed"
         prepend-icon="mdi-check"
-        color="red"
+        color="error"
         :loading="loading"
       >
         {{ $t("misc.actions.confirm") }}

src/components/navigation/navigationAppendItems.vue

@@ -27,7 +27,7 @@ exerciseStore.getAllExercises()
       :content="basketStore.itemsInBasket.reduce((tot, item) => {
         return tot + item.seats.length
       }, 0)"
-      color="red" offset-x="8" offset-y="8">
+      color="error" offset-x="8" offset-y="8">
       <v-btn variant="plain" icon="mdi-cart" to="/basket" />
     </v-badge>
   </div>

src/layouts/adminDataLayout.vue

@@ -34,7 +34,7 @@ defineProps({
         <outlined-button
           v-if="!hideAddButton"
           prepend-icon="mdi-plus"
-          color="green"
+          color="success"
           :disabled="fetchInProgress"
           @click="onAddClick()"
         >

src/locales/de.json

@@ -154,7 +154,7 @@
     "factoryReset": {
       "factoryReset": "Zurücksetzen auf Werkseinstellungen",
       "dialog": {
-        "title": "Aus Werkseinstellungen zurücksetzen?",
+        "title": "Auf Werkseinstellungen zurücksetzen?",
         "description": "Sollen alle Einstellungen und Daten auf Werkseinstellungen zurückgesetzt werden? Alle Änderungen und Fortschritte gehen verloren!"
       }
     }
@@ -239,7 +239,8 @@
       "connectToServer": "Server",
       "database": "Datenbank",
       "exercises": "Aufgaben",
-      "userData": "Persönliche Daten"
+      "userData": "Persönliche Daten",
+      "enterYourPersonalData": "Bitte gebe nun deinen Namen und deine Matrikelnummer von der Universität ein. Überprüfe die Angaben vor dem Absenden genau! Die Angaben können später nicht ohne Verlust des Bearbeitungsfortschrittes geändert werden!"
     },
     "user": "Angaben zur Person",
     "registrationNumber": "Matrikelnummer",

src/locales/en.json

@@ -239,7 +239,8 @@
       "connectToServer": "Server",
       "database": "Database",
       "exercises": "Exercises",
-      "userData": "User data"
+      "userData": "User data",
+      "enterYourPersonalData": "Please enter your name and your Matrikel number from your university. Check it twice! You can't change it later without loosing your exercise progress!"
     },
     "user": "About person",
     "registrationNumber": "Matrikel number",

src/pages/account/accountDataPage/accountManagingCard.vue

@@ -18,7 +18,7 @@ const accountStore = useAccountStore()
       <v-col class="d-flex justify-center align-center">
         <outlined-button
           prepend-icon="mdi-delete"
-          color="red"
+          color="error"
           :loading="accountStore.fetchInProgress"
           @click="showConfirmDialog = true"
         >
@@ -29,7 +29,7 @@ const accountStore = useAccountStore()
       <v-col class="d-flex justify-center align-center">
         <outlined-button
           prepend-icon="mdi-content-save"
-          color="green"
+          color="success"
           :loading="accountStore.fetchInProgress"
           @click="accountStore.updateAccount()"
         >

src/pages/account/accountDataPage/addressesCard.vue

@@ -81,7 +81,7 @@ const accountStore = useAccountStore()
             <v-col class="d-flex justify-center align-center">
               <outlined-button
                 @click="accountStore.removeAddress(address)"
-                color="red"
+                color="error"
                 prepend-icon="mdi-delete"
               >
                 {{ $t('misc.actions.remove') }}
@@ -102,7 +102,7 @@ const accountStore = useAccountStore()
       <outlined-button
         @click="accountStore.userAccount.addresses.push(new AddressModel())"
         prepend-icon="mdi-plus"
-        color="green"
+        color="success"
       >
         {{ $t('misc.actions.add') }}
       </outlined-button>

src/pages/account/accountDataPage/paymentsCard.vue

@@ -17,7 +17,7 @@ const accountStore = useAccountStore()
     <v-row>
       <v-col>
         <card-view-one-line
-          color="amber"
+          color="warning"
           prepend-icon="mdi-alert"
           :title="$t('account.noRealPaymentsNeeded')"
         />
@@ -60,7 +60,7 @@ const accountStore = useAccountStore()
                 <v-col class="d-flex justify-center align-center">
                   <outlined-button
                     @click="accountStore.removePayment(payment)"
-                    color="red"
+                    color="error"
                     prepend-icon="mdi-delete"
                   >
                     {{ $t('misc.actions.remove') }}
@@ -88,7 +88,7 @@ const accountStore = useAccountStore()
       <outlined-button
         @click="accountStore.userAccount.payments.push(new PaymentModel())"
         prepend-icon="mdi-plus"
-        color="green"
+        color="success"
       >
         {{ $t('misc.actions.add') }}
       </outlined-button>

src/pages/account/loginPage/loginForm.vue

@@ -69,7 +69,7 @@ async function startLogin() {
         append-icon="mdi-arrow-right"
         @click="startLogin"
         :loading="accountStore.fetchInProgress"
-        color="green"
+        color="success"
         id="btn-login"
       >
         {{ $t('account.login.login') }}

src/pages/account/loginPage/registerForm.vue

@@ -75,6 +75,7 @@ async function registerAccount() {
         prepend-icon="mdi-account-plus"
         @click="registerAccount"
         :loading="accountStore.fetchInProgress"
+        color="success"
       >
         {{ $t('account.register') }}
       </outlined-button>

src/pages/admin/bandsAdminPage/bandEditDialog.vue

@@ -93,7 +93,7 @@ function itemProps(item: GenreModel) {
     
     <template #actions>
       <outlined-button
-        color="green"
+        color="success"
         @click="bandStore.saveBand"
         :loading="bandStore.fetchInProgress"
       >

src/pages/admin/filesAdminPage/fileUploadDialog.vue

@@ -53,7 +53,7 @@ const test = ref()
       <outlined-button
         @click="filesStore.uploadFile"
         prepend-icon="mdi-file-upload"
-        color="green"
+        color="success"
         :disabled="filesStore.fileUploadDir.length == 0 || filesStore.fileUpload == undefined"
         :loading="filesStore.fetchInProgress"
       >

src/pages/admin/genresAdminPage/genreEditDialog.vue

@@ -35,7 +35,7 @@ const genreStore = useGenreStore()
 
     <template #actions>
       <outlined-button
-        color="green"
+        color="success"
         @click="genreStore.saveGenre"
         :disabled="!valid"
         :loading="genreStore.fetchInProgress"

src/pages/misc/basketPage/index.vue

@@ -53,7 +53,7 @@ const showOrderingDialog = ref()
               prepend-icon="mdi-basket-check"
               :disabled="basketStore.itemsInBasket.length == 0 || accountStore.userAccount.id == null"
               variant="outlined"
-              color="green"
+              color="success"
               @click="showOrderingDialog = true"
             >
               {{ $t('order.takeOrder') }}

src/pages/misc/basketPage/orderingDialog.vue

@@ -100,7 +100,7 @@ function paymentItemProps(item: PaymentModel) {
         @click="doOrder"
         :loading="orderingInProgress"
         prepend-icon="mdi-send"
-        color="green"
+        color="success"
       >
         {{ $t('order.takeOrder') }}
       </outlined-button>

src/pages/misc/basketPage/ticketsTable.vue

@@ -56,7 +56,7 @@ function removeFromBasket(basketItem: BasketItemModel) {
           <v-btn
             icon="mdi-delete"
             @click="removeFromBasket(basketItem)"
-            color="red"
+            color="error"
             variant="text"
             flat
           />

src/pages/misc/homePage/welcomeDialog.vue

@@ -63,7 +63,7 @@ watch(() => currentStep.value, () => {
               :title="step"
               :value="n + 1"
               complete-icon="mdi-check"
-              color="green"
+              color="success"
             />
 
             <v-divider v-if="n < steps.length - 1" />
@@ -73,6 +73,7 @@ watch(() => currentStep.value, () => {
 
         <!-- Content -->
         <v-stepper-window>
+          <!-- Step 1: Check connection to backend server -->
           <v-stepper-window-item
             :value="1"
             class="text-h4 text-center"
@@ -84,6 +85,7 @@ watch(() => currentStep.value, () => {
             <server-state-text />
           </v-stepper-window-item>
 
+          <!-- Step 2: Reset the database -->
           <v-stepper-window-item
             :value="2"
           >
@@ -100,7 +102,7 @@ watch(() => currentStep.value, () => {
             </div>
           </v-stepper-window-item>
 
-
+          <!-- Step 3: Create exercises -->
           <v-stepper-window-item
             :value="3"
           >
@@ -117,11 +119,18 @@ watch(() => currentStep.value, () => {
             </div>
           </v-stepper-window-item>
 
-
+          <!-- Step 4: Personal data -->
           <v-stepper-window-item
             :value="4"
           >
             <v-container class="px-0 py-2">
+              <v-row>
+                <v-col>
+                  <v-alert color="warning" icon="mdi-alert">
+                    {{ $t('misc.firstStartup.enterYourPersonalData') }}
+                  </v-alert>
+                </v-col>
+              </v-row>
               <v-row>
                 <v-col>
                   <v-text-field
@@ -171,7 +180,7 @@ watch(() => currentStep.value, () => {
               :disabled="preferencesStore.studentName.length == 0 || 
                 preferencesStore.registrationNumber.length == 0"
               prepend-icon="mdi-check"
-              color="green"
+              color="success"
             >
               {{ $t('misc.firstStartup.complete') }}
             </outlined-button>

src/pages/misc/preferencesPage/index.vue

@@ -2,7 +2,6 @@
 import pageSetup from './pageSetupSection.vue';
 import systemSetup from './systemSetupSection.vue';
 import aboutSection from './aboutSection.vue';
-import userSection from './userSection.vue';
 </script>
 
 <template>
@@ -13,12 +12,6 @@ import userSection from './userSection.vue';
       </v-col>
     </v-row>
 
-    <v-row>
-      <v-col>
-        <user-section />
-      </v-col>
-    </v-row>
-
     <v-row>
       <v-col>
         <system-setup />

src/pages/misc/preferencesPage/systemSetupSection.vue

@@ -28,7 +28,7 @@ preferenceStore.getServerState()
           <outlined-button
             @click="preferenceStore.showDeleteDbDialog = true"
             prepend-icon="mdi-database-refresh"
-            color="red"
+            color="warning"
             :disabled="preferenceStore.serverState != ServerStateEnum.ONLINE || preferenceStore.fetchInProgress"
           >
             {{ $t('preferences.resetDatabase.resetDatabase') }}
@@ -39,7 +39,7 @@ preferenceStore.getServerState()
           <outlined-button
             @click="preferenceStore.showDeleteExerciseDialog = true"
             prepend-icon="mdi-progress-close"
-            color="red"
+            color="warning"
             :disabled="preferenceStore.serverState != ServerStateEnum.ONLINE || preferenceStore.fetchInProgress"
           >
             {{ $t('preferences.resetExerciseProgress.resetExerciseProgress') }}
@@ -50,7 +50,7 @@ preferenceStore.getServerState()
           <outlined-button
             @click="preferenceStore.showFactoryResetDialog = true"
             prepend-icon="mdi-factory"
-            color="red"
+            color="warning"
             :disabled="preferenceStore.serverState != ServerStateEnum.ONLINE || preferenceStore.fetchInProgress"
           >
             {{ $t('preferences.factoryReset.factoryReset') }}

src/pages/misc/preferencesPage/userSection.vue

@@ -1,32 +0,0 @@
-<script setup lang="ts">
-import cardView from '@/components/basics/cardView.vue';
-import { usePreferencesStore } from '@/stores/preferences.store';
-
-const preferencesStore = usePreferencesStore()
-</script>
-
-<template>
-  <card-view icon="mdi-account-school" :title="$t('misc.user')">
-    <v-row>
-      <v-col>
-        <v-text-field
-          variant="outlined"
-          hide-details
-          :label="$t('misc.yourFullName')"
-          v-model="preferencesStore.studentName"
-        />
-      </v-col>
-    </v-row>
-
-    <v-row>
-      <v-col>
-        <v-text-field
-          variant="outlined"
-          hide-details
-          :label="$t('misc.registrationNumber')"
-          v-model="preferencesStore.registrationNumber"
-        />
-      </v-col>
-    </v-row>
-  </card-view>
-</template>

src/plugins/vuetify.ts

@@ -18,7 +18,11 @@ const vuetify = createVuetify({
         colors: {
           primary: colors.blue.darken4,
           secondary: colors.yellow.darken3,
-          sheet: colors.grey.darken4
+          sheet: colors.grey.darken4,
+          warning: colors.amber.darken3,
+          success: colors.green.darken2,
+          error: colors.red.darken2,
+          exerciseSolved: colors.purple.darken2
         }
       },
       light: {
@@ -26,7 +30,11 @@ const vuetify = createVuetify({
         colors: {
           primary: colors.blue.darken4,
           secondary: colors.yellow.darken3,
-          sheet: colors.grey.lighten3
+          sheet: colors.grey.lighten3,
+          warning: colors.amber.darken4,
+          success: colors.green.darken2,
+          error: colors.red.darken4,
+          exerciseSolved: colors.purple.darken2
         }
       },
     }

src/stores/account.store.ts

@@ -16,9 +16,10 @@ export const useAccountStore = defineStore("accountStore", {
     /** All accounts */
     accounts: ref<Array<AccountApiModel>>([]),
 
-    /** Useraccount which is currently logged in */
+    /** Server token of currently logged in account */
     userAccountToken: useLocalStorage("hackmycart/accountStore/userAccountToken", ""),
 
+    /** Useraccount which is currently logged in */
     userAccount: useLocalStorage("hackmycart/accountStore/userAccount", new AccountApiModel()),
 
     /** User input on login screen */
@@ -49,6 +50,9 @@ export const useAccountStore = defineStore("accountStore", {
           this.accounts = response.data
           this.fetchInProgress = false
         })
+        .catch(onrejected => {
+          this.fetchInProgress = false
+        })
     },
 
     /**

src/stores/feedback.store.ts

@@ -197,7 +197,7 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.BANDSAVEDERROR:
         case BannerStateEnum.GENREDELETEERROR:
         case BannerStateEnum.GENRESAVEDERROR:
-          return "red"
+          return "warning"
         
         case BannerStateEnum.BASKETTICKETADDED:
         case BannerStateEnum.DATABASERESETSUCCESSFUL:
@@ -211,7 +211,8 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.EXERCISEPROGRESSRESETSUCCESSFUL:
         case BannerStateEnum.GENREDELETESUCCESSFUL:
         case BannerStateEnum.GENRESAVEDSUCCESSFUL:
-          return "green"
+        case BannerStateEnum.BASKETTICKETREMOVED:
+          return "success"
 
         case BannerStateEnum.EXERCISESOLVED01:
         case BannerStateEnum.EXERCISESOLVED02:
@@ -225,10 +226,7 @@ export const useFeedbackStore = defineStore("feedbackStore", {
         case BannerStateEnum.EXERCISESOLVED25:
         case BannerStateEnum.EXERCISESOLVED31:
         case BannerStateEnum.EXERCISESOLVED32:
-          return "purple"
-
-        case BannerStateEnum.BASKETTICKETREMOVED:
-          return "blue"
+          return "exerciseSolved"
       }
     },