xs-admin/src/main.js

import './assets/main.css'

import { createApp, computed } from 'vue'
import { createPinia } from 'pinia'
import { useUserStore } from '@/stores/user'
import PrimeVue from 'primevue/config'
import ToastService from 'primevue/toastservice'
import ConfirmService from 'primevue/confirmationservice'
import Tooltip from 'primevue/tooltip'
import Aura from '@primeuix/themes/aura'
import 'primeicons/primeicons.css'

import App from './App.vue'
import router from './router'

const app = createApp(App)

app.use(createPinia())
app.use(router)
app.use(PrimeVue, { ripple: true, theme: { preset: Aura } })
app.use(ToastService)
app.use(ConfirmService)
app.directive('tooltip', Tooltip)

app.provide(
  'isAdmin',
  computed(() => {
    if (!(useUserStore().userInfo && useUserStore().userInfo.role)) return false
    return useUserStore().userInfo.role === 'admin'
  })
)

app.provide(
  'isManager',
  computed(() => {
    if (!(useUserStore().userInfo && useUserStore().userInfo.role)) return false
    return useUserStore().userInfo.role === 'manager'
  })
)

app.provide(
  'isUser',
  computed(() => {
    if (!(useUserStore().userInfo && useUserStore().userInfo.role)) return false
    return useUserStore().userInfo.role === 'user'
  })
)

app.mount('#app')