总览

项目访问链接

https://zion.functorz.com/tool/dK5wjNzjnw8/WEB?code=N1VP3v5UHxqvP&ref=5316313 

场景与目标

• 目标：构建一个智能旅行规划助手，通过接收用户的输入（出发地、目的地、预算、偏好等），调用外部地图 API 获取真实数据，最终生成一份结构化的专属旅行计划。

• 适用场景：旅行规划 App、私人管家服务或行程管理工具。

• 核心逻辑：

  • ​需求输入​：前端收集用户出发地、目的地及预算等参数。
  • ​智能推理​：AI Agent 调用高德地图 POI 2.0 API 获取真实地理位置信息及人均消费。
  • ​结构化解析​：AI 返回标准 JSON，通过 Zion 异步行为流进行​嵌套循环存储​。
  • ​数据呈现​：前端利用三层列表嵌套，渲染“计划-天-明细”的层级结构。
  • ​交互闭环​：通过条件式容器实现 AI 任务完成后的“未读提醒”与状态同步。

系列导读

完整流程包含三个阶段，建议按顺序阅读并实践：

1. 步骤一：API与Agent配置（数据模型准备、 API 配置与 AI Agent配置）
2. 步骤二：数据循环存储（搭建异步行为流与前端 UI 列表展示）
3. 步骤三：未读消息提示（利用数据聚合计算（Count）和条件容器，完善前端状态交互与用户体验）

💡 UI 搭建提前知：为了更专注于核心逻辑的学习，我们准备了常用组件样式模版。你可以直接复用模版界面，也可以自由发挥，使用 Zion 的基础组件自行搭建。

实现步骤

数据存储

为了存储生成的旅行计划，我们需要一个具有层级结构的数据库模型。你可以利用 Zion 数据面板中的 AI Copilot 通过描述需求来快速生成，或者手动创建以下四张表。

数据模型

1. 帐户表 (account)

系统自带表，用于标记旅行计划的归属关系。

2. 旅行计划表 (trip)

用于存储单次旅行的基础概览信息（外层主表）。

3. 每日行程表 (daily_itinerary)

中间层级表，将长途计划按天进行拆分。

4. 行程明细表 (itinerary_detail)

用于定义具体的物理位置（内层列表数据源）。