feat(chat): add chat room management functionality

- Created new chat schema in the database.
- Implemented chat room model with necessary fields (title, ownerId, roomTypeId, etc.).
- Added room type model and rights model for chat functionality.
- Developed API endpoints for managing chat rooms, including create, edit, and delete operations.
- Integrated chat room management into the admin interface with a dedicated view and dialog for room creation/editing.
- Added internationalization support for chat room management UI.
- Implemented autocomplete for victim selection in underground activities.
- Enhanced the underground view with new activity types and political target selection.

frontend/src/dialogues/admin/RoomDialog.vue

@@ -0,0 +1,191 @@
+<template>
+  <DialogWidget ref="dialog" :title="$t(room && room.id ? 'admin.chatrooms.edit' : 'admin.chatrooms.create')"
+    :show-close="true" :buttons="buttons" name="RoomDialog" :modal="true" :isTitleTranslated="true"
+    @close="closeDialog">
+    <form class="dialog-form" @submit.prevent="save">
+      <label>
+        {{ $t('admin.chatrooms.roomName') }}
+        <input v-model="localRoom.title" required />
+      </label>
+      <label>
+        {{ $t('admin.chatrooms.type') }}
+        <select v-model="localRoom.roomTypeId" required>
+          <option v-for="type in roomTypes" :key="type.id" :value="type.id">{{ $t(`admin.chatrooms.roomtype.${type.tr}`) }}</option>
+        </select>
+      </label>
+      <label>
+        <input type="checkbox" v-model="localRoom.isPublic" />
+        {{ $t('admin.chatrooms.isPublic') }}
+      </label>
+      <label>
+        <input type="checkbox" v-model="showGenderRestriction" />
+        {{ $t('admin.chatrooms.genderRestriction.show') }}
+      </label>
+      <label v-if="showGenderRestriction">
+        {{ $t('admin.chatrooms.genderRestriction.label') }}
+        <select v-model="localRoom.genderRestrictionId">
+          <option v-for="g in genderRestrictions" :key="g.id" :value="g.id">{{ $t(`gender.${g.value}`) }}</option>
+        </select>
+      </label>
+      <label>
+        <input type="checkbox" v-model="showMinAge" />
+        {{ $t('admin.chatrooms.minAge.show') }}
+      </label>
+      <label v-if="showMinAge">
+        {{ $t('admin.chatrooms.minAge.label') }}
+        <input v-model.number="localRoom.minAge" type="number" />
+      </label>
+      <label>
+        <input type="checkbox" v-model="showMaxAge" />
+        {{ $t('admin.chatrooms.maxAge.show') }}
+      </label>
+      <label v-if="showMaxAge">
+        {{ $t('admin.chatrooms.maxAge.label') }}
+        <input v-model.number="localRoom.maxAge" type="number" />
+      </label>
+      <label>
+        <input type="checkbox" v-model="showPassword" />
+        {{ $t('admin.chatrooms.password.show') }}
+      </label>
+      <label v-if="showPassword">
+        {{ $t('admin.chatrooms.password.label') }}
+        <input v-model="localRoom.password" type="password" />
+      </label>
+      <label>
+        <input type="checkbox" v-model="localRoom.friendsOfOwnerOnly" />
+        {{ $t('admin.chatrooms.friendsOfOwnerOnly') }}
+      </label>
+      <label>
+        <input type="checkbox" v-model="showRequiredUserRight" />
+        {{ $t('admin.chatrooms.requiredUserRight.show') }}
+      </label>
+      <label v-if="showRequiredUserRight">
+        {{ $t('admin.chatrooms.requiredUserRight.label') }}
+        <select v-model="localRoom.requiredUserRightId">
+          <option v-for="r in userRights" :key="r.id" :value="r.id">{{ $t(`admin.chatrooms.rights.${r.tr}`) }}</option>
+        </select>
+      </label>
+    </form>
+  </DialogWidget>
+</template>
+
+<script>
+
+import DialogWidget from '@/components/DialogWidget.vue';
+import axios from '@/utils/axios.js';
+
+export default {
+  name: 'RoomDialog',
+  components: { DialogWidget },
+  props: {
+    modelValue: Boolean,
+    room: Object
+  },
+  data() {
+    return {
+      dialog: null,
+      localRoom: this.room ? { ...this.room } : { title: '', isPublic: true },
+      roomTypes: [],
+      genderRestrictions: [],
+      userRights: [],
+      showGenderRestriction: !!(this.room && this.room.genderRestrictionId),
+      showMinAge: !!(this.room && this.room.minAge),
+      showMaxAge: !!(this.room && this.room.maxAge),
+      showPassword: !!(this.room && this.room.password),
+      showRequiredUserRight: !!(this.room && this.room.requiredUserRightId),
+      buttons: [
+        { text: 'Ok', action: () => this.save() },
+        { text: 'Cancel', action: () => this.closeDialog() }
+      ]
+    }
+  },
+  watch: {
+    room: {
+      handler(newVal) {
+        this.localRoom = newVal ? { ...newVal } : { title: '', isPublic: true };
+        this.showGenderRestriction = !!(newVal && newVal.genderRestrictionId);
+        this.showMinAge = !!(newVal && newVal.minAge);
+        this.showMaxAge = !!(newVal && newVal.maxAge);
+        this.showPassword = !!(newVal && newVal.password);
+        this.showRequiredUserRight = !!(newVal && newVal.requiredUserRightId);
+      },
+      immediate: true
+    }
+  },
+  mounted() {
+    this.dialog = this.$refs.dialog;
+    this.fetchRoomTypes();
+    this.fetchGenderRestrictions();
+    this.fetchUserRights();
+  },
+  methods: {
+    async fetchRoomTypes() {
+      const res = await axios.get('/api/admin/chat/room-types');
+      this.roomTypes = res.data;
+    },
+    async fetchGenderRestrictions() {
+      const res = await axios.get('/api/admin/chat/gender-restrictions');
+      this.genderRestrictions = res.data;
+    },
+    async fetchUserRights() {
+      const res = await axios.get('/api/admin/chat/user-rights');
+      this.userRights = res.data;
+    },
+    async open(roomData) {
+      await Promise.all([
+        this.fetchRoomTypes(),
+        this.fetchGenderRestrictions(),
+        this.fetchUserRights()
+      ]);
+      this.localRoom = roomData ? { ...roomData } : { title: '', isPublic: true };
+      this.dialog.open();
+    },
+    closeDialog() {
+      this.dialog.close();
+    },
+    save() {
+      this.$emit('save', this.localRoom);
+      this.closeDialog();
+    }
+  }
+}
+</script>
+
+<style scoped>
+.room-dialog-content {
+  padding: 16px;
+}
+.dialog-title {
+  font-weight: bold;
+  font-size: 1.2em;
+  margin-bottom: 12px;
+  display: block;
+}
+.dialog-fields > * {
+  margin-bottom: 8px;
+}
+.dialog-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  margin-top: 16px;
+}
+.save-btn, .cancel-btn {
+  padding: 6px 18px;
+  border: none;
+  border-radius: 3px;
+  background: #eee;
+  cursor: pointer;
+}
+.save-btn {
+  background: #1976d2;
+  color: #fff;
+}
+.cancel-btn {
+  background: #eee;
+  color: #333;
+}
+label {
+  display: block;
+}
+</style>

frontend/src/i18n/locales/de/admin.json

@@ -48,6 +48,50 @@
                 "success": "Die Änderungen wurden gespeichert.",
                 "error": "Die Änderungen konnten nicht gespeichert werden."
             }
+        },
+        "chatrooms": {
+            "title": "[Admin] - Chaträume verwalten",
+            "roomName": "Raumname",
+            "create": "Chatraum anlegen",
+            "edit": "Chatraum bearbeiten",
+            "type": "Typ",
+            "isPublic": "Öffentlich sichtbar",
+            "actions": "Aktionen",
+            "genderRestriction": {
+                "show": "Geschlechtsbeschränkung aktivieren",
+                "label": "Geschlechtsbeschränkung"
+            },
+            "minAge": {
+                "show": "Mindestalter angeben",
+                "label": "Mindestalter"
+            },
+            "maxAge": {
+                "show": "Höchstalter angeben",
+                "label": "Höchstalter"
+            },
+            "password": {
+                "show": "Passwortschutz aktivieren",
+                "label": "Passwort"
+            },
+            "friendsOfOwnerOnly": "Nur Freunde des Besitzers",
+            "requiredUserRight": {
+                "show": "Benötigtes Benutzerrecht angeben",
+                "label": "Benötigtes Benutzerrecht"
+            },
+            "roomtype": {
+                "chat": "Reden",
+                "dice": "Würfeln",
+                "poker": "Poker",
+                "hangman": "Hangman"
+            },
+            "rights": {
+                "talk": "Reden",
+                "scream": "Schreien",
+                "whisper": "Flüstern",
+                "start game": "Spiel starten",
+                "open room": "Raum öffnen",
+                "systemmessage": "Systemnachricht"
+            }
         }
     }
 }

frontend/src/router/adminRoutes.js

@@ -1,5 +1,6 @@
 import AdminInterestsView from '../views/admin/InterestsView.vue';
 import AdminContactsView from '../views/admin/ContactsView.vue';
+import ChatRoomsView from '../views/admin/ChatRoomsView.vue';
 import ForumAdminView from '../dialogues/admin/ForumAdminView.vue';
 import AdminFalukantEditUserView from '../views/admin/falukant/EditUserView.vue'
 
@@ -22,6 +23,12 @@ const adminRoutes = [
         component: ForumAdminView,
         meta: { requiresAuth: true }
     },
+    {
+        path: '/admin/chatrooms',
+        name: 'AdminChatRooms',
+        component: ChatRoomsView,
+        meta: { requiresAuth: true }
+    },
     {
         path: '/admin/falukant/edituser',
         name: 'AdminFalukantEditUserView',

frontend/src/views/admin/ChatRoomsView.vue

@@ -0,0 +1,109 @@
+
+<template>
+  <div class="admin-chat-rooms">
+    <h2>{{ $t('admin.chatrooms.title') }}</h2>
+    <button class="create-btn" @click="openCreateDialog">{{ $t('admin.chatrooms.create') }}</button>
+    <table class="rooms-table">
+      <thead>
+        <tr>
+          <th>{{ $t('admin.chatrooms.roomName') }}</th>
+          <th>{{ $t('admin.chatrooms.type') }}</th>
+          <th>{{ $t('admin.chatrooms.isPublic') }}</th>
+          <th>{{ $t('admin.chatrooms.actions') }}</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr v-for="room in rooms" :key="room.id">
+          <td>{{ room.title }}</td>
+          <td>{{ room.roomTypeTr || room.roomTypeId }}</td>
+          <td>{{ room.isPublic ? $t('common.yes') : $t('common.no') }}</td>
+          <td>
+            <button @click="editRoom(room)">{{ $t('common.edit') }}</button>
+            <button @click="deleteRoom(room)">{{ $t('common.delete') }}</button>
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  <RoomDialog ref="roomDialog" :room="selectedRoom" @save="fetchRooms" />
+  </div>
+</template>
+
+<script>
+import RoomDialog from '@/dialogues/admin/RoomDialog.vue';
+import apiClient from '@/utils/axios.js';
+
+export default {
+  name: 'AdminChatRoomsView',
+  components: { RoomDialog },
+  data() {
+    return {
+      rooms: [],
+  // dialog: false, // removed, handled by DialogWidget
+      selectedRoom: null,
+  // headers entfernt, da eigene Tabelle
+  // roomTypeTr sollte beim Laden der Räume mitgeliefert werden (API/Backend)
+    }
+  },
+  mounted() {
+    this.fetchRooms();
+  },
+  methods: {
+    openCreateDialog() {
+      this.selectedRoom = null;
+      this.$refs.roomDialog.open();
+    },
+    editRoom(room) {
+      this.selectedRoom = { ...room };
+      this.$refs.roomDialog.open(this.selectedRoom);
+    },
+    async deleteRoom(room) {
+      if (!room.id) return;
+  await apiClient.delete(`/api/admin/chat/rooms/${room.id}`);
+      this.fetchRooms();
+    },
+    async fetchRooms() {
+  const res = await apiClient.get('/api/admin/chat/rooms');
+      this.rooms = res.data;
+    },
+  },
+}
+</script>
+
+<style scoped>
+.admin-chat-rooms {
+  max-width: 900px;
+  margin: 0 auto;
+}
+.create-btn {
+  margin-bottom: 12px;
+  padding: 6px 18px;
+  border: none;
+  border-radius: 3px;
+  background: #1976d2;
+  color: #fff;
+  cursor: pointer;
+}
+.rooms-table {
+  width: 100%;
+  border-collapse: collapse;
+}
+.rooms-table th, .rooms-table td {
+  border: 1px solid #ddd;
+  padding: 8px;
+}
+.rooms-table th {
+  background: #f5f5f5;
+}
+.rooms-table td button {
+  margin-right: 6px;
+  padding: 4px 12px;
+  border: none;
+  border-radius: 3px;
+  background: #eee;
+  cursor: pointer;
+}
+.rooms-table td button:hover {
+  background: #1976d2;
+  color: #fff;
+}
+</style>

frontend/src/views/admin/RoomDialog.vue

@@ -0,0 +1,175 @@
+<template>
+  <DialogWidget ref="dialog" :title="$t(room && room.id ? 'admin.chatrooms.edit' : 'admin.chatrooms.create')"
+    :show-close="true" :buttons="buttons" name="RoomDialog" :modal="true" :isTitleTranslated="true"
+    @close="closeDialog">
+    <form class="dialog-form" @submit.prevent="save">
+      <label>
+        {{ $t('admin.chatrooms.title') }}
+        <input v-model="localRoom.title" required />
+      </label>
+      <label>
+        {{ $t('admin.chatrooms.type') }}
+        <select v-model="localRoom.roomTypeId" required>
+          <option v-for="type in roomTypes" :key="type.id" :value="type.id">{{ type.tr }}</option>
+        </select>
+      </label>
+      <label>
+        <input type="checkbox" v-model="localRoom.isPublic" />
+        {{ $t('admin.chatrooms.isPublic') }}
+      </label>
+      <label>
+        <input type="checkbox" v-model="showGenderRestriction" />
+        {{ $t('admin.chatrooms.genderRestriction.show') }}
+      </label>
+      <label v-if="showGenderRestriction">
+        {{ $t('admin.chatrooms.genderRestriction.label') }}
+        <select v-model="localRoom.genderRestrictionId">
+          <option v-for="g in genderRestrictions" :key="g.id" :value="g.id">{{ g.tr }}</option>
+        </select>
+      </label>
+      <label>
+        <input type="checkbox" v-model="showMinAge" />
+        {{ $t('admin.chatrooms.minAge.show') }}
+      </label>
+      <label v-if="showMinAge">
+        {{ $t('admin.chatrooms.minAge.label') }}
+        <input v-model.number="localRoom.minAge" type="number" />
+      </label>
+      <label>
+        <input type="checkbox" v-model="showMaxAge" />
+        {{ $t('admin.chatrooms.maxAge.show') }}
+      </label>
+      <label v-if="showMaxAge">
+        {{ $t('admin.chatrooms.maxAge.label') }}
+        <input v-model.number="localRoom.maxAge" type="number" />
+      </label>
+      <label>
+        <input type="checkbox" v-model="showPassword" />
+        {{ $t('admin.chatrooms.password.show') }}
+      </label>
+      <label v-if="showPassword">
+        {{ $t('admin.chatrooms.password.label') }}
+        <input v-model="localRoom.password" type="password" />
+      </label>
+      <label>
+        <input type="checkbox" v-model="localRoom.friendsOfOwnerOnly" />
+        {{ $t('admin.chatrooms.friendsOfOwnerOnly') }}
+      </label>
+      <label>
+        <input type="checkbox" v-model="showRequiredUserRight" />
+        {{ $t('admin.chatrooms.requiredUserRight.show') }}
+      </label>
+      <label v-if="showRequiredUserRight">
+        {{ $t('admin.chatrooms.requiredUserRight.label') }}
+        <select v-model="localRoom.requiredUserRightId">
+          <option v-for="r in userRights" :key="r.id" :value="r.id">{{ r.tr }}</option>
+        </select>
+      </label>
+    </form>
+  </DialogWidget>
+</template>
+<script>
+
+import DialogWidget from '@/components/DialogWidget.vue';
+
+export default {
+  name: 'RoomDialog',
+  props: {
+    modelValue: Boolean,
+    room: Object
+  },
+  data() {
+    return {
+  dialog: null,
+  localRoom: this.room ? { ...this.room } : { title: '', isPublic: true },
+      roomTypes: [],
+      genderRestrictions: [],
+      userRights: [],
+      showGenderRestriction: !!(this.room && this.room.genderRestrictionId),
+      showMinAge: !!(this.room && this.room.minAge),
+      showMaxAge: !!(this.room && this.room.maxAge),
+      showPassword: !!(this.room && this.room.password),
+      showRequiredUserRight: !!(this.room && this.room.requiredUserRightId),
+      buttons: [
+        { text: 'common.save', action: this.save },
+        { text: 'common.cancel', action: this.closeDialog }
+      ]
+  },
+  watch: {
+    room: {
+      handler(newVal) {
+        this.localRoom = newVal ? { ...newVal } : { title: '', isPublic: true };
+        this.showGenderRestriction = !!(newVal && newVal.genderRestrictionId);
+        this.showMinAge = !!(newVal && newVal.minAge);
+        this.showMaxAge = !!(newVal && newVal.maxAge);
+        this.showPassword = !!(newVal && newVal.password);
+        this.showRequiredUserRight = !!(newVal && newVal.requiredUserRightId);
+      },
+      immediate: true
+    }
+  },
+  mounted() {
+  this.dialog = this.$refs.dialog;
+  this.fetchRoomTypes();
+  this.fetchGenderRestrictions();
+  this.fetchUserRights();
+  },
+  methods: {
+    async fetchRoomTypes() {
+      // API-Call, z.B. this.roomTypes = await apiClient.get('/api/room-types')
+    },
+    async fetchGenderRestrictions() {
+      // API-Call, z.B. this.genderRestrictions = await apiClient.get('/api/gender-restrictions')
+    },
+    async fetchUserRights() {
+      // API-Call, z.B. this.userRights = await apiClient.get('/api/user-rights')
+    },
+    open(roomData) {
+      this.localRoom = roomData ? { ...roomData } : { title: '', isPublic: true };
+      this.dialog.open();
+    },
+    closeDialog() {
+      this.dialog.close();
+    },
+    save() {
+      this.$emit('save', this.localRoom);
+      this.closeDialog();
+    }
+  }
+}
+</script>
+<style scoped>
+.room-dialog-content {
+  padding: 16px;
+}
+.dialog-title {
+  font-weight: bold;
+  font-size: 1.2em;
+  margin-bottom: 12px;
+  display: block;
+}
+.dialog-fields > * {
+  margin-bottom: 8px;
+}
+.dialog-actions {
+  display: flex;
+  justify-content: flex-end;
+  gap: 8px;
+  margin-top: 16px;
+}
+.save-btn, .cancel-btn {
+  padding: 6px 18px;
+  border: none;
+  border-radius: 3px;
+  background: #eee;
+  cursor: pointer;
+}
+.save-btn {
+  background: #1976d2;
+  color: #fff;
+}
+.cancel-btn {
+  background: #eee;
+  color: #333;
+}
+</style>

frontend/src/views/falukant/UndergroundView.vue

@@ -13,6 +13,7 @@
                 <div class="create-activity">
                     <h3>{{ $t('falukant.underground.activities.create') }}</h3>
 
+                    <!-- Typ -->
                     <label class="form-label">
                         {{ $t('falukant.underground.activities.type') }}
                         <select v-model="newActivityTypeId" class="form-control">
@@ -23,18 +24,43 @@
                         </select>
                     </label>
 
+                    <!-- Victim mit Autocomplete -->
                     <label class="form-label">
                         {{ $t('falukant.underground.activities.victim') }}
-                        <input v-model="newVictimUsername" type="text" class="form-control"
+                        <input v-model="newVictimUsername" @input="onVictimInput" type="text" class="form-control"
                             :placeholder="$t('falukant.underground.activities.victimPlaceholder')" />
                     </label>
+                    <div v-if="victimSuggestions.length" class="suggestions">
+                        <ul>
+                            <li v-for="s in victimSuggestions" :key="s.username" @click="selectVictim(s)">
+                                {{ s.username }} — {{ s.firstname }} {{ s.lastname }}
+                                ({{ s.town }})
+                            </li>
+                        </ul>
+                    </div>
+
+                    <!-- Politische Zielpersonen (Multiselect) -->
+                    <label v-if="selectedType && selectedType.tr === 'corrupt_politician'" class="form-label">
+                        {{ $t('falukant.underground.activities.targets') }}
+                        <select v-model="newPoliticalTargets" multiple size="5" class="form-control">
+                            <option v-for="p in politicalTargets" :key="p.id" :value="p.id">
+                                {{ $t('falukant.titles.' + p.gender + '.' + p.title) }}
+                                {{ p.name }}
+                                ({{ $t('falukant.politics.offices.' + p.officeType) }})
+                            </option>
+                        </select>
+                    </label>
 
                     <!-- Bei sabotage: Ziel auswählen -->
                     <label v-if="selectedType && selectedType.tr === 'sabotage'" class="form-label">
                         {{ $t('falukant.underground.activities.sabotageTarget') }}
                         <select v-model="newSabotageTarget" class="form-control">
-                            <option value="house">{{ $t('falukant.underground.targets.house') }}</option>
-                            <option value="storage">{{ $t('falukant.underground.targets.storage') }}</option>
+                            <option value="house">
+                                {{ $t('falukant.underground.targets.house') }}
+                            </option>
+                            <option value="storage">
+                                {{ $t('falukant.underground.targets.storage') }}
+                            </option>
                         </select>
                     </label>
 
@@ -42,9 +68,15 @@
                     <label v-if="selectedType && selectedType.tr === 'corrupt_politician'" class="form-label">
                         {{ $t('falukant.underground.activities.corruptGoal') }}
                         <select v-model="newCorruptGoal" class="form-control">
-                            <option value="elect">{{ $t('falukant.underground.goals.elect') }}</option>
-                            <option value="tax_increase">{{ $t('falukant.underground.goals.taxIncrease') }}</option>
-                            <option value="tax_decrease">{{ $t('falukant.underground.goals.taxDecrease') }}</option>
+                            <option value="elect">
+                                {{ $t('falukant.underground.goals.elect') }}
+                            </option>
+                            <option value="tax_increase">
+                                {{ $t('falukant.underground.goals.taxIncrease') }}
+                            </option>
+                            <option value="tax_decrease">
+                                {{ $t('falukant.underground.goals.taxDecrease') }}
+                            </option>
                         </select>
                     </label>
 
@@ -69,13 +101,9 @@
                         </thead>
                         <tbody>
                             <tr v-for="act in activities" :key="act.id">
-                                <!-- Typ -->
                                 <td>{{ $t(`falukant.underground.types.${act.type}`) }}</td>
-                                <!-- Victim -->
                                 <td>{{ act.victimName }}</td>
-                                <!-- Cost -->
                                 <td>{{ formatCost(act.cost) }}</td>
-                                <!-- Zusätzliche Informationen -->
                                 <td>
                                     <template v-if="act.type === 'sabotage'">
                                         {{ $t(`falukant.underground.targets.${act.target}`) }}
@@ -145,22 +173,35 @@ export default {
             activities: [],
             attacks: [],
             loading: { activities: false, attacks: false },
-
-            // Neue Activity-Formfelder
             newActivityTypeId: null,
             newVictimUsername: '',
+            victimSuggestions: [],
+            victimSearchTimeout: null,
+            newPoliticalTargets: [],
             newSabotageTarget: 'house',
             newCorruptGoal: 'elect'
         };
     },
     computed: {
         selectedType() {
-            return this.undergroundTypes.find(t => t.id === this.newActivityTypeId) || null;
+            return this.undergroundTypes.find(
+                t => t.id === this.newActivityTypeId
+            ) || null;
         },
         canCreate() {
-            if (!this.newActivityTypeId || !this.newVictimUsername.trim()) return false;
-            if (this.selectedType.tr === 'sabotage' && !this.newSabotageTarget) return false;
-            if (this.selectedType.tr === 'corrupt_politician' && !this.newCorruptGoal) return false;
+            if (!this.newActivityTypeId) return false;
+            const hasUser = this.newVictimUsername.trim().length > 0;
+            const hasPol = this.newPoliticalTargets.length > 0;
+            if (!hasUser && !hasPol) return false;
+            if (this.selectedType?.tr === 'sabotage' && !this.newSabotageTarget) {
+                return false;
+            }
+            if (
+                this.selectedType?.tr === 'corrupt_politician' &&
+                !this.newCorruptGoal
+            ) {
+                return false;
+            }
             return true;
         }
     },
@@ -181,34 +222,32 @@ export default {
             }
         },
 
-        async loadUndergroundTypes() {
-            const { data } = await apiClient.get('/api/falukant/underground/types');
-            this.undergroundTypes = data;
-        },
-
-        async loadActivities() {
-            this.loading.activities = true;
-            try {
-                const { data } = await apiClient.get('/api/falukant/underground/activities');
-                this.activities = data;
-            } catch (err) {
-                console.error('Error loading activities', err);
-            } finally {
-                this.loading.activities = false;
+        onVictimInput() {
+            clearTimeout(this.victimSearchTimeout);
+            const q = this.newVictimUsername.trim();
+            if (q.length >= 3) {
+                this.victimSearchTimeout = setTimeout(() => {
+                    this.searchVictims(q);
+                }, 300);
+            } else {
+                this.victimSuggestions = [];
             }
         },
-
-        async loadAttacks() {
-            this.loading.attacks = true;
+        async searchVictims(q) {
+            console.log('Searching victims for:', q);
             try {
-                const { data } = await apiClient.get('/api/falukant/underground/attacks');
-                this.attacks = data;
+                const { data } = await apiClient.get('/api/falukant/users/search', {
+                    params: { q }
+                });
+                this.victimSuggestions = data;
             } catch (err) {
-                console.error('Error loading attacks', err);
-            } finally {
-                this.loading.attacks = false;
+                console.error('Error searching users', err);
             }
         },
+        selectVictim(u) {
+            this.newVictimUsername = u.username;
+            this.victimSuggestions = [];
+        },
 
         async createActivity() {
             if (!this.canCreate) return;
@@ -216,17 +255,22 @@ export default {
                 typeId: this.newActivityTypeId,
                 victimUsername: this.newVictimUsername.trim()
             };
-            // je nach Typ noch ergänzen:
             if (this.selectedType.tr === 'sabotage') {
                 payload.target = this.newSabotageTarget;
             }
             if (this.selectedType.tr === 'corrupt_politician') {
                 payload.goal = this.newCorruptGoal;
+                if (this.newPoliticalTargets.length) {
+                    payload.politicalTargets = this.newPoliticalTargets;
+                }
             }
             try {
-                await apiClient.post('/api/falukant/underground/activities', payload);
-                // zurücksetzen & neu laden
+                await apiClient.post(
+                    '/api/falukant/underground/activities',
+                    payload
+                );
                 this.newVictimUsername = '';
+                this.newPoliticalTargets = [];
                 this.newSabotageTarget = 'house';
                 this.newCorruptGoal = 'elect';
                 await this.loadActivities();
@@ -235,6 +279,38 @@ export default {
             }
         },
 
+        async loadUndergroundTypes() {
+            const { data } = await apiClient.get(
+                '/api/falukant/underground/types'
+            );
+            this.undergroundTypes = data;
+        },
+
+        async loadActivities() {
+            return;
+            this.loading.activities = true;
+            try {
+                const { data } = await apiClient.get(
+                    '/api/falukant/underground/activities'
+                );
+                this.activities = data;
+            } finally {
+                this.loading.activities = false;
+            }
+        },
+
+        async loadAttacks() {
+            this.loading.attacks = true;
+            try {
+                const { data } = await apiClient.get(
+                    '/api/falukant/underground/attacks'
+                );
+                this.attacks = data;
+            } finally {
+                this.loading.attacks = false;
+            }
+        },
+
         formatDate(ts) {
             return new Date(ts).toLocaleDateString(this.$i18n.locale, {
                 year: 'numeric',
@@ -245,26 +321,26 @@ export default {
             });
         },
 
-        formatCost(value) {
+        formatCost(v) {
             return new Intl.NumberFormat(navigator.language, {
                 minimumFractionDigits: 0,
                 maximumFractionDigits: 0
-            }).format(value);
+            }).format(v);
         }
     }
 };
 </script>
 
 <style scoped>
+h2 {
+    margin-top: 20px;
+}
+
 .underground-view {
     display: flex;
     flex-direction: column;
 }
 
-h2 {
-    padding-top: 20px;
-}
-
 .tab-content {
     margin-top: 1rem;
 }
@@ -279,18 +355,12 @@ h2 {
     margin: 1em 0;
 }
 
-/* --- Create Activity --- */
 .create-activity {
     border: 1px solid #ccc;
     padding: 1rem;
     margin-bottom: 1rem;
-    border-radius: 4px;
     background: #fafafa;
-    display: inline-block;
-}
-
-.create-activity h3 {
-    margin-top: 0;
+    border-radius: 4px;
 }
 
 .form-label {
@@ -310,11 +380,11 @@ h2 {
 
 .btn-create-activity {
     padding: 0.5rem 1rem;
-    cursor: pointer;
     background: #4caf50;
     color: white;
     border: none;
     border-radius: 4px;
+    cursor: pointer;
 }
 
 .btn-create-activity:disabled {
@@ -322,22 +392,42 @@ h2 {
     cursor: not-allowed;
 }
 
-/* --- Activities List --- */
-.activities-list ul {
-    list-style: disc;
-    margin-left: 1.5em;
-}
-
-/* --- Attacks Table --- */
+.activities-table table,
 .attacks-list table {
     width: 100%;
     border-collapse: collapse;
 }
 
+.activities-table th,
+.activities-table td,
 .attacks-list th,
 .attacks-list td {
     padding: 8px;
     border: 1px solid #ddd;
     text-align: left;
 }
-</style>
+
+.suggestions {
+    position: absolute;
+    background: #fff;
+    border: 1px solid #ccc;
+    z-index: 10;
+    max-height: 200px;
+    overflow-y: auto;
+}
+
+.suggestions ul {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+}
+
+.suggestions li {
+    padding: 0.5em;
+    cursor: pointer;
+}
+
+.suggestions li:hover {
+    background: #eee;
+}
+</style>