elimina items

src/pages/listas/indexPage.vue

@@ -25,12 +25,23 @@
       </div>
     </div>
   </div>
-  <div v-for="item in items" :key="item.id">
-    <p
-      class="flex flex-center bg-cyan-7 q-pa-md q-mx-md text-weight-bold text-h6 rounded-borders"
+  <div class="flex flex-center q-mt-xl">
+    <div
+      v-for="item in items"
+      :key="item.id"
+      class="full-width text-center q-px-md"
     >
-      {{ item.nombre }}
-    </p>
+      <p
+        class="bg-cyan-7 q-pa-md q-mx-md text-weight-bold text-h6 rounded-borders"
+      >
+        {{ item.nombre
+        }}<q-icon
+          class="float-right cursor-pointer q-mt-xs"
+          name="delete"
+          @click="eliminarItem(item)"
+        />
+      </p>
+    </div>
   </div>
 </template>
 
@@ -82,6 +93,18 @@ const cargarProducto = async () => {
   }
 };
 
+const eliminarItem = async (i) => {
+  //Lo saca de la lista
+  const orden = lista.value.items.indexOf(i.id);
+  lista.value.items.splice(orden, 1);
+  await listaStore.pb.collection("lista").update(lista.value.id, lista.value);
+  const arrayIdItem = lista.value.items;
+  const result = await listaStore.pb.collection("items").getFullList();
+  items.value = result.filter(
+    (element) => arrayIdItem.indexOf(element.id) != -1
+  );
+};
+
 onMounted(async () => {
   lista.value = await listaStore.pb
     .collection("lista")