studio-variable/designtopack
3
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

content notification read working

Browse source
This commit is contained in:
isUnknown 2024-12-19 10:32:48 +01:00
parent ffb8252808
commit 94c5737245
21 changed files with 317 additions and 163 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/Menu.vue
View file

@ -117,7 +117,7 @@ const { page } = storeToRefs(usePageStore());
const unreadNotificationsCount = computed(() => {
if (!user.value) return undefined;
const count = user.value.notifications.filter(
(notification) => notification.isRead
(notification) => notification.isread
).length;
if (count === 0) return undefined;
return count;
@ -164,7 +164,7 @@ function hasUnreadNotification(project) {
if (!user.value) return false;
return user.value.notifications.some((notification) => {
return (
notification.isRead != true &&
notification.isread != true &&
project.uri.includes(notification.location.project.uri)
);
});

4
src/components/comments/Comment.vue
View file

@ -16,7 +16,7 @@
<time
class="comment__date"
:datetime="dayjs(comment.date).format('YYYY-MM-DD')"
>{{ formatDate() }}</time
>{{ formatDate(comment.date) }}</time
>
</p>
</header>
@ -74,7 +74,7 @@ const status = computed(() => {
const correspondingNotification = userStore.notifications.find(
(notification) => notification.id === comment.id
);
if (correspondingNotification && !correspondingNotification.isRead) {
if (correspondingNotification && !correspondingNotification.isread) {
return "unread";
}
return undefined;

44
src/components/notifications/Comment.vue Normal file
View file

@ -0,0 +1,44 @@
<template>
<article
class="notification | bg-white rounded-lg | p-16 | flow"
:data-status="notification.isread == true ? 'read' : 'unread'"
data-type="comment"
@click="read(notification)"
>
<header>
<p class="flex">
<strong
class="notification__type | font-medium text-primary"
data-icon="comment"
>Commentaire</strong
>
<span class="notification__client | text-grey-700">{{
notification.location.project.title
}}</span>
<time
datetime=""
class="notification__date | text-grey-700 | ml-auto"
>{{ formatDate(notification) }}</time
>
</p>
</header>
<p
v-if="notification.type"
class="notification__body | text-md font-medium | line-clamp"
>
{{
notification.author.name
? notification.author.name
: notification.author.email
}}
: {{ notification.text }}
</p>
</article>
</template>
<script setup>
import { useNotificationsStore } from "../../stores/notifications";
const { notification } = defineProps({ notification: Object });
const { formatDate } = useNotificationsStore();
</script>

42
src/components/notifications/Content.vue Normal file
View file

@ -0,0 +1,42 @@
<template>
<article
class="notification | bg-white rounded-lg | p-16 | flow"
:data-status="notification.isread == 'true' ? 'read' : 'unread'"
data-type="content"
@click="read(notification)"
title="Aller au contenu"
>
<header>
<p class="flex">
<strong
class="notification__type | font-medium text-primary"
data-icon="content"
>Contenu</strong
>
<span class="notification__client | text-grey-700">{{
notification.location.project.title
}}</span>
<time
datetime=""
class="notification__date | text-grey-700 | ml-auto"
>{{ formatDate(notification) }}</time
>
</p>
</header>
<p
v-if="notification.type"
class="notification__body | text-md font-medium | line-clamp"
>
{{ notification.text }}
</p>
</article>
</template>
<script setup>
import { useRouter } from "vue-router";
import { useNotificationsStore } from "../../stores/notifications";
const router = useRouter();
const { notification } = defineProps({ notification: Object });
const { formatDate, read } = useNotificationsStore();
</script>

49
src/components/notifications/Reply.vue Normal file
View file

@ -0,0 +1,49 @@
<template>
<article
class="notification | bg-white rounded-lg | p-16 | flow"
:data-status="notification.isread == true ? 'read' : 'unread'"
data-type="comment"
@click="read(notification)"
>
<header>
<p class="flex">
<strong
class="notification__type | font-medium text-primary"
data-icon="comment"
>Réponse à
{{
notification.location.parent.author.name
? notification.location.parent.author.name
: notification.location.parent.author.email
}}</strong
>
<span class="notification__client | text-grey-700">{{
notification.location.project.title
}}</span>
<time
datetime=""
class="notification__date | text-grey-700 | ml-auto"
>{{ formatDate(notification) }}</time
>
</p>
</header>
<p
v-if="notification.type"
class="notification__body | text-md font-medium | line-clamp"
>
{{
notification.author.name
? notification.author.name
: notification.author.email
}}
: {{ notification.text }}
</p>
</article>
</template>
<script setup>
import { useNotificationsStore } from "../../stores/notifications";
const { notification } = defineProps({ notification: Object });
const { formatDate } = useNotificationsStore();
</script>