Füge verbesserte Fehlerbehandlung und Wiederholungslogik zur Benutzerregistrierung im authController hinzu, aktualisiere die Router-Konfiguration für die Registrierungsseite und implementiere ein Dialogfeld zur Benutzerinteraktion in der RegisterContent-Komponente.

src/content/authentication/RegisterContent.vue

@@ -19,10 +19,19 @@
     <p>
       <router-link to="/forgot-password">Passwort vergessen?</router-link>
     </p>
+
+    <div v-if="dialogVisible" class="dialog">
+      <div class="dialog-content">
+        <h3>{{ dialogTitle }}</h3>
+        <p>{{ dialogMessage }}</p>
+        <button type="button" @click="closeDialog">Schließen</button>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import axios from '../../axios';
 
 export default {
   name: 'RegisterComponent',
@@ -41,32 +50,27 @@ export default {
   methods: {
     async register() {
       try {
-        const response = await fetch('/register', {
-          method: 'POST',
-          headers: {
-            'Content-Type': 'application/json'
-          },
-          body: JSON.stringify({
-            name: this.name,
-            email: this.email,
-            password: this.password
-          })
+        const response = await axios.post('/auth/register', {
+          name: this.name,
+          email: this.email,
+          password: this.password
         });
-        if (response.ok) {
-          await response.json();
-          this.showDialog('Registrierung erfolgreich', 'Ihr Konto wurde erfolgreich erstellt.');
-        } else {
-          const error = await response.json();
-          this.showDialog('Fehler', error.message);
-        }
+        this.showDialog('Registrierung erfolgreich', response.data?.message || 'Ihr Konto wurde erfolgreich erstellt.');
+        this.name = '';
+        this.email = '';
+        this.password = '';
       } catch (err) {
-        this.showDialog('Ein Fehler ist aufgetreten', err.message);
+        const message = err?.response?.data?.message || err?.message || 'Ein unbekannter Fehler ist aufgetreten';
+        this.showDialog('Fehler', message);
       }
     },
     showDialog(title, message) {
       this.dialogTitle = title;
       this.dialogMessage = message;
       this.dialogVisible = true;
+    },
+    closeDialog() {
+      this.dialogVisible = false;
     }
   }
 };
@@ -87,4 +91,22 @@ label {
 button {
   margin-top: 20px;
 }
+.dialog {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: rgba(0, 0, 0, 0.4);
+}
+.dialog-content {
+  background: #fff;
+  padding: 16px;
+  border-radius: 4px;
+  max-width: 420px;
+  width: 90%;
+}
 </style>

src/router.js

@@ -51,6 +51,7 @@ router.beforeEach(async (to, from, next) => {
     const routes = generateRoutesFromMenu(store.state.menuData);
     routes.forEach(route => router.addRoute(route));
     addEditPagesRoute();
+    addRegisterRoute();
     router.addRoute({
       path: '/:pathMatch(.*)*',
       components: {
@@ -83,6 +84,21 @@ function addEditPagesRoute() {
   });
 }
 
+function addRegisterRoute() {
+  if (router.hasRoute('/register')) {
+    router.removeRoute('/register');
+  }
+  router.addRoute({
+    path: '/register',
+    components: {
+      default: () => import('./content/authentication/RegisterContent.vue'),
+      rightColumn: loadComponent('ImageContent')
+    },
+    name: 'register'
+  });
+}
+
 addEditPagesRoute();
+addRegisterRoute();
 
 export default router;