appointment request notification working

src/components/notifications/AppointmentRequest.vue

@@ -0,0 +1,59 @@
+<template>
+  <article
+    @click="read()"
+    v-if="useUserStore.role !== 'client'"
+    class="notification | bg-white rounded-lg | p-16 | flow"
+    data-type="appointment-request"
+  >
+    <header>
+      <p class="flex">
+        <strong
+          class="notification__type | font-medium text-primary"
+          data-icon="comment"
+          >Demande de rendez-vous</strong
+        >
+        <span class="notification__client | text-grey-700"
+          >{{ notification.project.title }}
+          {{
+            notification.project.status === "draft" ? "(brouillon)" : ""
+          }}</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"
+      v-html="
+        'Auteur : ' +
+        (notification.author.name
+          ? notification.author.name + ' (' + notification.author.email + ')'
+          : notification.author.email) +
+        ' : <br>' +
+        notification.text
+      "
+    ></p>
+  </article>
+</template>
+
+<script setup>
+import { useNotificationsStore } from "../../stores/notifications";
+import { useUserStore } from "../../stores/user";
+import { useApiStore } from "../../stores/api";
+
+const { notification } = defineProps({ notification: Object });
+const { formatDate } = useNotificationsStore();
+const { user } = useUserStore();
+const api = useApiStore();
+
+async function read() {
+  const response = await api.readNotification(
+    notification.id,
+    notification.project.uri
+  );
+}
+</script>

src/components/notifications/ProjectRequest.vue

@@ -13,7 +13,10 @@
           >Demande de création de projet</strong
         >
         <span class="notification__client | text-grey-700"
-          >{{ notification.project.title }} (brouillon)</span
+          >{{ notification.project.title }}
+          {{
+            notification.project.status === "draft" ? "(brouillon)" : ""
+          }}</span
         >
         <time
           datetime=""
@@ -26,11 +29,11 @@
       v-if="notification.type"
       class="notification__body | text-md font-medium | line-clamp"
       v-html="
-        'Auteur de la demande : ' +
+        'De la part de ' +
         (notification.author.name
           ? notification.author.name + ' (' + notification.author.email + ')'
           : notification.author.email) +
-        '<br>Demande : ' +
+        ' : <br>' +
         notification.text
       "
     ></p>