Basic Task deletion

src/components/task/TaskEditComponent.vue

@@ -122,7 +122,6 @@
         hint="Add a boat, if applicable"
         v-model="modifiedTask.boat"
         use-input
-        emit-value
         input-debounce="250"
         :options="boatList"
         option-label="name"
@@ -172,7 +171,6 @@ const defaultTask = <Task>{
   volunteers_required: 0,
   status: 'ready',
   depends_on: [],
-  boat: '',
 };
 
 const { taskId } = props;
@@ -210,7 +208,7 @@ function filterTasks(val: string, update: (cb: () => void) => void): void {
 }
 
 function filterTags(
-  optionVar: Ref<SkillTag[] | TaskTag[] | undefined>,
+  optionVar: Ref<(SkillTag | TaskTag)[] | undefined>,
   optionSrc: SkillTag[] | TaskTag[],
   val: string,
   update: (cb: () => void) => void

src/components/task/TaskTableComponent.vue

@@ -22,7 +22,7 @@
           color="primary"
           :disable="loading"
           label="Delete task(s)"
-          @click="deleteTask"
+          @click="deleteTasks"
         />
         <q-space />
         <q-input
@@ -137,8 +137,12 @@ const taskStore = useTaskStore();
 taskStore.fetchTaskTags();
 taskStore.fetchSkillTags();
 
-function deleteTask() {
-  return;
+function deleteTasks() {
+  selected.value.map((task: Task) => {
+    console.log('Deleting Task: ' + task.$id);
+    taskStore.deleteTask(task);
+    return;
+  });
 }
 const filter = ref('');
 </script>

src/stores/task.ts

@@ -1,6 +1,7 @@
 import { defineStore } from 'pinia';
 import { AppwriteIds, databases, ID } from 'src/boot/appwrite';
 import type { Models } from 'appwrite';
+import { Boat } from './boat';
 
 export const TASKSTATUS = ['ready', 'complete', 'waiting', 'archived'];
 
@@ -15,7 +16,7 @@ export interface Task extends Partial<Models.Document> {
   volunteers_required: number;
   status: string;
   depends_on: Task[];
-  boat: string;
+  boat?: Boat;
 } // TODO: convert some of these strings into objects.
 
 export interface TaskTag extends Models.Document {
@@ -89,11 +90,30 @@ export const useTaskStore = defineStore('tasks', {
         console.error('Failed to fetch skill tags', error);
       }
     },
+    async deleteTask(task: Task | string) {
+      const docId = typeof task === 'string' ? task : task.$id;
+      if (docId === undefined) {
+        console.error('No document ID provided to deleteTask!');
+        return;
+      }
+      try {
+        const response = await databases.deleteDocument(
+          AppwriteIds.databaseId,
+          AppwriteIds.collectionIdTask,
+          docId
+        );
+        this.tasks = this.tasks.filter((task) => docId !== task.$id);
+      } catch (error) {
+        // Need some better error handling, here.
+        console.error('Failed to delete task:', error);
+      }
+    },
     async addTask(task: Task) {
       const newTask = <Models.Document>{ ...task };
       newTask.required_skills = task.required_skills.map((s) => s['$id']);
       newTask.tags = task.tags.map((s) => s['$id']);
       newTask.depends_on = task.depends_on.map((d) => d['$id']);
+      newTask.boat = task.boat?.$id;
       try {
         const response = await databases.createDocument(
           AppwriteIds.databaseId,