ahtlon/deck
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Cancel Card Heading Edit on Click Outside

Browse Source 
Clicking away while editing a card name
will now cancel the edit.

Signed-off-by: Gary Kim <gary@garykim.dev>
This commit is contained in:
Gary Kim
2019-09-17 18:36:26 +08:00
parent 97864ac1ff
commit b50e295e27
1 changed files with 8 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/cards/CardItem.vue
View File

@@ -1,8 +1,12 @@
<!-- <!--
- @copyright Copyright (c) 2018 Julius Härtl <jus@bitgrid.net> - @copyright Copyright (c) 2018 Julius Härtl <jus@bitgrid.net>
- -
- @copyright Copyright (c) 2019 Gary Kim <gary@garykim.dev>
-
- @author Julius Härtl <jus@bitgrid.net> - @author Julius Härtl <jus@bitgrid.net>
- -
- @author Gary Kim <gary@garykim.dev>
-
- @license GNU AGPL version 3 or any later version - @license GNU AGPL version 3 or any later version
- -
- This program is free software: you can redistribute it and/or modify - This program is free software: you can redistribute it and/or modify
@@ -27,7 +31,7 @@
<h3 v-if="showArchived">{{ card.title }}</h3> <h3 v-if="showArchived">{{ card.title }}</h3>
<h3 v-else @click.stop="startEditing(card)">{{ card.title }}</h3> <h3 v-else @click.stop="startEditing(card)">{{ card.title }}</h3>
<transition name="fade" mode="out-in"> <transition name="fade" mode="out-in">
<form v-if="editing"> <form v-if="editing" v-click-outside="cancelEdit">
<input v-model="copiedCard.title" type="text" autofocus> <input v-model="copiedCard.title" type="text" autofocus>
<input type="button" class="icon-confirm" @click="finishedEdit(card)"> <input type="button" class="icon-confirm" @click="finishedEdit(card)">
</form> </form>
@@ -157,6 +161,9 @@ export default {
} }
this.editing = false this.editing = false
}, },
cancelEdit() {
this.editing = false
},
deleteCard() { deleteCard() {
this.$store.dispatch('deleteCard', this.card) this.$store.dispatch('deleteCard', this.card)
}, },