I agree with the first one. The second although you think the integrity is strong, but if all soft into a component, the code will be very messy, very much, very bad for future maintenance and modification.

Yes, event notification is a little more convenient than vuex when you don't have a lot of components and data involved.

I will write in a component, on the left is a tab, on the right is a dynamic component,

<template>
    <div class="tabs">
        <tab-item
            v-for="tab in tabs"
            @click.native="onTabClick(tab)">
    </div>
    <components :is="currentTab.component">
</template>

<script>
export default {
    data() {
        return {
            tabs: [
                {
                    name: 'a',
                    component: 'cpA'
                }            
            ],
            currentTab: {
                name: 'a',
                component: 'cpA'
            }
        }
    },
    methods: {
        onTabClick(tab) {
            this.currentTab = tab
        }
    }
}
</script>

I simply do it for you, and that's about it.

if I do it, I still have to do it according to whether the content on the right is uniform, such as takeout, different categories, and different products on the right, then it must be the same component.
in your case, there are mainly different forms on the right, even more if the contents of the forms are different. Certainly tend to different components, and can even use different routes, two-level routing to do