exchange-2.0/resources/assets/vue/general/mixins/tabHandler.js

export default {
    data() {
        return {
            activeTab: null,
            displayedTabs: [],
        };
    },
    methods: {
        setActiveTab(event) {
            const tabName = event.currentTarget.getAttribute('tab-name');
            // console.log(`Tab "${tabName}" clicked`);
            this.activeTab = tabName;
            if (!this.displayedTabs.includes(tabName)) {
                this.displayedTabs.push(tabName);
            }
        },
        isActiveTab(tabName) {
            return this.activeTab === tabName;
        },
        showTabContent(tabName) {
            return this.displayedTabs.includes(tabName);
        },
    },
}