diff --git a/src/plugins/timeConductor/TimePopupFixed.vue b/src/plugins/timeConductor/TimePopupFixed.vue index 652df767e3..cfbaa23440 100644 --- a/src/plugins/timeConductor/TimePopupFixed.vue +++ b/src/plugins/timeConductor/TimePopupFixed.vue @@ -182,13 +182,22 @@ export default { this.handleNewBounds = _.throttle(this.handleNewBounds, 300); }, mounted() { + document.addEventListener('keydown', this.handleKeyDown); this.setTimeSystem(JSON.parse(JSON.stringify(this.openmct.time.getTimeSystem()))); this.setViewFromBounds(this.bounds); }, beforeUnmount() { this.clearAllValidation(); + document.removeEventListener('keydown', this.handleKeyDown); }, methods: { + handleKeyDown({ key }) { + if (key === 'Enter' && !this.hasInputValidityError) { + this.handleFormSubmission(true); + } else if (key === 'Escape') { + this.dismiss(); + } + }, handleNewBounds(bounds) { this.setBounds(bounds); this.setViewFromBounds(bounds); @@ -322,8 +331,11 @@ export default { }, hide($event) { if ($event.target.className.indexOf('c-button icon-x') > -1) { - this.$emit('dismiss'); + this.dismiss(); } + }, + dismiss() { + this.$emit('dismiss'); } } }; diff --git a/src/plugins/timeConductor/TimePopupRealtime.vue b/src/plugins/timeConductor/TimePopupRealtime.vue index 326f21bd72..71fa5d782c 100644 --- a/src/plugins/timeConductor/TimePopupRealtime.vue +++ b/src/plugins/timeConductor/TimePopupRealtime.vue @@ -172,11 +172,20 @@ export default { mounted() { this.setOffsets(); document.addEventListener('click', this.hide); + document.addEventListener('keydown', this.handleKeyDown); }, beforeUnmount() { document.removeEventListener('click', this.hide); + document.removeEventListener('keydown', this.handleKeyDown); }, methods: { + handleKeyDown({ key }) { + if (key === 'Enter' && !this.isDisabled) { + this.submit(); + } else if (key === 'Escape') { + this.dismiss(); + } + }, format(ref) { const curVal = this[ref]; this[ref] = curVal.toString().padStart(2, '0'); @@ -218,13 +227,16 @@ export default { seconds: this.endInputSecs } }); - this.$emit('dismiss'); + this.dismiss(); }, hide($event) { if ($event.target.className.indexOf('c-button icon-x') > -1) { - this.$emit('dismiss'); + this.dismiss(); } }, + dismiss() { + this.$emit('dismiss'); + }, increment($ev, ref) { $ev.preventDefault(); const step = ref === 'startInputHrs' || ref === 'endInputHrs' ? 1 : 5;