2026-06-14 更新日志

本次更新搭建了后端管理系统、留言板、用户注册登录等功能模块。

---

一、后端管理系统

数据存储

• 采用 JSON 文件数据库，存储在 .data/db/ 目录
• 包含 users.json、projects.json、albums.json、moments.json 四个集合
• 提供标准 CRUD 操作函数（getAll / add / update / remove / query）

认证系统

• JWT Token 认证，7 天有效期
• bcrypt 密码加密存储
• 管理员注册/登录，普通用户注册/登录
• API 中间件：GET 公开读写，POST/PUT/DELETE 需 JWT 校验

API 端点

端点	方法	说明
/api/auth/login	POST	用户登录
/api/auth/register	POST	用户注册
/api/auth/check	GET	验证登录状态
/api/projects	CRUD	项目管理
/api/albums	CRUD	相册管理（含照片）
/api/moments	CRUD	动态管理
/api/articles/write	CRUD	文章写入（Markdown 文件）
/api/messages	CRUD	留言板
/api/init	GET	初始化种子数据

管理后台

• 独立的 /admin 路由，ssr: false 纯客户端渲染
• 仪表盘：文章/项目/相册/动态数量统计
• 文章管理：手动填写 + 拖拽 .md 文件上传两种方式，标题自动生成 slug
• 项目管理：卡片式 CRUD
• 相册管理：封面 + 照片动态添加/删除
• 动态管理：列表式 CRUD

默认账号

• 管理员：admin / admin123（访问 /api/init 初始化，密码 bcrypt 加密存储）

---

二、公开页面数据源升级

• 首页、项目页、照片墙、动态页的硬编码数据 → 改为从 API 动态获取
• API 不可用时使用 fallback 数据兜底

---

三、留言板

• 新建 /messages 页面
• 登录后可发表留言（限 1000 字符）
• 管理员可删除任意留言，普通用户可删除自己的留言
• 支持分页加载

---

四、登录状态 UI

• 右上角用户菜单组件（UserMenu.vue）
• 未登录：显示「登录」按钮
• 已登录：显示头像（首字母）+ 用户名，悬停下拉

- 管理员 → 「进入后台」「个人主页」「退出登录」

- 普通用户 → 「个人主页」「退出登录」

• 导航栏移除「注册」按钮，登录卡片右下角保留「注册账号」

---

五、安全修复

• /api/init 不再返回明文密码
• 用户密码 bcrypt 加密存储
• API 写操作强制 JWT 令牌校验

---

六、头像系统 & 个人主页

• 独立个人主页 /profile
• 用户可提交头像 URL，需管理员审核
• 头像审核页面（/admin/review），支持通过/拒绝
• 自动审核开关：开启后留言无需审核直接显示
• 审核通过后头像自动同步（/api/user/me 实时拉取）
• 支持修改密码（旧密码验证）
• 留言板、导航栏、个人主页头像自适应显示

七、仪表盘优化

• 图表切换：条形图 / SVG 折线图 / CSS 饼图
• 访客统计（今日/总访客/浏览）
• 7 天访问趋势柱状图
• 最近活动时间线
• 数据可视化切换带过渡动画

八、数据追踪系统

• server/middleware/analytics.ts 自动记录页面访问
• /api/admin/analytics 获取统计数据
• 关键操作日志：登录、创建文章、发表留言

九、安全增强

• 登录/注册验证码（服务端数学题，答案不过客户端）
• 同 IP 15 分钟内限 5 次登录/注册请求
• 用户名 2-20 字符限制
• JWT 密钥支持环境变量注入
• /api/init 初始化后拒绝重复访问

十、全部管理页分页组件

• 统一 Pagination.vue 组件
• 文章/项目/相册/动态/留言/审核 6 页均接入
• 支持页码省略号和自适应页码数量

十一、UI/UX 优化

• 用户菜单悬停展开，卡片式设计
• 登录页滑入/滑出动画
• 仪表盘三模式图表切换带动画
• 基础卡片 BaseCard 支持 class 透传
• 输入框去掉 type="url" 避免红色波浪线

十二、Nginx 配置修复

• /api/* 全部转发到 Nuxt，Django 仅处理 /admin/

十三、BUG 修复

• 首页手机端「最新动态」消失问题
• Splash 加载屏在管理/登录页面卡住问题
• 管理页面 SSR 导致 localStorage 报错（改为 ssr: false）
• useFetch 缺少 key 导致数据缓存冲突
• 管理页面刷新后一直处于加载状态
• 退出登录后加载屏卡住
• islandComponent TypeScript 类型报错
• 验证码不过期、头像不更新等细节修复