Fixing deletion: now items get properly updated

Hectruendo · Hectruendo · commit 1804da1429a7 · 2024-04-24T12:01:21.000+02:00
diff --git a/admin/components/generic/Card.vue b/admin/components/generic/Card.vue
@@ -49,7 +49,7 @@ const itemsStore = useItemsStore();
 const deleting = ref(undefined);
 const deleteDialogVisible = ref(false);
 const { $axios } = useNuxtApp();
-const emit = defineEmits(["delete", "edit"]);
+const emit = defineEmits(["deleted", "edit"]);
 
 const props = defineProps({
     item: {
@@ -91,10 +91,11 @@ function createTitle(item) {
 }
 
 async function delItem() {
-    await deleteItem(deleting.value, itemsStore, props.apiUrl, t);
+    const deleted = await deleteItem(deleting.value, itemsStore, props.apiUrl, t);
     deleting.value = undefined;
     deleteDialogVisible.value = false;
-    emit("delete", props.item.id);
+    if (deleted)
+        emit("deleted", props.item.id);
 }
 
 async function resolveCardProps() {
diff --git a/admin/components/generic/ReadView.vue b/admin/components/generic/ReadView.vue
@@ -30,7 +30,7 @@
             </div>
         </div>
         <div class="cards-view" v-if="!itemsStore.tableMode && cardProps && requiredFilterSatisfied">
-            <Card v-for="item in items.results" @edit="(id) => emit('editing', id)" :item="item" :cardProps="cardProps" :titleProps="titleProps" :apiUrl="apiUrl" :itemSchema="itemSchema">
+            <Card v-for="item in items.results" @edit="(id) => emit('editing', id)" :item="item" :cardProps="cardProps" :titleProps="titleProps" :apiUrl="apiUrl" :itemSchema="itemSchema" @deleted="_updateListFromDel">
                 <template v-slot:extra-card-bottom="{item}">
                     <slot name="extra-card-bottom" :item="item"></slot>
                 </template>
@@ -262,10 +262,18 @@ function sortChange({column, prop, order}) {
 
 
 async function delItem() {
-    await deleteItem(deleting.value, itemsStore, props.apiUrl, t);
+    const deleted = await deleteItem(deleting.value, itemsStore, props.apiUrl, t);
+    if (deleted) {
+        await _updateListFromDel(deleting.value)
+    }
     deleting.value = undefined;
     deleteDialogVisible.value = false
 }
+async function _updateListFromDel(id) {
+    items.value.results = items.value.results.filter(item => item.id.toString() !== id.toString())
+    await resolveTableRowProps(items.value.results)
+}
+
 </script>
 
 <style lang="scss">
diff --git a/admin/utils/index.js b/admin/utils/index.js
@@ -85,7 +85,7 @@ export async function solveRefPropValue(item, propName, itemSchema) {
 export async function deleteItem(id, itemsStore, apiUrl, $t) {
     try {
         itemsStore.loading = true;
-        await itemsStore.deleteItem(apiUrl, id);
+        await itemsStore.deleteItem(apiUrl, id, false);
         itemsStore.loading = false;
     } catch (e) {
         itemsStore.loading = false;
@@ -95,14 +95,15 @@ export async function deleteItem(id, itemsStore, apiUrl, $t) {
             type: "error",
             position: "top-right",
         });
-        return;
+        return false;
     }
     ElNotification({
         title: "Success",
         message: $t("successdeletingitem"),
         type: "success",
         position: "top-right",
     });
+    return true;
 }
 
 
