diff --git a/src/plugins/tabs/components/tabs.scss b/src/plugins/tabs/components/tabs.scss index efc7b0ade9..c3ce0f38c3 100644 --- a/src/plugins/tabs/components/tabs.scss +++ b/src/plugins/tabs/components/tabs.scss @@ -17,6 +17,19 @@ margin-right: $interiorMarginSm; opacity: 0.7; } + + &__label { + flex: 1 1 auto; + } + + &__close-btn { + flex: 0 0 auto; + pointer-events: all; + } + + > * + * { + margin-left: $interiorMargin; + } } &__object-holder { diff --git a/src/plugins/tabs/components/tabs.vue b/src/plugins/tabs/components/tabs.vue index 294ba41470..0cfaa2c4b9 100644 --- a/src/plugins/tabs/components/tabs.vue +++ b/src/plugins/tabs/components/tabs.vue @@ -19,7 +19,7 @@ > Drag objects here to add them to this view. - + {{ tab.domainObject.name }} + +
import ObjectView from '../../../ui/components/ObjectView.vue'; +import RemoveAction from '../../remove/RemoveAction.js'; import { getSearchParam, setSearchParam, @@ -123,6 +117,7 @@ export default { this.unsubscribe = this.openmct.objects.observe(this.internalDomainObject, '*', this.updateInternalDomainObject); + this.RemoveAction = new RemoveAction(this.openmct); document.addEventListener('dragstart', this.dragstart); document.addEventListener('dragend', this.dragend); }, @@ -153,6 +148,38 @@ export default { this.currentTab = tab; }, + showRemoveDialog(index) { + if(!this.tabsList[index]) { + return; + } + + let activeTab = this.tabsList[index]; + let childDomainObject = activeTab.domainObject + + let prompt = this.openmct.overlays.dialog({ + iconClass: 'alert', + message: `This action will remove this tab from the Tabs Layout. Do you want to continue?`, + buttons: [ + { + label: 'Ok', + emphasis: 'true', + callback: () => { + this.removeFromComposition(childDomainObject); + prompt.dismiss(); + } + }, + { + label: 'Cancel', + callback: () => { + prompt.dismiss(); + } + } + ] + }); + }, + removeFromComposition(childDomainObject) { + this.composition.remove(childDomainObject); + }, addItem(domainObject) { let type = this.openmct.types.get(domainObject.type) || unknownObjectType, tabItem = {