ExternalVendorCode/openmct
1
0
Fork 0
mirror of https://github.com/nasa/openmct.git synced 2025-06-18 23:28:14 +00:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

Multiple modal instances on 'Enter' button #2513

Browse Source
This commit is contained in:
Nikhil Mandlik
2019-10-10 11:27:40 -07:00
parent 9b7a986475
commit 6b2f2b758d
1 changed files with 17 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/api/overlays/components/OverlayComponent.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div class="c-overlay"> <div class="c-overlay" ref="overlay" tabindex="0">
<div class="c-overlay__blocker" <div class="c-overlay__blocker"
@click="destroy"> @click="destroy">
</div> </div>
@ -11,6 +11,8 @@
<div class="c-overlay__contents" ref="element"></div> <div class="c-overlay__contents" ref="element"></div>
<div class="c-overlay__button-bar" v-if="buttons"> <div class="c-overlay__button-bar" v-if="buttons">
<button class="c-button" <button class="c-button"
tabindex="0"
ref="buttons"
v-for="(button, index) in buttons" v-for="(button, index) in buttons"
:key="index" :key="index"
:class="{'c-button--major': button.emphasis}" :class="{'c-button--major': button.emphasis}"
@ -174,6 +176,9 @@
inject: ['dismiss', 'element', 'buttons', 'dismissable'], inject: ['dismiss', 'element', 'buttons', 'dismissable'],
mounted() { mounted() {
this.$refs.element.appendChild(this.element); this.$refs.element.appendChild(this.element);
setTimeout(() => {
this.getFocusElement().focus();
}, 0);
}, },
methods: { methods: {
destroy: function () { destroy: function () {
@ -184,6 +189,17 @@
buttonClickHandler: function (method) { buttonClickHandler: function (method) {
method(); method();
this.$emit('destroy'); this.$emit('destroy');
},
getFocusElement: function () {
if (!this.$refs.buttons) {
return this.$refs.overlay;
}
const focusButton = this.$refs.buttons.filter((button, index) => {
return this.buttons[index].emphasis;
});
return focusButton[0] || this.$refs.buttons[0];
} }
} }
} }