本项目映记后台管理端代码仓库。基于 Vue 3 + TypeScript + Vite + Element Plus 开发,为管理员提供用户管理、内容审核、日志查询及数据统计等功能。
目前已完成以下核心模块的开发与对接:
🔐 认证与授权 (Authentication)
管理员登录采用双Token机制实现无感刷新,支持记住我功能。个人中心可查看账户信息、修改密码(邮箱验证码校验)。
📊 数据统计 (Statistics)
展示今日新增用户量和发帖量,提供近七日用户增长和帖子发布趋势折线图,以及用户地区分布饼图和帖子浏览量Top 10排行榜。
👥 用户管理 (User Management)
支持多条件实时搜索(昵称、邮箱、注册时间),展示用户详细信息包括帖子数、粉丝数、获赞数等统计数据,提供用户删除功能。
📝 内容审核 (Content Audit)
核心审核功能包括:按状态Tab分类查看(全部/待审核/已通过/已拒绝)、实时搜索筛选、单个帖子详情预览及审核操作(通过/拒绝/撤回)、查看审核历史记录。支持批量操作(批量通过/拒绝并填写统一原因)和AI智能审核(单个或批量),AI会提供审核建议供管理员选择性采纳。
📋 操作日志 (Operation Logs)
自动记录管理员的关键操作(用户删除、帖子审核等),支持按操作人、关键词、对象ID、状态、时间范围等多条件筛选,提供实时搜索和Excel批量导出功能。
确保您的本地环境已安装:
# 进入项目目录
cd 管理端
# 安装依赖
pnpm install
本项目支持 Mock 模式(前端独立开发)和 API 对接模式(连接本地/远程后端)。
无需启动后端服务,使用本地 Mock 数据。
pnpm run dev
连接真实后端接口。默认连接远程服务器,也可修改 .env.pro 连接本地。
启动命令:
pnpm run dev:pro
启动成功后访问: http://localhost:4000 (默认端口)
pnpm run build:pro
src/
├── api/ # 后端接口定义 (Axios)
│ ├── content/ # 内容审核模块 (帖子审核、AI审核)
│ ├── log/ # 日志管理模块
│ ├── login/ # 登录认证模块
│ ├── profile/ # 个人中心模块
│ ├── stats/ # 数据统计接口
│ └── user/ # 用户管理模块
├── assets/ # 静态资源 (图片/图标)
├── axios/ # Axios封装 (拦截器、配置)
├── components/ # 全局通用组件
├── layout/ # 页面布局 (侧边栏、顶栏)
├── router/ # 路由配置
├── store/ # Pinia 状态管理
├── utils/ # 工具函数 (日期格式化、权限等)
└── views/ # 页面视图
├── Authorization/ # 用户管理
│ └── User/ # 用户列表、详情
├── Content/ # 内容审核
│ └── Audit.vue # 审核列表、详情、批量操作
├── Log/ # 日志管理
│ └── AdminLog.vue # 操作日志列表、导出
├── Login/ # 登录页面
│ ├── Login.vue # 登录表单
│ └── components/ # 登录、注册、找回密码组件
├── Personal/ # 个人中心
│ ├── PersonalCenter.vue # 个人信息
│ └── ChangePassword/ # 修改密码
└── Statistics/ # 数据统计
├── Index.vue # 统计仪表盘
├── echarts-data.ts # 图表配置
└── components/ # PanelGroup等组件
mock/ # Mock 数据 (开发模式)
├── content/ # 内容审核 Mock
├── log/ # 日志 Mock
├── user/ # 用户 Mock
└── ...
.env.pro 中的 VITE_API_URL 需配置为后端服务地址