<template>
  <v-badge
    color="error"
    :content="IM.unreadCount"
    :model-value="IM.unreadCount > 0"
    offset-y="10"
  >
    <v-btn class="ml-1" size="small" icon="mdi-bell-outline" @click="router.push(path)"></v-btn>
  </v-badge>
</template>

<script setup>
defineOptions({ name: 'layout-message' })
import { useIM } from '@/hooks/web/useIM'
import { useIMStore } from '@/store/im'
import { useRouter } from 'vue-router'

defineProps({
  path: {
    type: String,
    default: '/recruit/personal/message'
  }
})

const router = useRouter()

const IM = useIMStore()
// useDataSource()

useIM()
</script>

<style lang="scss" scoped>

</style>