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">
<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)">
&nbsp;
</div>
@ -107,6 +107,10 @@ export default {
* @param task the task to save; this is an object as received from the broker.
*/
saveTask(task) {
if (!task.title) {
/* don't save empty tasks */
return;
}
console.info(`Saving task '${task.title}' with id ${task.id}`);
let request = "";
if (task.id !== NEW_TASK_ID) {
@ -114,8 +118,8 @@ export default {
request = `mutation {
updateTask(
id: "${task.id}",
title: "${task.title}",
description: "${task.description}",
title: "${task.title.replaceAll('"', '\\"')}",
description: "${task.description.replaceAll('"', '\\"')}",
completed: ${task.completed ? "true" : "false"},
list: {
id: "${task.list.id}"
@ -128,8 +132,8 @@ export default {
/* create new task */
request = `mutation {
createTask(
title: "${task.title}",
description: "${task.description}",
title: "${task.title.replaceAll('"', '\\"')}",
description: "${task.description.replaceAll('"', '\\"')}",
completed: ${task.completed ? "true" : "false"},
list: {
id: "${task.list.id}"
@ -148,7 +152,7 @@ export default {
request
).then(data => {
/* 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;
}
}).catch(e => {
@ -196,15 +200,18 @@ export default {
return;
}
store.tasks.push({
id: NEW_TASK_ID,
completed: false,
title: "Enter task here",
description: "",
list: {
id: this.currentList,
}
});
/* Do not add another empty/new task */
if (!store.tasks.find((item) => item.id === NEW_TASK_ID)) {
store.tasks.push({
id: NEW_TASK_ID,
completed: false,
title: "",
description: "",
list: {
id: this.currentList,
}
});
}
/* wait a moment, then scroll list to the bottom */
setTimeout(function() {