# 5-在线旅游系统 - 功能说明

# 项目概述

本系统是一个基于 Django 3.2 + Vue 3 前后端分离架构的在线旅游推荐与服务平台，面向「管理员（ADMIN）」与「普通用户（USER）」两类角色，分别提供后台管理端与前台用户端两套界面。系统核心功能围绕旅游业务全链路展开：景点分类与旅游景点管理、景点收藏、景点购票订单与订单评价、旅游路线与旅游商品管理、游记内容社区（游记发布、浏览、点赞、评论）、系统公告与轮播图运营，以及后台首页的多维数据统计图表。技术上，后端采用 Django 3.2 + Django REST Framework 3.14 构建 RESTful 接口，通过自研 JWT（PyJWT，HS256）中间件完成登录鉴权与角色识别，MySQL 8.0 存储数据（库名 d_5_travel_system，字符集 utf8mb4）；前端采用 Vue 3.4.29 + Element Plus 2.8.4 + Vite 5.3.1，使用 Vue Router 4 管理路由、Axios 封装统一请求、ECharts 5 绘制统计图表、wangEditor 5 实现富文本编辑，架构上按功能模块拆分为多个独立 Django App，前后端通过统一响应格式的 HTTP 接口通信。

# 项目概览

# ✨ 创新点

# 1. 全模块化的 Django App 架构

要点：project/apps/ 下按业务域拆分为 15 个独立 App（user、admin、category、scenic_spot、scenic_collect、ticket_order、order_review、travel_route、travel_product、travel_note、note_comment、note_like、notice、banner、pet），每个 App 自带 models.py / views.py / urls.py / XxxSerializer.py，职责单一、便于扩展。
要点：每个 App 的 urls.py 统一暴露 page（分页）、list（不分页）、add、update、delete、delBatch、detail 七类标准接口，前端 views/admin/*.vue 页面与之一一对应，形成可复用的 CRUD 脚手架。
要点：模型类全部声明 managed = False，表结构由 sql/d_5_travel_system.sql 脚本维护，Django 只做映射，避免迁移与手工建表冲突。

# 2. 自定义 JWT 认证与令牌拦截中间件

要点：utils/jwt_auth.py 基于 PyJWT 实现 create_token 与 get_payload，使用 settings 的 SECRET_KEY 作为密钥、算法 HS256，Payload 中携带 id、username、type（ADMIN / USER）三个字段，默认超时时间为 60*24*30 分钟。
要点：middleware/TokenInterceptorMiddleware.py 统一拦截请求，从请求头 token（HTTP_TOKEN）解析令牌，通过后把 id、username、type 注入 request，并维护登录/注册/找回密码、/category/list、/uploads/、/static/、/swagger/、/django-admin/ 等白名单；未携带或校验失败统一返回 code=401 提示「访问接口未授权，请重新登录」。
要点：前端 src/utils/http.js 的 Axios 请求拦截器自动附加 token 请求头，响应拦截器统一处理 200/401/409/500，遇到 401 自动清理本地令牌并跳转登录页。

# 3. 面向用户的旅游内容推荐与社区互动

要点：前台首页（views/front/Index.vue）聚合展示轮播图（GET /banner/list）、推荐景点（GET /scenic_spot/page）、热门路线（GET /travel_route/page）、最新游记（GET /travel_note/page）四个内容区块，构成「一站式」旅游推荐入口。
要点：景点、旅游路线、游记均提供前台列表页（含名称类搜索项）与独立详情页，详情页渲染后台维护的富文本介绍、行程安排与游记正文。
要点：游记支持点赞与评论互动，note_like / note_comment 模块提供 check（是否已点赞）与 cancel（取消点赞）接口，实现「已点赞/未点赞」状态的精确回显与去重。

# 4. 购票订单的状态流转与一键确认

要点：前台景点详情页「立即购票」弹窗填写购票数量、游玩日期、联系人、联系电话，前端按「门票单价 × 数量」实时计算总价并生成订单，初始状态写入 待支付。
要点：后台「购票订单」页面提供 待确认 / 已确认 / 已完成 / 已取消 四种状态选项，列表中对状态为 待确认 的订单显示「确认」按钮，一键调用 PUT /ticket_order/update 将状态扭转为 已确认。
要点：ticket_order 表的 status 为 varchar 字段，直接存储中文状态描述，配合 GET /common/statistics 的 order_status_stats 分组统计，驱动后台首页「订单状态分布」饼图。

# 5. 多维度后台数据统计看板

要点：apps/common/views.py 的 StatisticsAPIView 一次性汇总用户总数、管理员总数、景点总数、订单总数、游记总数、分类总数，并按 status 分组统计订单、按分类遍历统计景点数量。
要点：后台首页 views/admin/Home.vue 用四张统计卡片 + 两个 ECharts 图表（订单状态分布饼图、景点分类分布柱状图）呈现数据，组件卸载时自动 dispose() 释放图表实例。

# ✨ 项目亮点

# 一、业务功能亮点

景点业务全链路闭环：从「景点分类」建立分类体系 →「旅游景点」维护名称、封面、图片、地区、地址、门票价格、开放时间、推荐等级、浏览量 →「景点收藏」记录用户收藏 →「购票订单」下单购票 →「订单评价」沉淀评分与评价，模块之间通过 ID 逻辑关联形成完整业务链。
游记内容社区：后台维护游记（标题、封面、富文本内容、旅游地点、旅游日期），前台「游记广场」列表检索、详情阅读，并支持点赞/取消点赞与发表评论，点赞与评论均按当前登录用户维度记录。
旅游路线与旅游商品运营：旅游路线支持维护行程天数、目的地、参考价格、路线介绍与逐日行程安排；旅游商品支持维护商品图片、价格、库存数量与商品描述，丰富平台可售内容。
平台运营与账号治理：系统公告、首页轮播图支撑运营内容展示；管理员管理与用户管理支持按用户名/手机号检索、新增、编辑、删除与「重置密码」，重置后密码统一恢复为 123456。

# 二、技术实现亮点

现代化前端技术栈：采用 Vue 3.4.29（Composition API + <script setup>）、Element Plus 2.8.4、Vite 5.3.1、Vue Router 4.4.3、Pinia 2.2.2、Axios 1.7.5、ECharts 5.5.1、wangEditor（@wangeditor/editor 5.1.14 / @wangeditor/editor-for-vue 5.1.12）、@wocwin/t-ui-plus 1.4.13，并引入 dayjs、lodash、swiper、highlight.js、crypto-js、sm-crypto 等工具库。
稳定可靠的后端架构：Django ~=3.2（工程由 Django 3.2.20 生成） + Django REST Framework ~=3.14.0，接口统一使用 DRF 的 APIView 实现，配合 PyJWT ~=2.7.0 做鉴权、drf-yasg 1.21.7 生成 Swagger 接口文档、django-cors-headers 4.2.0 处理跨域（CORS_ORIGIN_ALLOW_ALL = True，允许携带 token 请求头），数据库驱动使用 PyMySQL 1.1.0 / mysqlclient 2.1.1。
完善的数据库设计：15 张核心业务表，全部使用逻辑外键（如 scenic_spot.category_id、ticket_order.scenic_spot_id、note_like.travel_note_id 仅存 ID，不建物理外键约束），主键统一 bigint 自增且 COMMENT 为「ID」，金额字段使用 decimal(10,2)，计数字段使用 int，状态字段使用 varchar 存储中文描述；表统一 utf8mb4 / utf8mb4_unicode_ci。
丰富的第三方集成：PyJWT 提供无状态令牌认证，drf-yasg 提供 Swagger 可视化文档，ECharts 提供统计可视化，wangEditor 提供富文本编辑，Element Plus + @element-plus/icons-vue 提供全量 UI 组件与图标；utils/DateUtil.py、utils/current_user.py、apps/common/ResponseMessage.py 等工具类统一封装日期、当前用户与响应格式。
安全性设计：登录令牌采用 HS256 签名且默认 30 天有效期；中间件对非白名单接口强制校验令牌；UpdateCurrentUserAPIView、UpdatePasswordAPIView 校验 user_id != request.id 时返回「无权修改其他用户信息 / 密码」；ResetPasswordAPIView 校验当前用户类型必须为 ADMIN，否则返回「无权执行此操作」；模型保存通过 apps/common/signals.py 的 pre_save 信号统一自动填充创建时间。

# 三、用户体验亮点

双界面设计：后台管理端（views/layout/AdminLayout.vue，左侧 6 组折叠菜单 + 顶栏用户信息与退出）与前台用户端（views/layout/FrontLayout.vue，顶部横向导航：首页 / 景点推荐 / 旅游路线 / 游记广场 / 个人中心）完全分离，登录时选择「管理员 / 用户」类型自动跳转到对应端。
响应式布局：前台布局使用 Element Plus 栅格（el-row / el-col）与媒体查询（@media (max-width: 768px) 隐藏用户名文字与菜单文本、搜索框自适应宽度），个人中心采用 :xs/:sm/:md 断点列宽适配移动端。
交互优化：
- 友好的加载提示和错误提示：Axios 响应拦截器按 code 分类提示（401 提示重新登录、500/409 提示具体 msg），网络异常提示「网络连接失败，请检查网络」。
- 重要操作的确认弹窗：后台各管理页面的删除操作使用 ElMessageBox 二次确认，取消时提示「已取消删除」并清空表格勾选。
- 及时的全局消息提示：新增/编辑/删除/收藏/点赞/评论等操作成功后统一使用 ElMessage 成功提示。
- 严谨的前后端表单验证：前端 el-form 的 :rules 对必填项、日期、手机号等做校验（触发器 blur / change），后端序列化器统一 fields = "__all__" 并声明 read_only_fields = ['id', 'create_time']。
文件上传体验：封装 components/MyUpload.vue 组件，支持图片卡片/图片/视频/音频/附件多种类型、多文件列表回显、点击预览（图片弹窗、视频/音频播放器、附件直接下载）；limit === 1 时再次选择文件自动替换原文件，超出数量时提示「最多只允许上传 N 张图片」；上传自动携带令牌请求头。

# 管理员（ADMIN）

# 首页与数据统计

数据统计首页：查看用户总数、景点总数、订单总数、游记总数四张统计卡片，以及「订单状态分布」饼图、「景点分类分布」柱状图，数据来自 GET /common/statistics。

# 用户管理

管理员管理：按用户名、手机号检索账号列表（GET /admin/page），支持表格行内查看（ID、用户名、昵称、手机号、邮箱），新增（POST /admin/add）、编辑（PUT /admin/update）、删除（DELETE /admin/delete，支持批量勾选删除）与重置密码（POST /common/resetPassword?id=&type=ADMIN，重置为 123456）；新增账号时可上传头像，未填写密码时后端默认写入 123456。 用户管理：按用户名、手机号检索用户列表（GET /user/page），支持新增（POST /user/add）、编辑（PUT /user/update）、删除（POST /user/delete）与重置密码（type=USER）。

# 景点管理

景点分类：分页查询分类（GET /category/page）并按分类名称搜索，维护分类名称与分类描述，支持新增、编辑、批量删除。 旅游景点：分页查询景点（GET /scenic_spot/page）并按景点名称搜索；列表连表展示分类名称，并对封面图提供 preview-teleported 预览；新增/编辑景点名称、分类 ID、封面（MyUpload，限 1 张）、景点图片（MyUpload，最多 9 张）、所在地区、详细地址、门票价格、开放时间、景点介绍（MyEditor 富文本）、推荐等级、浏览量；支持批量删除。 景点收藏：分页查看全部收藏记录（GET /scenic_collect/page，连表展示用户与景点名称、收藏时间），可新增、编辑、批量删除收藏记录。

# 订单管理

购票订单：按联系人、订单状态筛选订单（GET /ticket_order/page，连表展示景点名称与用户名），查看数量、总价、游玩日期、联系人、电话、状态与创建时间；支持新增（POST /ticket_order/add）、编辑（PUT /ticket_order/update）、删除（DELETE /ticket_order/delBatch）；对状态为「待确认」的订单提供「确认」按钮，一键扭转为「已确认」。 订单评价：分页查看评价列表（GET /order_review/page，连表展示用户与景点名称），查看评分、评价内容、评价时间，支持新增、编辑、批量删除。

# 旅游管理

旅游路线：分页查询路线（GET /travel_route/page）并按路线名称搜索，维护路线名称、封面图片、行程天数、目的地、参考价格、路线介绍、行程安排、浏览量，支持新增、编辑、批量删除。 旅游商品：分页查询商品（GET /travel_product/page）并按商品名称搜索，维护商品名称、商品图片、商品价格、库存数量、商品描述，支持新增、编辑、批量删除。

# 游记管理

游记管理：分页查询游记（GET /travel_note/page）并按标题搜索，维护所属用户 ID、游记标题、封面、游记内容（MyEditor 富文本）、旅游地点、旅游日期、浏览量，列表连表展示用户名，支持新增、编辑、批量删除。 游记评论：分页查看评论列表（GET /note_comment/page，连表展示游记标题与用户名），查看评论内容与评论时间，支持新增、编辑、批量删除。 游记点赞：分页查看点赞记录（GET /note_like/page，连表展示游记标题与用户名），查看点赞时间，支持新增、编辑、批量删除。

# 系统管理

系统公告：分页查询公告（GET /notice/page）并按公告标题搜索，维护公告标题与公告内容，支持新增、编辑、批量删除。 轮播图：分页查询轮播图（GET /banner/page）并按标题搜索，维护标题与图片地址，支持新增、编辑、批量删除。

# 个人中心

个人信息：查看并修改自己的头像、邮箱、电话（POST /common/updateCurrentUser，后端校验只能修改本人信息）。 修改密码：输入旧密码与新密码完成修改（POST /common/updatePassword，后端校验原密码正确性），成功后清空本地登录状态并跳转登录页。

# 普通用户（USER）

# 首页

首页推荐：首页顶部轮播图（GET /banner/list 取前 5 条），以及「推荐景点」「热门路线」「最新游记」三个内容区块（各取分页接口首页数据），点击卡片跳转对应详情页。

# 景点

景点推荐：检索景点列表（GET /scenic_spot/page，支持分页），前端提供「景点名称」与「所在地区」两个搜索项（后端分页接口实际按 name 做包含匹配，location 参数未参与后端过滤），卡片展示封面、地区、简介、门票价格与推荐等级。 景点详情：查看景点名称、所在地区、详细地址、门票价格、开放时间、推荐等级、浏览量、景点介绍（富文本渲染）与封面大图预览。 景点购票：在详情页点击「立即购票」，填写购票数量（1—10 张）、游玩日期、联系人、联系电话，实时计算总价并提交订单（POST /ticket_order/add，初始状态 待支付）。 景点收藏：一键收藏景点（POST /scenic_collect/add，已收藏时后端提示「已经收藏过该景点」），再次点击取消收藏（DELETE /scenic_collect/cancel），进入详情页时通过 GET /scenic_collect/check 回显收藏状态。

# 旅游路线

路线列表：检索旅游路线（GET /travel_route/page，前端提供「路线名称」「目的地」搜索项，后端实际按 name 包含匹配），卡片展示封面、行程天数（N 天 N-1 晚）、目的地、参考价格与浏览量。 路线详情：查看目的地、行程天数、参考价格、浏览量、路线介绍与行程安排（富文本渲染），并支持封面大图预览。

# 游记广场

游记列表：检索游记（GET /travel_note/page，前端提供「游记标题」「旅游地点」搜索项，后端实际按 title 包含匹配），卡片展示封面、标题、作者、地点、浏览量。 游记详情：查看游记标题、作者、发布时间、浏览量、旅游地点、旅游日期与游记正文（富文本渲染）。 游记点赞：点击「点赞」发表点赞（POST /note_like/add，已点赞提示「已经点赞过该游记」），再次点击「已点赞」取消（DELETE /note_like/cancel），进入详情页时通过 GET /note_like/check 回显状态。 游记评论：在评论区输入内容后发表评论（POST /note_comment/add，空内容前端提示「请输入评论内容」），评论区列表展示评论人与评论时间。

# 个人中心

个人信息：查看用户名、昵称、邮箱、联系方式，并可跳转编辑信息页修改头像、邮箱、电话（POST /common/updateCurrentUser）。 修改密码：通过旧密码校验后修改登录密码（POST /common/updatePassword）。

# 账号入口

注册账号：注册页可上传头像、选择用户类型（管理员/用户）、填写用户名、密码、昵称完成注册（PUT /common/register，用户名重复时提示「用户名重复」）。 找回密码：选择类型、输入手机号、验证码与新密码重置密码（POST /common/retrievePassword，按手机号匹配账号，未注册提示「该手机号未注册」）。

# 功能权限对照表

功能模块	管理员（ADMIN）	普通用户（USER）
数据统计首页	✓	-
管理员管理	✓	-
用户管理	✓	-
景点分类	✓	-
旅游景点	✓（维护全部）	✓（前台浏览、搜索、查看详情）
景点收藏	✓（查看/维护全部记录）	✓（仅自己的：收藏、取消、状态查询）
购票订单	✓（查看、维护、确认订单）	✓（下单购票）
订单评价	✓	-
旅游路线	✓（维护全部）	✓（前台浏览、查看详情）
旅游商品	✓	-
游记管理	✓（维护全部）	✓（前台浏览、查看详情）
游记评论	✓（维护全部）	✓（仅自己的：发表评论）
游记点赞	✓（维护全部）	✓（仅自己的：点赞、取消点赞）
系统公告	✓	-
轮播图	✓	✓（前台首页展示）
个人信息 / 修改密码	✓	✓
文件上传	✓	✓

# 订单状态说明

ticket_order.status（varchar(20)，中文状态描述）在代码中出现的取值如下：

待支付：前台景点详情页「立即购票」提交订单时写入的初始状态（views/front/ScenicDetail.vue 的 submitOrder 中 status: '待支付'）。
待确认：后台「购票订单」页面状态筛选项与表单状态选项之一，表示订单待管理员确认；列表中对处于该状态的订单显示「确认」按钮。
已确认：后台「购票订单」页面点击「确认」按钮后的目标状态（PUT /ticket_order/update，参数 {id, status: '已确认'}）；同时也是状态筛选项与表单选项之一。
已完成：后台「购票订单」页面的状态选项之一，表示订单已完成。
已取消：后台「购票订单」页面的状态选项之一，表示订单已取消。

补充说明：状态取值以字符串形式存储，后端未定义状态常量枚举；GET /common/statistics 会按 status 分组返回 order_status_stats（字段 status、count），用于后台首页「订单状态分布」饼图。

# 默认账号

# 管理员

用户名: admin
密码: 123456

1
2

（来自 sql/d_5_travel_system.sql 中 admin 表的初始化数据：INSERT INTO admin VALUES (1, 'admin', '123456', '系统管理员', NULL, '13800000000', 'admin@example.com')，密码为明文存储；登录时用户类型需选择「管理员」。）

# 测试用户

用户名: user
密码: 123456

1
2

（来自 sql/d_5_travel_system.sql 中 user 表的初始化数据：INSERT INTO user VALUES (1, 'user', '123456', '管理员', NULL, '13800000000', 'user@qq.com', 1000.00)，密码为明文存储；登录时用户类型需选择「用户」。）

# 核心业务流程

# 登录与鉴权流程

1. 用户在登录页选择用户类型（管理员 ADMIN / 用户 USER），输入用户名与密码
2. 前端调用 POST /common/login 提交 {username, password, type}
3. 后端校验 type 必须为 ADMIN 或 USER，否则返回「无效的用户类型」
4. 按 type 查询不同数据表：ADMIN 查询 admin 表，USER 查询 user 表；密码逐字比对，不一致返回「用户名或者是密码错误」
5. 校验通过后生成 JWT（Payload：id、username、type，HS256 签名），随用户信息一起返回
6. 前端将 token 与 currentUser 写入 localStorage；USER 跳转前台「/」，ADMIN 跳转后台「/admin」
7. 后续请求由 Axios 拦截器在请求头附加 token，后端 TokenInterceptorMiddleware 解析令牌并把 id、username、type 注入 request；令牌缺失或失效返回 code=401，前端清除令牌并跳回登录页

1
2
3
4
5
6
7

# 景点购票与订单处理流程

1. 用户在前台「景点推荐」列表进入景点详情页（GET /scenic_spot/detail）
2. 点击「立即购票」，填写购票数量（1—10）、游玩日期、联系人、联系电话，前端按「门票价格 × 数量」实时计算总价
3. 未选择游玩日期时前端提示「请选择游玩日期」；确认后调用 POST /ticket_order/add，订单状态写入「待支付」
4. 管理员在后台「购票订单」页面按联系人/状态检索订单，查看景点、用户、数量、总价、游玩日期等信息
5. 对状态为「待确认」的订单点击「确认」，调用 PUT /ticket_order/update 将状态扭转为「已确认」
6. 管理员可继续编辑订单状态为「已完成」或「已取消」，或批量删除订单；状态分布数据由 GET /common/statistics 汇总后展示在后台首页饼图

1
2
3
4
5
6

# 游记发布与互动流程

1. 管理员在后台「游记管理」新增游记，填写用户 ID、标题、封面、内容（MyEditor 富文本）、地点、日期，调用 POST /travel_note/add
2. 用户在「游记广场」检索游记（GET /travel_note/page，前端提供标题、地点搜索项），进入详情页（GET /travel_note/detail）阅读正文
3. 详情页调用 GET /note_like/check 回显当前用户点赞状态；点击「点赞」调用 POST /note_like/add（已点赞返回「已经点赞过该游记」），点击「已点赞」调用 DELETE /note_like/cancel 取消
4. 用户在评论区提交内容，调用 POST /note_comment/add，后端通过 utils/current_user.py 的 get_current_user_id() 取当前用户写入 user_id，评论列表通过 GET /note_comment/list 展示
5. 管理员在后台「游记评论」「游记点赞」页面查看或维护全部互动记录

1
2
3
4
5

# 景点收藏流程

1. 用户进入景点详情页，通过 GET /scenic_collect/check 判断是否已收藏
2. 点击「收藏景点」调用 POST /scenic_collect/add，后端通过 get_current_user_id() 取当前用户写入 user_id 并做重复校验
3. 再次点击「已收藏」调用 DELETE /scenic_collect/cancel 取消收藏
4. 管理员在后台「景点收藏」页面查看全部收藏记录（连表展示用户名与景点名称）并进行维护

1
2
3
4

# 技术说明

# 系统架构

前端：Vue 3.4.29 + Element Plus 2.8.4 + Vite 5.3.1
后端：Django 3.2（工程由 Django 3.2.20 生成，依赖 Django~=3.2） + Django REST Framework 3.14.0（djangorestframework~=3.14.0）
数据库：MySQL 8.0（库名 d_5_travel_system，字符集 utf8mb4）
认证：自定义 JWT Token（PyJWT 2.7.0，HS256，密钥取自 settings 的 SECRET_KEY）

# 访问地址

后端API：http://127.0.0.1:8000
前端页面：http://localhost:5173（开发环境，Vite 默认端口）
Swagger 接口文档：http://127.0.0.1:8000/swagger/
Django 自带管理后台：http://127.0.0.1:8000/django-admin/

# 数据库

数据库名：d_5_travel_system（settings.py 中 USER/PASSWORD 为 root / 123456，HOST localhost，PORT 3306）
字符集：utf8mb4（排序规则 utf8mb4_unicode_ci）
总表数：15 张表（模型定义，均为 managed = False 的逻辑映射）

序号	模型类	数据表 db_table	说明
1	User	user	用户表
2	Admin	admin	管理员表
3	Category	category	景点分类
4	ScenicSpot	scenic_spot	旅游景点
5	ScenicCollect	scenic_collect	景点收藏
6	TicketOrder	ticket_order	景点购票订单
7	OrderReview	order_review	订单评价
8	TravelRoute	travel_route	旅游路线
9	TravelProduct	travel_product	旅游商品
10	TravelNote	travel_note	游记
11	NoteComment	note_comment	游记评论
12	NoteLike	note_like	游记点赞
13	Notice	notice	系统公告
14	Banner	banner	轮播图
15	Pet	pet	宠物信息

说明：sql/d_5_travel_system.sql 建表脚本中包含 14 张表（admin、banner、category、note_comment、note_like、notice、order_review、scenic_collect、scenic_spot、ticket_order、travel_note、travel_product、travel_route、user），未包含 pet 表；apps/common/models.py 中的 Test、A、B、C 仅为字段类型学习示例，且 apps.common 未注册到 INSTALLED_APPS，不属于业务表。

# API接口规范

RESTful风格：
GET    /module/page          # 分页查询
GET    /module/list          # 查询全部（不分页）
GET    /module/detail        # 查询详情
POST   /module/add           # 新增
PUT    /module/update        # 更新
DELETE /module/delete        # 批量删除
DELETE /module/delBatch      # 批量删除

响应格式：
{
    "code": 200,
    "msg": "操作成功",
    "data": {...}
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

分页参数：请求参数为 pageNum（页码，从 1 开始），后端分页大小由 settings.PAGE_SIZE = 10 固定控制，返回 { total, list }。
响应码：200 操作成功；500 操作失败或业务提示（ResponseMessage.other 中 data 与 msg 同为提示文案）；401 未授权（由令牌中间件返回，前端据此跳转登录页）。
认证方式：除白名单外的接口均需在请求头中携带 token。

# 系统特色

# 富文本编辑

组件：wangEditor（@wangeditor/editor ^5.1.14 + @wangeditor/editor-for-vue ^5.1.12），封装为 components/MyEditor.vue，固定高度 400px，占位提示「请输入内容...」。
应用位置：后台「旅游景点」新增/编辑弹窗的「介绍」字段（ScenicSpot.vue）、后台「游记管理」新增/编辑弹窗的「内容」字段（TravelNote.vue）；前台景点详情、路线详情、游记详情通过 v-html 渲染富文本内容。
支持功能：工具栏通过 Toolbar 组件呈现，支持图片上传与视频上传（MENU_CONF.uploadImage / uploadVideo 均指向后端 /file/upload，请求头携带 token，字段名 file，customInsert 使用后端返回的 fileUrl 插入），视频上传 maxFileSize 为 100MB；组件卸载时自动 destroy() 释放实例。

# 数据可视化

组件：ECharts ^5.5.1
图表：订单状态分布（pie 环形饼图，radius: ['40%','70%']，图例在右侧，标签格式 {b}\n{c}）、景点分类分布（bar 柱状图，柱宽 50%，柱体使用 LinearGradient 渐变，含阴影轴指示器）
位置：管理后台首页（views/admin/Home.vue），页面顶部另有「用户总数、景点总数、订单总数、游记总数」四张统计卡片；数据统一来自 GET /common/statistics

# 文件上传

上传接口：POST /file/upload（同时通过 POST /common/upload 暴露同一视图 FileUploadAPIView），字段名 file，必须携带 token 请求头
大小限制：后端 settings.py 未配置上传大小限制；前端仅富文本编辑器的视频上传设置了 maxFileSize: 100 * 1024 * 1024（100MB）
支持格式：MyUpload.vue 按类型设置 accept——图片类型为 image/*（imageCard 为卡片样式、image 为列表图片样式）、视频为 video/*、音频为 audio/*、附件类型不限制格式；组件 limit 默认 100，limit === 1 时选择新文件会自动替换旧文件
存储方式：文件保存至 settings.UPLOAD_PATH（相对项目根的 uploads\ 目录）与 MEDIA_ROOT（BASE_DIR/uploads），文件名使用 uuid4 + 原扩展名重命名，避免重名覆盖
访问格式：http://127.0.0.1:8000/uploads/<uuid文件名>（由 settings.HTTP_PICTURE = "http://127.0.0.1:8000/uploads/" 拼接返回，MEDIA_URL 为 /uploads/）

# 5-在线旅游系统 - 功能说明

# 项目概述

# 项目概览

# ✨ 创新点

# 1. 全模块化的 Django App 架构

# 2. 自定义 JWT 认证与令牌拦截中间件

# 3. 面向用户的旅游内容推荐与社区互动

# 4. 购票订单的状态流转与一键确认

# 5. 多维度后台数据统计看板

# ✨ 项目亮点

# 一、 业务功能亮点

# 二、 技术实现亮点

# 三、 用户体验亮点

# 管理员（ADMIN）

# 首页与数据统计

# 用户管理

# 景点管理

# 订单管理

# 旅游管理

# 游记管理

# 系统管理

# 个人中心

# 普通用户（USER）

# 首页

# 景点

# 旅游路线

# 游记广场

# 个人中心

# 账号入口

# 功能权限对照表

# 订单状态说明

# 默认账号

# 管理员

# 测试用户

# 核心业务流程

# 登录与鉴权流程

# 景点购票与订单处理流程

# 游记发布与互动流程

# 景点收藏流程

# 技术说明

# 系统架构

# 访问地址

# 数据库

# API接口规范

# 系统特色

# 富文本编辑

# 数据可视化

# 文件上传

# 一、业务功能亮点

# 二、技术实现亮点

# 三、用户体验亮点