diff --git a/src/components/tasks/TaskDetailView.vue b/src/components/tasks/TaskDetailView.vue index e805ee90..11b3b283 100644 --- a/src/components/tasks/TaskDetailView.vue +++ b/src/components/tasks/TaskDetailView.vue @@ -6,7 +6,7 @@ #{{ task.id }}
Done
- +

{{ task.text }}

{{ namespace.name }} > @@ -304,6 +304,7 @@ list: ListModel, namespace: NamespaceModel, showDeleteModal: false, + taskTitle: '', priorities: priorites, flatPickerConfig: { @@ -345,6 +346,7 @@ .then(r => { this.$set(this, 'task', r) this.setListAndNamespaceTitleFromParent() + this.taskTitle = this.task.text // Set all active fields based on values in the model this.activeFields.assignees = this.task.assignees.length > 0 @@ -363,6 +365,22 @@ this.error(e, this) }) }, + saveTaskOnChange() { + this.$refs.taskTitle.spellcheck = false + + // Pull the task title from the contenteditable + let taskTitle = this.$refs.taskTitle.textContent + this.task.text = taskTitle + + // We only want to save if the title was actually change. + // Because the contenteditable does not have a change event, + // we're building it ourselves and only calling saveTask() + // if the task title changed. + if (this.task.text !== this.taskTitle) { + this.saveTask() + this.taskTitle = taskTitle + } + }, saveTask() { this.taskService.update(this.task) .then(r => { diff --git a/src/styles/components/task.scss b/src/styles/components/task.scss index 268eeb4f..ab1257a8 100644 --- a/src/styles/components/task.scss +++ b/src/styles/components/task.scss @@ -46,6 +46,10 @@ padding: 0 .3em; } + h1.input.title { + height: auto; + } + .is-done { background: $green; color: $white;