<template> <div class="ui three stackable cards"> <!-- EVENTS --> <div class="red card"> <div class="content"> <div class="center aligned header"> Mes dernières notifications reçues </div> <div class="center aligned description"> <div class="ui relaxed list"> <div v-for="item in events" :key="item.id" class="item" > <div class="content ellipsis nowrap"> <span v-if="item.event_type === 'create'"> <a v-if="item.object_type === 'feature'" :href="modifyUrl(item.related_feature.feature_url)" > Signalement créé </a> <a v-else-if="item.object_type === 'comment'" :href="modifyUrl(item.related_feature.feature_url)" > Commentaire créé </a> <a v-else-if="item.object_type === 'attachment'" :href="modifyUrl(item.related_feature.feature_url)" > Pièce jointe ajoutée </a> <a v-else-if="item.object_type === 'project'" :href="modifyUrl(item.project_url)" > Projet créé </a> </span> <span v-else-if="item.event_type === 'update'"> <a v-if="item.object_type === 'feature'" :href="modifyUrl(item.related_feature.feature_url || item.project_url)" > Signalement mis à jour </a> <a v-else-if="item.object_type === 'project'" :href="modifyUrl(item.project_url)" >à Projet mis à jour </a> </span> <span v-else-if="item.event_type === 'delete'"> <span v-if="item.object_type === 'feature'"> Signalement supprimé({{ item.data.feature_title }}) </span> <i v-else>Événement inconnu</i> </span> <span v-if="item.object_type !== 'project'" class="meta" > ({{ item.related_feature.title ? item.related_feature.title : 'signalement supprimé' }}) </span> <div class="description"> <i>[ {{ item.created_on }} <span v-if="user.is_authenticated"> , par {{ item.display_user }} </span> ]</i> </div> </div> </div> <i v-if="!events || events.length === 0" >Aucune notification pour le moment.</i> </div> </div> </div> </div> <!-- FEATURES --> <div class="orange card"> <div class="content"> <div class="center aligned header"> Mes derniers signalements </div> <div class="center aligned description"> <div class="ui relaxed list"> <div v-for="item in features" :key="item.id" class="item" > <div class="content"> <div> <a v-if="item.related_feature && item.related_feature.feature_url" :href="modifyUrl(item.related_feature.feature_url)" >{{ item.related_feature.title }}</a> <span v-else class="meta" ><del>{{ item.data.feature_title }}</del> (supprimé)</span> </div> <div class="description"> <i>[ {{ item.created_on }} <span v-if="user.is_authenticated"> , par {{ item.display_user }} </span> ]</i> </div> </div> </div> <i v-if="!features || features.length === 0" >Aucun signalement pour le moment.</i> </div> </div> </div> </div> <!-- COMMENTS --> <div class="yellow card"> <div class="content"> <div class="center aligned header"> Mes derniers commentaires </div> <div class="center aligned description"> <div class="ui relaxed list"> <div v-for="item in comments" :key="item.id" class="item" > <div class="content"> <div> <a :href="modifyUrl(item.related_feature.feature_url)" >"{{ item.related_comment.comment }}"</a> </div> <div class="description"> <i>[ {{ item.created_on }} <span v-if="user.is_authenticated"> , par {{ item.display_user }} </span> ]</i> </div> </div> </div> <i v-if="!comments || comments.length === 0" >Aucun commentaire pour le moment.</i> </div> </div> </div> </div> </div> </template> <script> import { mapState } from 'vuex'; import miscAPI from '@/services/misc-api'; export default { name: 'UserActivity', data() { return { events: [], features: [], comments: [], }; }, computed: { ...mapState([ 'user', ]), isSharedProject() { return this.$route.path.includes('projet-partage'); }, }, created(){ this.getEvents(); }, methods: { getEvents(){ miscAPI.getUserEvents(this.$route.params.slug) .then((data)=>{ this.events = data.events; this.features = data.features; this.comments = data.comments; }); }, modifyUrl(url) { if (url && this.isSharedProject) { return url.replace('projet', 'projet-partage'); } return url; } } }; </script>