<template>
  <div style="width: 100vw; height: 100vh;">
    <div v-if="!isLoggedIn">
      <LoginModule @login-success="handleLoginSuccess" />
    </div>
    <router-view v-else />
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import { message } from 'ant-design-vue'
import LoginModule from './components/LoginModule.vue'
import { initUserPermissionsAfterLogin } from './utils/permission.js'
import { clearUserPermissions } from './utils/permission.js'

const isLoggedIn = ref(false)

// 处理登录成功
const handleLoginSuccess = async () => {
  console.log('===== 处理登录成功事件 =====')
  checkLoginStatus()
  
  try {
    console.log('开始初始化用户权限...')
    await initUserPermissionsAfterLogin()
    message.success('登录成功！')
  } catch (error) {
    console.error('❌ 权限初始化失败:', error)
    message.warning('权限加载异常，请检查权限配置')
  }
}

// 检查登录状态
const checkLoginStatus = () => {
  const token = localStorage.getItem('token')
  const userInfoStr = localStorage.getItem('userInfo')
  const isLoggedInStr = localStorage.getItem('isLoggedIn')
  
  if (token && userInfoStr && isLoggedInStr === 'true') {
    isLoggedIn.value = true
  } else {
    isLoggedIn.value = false
  }
}

// 监听登录状态变化
onMounted(() => {
  console.log('===== App 组件挂载，开始初始化 =====')
  checkLoginStatus()
})
</script>

<style scoped>
</style>
