feat(UI): esc key to cancel cell edit

This commit is contained in:
Fabio Di Stasio 2021-02-27 18:29:47 +01:00
parent b4ead6992c
commit 45351faeae
2 changed files with 24 additions and 0 deletions

View File

@ -74,6 +74,12 @@ export default {
else return '';
}
},
created () {
window.addEventListener('keydown', this.onKey);
},
beforeDestroy () {
window.removeEventListener('keydown', this.onKey);
},
methods: {
confirmModal () {
this.$emit('confirm');
@ -82,6 +88,11 @@ export default {
hideModal () {
this.$emit('hide');
},
onKey (e) {
e.stopPropagation();
if (e.key === 'Escape')
this.hideModal();
}
}
};

View File

@ -336,6 +336,8 @@ export default {
editON (event, content, field) {
if (!this.isEditable) return;
window.addEventListener('keydown', this.onKey);
const type = this.fields[field].type.toUpperCase(); ;
this.originalContent = content;
this.editingType = type;
@ -380,6 +382,8 @@ export default {
this.isInlineEditor = { ...this.isInlineEditor, ...obj };
},
editOFF () {
if (!this.editingField) return;
this.isInlineEditor[this.editingField] = false;
let content;
if (!BLOB.includes(this.editingType)) {
@ -405,6 +409,7 @@ export default {
this.editingType = null;
this.editingField = null;
window.removeEventListener('keydown', this.onKey);
},
hideEditorModal () {
this.isTextareaEditor = false;
@ -446,6 +451,14 @@ export default {
if (keyName.includes('.'))
return this.keyUsage.find(key => key.field === keyName.split('.').pop());
return this.keyUsage.find(key => key.field === keyName);
},
onKey (e) {
e.stopPropagation();
if (e.key === 'Escape') {
this.isInlineEditor[this.editingField] = false;
this.editingField = null;
window.removeEventListener('keydown', this.onKey);
}
}
}
};