four-leaf-clover第二次团队作业——原型设计+概要设计
知途 · 全维度旅游助手智能体 Web 系统 — 团队博客
知途 ZHITU · 全维度旅游助手智能体 Web 系统 2025–2026 学年 软件工程课程
![屏幕截图 2026-05-10 211638]()
![image]()
![image]()
![image]()
![image]()
团队博客 · 第二次迭代作业
知途：当 AI 真正懂旅行
全维度旅游助手智能体 Web 系统 — 原型设计 & 概要设计
| 作业所属课程 | 首页 - 软件工程24级 - 广东工业大学 - 班级博客 - 博客园 |
|---|---|
| 作业要求 | 第二次团队作业 （原型设计+概要设计） - 作业 - 软件工程24级 - 班级博客 - 博客园 |
| 作业目标 | 通过专业原型工具（墨刀/Axure）设计"知途"Web 系统的前台与后台原型；完成 UML 需求分析与数据库设计；呈现团队协作分工与开发里程碑计划。 |
| 团队名称 | four-leaf-clover |
| 团队成员 |
许龙-3124004560 王同裕-3124004553 罗航-3124004549 唐钢湶-3124004594 胡祖豪-3124004425 刘宇航-3124004591 罗嘉钦-3124004592 刘聪-3124004548 詹金涛-3124004563 |
项目背景
为什么要做"知途"？
我们生活在信息爆炸的时代，但做一份真正好用的旅行攻略，却比十年前更难了——需要在数十篇攻略里拼凑信息，在十几个 APP 之间切换，还无法做到个性化。
知途是一个面向个人旅行者的 AI 智能体 Web 系统，具备天气感知、本地美食推荐、多维景点分析、历史典故讲解、交通规划和预算管理六大核心维度，致力于成为用户真正意义上的"随身导游老友"。
🌤 天气感知 🍜 美食推荐 🗺 景点分析 📖 历史典故 🚆 交通规划 💰 预算管理
原型设计（40%）
前台应用原型
前台原型遵循"简洁、直观、高效"设计原则，采用墨刀完成交互设计（）。以下为核心页面的高保真效果示意：
原型工具：墨刀（Modao） | 交互方式：输入目的地 → 参数设置 → AI 生成路线 → 时间轴展示 → 拖拽调整 | 适配终端：桌面端 + 移动端响应式
🖥 页面一：首页 / 行程生成
图 1 · 知途前台首页原型示意（完整交互版见墨刀链接）
🗓 页面二：生成结果 — 行程时间轴
📍 成都 · 3天亲子游 · ¥5,000 · 文化历史 ☁️ 明日有小雨，已调整行程
第一天 — 历史文化沉浸（晴）
09:00
武侯祠 & 锦里
建议游览 2.5h · 门票¥60/人 · 提前网上预约 | 三国历史发源地，千年古祠
12:00
🍜 午餐：陈麻婆豆腐（总府店）
开业50年 · 人均¥45 · 本地人推荐 · 步行5min
14:30
宽窄巷子
清朝老街 · 免费 · 拍照最佳时段 14:30–17:00
第二天 — 自然与美食（有雨，已调整室内）
09:30
成都博物馆
雨天首选 · 免费 · 馆内讲解服务¥80/场
14:00
大熊猫繁育研究基地
⚠️ 须预约 · 门票¥55 · 地铁3号线直达
预计总花费：¥4,680 / 2人 💡 拖拽可调整顺序 · 点击可编辑详情
图 2 · 行程时间轴结果页原型（支持拖拽、删除、添加项目）
后台管理原型
后台面向系统管理员，提供景点数据管理、用户行为分析、美食库维护、天气接口配置等功能模块。
图 3 · 后台管理系统原型 — 数据看板与景点管理模块
概要设计（40%）
系统架构 · UML 设计 · 数据库设计
系统采用前后端分离 + 智能体中间层的三层架构：React 前端 → Node.js/Express API → LangChain AI 智能体，数据层使用 MySQL，外部数据来源包括天气 API、地图 API 等。
🏗 整体系统架构（自顶向下）
图 4 · 知途系统整体架构图（自顶向下）
📋 用例图（需求分析）
图 5 · 用例图（旅行者 & 管理员视角）
🔄 活动图（行程生成业务流程）
图 6 · 行程生成业务活动图（并行数据拉取 + 用户调整循环）
🏛 类图（核心系统结构）
图 7 · 核心类图（User · ItineraryPlan · AIAgent · Attraction · Restaurant · WeatherService）
⏱ 时序图（行程生成核心流程）
图 8 · 行程生成时序图（从用户输入到 AI 规划结果渲染全流程）
🗄 数据库设计 — ER 图 & 关系数据模型
users（用户表）
PKuser_idVARCHAR(36)
emailVARCHAR(100)
preferencesJSON
created_atTIMESTAMP
itinerary_plans（行程表）
PKplan_idVARCHAR(36)
FKuser_idVARCHAR(36)
destinationVARCHAR(100)
daysINT
budgetDECIMAL(10,2)
plan_dataJSON
created_atTIMESTAMP
attractions（景点表）
PKattr_idVARCHAR(36)
nameVARCHAR(100)
cityVARCHAR(50)
ticket_priceDECIMAL(8,2)
open_hoursVARCHAR(100)
storyTEXT
lat, lngDECIMAL(9,6)
restaurants（餐厅表）
PKrest_idVARCHAR(36)
nameVARCHAR(100)
cityVARCHAR(50)
cuisine_typeVARCHAR(50)
avg_priceDECIMAL(8,2)
local_ratingDECIMAL(3,1)
years_openINT
weather_cache（天气缓存）
PKcache_idVARCHAR(36)
cityVARCHAR(50)
forecast_dataJSON
fetched_atTIMESTAMP
expires_atTIMESTAMP
图 9 · 核心数据库关系数据模型（users 1:N itinerary_plans；景点/餐厅通过 plan_data JSON 关联）
对象关系映射（ORM）：使用 Sequelize（Node.js ORM）进行映射。User 实体类 → users 表；ItineraryPlan 实体类 → itinerary_plans 表；Attraction → attractions 表；Restaurant → restaurants 表。关联关系通过外键约束和 Sequelize 的 hasMany / belongsTo 定义。
团队协作记录（20%）
开发计划 · 分工安排 · 协作过程
📅 预期开发计划时间安排
| 周次 | 任务内容 | 里程碑 | 产出 | |
|---|---|---|---|---|
| day 1–2 | 需求调研、用户访谈、竞品分析；确定六大功能模块 | 需求规格说明书、竞品分析报告 | ||
| day 3–4 | 原型设计（墨刀）：前台主流程 + 后台管理；UML 需求分析 | M1：原型评审 | 墨刀原型链接、用例图、活动图 | |
| day 5–6 | 数据库设计、技术选型确认；搭建前后端开发框架 | ER 图、数据库脚本、项目框架 repo | ||
| day 7–9 | 核心功能开发：AI 行程生成、天气接入、景点API、美食数据库 | M2：核心功能上线 | 可运行 MVP 版本，API 接口文档 | |
| day 10–11 | 前台 UI 完善、后台管理功能、预算模块、导出PDF | 前后台完整功能版本 | ||
| day 12–13 | 集成测试、性能优化、Bug 修复；用户测试 | M3：Beta 测试 | 测试报告、修复记录 | |
| day 14–15 | 部署上线（云服务器）；准备演示 PPT 与博客 | M4：正式发布 | 线上可访问系统、演示视频、最终博客 |
👥 团队分工安排
| 成员 | 角色 | 负责模块 | 具体开发部分 |
|---|---|---|---|
| 许龙（队长） |
全栈 + 架构 | AI 智能体 / 系统架构 | LangChain 智能体开发；Prompt Engineering；系统架构设计；项目管理协调 |
| 刘聪 |
前端开发 | 前台 Web 应用 | React 主界面开发；时间轴组件；Mapbox 地图集成；响应式适配 |
| 许龙 |
后端开发 | API 服务 / 数据库 | Node.js/Express API 搭建；MySQL 数据库设计；天气/交通 API 集成；Redis 缓存 |
| 詹金涛 | 数据 + 后台 | 数据库 / 后台管理 | 景点/美食/典故数据库整理；后台管理系统开发；数据爬虫与清洗 |
| all-members | 设计 + 测试 | UI 设计 / 测试 | 墨刀原型设计（前台+后台）；UI 视觉规范；功能测试与测试用例编写；技术博客撰写 |
💬 团队协作过程记录
团队使用 GitHub Projects 进行任务看板管理，飞书 进行日常沟通，腾讯会议 进行周例会，代码协作全部通过 Git + Pull Request 完成。
许
完成了 LangChain 智能体核心框架搭建，接入了 OpenAI API，实现了基本的行程生成 Prompt 模板。天气动态调整逻辑已完成初版，测试了成都3日游场景，效果不错！
刘
时间轴组件开发完成，支持拖拽排序（使用 @dnd-kit/core）。已和后端 API 联调，行程数据可以正常渲染。Mapbox 地图集成遇到了跨域问题。
许
天气 API（和风天气）接入完成，Redis 缓存机制上线，TTL 设置为3小时，大幅减少了 API 调用次数。景点查询接口已写好文档，提交给前端联调。
詹
成都、西安、杭州三个城市的景点数据准备录入，共 324 条景点，186 家餐厅，准备做数据清洗去重。后台管理系统的景点 CRUD 接口已与前端对接。
GitHub 贡献说明：团队每位成员均在 GitHub 上有独立的 commit 和 PR 记录。主分支采用 Feature Branch 工作流，所有功能通过 Pull Request + Code Review 合并，确保代码质量。各成员 GitHub 用户名及贡献图已附在仓库 README 中。
总结与展望
写在最后
做"知途"这个项目，让我们重新思考了 AI 与旅行的关系。我们相信，真正好的旅行 AI，不是搜索引擎，而是一个懂你的旅伴——它处理繁琐的信息，让人有更多时间去感受风景、品尝美食、聆听故事。
目前系统仍在迭代中，我们已收到早期测试用户的积极反馈。后续计划引入更多城市数据、支持多语言，并探索离线模式与硬件行程本集成等方向。
✅ MVP 已完成
🚀 Beta 测试中
📱 移动端适配
🌏 多城市扩展中
知途旅游助手智能体 · 软件工程实践课程团队作业 · 2026学年
许龙,刘聪,詹金涛,.... | 技术栈：React · Node.js · LangChain · MySQL · Mapbox
- github团队仓库链接:https://github.com/Princcess-Dragon/Four-Leaf-Clover
- 团队名称_系统设计说明书.pdf:未完成
- 团队名称_数据库设计说明书.pdf:未完成
- 原型在线预览链接:未完成
浙公网安备 33010602011771号