import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import Pinia from './store'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import 'element-plus/dist/index.css'
import 'element-plus/theme-chalk/dark/css-vars.css'
import 'normalize.css/normalize.css'
import '@/styles/theme.scss'
import '@/styles/element.scss'
import Breadcrumb from '@/components/Breadcrumb/index.vue'
import Pagination from '@/components/Pagination/index.vue'
import StatusText from '@/components/StatusText/index.vue'

// 注册 SVG 图标组件
import SvgIcon from '@/components/SvgIcon/index.vue'
import 'virtual:svg-icons-register'

// 按钮权限指令
import { vPermission } from '@/directives/permission'

// ⚠️ 路由守卫必须在 createApp 后、mount 前引入
import './permission'

const app = createApp(App)

// 注册所有 Element Plus 图标（Sidebar 的 icon 字段使用）
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component)
}
// 注册 SVG 图标组件
app.component('SvgIcon', SvgIcon)
// 注册面包屑组件
app.component('Breadcrumb', Breadcrumb)
// 注册分页组件
app.component('Pagination', Pagination)
// 注册状态文本组件
app.component('StatusText', StatusText)

// 注册按钮权限指令
app.directive('permission', vPermission)

app.use(Pinia).use(router)
app.mount('#app')
