Files
yourpart3/frontend/src/views/admin/ContactsView.vue
2024-09-27 07:40:06 +02:00

58 lines
1.8 KiB
Vue

<template>
<div>
<h2>{{ $t('admin.contacts.title') }}</h2>
<table>
<thead>
<tr>
<th>{{ $t('admin.contacts.date') }}</th>
<th>{{ $t('admin.contacts.from') }}</th>
<th>{{ $t('admin.contacts.actions') }}</th>
</tr>
</thead>
<tbody>
<tr v-for="contact in contacts">
<td>{{ formatDateTimeLong(contact.createdAt) }}</td>
<td>{{ contact.email }}</td>
<td>
<button @click="openRequest(contact)">{{ $t('admin.contacts.open') }}</button>
<button @click="finishRequest(contact)">{{ $t('admin.contacts.finished') }}</button>
</td>
</tr>
</tbody>
</table>
</div>
</template>
<script>
import apiClient from '@/utils/axios.js';
import { formatDateTimeLong } from '@/utils/datetime.js';
export default {
name: 'AdminContactsView',
data() {
return {
contacts: []
}
},
mounted() {
this.getContacts()
},
methods: {
formatDateTimeLong,
async getContacts() {
try {
const openContactRequests = await apiClient.get('/api/admin/opencontacts');
this.contacts = openContactRequests.data;
} catch (error) {
this.$root.$refs.errorDialog.open(`tr:error.${error.response.data.error}`);
}
},
async openRequest(contact) {
this.$root.$refs.answerContactDialog.open(contact);
},
async finishRequest(contact) {
await apiClient.get('/api/admin/opencontacts/finish/${contact.id}');
}
}
}
</script>