laobinghu
ce208df092
核心功能: - 项目初始化 (Nuxt 4 + Nuxt UI + Pinia + ofetch) - TypeScript 类型定义 (User, Article, Comment, API 响应) - 认证系统 (登录/登出、Cookie 支持、权限中间件) - 文章列表页 (筛选、分页、响应式布局) - 文章详情页 (Markdown 渲染、评论系统) - 文章编辑器 (左右分栏、实时预览、Markdown 工具栏) 管理后台: - 侧边栏布局、权限检查 - 数据分析 (数据统计卡片、热门文章、评论审核统计) - 文章管理 (表格、筛选、删除) - 评论管理 (审核通过/拒绝、删除) - 用户管理 (角色管理、删除) 全局组件: - 导航栏 (暗色模式切换、移动端菜单) - 页脚 - 403/404 错误页 配置文件: - .env.example 环境变量模板 - nuxt.config.ts 完整配置 - 自定义 CSS 样式
72 lines
2.3 KiB
Vue
72 lines
2.3 KiB
Vue
<template>
|
|
<div class="min-h-screen bg-gray-50 dark:bg-gray-900">
|
|
<div class="flex">
|
|
<aside
|
|
class="fixed left-0 top-0 h-full w-64 bg-white dark:bg-gray-800 border-r border-gray-200 dark:border-gray-700"
|
|
>
|
|
<nav class="p-4 space-y-2">
|
|
<UButton
|
|
to="/admin/dashboard"
|
|
variant="ghost"
|
|
class="w-full justify-start"
|
|
:active="$route.path.startsWith('/admin/dashboard')"
|
|
>
|
|
<UIcon name="i-heroicons-chart-bar" class="w-5 h-5 mr-3" />
|
|
数据分析
|
|
</UButton>
|
|
<UButton
|
|
to="/admin/articles"
|
|
variant="ghost"
|
|
class="w-full justify-start"
|
|
:active="$route.path.startsWith('/admin/articles')"
|
|
>
|
|
<UIcon name="i-heroicons-document-text" class="w-5 h-5 mr-3" />
|
|
文章管理
|
|
</UButton>
|
|
<UButton
|
|
to="/admin/comments"
|
|
variant="ghost"
|
|
class="w-full justify-start"
|
|
:active="$route.path.startsWith('/admin/comments')"
|
|
>
|
|
<UIcon name="i-heroicons-chat-bubble-left-right" class="w-5 h-5 mr-3" />
|
|
评论管理
|
|
</UButton>
|
|
<UButton
|
|
to="/admin/users"
|
|
variant="ghost"
|
|
class="w-full justify-start"
|
|
:active="$route.path.startsWith('/admin/users')"
|
|
>
|
|
<UIcon name="i-heroicons-users" class="w-5 h-5 mr-3" />
|
|
用户管理
|
|
</UButton>
|
|
</nav>
|
|
</aside>
|
|
|
|
<div class="flex-1 ml-64">
|
|
<header
|
|
class="bg-white dark:bg-gray-800 border-b border-gray-200 dark:border-gray-700 px-6 py-4"
|
|
>
|
|
<div class="flex items-center justify-between">
|
|
<h1 class="text-xl font-semibold text-gray-900 dark:text-white">
|
|
管理后台
|
|
</h1>
|
|
<div class="flex items-center space-x-4">
|
|
<UButton to="/" variant="ghost" size="sm">
|
|
<UIcon name="i-heroicons-arrow-left" class="w-4 h-4 mr-2" />
|
|
返回首页
|
|
</UButton>
|
|
<UserMenu />
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="p-6">
|
|
<slot />
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|