Add password reset localization and chat configuration
- Implemented German and English localization for password reset functionality. - Added WebSocket URL resolution logic in chat services to support various environments and configurations. - Created centralized chat configuration for event keys and payload mappings. - Developed RoomsView component for admin chat room management, including create, edit, and delete functionalities.
This commit is contained in:
113
frontend/src/views/admin/RoomsView.vue
Normal file
113
frontend/src/views/admin/RoomsView.vue
Normal file
@@ -0,0 +1,113 @@
|
||||
<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="saveRoom" />
|
||||
<ChooseDialog ref="chooseDialog" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import RoomDialog from '@/dialogues/admin/RoomDialog.vue';
|
||||
import ChooseDialog from '@/dialogues/standard/ChooseDialog.vue';
|
||||
import apiClient from '@/utils/axios.js';
|
||||
|
||||
export default {
|
||||
name: 'RoomsView',
|
||||
components: { RoomDialog, ChooseDialog },
|
||||
data() {
|
||||
return {
|
||||
rooms: [],
|
||||
selectedRoom: null,
|
||||
}
|
||||
},
|
||||
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;
|
||||
const confirmed = await this.$refs.chooseDialog.open({
|
||||
title: this.$t('common.confirm'),
|
||||
message: this.$t('admin.chatrooms.confirmDelete')
|
||||
});
|
||||
if (!confirmed) 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;
|
||||
},
|
||||
async saveRoom(roomData) {
|
||||
// Remove forbidden and associated object fields before sending to backend
|
||||
const { id, ownerId, passwordHash, roomType, genderRestriction, ...cleanData } = roomData;
|
||||
if (roomData.id) {
|
||||
await apiClient.put(`/api/admin/chat/rooms/${roomData.id}`, cleanData);
|
||||
} else {
|
||||
await apiClient.post('/api/admin/chat/rooms', cleanData);
|
||||
}
|
||||
this.fetchRooms();
|
||||
},
|
||||
},
|
||||
}
|
||||
</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;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user