<template>
  <div class="welcome-page">
    <el-result icon="warning" title="暂无可用功能菜单">
      <template #sub-title>
        <p v-if="yonghuid">用户ID：{{ yonghuid }}</p>
        <p v-if="roleNames.length">已绑角色：{{ roleNames.join('、') }}（角色内可能未含功能权限码）</p>
        <p v-else>该账号未绑定任何角色</p>
        <p class="hint">请超管在「后台用户」中为该用户ID绑定角色；角色内需含对应权限（考核=kaohepeizhi）</p>
      </template>
      <template #extra>
        <el-button type="primary" @click="goTry">刷新权限</el-button>
        <el-button @click="logout">退出登录</el-button>
      </template>
    </el-result>
  </div>
</template>

<script setup>
import { computed, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { ElMessage } from 'element-plus'
import request from '@/utils/request'
import {
  clearMenuAccess,
  getDefaultLandingPath,
  getMenuAccess,
  JITUAN_API,
  setMenuAccess,
} from '@/utils/club-context'

const router = useRouter()
const access = computed(() => getMenuAccess() || {})
const yonghuid = computed(() => access.value.yonghuid || '')
const roleNames = computed(() => access.value.role_names || [])

const goTry = async () => {
  try {
    const res = await request.get(JITUAN_API.menuAccess)
    if (res.code === 0 && res.data) {
      setMenuAccess(res.data)
      const landing = getDefaultLandingPath(res.data)
      if (landing) {
        ElMessage.success('权限已生效')
        router.replace(landing)
        return
      }
    }
    ElMessage.warning('仍无可用菜单，请确认角色与权限已绑定')
  } catch {
    ElMessage.error('刷新失败')
  }
}

const logout = () => {
  localStorage.removeItem('token')
  clearMenuAccess()
  router.replace('/login')
}

onMounted(() => {
  const landing = getDefaultLandingPath()
  if (landing) router.replace(landing)
})
</script>

<style scoped>
.welcome-page {
  padding: 48px 24px;
}
.hint {
  margin-top: 8px;
  color: #909399;
  font-size: 14px;
}
</style>
