Use only the model itself when updating

src/components/lists/ShowList.vue

@@ -283,12 +283,14 @@
                 this.newTask = {}
             },
 			markAsDone(e) {
-				//let context = this
 				let updateFunc = () => {
-					this.taskService.update({id: e.target.id}, {done: e.target.checked})
+					// We get the task, update the 'done' property and then push it to the api.
+					let task = this.list.getTaskByID(e.target.id)
+					task.done = e.target.checked
+					this.taskService.update(task)
 						.then(r => {
 							this.updateTaskInList(r)
-							this.handleSuccess({message: 'The task was successfully ' + (e.target.checked ? '' : 'un-') + 'marked as done.'})
+							this.handleSuccess({message: 'The task was successfully ' + (task.done ? '' : 'un-') + 'marked as done.'})
 						})
 						.catch(e => {
 							this.handleError(e)
@@ -300,21 +302,6 @@
 				} else {
 					updateFunc() // Don't delay it when un-marking it as it doesn't have an animation the other way around
 				}
-
-				/*function doTheDone() {
-					const cancel = message.setLoading(context)
-
-					HTTP.post(`tasks/` + e.target.id, {done: e.target.checked}, {headers: {'Authorization': 'Bearer ' + localStorage.getItem('token')}})
-						.then(response => {
-							context.updateTaskByID(parseInt(e.target.id), response.data)
-							context.handleSuccess({message: 'The task was successfully ' + (e.target.checked ? '' : 'un-') + 'marked as done.'})
-							cancel() // To not set the spinner to loading when the request is made in less than 100ms, would lead to loading infinitly.
-						})
-						.catch(e => {
-							cancel()
-							context.handleError(e)
-						})
-				}*/
 			},
 			editTask(id) {
                 // Find the selected task and set it to the current object

src/models/list.js

@@ -59,4 +59,13 @@ export default class ListModel extends AbstractModel {
 		}
 		this.sortTasks()
 	}
+	
+	getTaskByID(id) {
+		for (const t in this.tasks) {
+			if (this.tasks[t].id === parseInt(id)) {
+				return this.tasks[t]
+			}
+		}
+		return {} // FIXME: This should probably throw something to make it clear to the user noting was found
+	}
 }

src/services/abstractService.js

@@ -190,11 +190,14 @@ export default class AbstractService {
 	 * @param data
 	 * @returns {Q.Promise<any>}
 	 */
-	update(pathparams, data) {
+	update(model) {
 		const cancel = this.setLoading()
 		
 		// Finally make the request and get our data.
-		return this.http.post(this.getReplacedRoute(this.paths.update, pathparams), data)
+		let url = this.getReplacedRoute(this.paths.update, model)
+		// eslint-disable-next-line
+		console.log(url, model)
+		return this.http.post(this.getReplacedRoute(this.paths.update, model), model)
 			.catch(error => {
 				return this.errorHandler(error)
 			})