jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged PR 130: Edit and delete messages. Removed option for report

Browse Source 
Edit and delete messages. Removed option for report
This commit is contained in:
Dominic Villemure
2024-08-29 04:29:51 +00:00
parent dbc423b18b 3de9c897ec
commit ed1abd4a96
5 changed files with 51 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/views/contents/ContentCard.vue
View File

@@ -31,9 +31,6 @@
<v-list-item v-if="creatorIsCurrentUser" @click="openDeleteConfirmationDialog">
<v-list-item-title>Effacer le contenu</v-list-item-title>
</v-list-item>
<v-list-item @click="reportContent">
<v-list-item-title>Reporter le contenu</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</div>
@@ -225,10 +222,6 @@ async function deleteContent() {
}
}
function reportContent() {
console.log('Reporter le contenu');
}
function redirectToContent() {
window.location.href = `/content/${props.content.id}`;
}

7
src/views/contents/contentcards/NContentCard.vue
View File

@@ -31,9 +31,6 @@
<v-list-item v-if="creatorIsCurrentUser" @click="openDeleteConfirmationDialog">
<v-list-item-title>{{$t('contentCard.delete')}}</v-list-item-title>
</v-list-item>
<v-list-item @click="reportContent">
<v-list-item-title>{{$t('contentCard.report')}}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</div>
@@ -218,10 +215,6 @@ async function deleteContent() {
}
}
function reportContent() {
console.log('Reporter le contenu');
}
function redirectToContent() {
window.location.href = `/content/${props.content.id}`;
}

7
src/views/contents/contentcards/SmContentCard.vue
View File

@@ -31,9 +31,6 @@
<v-list-item v-if="creatorIsCurrentUser" @click="openDeleteConfirmationDialog">
<v-list-item-title>{{ $t('contentCard.delete') }}</v-list-item-title>
</v-list-item>
<v-list-item @click="reportContent">
<v-list-item-title>{{ $t('contentCard.report') }}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</div>
@@ -217,10 +214,6 @@ async function deleteContent() {
}
}
function reportContent() {
console.log('Reporter le contenu');
}
function redirectToContent() {
window.location.href = `/content/${props.content.id}`;
}

59
src/views/messages/Message.vue
View File

@@ -27,7 +27,7 @@
</div>
</div>
</div>
<v-menu class="ml-auto">
<v-menu class="ml-auto" v-if="messageAuthorIsCurrentUser">
<template v-slot:activator="{ props }">
<v-btn variant="plain" icon v-bind="props">
<v-icon>mdi-dots-vertical</v-icon>
@@ -37,12 +37,9 @@
<v-list-item @click="editMessage(message)">
<v-list-item-title>{{ $t('message.edit') }}</v-list-item-title>
</v-list-item>
<v-list-item @click="deleteMessage(message)">
<v-list-item @click="deleteMessage()">
<v-list-item-title>{{ $t('message.delete') }}</v-list-item-title>
</v-list-item>
<v-list-item @click="reportMessage(message)">
<v-list-item-title>{{ $t('message.report') }}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</div>
@@ -57,11 +54,11 @@
rows="1"
auto-grow
class="flex-1 mt-3"
@keyup.enter="acceptechanges"
@keyup.enter="acceptChanges"
></v-textarea>
<div class="flex flex-col px-2 space-y-1">
<v-btn variant="plain" @click="acceptechanges">
<v-btn variant="plain" @click="acceptChanges">
<v-icon>mdi-check</v-icon>
</v-btn>
<v-btn variant="plain" @click="cancel">
@@ -73,15 +70,24 @@
</div>
</div>
</div>
<must-be-logged v-model="loginModal" message="Vous devez être connecté pour supprimer ou modifier un commentaire."></must-be-logged>
</template>
<script setup>
import { ref, watch, onMounted, onBeforeUnmount } from "vue";
import {ref, watch, onMounted, onBeforeUnmount, computed} from "vue";
import { time_ago } from "@/internal_time_ago.js";
import MustBeLogged from "@/views/MustBeLogged.vue";
import {useAuthStore} from "@/stores/authStore.js";
import {useClient} from "@/plugins/api.js";
const isEditMessage = ref(false);
const editMessageValue = ref("");
const originalMessageValue = ref("");
const loginModal = ref(false);
const authStore = useAuthStore();
const client = useClient();
const messageAuthorId = computed(() => props.message.createdBy)
const messageAuthorIsCurrentUser = computed(() => authStore.isAuthenticated && authStore.userId === messageAuthorId.value)
const props = defineProps({
message: {
@@ -90,15 +96,32 @@ const props = defineProps({
}
});
const emits = defineEmits(['message-deleted']);
function editMessage(message) {
isEditMessage.value = true;
originalMessageValue.value = message.value;
editMessageValue.value = message.value;
}
function acceptechanges() {
const acceptChanges = async() => {
props.message.value = editMessageValue.value;
isEditMessage.value = false;
console.log('Update message', props.message.value);
if (!authStore.isAuthenticated) {
loginModal.value = true;
} else {
try {
await client.post(`/api/messages/update`, {
"id": props.message.id,
"subjectId": props.message.subjectId,
"message": props.message.value
})
} catch (error) {
console.error(`post api/message/update : ${error}`)
}
}
}
function cancel() {
@@ -106,12 +129,20 @@ function cancel() {
isEditMessage.value = false;
}
function deleteMessage(message) {
console.log('Delete message', message);
const deleteMessage = async () => {
console.log('Delete message', props.message);
if (!authStore.isAuthenticated) {
loginModal.value = true;
} else {
try {
await client.delete(`/api/messages/${props.message.id}`)
emits('message-deleted', {
"id": props.message.id
})
} catch (error) {
console.error(`delete api/message : ${error}`)
}
}
function reportMessage(message) {
console.log('Report message', message);
}
function handleKeydown(event) {

5
src/views/messages/MessageList.vue
View File

@@ -7,6 +7,7 @@
>
<template v-for="message in messages" :key="message">
<message :message="message"
@message-deleted="(messageId) => handleDeleteMessage(messageId)"
class="border-b"
></message>
</template>
@@ -87,4 +88,8 @@ async function fetchMessages({done, page_size = 10}) {
done('error');
}
}
function handleDeleteMessage(message){
messages.value = messages.value.filter(item => item.id !== message.id);
}
</script>