功能文档汇总

# 1-个人博客系统 - 功能说明

# 项目概述

个人博客系统是一个功能完善的内容管理平台，集文章发布、分类管理、标签系统、评论互动于一体的综合性Web应用系统。采用前后端分离架构，基于Django和Vue 3技术栈，为博主提供专业的内容创作与管理解决方案。

# 项目概览

# ✨ 创新点

# 1. 模块化独立App架构

  • 独立应用设计：每个功能模块独立为Django App，职责清晰。
  • 松耦合架构：模块间通过逻辑外键关联，避免物理外键约束。
  • 易于扩展：新增功能只需创建新App，不影响现有模块。

# 2. 自定义JWT认证体系

  • 无状态认证：基于Token的认证机制，不依赖Session。
  • 灵活配置：Token有效期可通过环境变量配置（默认7天）。
  • 装饰器权限控制：@login_required_api、@admin_required_api简化权限验证。

# 3. 智能代码生成器

  • 一键生成CRUD：自动生成models、serializers、views、urls完整代码。
  • 多字段类型支持：支持string、int、decimal、date、json等多种字段类型。
  • 自动化部署：自动注册到settings.py和主urls.py，自动执行数据库迁移。

# 4. 富文本内容编辑

  • 双编辑器支持：集成WangEditor和V-md-editor，支持富文本和Markdown。
  • 图片上传：支持图片插入、拖拽上传、实时预览。
  • 代码高亮：集成highlight.js，支持多语言代码高亮显示。

# 5. 完善的工具函数库

  • 50+工具函数：密码加密、数据验证、格式化、随机生成等。
  • 日志系统：按类型分文件记录，自动轮转，支持API请求日志。
  • 环境变量管理：使用python-dotenv，支持多环境配置切换。

# ✨ 项目亮点

# 一、 业务功能亮点

  1. 完整的内容管理系统：文章、分类、标签、评论全流程管理。
  2. 灵活的文章状态控制：草稿、已发布、已下架三种状态，支持置顶。
  3. 多维度文章组织：分类+标签双重组织方式，便于内容归档。
  4. 评论互动系统：支持父子评论，记录IP地址，状态管理。

# 二、 技术实现亮点

  1. 现代化前端技术栈：采用 Vue 3.4.29 + Vite 5.3.1 + Element Plus 2.8.4 + Pinia 2.2.2，高效开发。
  2. 稳定可靠的后端架构：基于 Django 3.2.23 + DRF 3.14.0，配合自定义JWT认证。
  3. 完善的数据库设计：6张核心表，逻辑外键设计，自动时间戳，文章数量自动统计。
  4. 丰富的第三方集成：WangEditor（富文本）、V-md-editor（Markdown）、ECharts（图表）、Axios（HTTP）。
  5. 安全性设计：密码哈希存储、Token认证、装饰器权限拦截、防止删除自己的管理员账号。

# 三、 用户体验亮点

  1. 双界面设计：前台展示界面简洁直观，后台管理界面功能完善。
  2. 响应式布局：基于Element Plus栅格系统，适配多种屏幕尺寸。
  3. 交互优化：
    • 友好的加载提示和错误提示。
    • 重要操作的确认弹窗。
    • 及时的全局消息提示。
    • 严谨的前后端表单验证。
  4. 文件上传体验：支持图片预览、拖拽上传、大文件上传（最大100MB）。

# 管理员

# 系统管理

管理员管理：管理全部管理员账号，支持新增、编辑、删除、启用/禁用操作

普通用户管理：管理全部用户账号，可修改用户信息、状态，支持重置密码

# 内容管理

文章管理：管理全部文章，支持新增、编辑、删除、发布/下架、置顶操作，可查看文章详情、浏览量统计

分类管理：管理文章分类，支持新增、编辑、删除、排序，自动统计分类下的文章数量

标签管理：管理文章标签，支持新增、编辑、删除，可设置标签颜色，自动统计标签下的文章数量

评论管理：管理全部评论，可查看评论详情、删除不当评论、启用/禁用评论

# 普通用户

# 内容浏览

首页：浏览全部已发布文章，可按分类、标签筛选，可搜索文章

文章详情：查看文章完整内容，查看文章分类和标签，查看评论列表

# 互动功能

发表评论：对文章发表评论，支持回复其他用户的评论（需登录）

# 个人中心

个人信息：修改个人信息（昵称、头像、邮箱、电话）

修改密码：修改登录密码

# 功能权限对照表

功能模块 管理员 普通用户
首页 ✓ ✓
管理员管理 ✓ -
普通用户管理 ✓ -
文章管理 ✓ -
分类管理 ✓ -
标签管理 ✓ -
评论管理 ✓ -
文章浏览 ✓ ✓
发表评论 ✓ ✓(需登录)
个人信息管理 ✓ ✓

# 文章状态说明

# 文章状态

  • 草稿：文章已创建，未发布，仅管理员可见
  • 已发布：文章已发布，所有用户可见
  • 已下架：文章已下架，仅管理员可见

# 评论状态

  • 启用：评论正常显示
  • 禁用：评论被隐藏，不显示在前台

# 默认账号

# 管理员

用户名: admin
密码: admin123
类型: ADMIN
1
2
3

# 测试用户

用户名: user
密码: user123
类型: USER
1
2
3

# 核心业务流程

# 用户注册流程

1. 填写注册信息(用户名、密码、昵称、邮箱)
2. 系统创建用户账号(类型:USER、状态:启用)
3. 跳转到登录页
1
2
3

# 文章发布流程

1. 管理员进入文章管理 → 点击"新增文章"
2. 填写文章信息(标题、摘要、内容、封面)
3. 选择分类和标签
4. 设置文章状态(草稿/已发布)、是否置顶、是否允许评论
5. 提交保存
6. 系统创建文章记录，创建文章-标签关联记录
7. 更新分类和标签的文章数量统计
8. 已发布的文章在前台展示
1
2
3
4
5
6
7
8

# 评论发表流程

1. 用户浏览文章详情 → 点击"发表评论"
2. 填写评论内容
3. 提交评论(记录用户ID、文章ID、IP地址)
4. 评论显示在文章下方
5. 其他用户可回复该评论(parent_id指向父评论)
1
2
3
4
5

# 文章删除流程

1. 管理员选择要删除的文章
2. 系统收集受影响的分类ID和标签ID
3. 删除文章-标签关联记录
4. 删除文章相关的评论记录
5. 删除文章记录
6. 更新受影响分类和标签的文章数量
1
2
3
4
5
6

# 技术说明

# 系统架构

  • 前端：Vue 3.4.29 + Element Plus 2.8.4 + Vite 5.3.1
  • 后端：Django 3.2.23 + Django REST Framework 3.14.0
  • 数据库：SQLite（开发）/ MySQL / PostgreSQL（生产）
  • 认证：自定义JWT Token

# 访问地址

  • 后端API：http://localhost:8000
  • 前端页面：http://localhost:5173（开发环境）

# 数据库

  • 数据库名：db.sqlite3（开发环境）
  • 字符集：utf8mb4
  • 总表数：6张表（user、article、category、tag、article_tag、comment）

# API接口规范

RESTful风格：
GET    /module/page          # 分页查询
POST   /module/add           # 新增
PUT    /module/update        # 更新
DELETE /module/delBatch      # 批量删除

响应格式：
{
    "code": 200,
    "msg": "success",
    "data": {...}
}
1
2
3
4
5
6
7
8
9
10
11
12

# 系统特色

# 富文本编辑

  • 组件：WangEditor 5.1.x、V-md-editor 2.3.18
  • 应用：文章内容编辑、评论内容编辑
  • 功能：支持文本格式化、图片插入、链接插入、列表、对齐、Markdown语法

# 数据可视化

  • 组件：ECharts 5.5.1
  • 图表：文章分类统计（饼图）、文章发布趋势（折线图）
  • 位置：管理后台首页

# 文件上传

  • 单文件限制：100MB
  • 支持格式：.jpg、.jpeg、.png、.gif
  • 存储方式：按日期创建子目录（YYYYMMDD）
  • 访问格式：http://localhost:8000/file/{日期}/{UUID}.{扩展名}

# 工具函数库

  • 密码处理：hash_password、verify_password、md5_hash
  • 数据验证：is_valid_email、is_valid_phone、is_valid_id_card
  • 格式化：format_file_size、format_datetime、format_number
  • 随机生成：generate_random_string、generate_order_no、generate_uuid
  • 请求处理：get_client_ip、build_query_params、parse_query_string
Java导航网   |