samples/vue-todo
3
0
Fork 1
Code Issues 1 Pull Requests Packages Projects Releases 2 Wiki Activity

fix multiple items being created

Browse Source
This commit is contained in:
Markus Thielen 2023-11-01 17:22:13 +01:00
parent 5e5c4033f8
commit 6ae8333d25
1 changed files with 22 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
src/components/Todo.vue
View File

@ -37,7 +37,7 @@
<div id="todo-container"> <div id="todo-container">
<transition-group name="list" tag="div"> <transition-group name="list" tag="div">
<div :class="todoItemClass(task)" v-for="(task, i) in filteredItems" :id="taskElId(task)" :key="i"> <div :class="todoItemClass(task)" v-for="(task, i) in filteredItems" :id="taskElId(task)" :key="task.id">
<div :class="todoCheckedClass(task)" @click="toggleCompleted(task)"> <div :class="todoCheckedClass(task)" @click="toggleCompleted(task)">
&nbsp; &nbsp;
</div> </div>
@ -107,6 +107,10 @@ export default {
* @param task the task to save; this is an object as received from the broker. * @param task the task to save; this is an object as received from the broker.
*/ */
saveTask(task) { saveTask(task) {
if (!task.title) {
/* don't save empty tasks */
return;
}
console.info(`Saving task '${task.title}' with id ${task.id}`); console.info(`Saving task '${task.title}' with id ${task.id}`);
let request = ""; let request = "";
if (task.id !== NEW_TASK_ID) { if (task.id !== NEW_TASK_ID) {
@ -114,8 +118,8 @@ export default {
request = `mutation { request = `mutation {
updateTask( updateTask(
id: "${task.id}", id: "${task.id}",
title: "${task.title}", title: "${task.title.replaceAll('"', '\\"')}",
description: "${task.description}", description: "${task.description.replaceAll('"', '\\"')}",
completed: ${task.completed ? "true" : "false"}, completed: ${task.completed ? "true" : "false"},
list: { list: {
id: "${task.list.id}" id: "${task.list.id}"
@ -128,8 +132,8 @@ export default {
/* create new task */ /* create new task */
request = `mutation { request = `mutation {
createTask( createTask(
title: "${task.title}", title: "${task.title.replaceAll('"', '\\"')}",
description: "${task.description}", description: "${task.description.replaceAll('"', '\\"')}",
completed: ${task.completed ? "true" : "false"}, completed: ${task.completed ? "true" : "false"},
list: { list: {
id: "${task.list.id}" id: "${task.list.id}"
@ -148,7 +152,7 @@ export default {
request request
).then(data => { ).then(data => {
/* Save the task's id in case it was just created */ /* Save the task's id in case it was just created */
if (!task.id) { if (task.id === NEW_TASK_ID) {
task.id = data.createTask.id; task.id = data.createTask.id;
} }
}).catch(e => { }).catch(e => {
@ -196,15 +200,18 @@ export default {
return; return;
} }
store.tasks.push({ /* Do not add another empty/new task */
id: NEW_TASK_ID, if (!store.tasks.find((item) => item.id === NEW_TASK_ID)) {
completed: false, store.tasks.push({
title: "Enter task here", id: NEW_TASK_ID,
description: "", completed: false,
list: { title: "",
id: this.currentList, description: "",
} list: {
}); id: this.currentList,
}
});
}
/* wait a moment, then scroll list to the bottom */ /* wait a moment, then scroll list to the bottom */
setTimeout(function() { setTimeout(function() {