client brief image details - remove image working

src/components/project/ClientBrief/ImageDetailsModal.vue

@@ -45,7 +45,7 @@
       <button
         data-icon="delete"
         class="btn btn--black-10 | ml-auto mt-auto"
-        @click="image = false"
+        @click="remove()"
       >
         Supprimer cette image
       </button>
@@ -64,7 +64,7 @@ const { imageDetails } = defineProps({
   imageDetails: Object,
 });
 
-const emit = defineEmits(["close"]);
+const emit = defineEmits(["close", "remove"]);
 
 const isOpen = ref(true);
 watch(isOpen, () => {
@@ -117,11 +117,32 @@ const saveDescription = debounce(() => {
     .then((res) => res.json())
     .then((json) => {
       console.log(json);
+      emit("");
     })
     .catch((error) => {
       console.error("Erreur lors de la sauvegarde :", error);
     });
 }, 1000);
+
+function remove() {
+  const headers = {
+    method: "POST",
+    body: JSON.stringify({
+      pageUri: page.uri,
+      fileName: image.value.name,
+    }),
+  };
+  fetch("/remove-file.json", headers)
+    .then((res) => res.json())
+    .then((json) => {
+      console.log(json);
+      emit("remove", image.value);
+      isOpen.value = false;
+    })
+    .catch((error) => {
+      console.error("Erreur lors de la suppression :", error);
+    });
+}
 </script>
 
 <style>

src/components/project/ClientBrief/Images.vue

@@ -38,6 +38,7 @@
       v-if="imageDetails"
       :imageDetails="imageDetails"
       @close="imageDetails = null"
+      @remove="removeImage"
     />
   </section>
 </template>
@@ -89,6 +90,11 @@ function beforeSend(event) {
 function changeSelectedTags(newTags) {
   selectedTags.value = newTags;
 }
+
+function removeImage(target) {
+  console.log("remove", target);
+  images.value = images.value.filter((image) => image.uuid !== target.uuid);
+}
 </script>
 
 <style>