diff options
| author | Simon Hötten <s+git@hoetten.org> | 2022-09-25 03:56:09 +0300 |
|---|---|---|
| committer | Julius Härtl <jus@bitgrid.net> | 2022-11-07 21:54:25 +0300 |
| commit | 0ae73b57d56d41b4945a1d90b2b754dfcd28f8ef (patch) | |
| tree | a0cb116e86c8654a0c30f7057306b9cbf960973a | |
| parent | 95837d0626cb7f610ee996a2b057acff9639e1e6 (diff) | |
allow to cancel stack title edit
Signed-off-by: Simon Hötten <s+git@hoetten.org>
| -rw-r--r-- | src/components/board/Stack.vue | 14 |
1 files changed, 11 insertions, 3 deletions
diff --git a/src/components/board/Stack.vue b/src/components/board/Stack.vue index b0755edf..c99af30f 100644 --- a/src/components/board/Stack.vue +++ b/src/components/board/Stack.vue @@ -41,7 +41,10 @@ @keydown.enter="startEditing(stack)"> {{ stack.title }} </h3> - <form v-else @submit.prevent="finishedEdit(stack)"> + <form v-else-if="editing" + v-click-outside="cancelEdit" + @submit.prevent="finishedEdit(stack)" + @keyup.esc="cancelEdit"> <input v-model="copiedStack.title" v-focus type="text" @@ -142,7 +145,7 @@ </template> <script> - +import ClickOutside from 'vue-click-outside' import { mapGetters, mapState } from 'vuex' import { Container, Draggable } from 'vue-smooth-dnd' @@ -164,7 +167,9 @@ export default { NcModal, ArchiveIcon, }, - + directives: { + ClickOutside, + }, props: { stack: { type: Object, @@ -274,6 +279,9 @@ export default { } this.editing = false }, + cancelEdit() { + this.editing = false + }, async clickAddCard() { this.stateCardCreating = true try { |