系统页面开发：用 SDK 完成业务页面

这一节说明如何让 Agent 在 Rabetbase 项目里开发系统页面，并用 Lovrabet TypeScript SDK 接入真实数据。你不需要手写 SDK 教程式代码；只要说清页面目标、数据来源、交互状态和验收方式，Agent 会查数据模型、接入 SDK、修改页面文件并给出验证结果。

适合交给 Agent 的任务

• 新增工作台、看板、大屏、列表、详情页或复杂表单。
• 把页面里的 mock 数据替换成 Lovrabet SDK 真实调用。
• 用 SDK 完成筛选、分页、详情读取、新增、编辑、删除等数据操作。
• 在页面中接入已保存 SQL 或 BFF 返回的数据。
• 补齐加载态、空态、错误态、权限提示和表单校验。
• 本地调试页面，并准备菜单入口或资源发布。

准备工作

• 已经打开目标 Rabetbase 项目。
• 知道页面要解决的业务问题，以及入口路由或菜单名称。
• 能说清页面涉及哪些数据，例如客户、订单、工单、审批记录等。
• 涉及写入时，先要求 Agent 确认可写字段、必填项、枚举值和权限边界。
• 涉及发布时，要求 Agent 先本地验证，再预览菜单和资源影响。

页面开发主线

1. 先让 Agent 接手项目，确认页面目录、路由、组件风格和 SDK 客户端入口。
2. 再让 Agent 查清相关数据集、字段、操作、枚举和关联关系。
3. 页面读写优先使用 Lovrabet SDK；标准 SDK 不够时，再考虑 SQL 或 BFF。
4. 开发页面时同时补齐加载态、空态、错误态、权限提示和表单校验。
5. 完成后本地调试，再做构建、菜单或资源接入检查。

常用 Prompt

规划页面和数据路径

请帮我规划「客户列表页」这个系统页面。
业务目标是：销售需要按客户等级、负责人、最近跟进时间筛选客户，并快速看到客户最近一次跟进情况。
请先检查当前项目的页面目录、路由、组件写法和 SDK 客户端入口。
再围绕页面需要的数据，确认相关数据集、字段、操作、枚举值和关联关系。
最后给出实现路径：哪些地方用 SDK，哪些地方需要 SQL 或 BFF，哪些风险要先确认。

AI 可能调用：rabetbase api pull、rabetbase dataset list、rabetbase dataset detail、rabetbase dataset operations。

新增一个 SDK 列表页

请新增一个「客户列表页」。
页面需要展示客户名称、客户等级、负责人、最近跟进时间、下一次跟进时间和跟进状态。
支持关键词、客户等级、负责人、跟进状态筛选，并按最近跟进时间倒序分页。
数据必须来自 Lovrabet SDK，不要使用 mock 数据。
请按当前项目已有页面风格实现，并补齐加载态、空态和错误态。
完成后告诉我新增或修改了哪些文件、路由是什么、如何本地验证。

AI 可能调用：rabetbase api pull、rabetbase dataset detail、rabetbase dataset operations、rabetbase codegen sdk、rabetbase run start。

接入详情页和表单写入

请为「客户」补齐详情查看和编辑能力。
详情页需要展示客户基础信息、联系人、最近跟进记录和未完成待办。
表单需要支持编辑客户等级、负责人、下一次跟进时间和备注。
请先确认可写字段、必填项、枚举值、默认值和权限边界，再接入 SDK。
完成后给出表单校验规则、失败提示和验证步骤。

AI 可能调用：rabetbase dataset detail、rabetbase dataset operations、rabetbase codegen sdk、rabetbase run start。

把 mock 数据替换成 SDK 调用

当前页面「src/pages/customer/CustomerList.tsx」里还有 mock 数据。
请帮我替换成 Lovrabet SDK 的真实数据调用。
替换前先确认页面字段和真实数据集字段的映射关系。
不要改变现有交互和样式；如果字段缺失或口径不一致，请先列出来让我确认。

AI 可能调用：rabetbase api pull、rabetbase dataset detail、rabetbase dataset operations、rabetbase codegen sdk。

接入 SQL 或 BFF 数据

这个客户列表页需要展示「每个客户近 90 天成交金额、最近一次跟进记录和未完成待办数」。
请先判断标准 SDK 查询是否够用。
如果不够，请复用或补充平台托管 SQL / BFF，并把调用接入页面。
执行前先说明为什么需要 SQL 或 BFF，以及会影响哪些页面或接口。

AI 可能调用：rabetbase dataset detail、rabetbase sql detail、rabetbase codegen sql、rabetbase bff detail、rabetbase bff status。

本地验证并准备接入菜单

页面已经开发完成，请帮我做本地验证和接入前检查。
请检查页面路由、SDK 调用、加载态、空态、错误态、表单写入、构建产物和菜单入口。
先列出通过项、风险项和阻断项。
如果需要同步菜单或更新资源，请先预览影响范围，不要直接覆盖。

AI 可能调用：rabetbase run start、rabetbase run build、rabetbase run preview、rabetbase menu sync、rabetbase menu update。

SDK 深入阅读大纲

这篇文档只说明如何把系统页面开发任务交给 Agent。SDK 细节请看 TypeScript SDK 及其子文档。

• 入门

  • SDK 介绍
  • 快速开始
  • 配置详解
  • 认证配置

• 数据操作

  • API 使用指南
  • Filter API
  • 聚合 API
  • SQL API
  • BFF API
  • 用户列表查询
  • 多表查询

• 进阶功能

  • 模型别名
  • 高级功能
  • 错误处理
  • 语法糖
  • TypeScript 支持
  • SQL 教程

• 参考

  • API 参考
  • MCP SDK 使用
  • 实际应用示例
  • 故障排查

• Changelog

写 Prompt 时要补充的信息

• 页面目标：要解决什么业务问题。
• 页面位置：新页面、已有页面、路由、菜单或组件文件。
• 数据对象：数据集、字段、筛选条件、详情字段、表单字段。
• 交互要求：筛选、分页、排序、详情抽屉、弹窗、批量操作、图表。
• 状态要求：加载态、空态、错误态、权限提示、表单校验。
• 发布约束：先本地验证、先预览菜单、不覆盖无关资源。

完成检查

• 页面文件、路由和菜单入口已经说明清楚。
• 页面没有继续依赖 mock 数据。
• SDK 调用使用真实字段和真实数据操作。
• 加载态、空态、错误态和写入失败提示可见。
• 本地调试或构建结果已经说明。
• 菜单或资源同步前已经预览影响范围。

下一步：如果只需要生成调用片段或同步菜单，看「代码生成与菜单」；如果页面依赖的数据结构还不清楚，先回到「API 与数据集：拉配置、看清数据」。