Глобальная шина событий и уведомления в Vue.js

Я пытаюсь создать глобальную шину событий, чтобы два компонента Parent-Child могли общаться друг с другом. Я искал вокруг; Я прочитал много статей о хорошем шаблоне The Global Event Bus, однако не могу найти решения для своей ситуации. Я хочу добавить функцию уведомления в свое приложение. Это файл event.js в котором есть разные типы уведомлений:

Event.js

import Vue from 'vue';

export default new Vue({
methods: {
    notifySuccess(message) {
        this.$emit('notify', 'success', message);
    },

    notifyInfo(message) {
        this.$emit('notify', 'info', message);
    },

    notifyWarning(message) {
        this.$emit('notify', 'warning', message);
    },

    notifyDanger(message) {
        this.$emit('notify', 'danger', message);
    },

    requestError(error) {
        if (error.response) {
            this.notifyDanger(error.response.status + ': ' + error.response.statusText);
        }
    },
},
});

Родительский компонент выглядит так

App.vue

<template>
  <router-view></router-view>
</template>

<script>
    import Event from './js/event.js';

    export default {
        name: 'app',
        created() {
            Event.$on('notify', (type, message) => alert(`${type}\n${message}`));
        }
    }
</script>

Дочерний компонент выглядит так

Заголовок.vue

<template>
   <a class="navbar-brand" href="#" @click.prevent="clickTest"></a>
</template>

<script>
    name: 'header',
    methods: {
        clickTest() {
             Event.$emit('notify', 'success', 'Hello World!');
           }
    }
</script>

Я добавлю в будущем всплывающие окна, например, notifySuccess отображает всплывающее окно в зеленом цвете, notifyDanger в красном цвете, notifyWarning в желтом цвете.

Как создать событие/метод в дочернем компоненте в зависимости от типа нострификации? Что я делаю не так?

PS: Извините за мой плохой английский. Надеюсь, ты меня понимаешь.