app_vue2/components/Layout/Header/Notification.vue

<template>
  <v-menu offset-y>
    <template v-slot:activator="{ on, attrs }">
      <v-tooltip bottom>
        <template v-slot:activator="{ on, attrs }">
          <v-btn icon
                 v-bind="attrs"
                 v-on="on"
          >
            <v-icon class="ot_white--text" small>fa-bell</v-icon>
          </v-btn>
        </template>
        <span>{{ $t('notification') }}</span>
      </v-tooltip>
    </template>
    <v-list dense>
      <template v-for="(item, index) in properties.menu">
        <v-list-item :key="item.title">
          <v-list-item-title v-text="$t(item.title)"></v-list-item-title>
        </v-list-item>
        <v-divider
          v-if="index < properties.menu.length - 1"
          :key="index"
        ></v-divider>
      </template>

    </v-list>
  </v-menu>
</template>

<script lang="ts">
  import {$useMenu} from '@/use/layout/menu'
  import {defineComponent, reactive, Ref} from '@nuxtjs/composition-api'
  import {AnyJson} from "~/types/interfaces";
  import {UnwrapRef} from "@vue/composition-api";

  export default defineComponent({
    setup() {
      const menu:Ref<any> = $useMenu.setUpContext().useConfigurationMenuConstruct()

      const properties:UnwrapRef<AnyJson> = reactive({
        menu: menu
      })

      return {
        properties
      }
    }
  })
</script>

<style scoped>

</style>