<template>
  <ElConfigProvider size="default" :locale="locales[language]" :z-index="3000">
    <RouterView></RouterView>
  </ElConfigProvider>
</template>

<script setup lang="ts">
  import { useUserStore } from './store/modules/user'
  import zh from 'element-plus/es/locale/lang/zh-cn'
  import en from 'element-plus/es/locale/lang/en'
  import { systemUpgrade } from '@/utils'
  import { AuthService } from '@/api/modules'
  import { ApiStatus } from './utils/http/status'
  import { setThemeTransitionClass } from '@/utils'
  import { checkStorageCompatibility } from '@/utils'

  const userStore = useUserStore()
  const { language } = storeToRefs(userStore)

  const locales = {
    zh: zh,
    en: en
  }

  onBeforeMount(() => {
    setThemeTransitionClass(true)
  })

  onMounted(() => {
    // 检查存储兼容性
    checkStorageCompatibility()
    // 提升暗黑主题下页面刷新视觉体验
    setThemeTransitionClass(false)
    // 系统升级
    systemUpgrade()
    // 获取用户信息
    getUserInfo()
  })

  // 获取用户信息
  const getUserInfo = async () => {
    if (userStore.isLogin && userStore.accessToken) {
      try {
        const res = await AuthService.getUserInfo()
        if (res.code === ApiStatus.success && res.data) {
          // API 返回的是 { user, permissions }，我们需要保存 user 和 permissions
          userStore.setUserInfo(res.data.user)
          userStore.setPermissions(res.data.permissions || [])
        }
      } catch (error) {
        console.error('获取用户信息失败:', error)
      }
    }
  }
</script>
