Move banner system to store, migrate login/register API handling to own file, display Account details on accountPage

software/src/pages/preferencesPage/index.vue

@@ -2,15 +2,12 @@
 import { Ref, ref } from 'vue';
 import pageSetup from './pageSetup.vue';
 import systemSetup from './systemSetup.vue';
-import BannerModel from '@/data/models/bannerModel';
 import alertBanner from '@/components/alertBanner.vue';
-
-const banner: Ref<BannerModel> = ref(new BannerModel())
 </script>
 
 <template>
   <v-container max-width="800">
-    <alert-banner v-model:alert-banner="banner" />
+    <alert-banner />
 
     <v-row>
       <v-col>
@@ -20,7 +17,7 @@ const banner: Ref<BannerModel> = ref(new BannerModel())
 
     <v-row>
       <v-col>
-        <system-setup v-model:alert-banner="banner" />
+        <system-setup />
       </v-col>
     </v-row>
   </v-container>

software/src/pages/preferencesPage/systemSetup.vue

@@ -1,16 +1,15 @@
 <script setup lang="ts">
 import { BannerStateEnum } from '@/data/enums/bannerStateEnum';
-import BannerModel from '@/data/models/bannerModel';
+import { useFeedbackStore } from '@/data/stores/feedbackStore';
 import axios from 'axios';
 
-const alertBanner = defineModel("alertBanner", { required: true, type: BannerModel })
+const feedbackStore = useFeedbackStore()
 
 function resetDb() {
   axios.get("http://127.0.0.1:3000/api/resetdatabase")
     .then(res => {
       if (res.status == 200) {
-        alertBanner.value.bannerState = BannerStateEnum.DATABASERESETSUCCESSFUL
-        alertBanner.value.show = true
+        feedbackStore.changeBanner(BannerStateEnum.DATABASERESETSUCCESSFUL)
       }
     })
   // todo: Request all data