101 lines
2.9 KiB
Vue
101 lines
2.9 KiB
Vue
<script lang="ts" setup>
|
|
const router = useRouter()
|
|
const loginState = useLoginState()
|
|
|
|
// 检查用户权限
|
|
if (loginState.user.auth_code !== 2) {
|
|
throw createError({
|
|
statusCode: 403,
|
|
statusMessage: '无权访问管理页面',
|
|
})
|
|
}
|
|
|
|
useHead({
|
|
title: '管理中心',
|
|
})
|
|
|
|
const adminPages = [
|
|
{
|
|
title: '用户管理',
|
|
description: '管理系统用户、权限和服务配额',
|
|
icon: 'i-tabler-users',
|
|
path: '/generation/admin/users',
|
|
color: 'blue',
|
|
},
|
|
{
|
|
title: '数字人定制管理',
|
|
description: '管理用户提交的数字人定制请求',
|
|
icon: 'i-tabler-user-cog',
|
|
path: '/generation/admin/digital-human-train',
|
|
color: 'amber',
|
|
},
|
|
]
|
|
|
|
const navigateToPage = (path: string) => {
|
|
router.push(path)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div>
|
|
<div class="p-4 pb-0">
|
|
<BubbleTitle
|
|
title="管理中心"
|
|
subtitle="Administrator Panel"
|
|
/>
|
|
<GradientDivider />
|
|
</div>
|
|
|
|
<div class="p-4">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
<div
|
|
v-for="page in adminPages"
|
|
:key="page.path"
|
|
class="group cursor-pointer"
|
|
@click="navigateToPage(page.path)"
|
|
>
|
|
<UCard
|
|
class="hover:shadow-lg transition-all duration-200 group-hover:scale-105"
|
|
:ui="{
|
|
ring: 'ring-1 ring-gray-200 dark:ring-gray-700 group-hover:ring-gray-300 dark:group-hover:ring-gray-600',
|
|
}"
|
|
>
|
|
<div class="flex flex-col items-center text-center p-6">
|
|
<div
|
|
class="w-16 h-16 rounded-full flex items-center justify-center mb-4 transition-colors"
|
|
:class="{
|
|
'bg-blue-100 dark:bg-blue-900/30': page.color === 'blue',
|
|
'bg-amber-100 dark:bg-amber-900/30': page.color === 'amber',
|
|
}"
|
|
>
|
|
<UIcon
|
|
:name="page.icon"
|
|
class="w-8 h-8"
|
|
:class="{
|
|
'text-blue-600 dark:text-blue-400': page.color === 'blue',
|
|
'text-amber-600 dark:text-amber-400': page.color === 'amber',
|
|
}"
|
|
/>
|
|
</div>
|
|
|
|
<h3 class="text-lg font-semibold text-gray-900 dark:text-white mb-2">
|
|
{{ page.title }}
|
|
</h3>
|
|
|
|
<p class="text-sm text-gray-600 dark:text-gray-400 leading-relaxed">
|
|
{{ page.description }}
|
|
</p>
|
|
|
|
<div class="mt-4 flex items-center text-sm text-gray-500 dark:text-gray-400 group-hover:text-gray-700 dark:group-hover:text-gray-300 transition-colors">
|
|
<span>进入管理</span>
|
|
<UIcon name="i-heroicons-arrow-right" class="ml-1 w-4 h-4" />
|
|
</div>
|
|
</div>
|
|
</UCard>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped></style> |