本技能提供 SAP Fiori Elements 页面模板（floorplans）的最佳实践参考，主要资料引用自 SAP UI5 文档、SAP Fiori Development Portal 与官方特性展示仓库。
一、用途与选型 该技能用于在开发 SAP Fiori Elements 应用时选择合适的页面模板，并遵循推荐做法。可用的模板及适用场景如下：
- List Report + Object Page：用于浏览大量条目并点击进入详情，是大多数业务应用的默认选择，OData V4 完全支持。
- Worklist：用于处理一小组待办工作项、逐条处理且无需复杂过滤，本质上等同于禁用过滤栏的 List Report，OData V4 支持。
- Analytical List Page（ALP）：用于数据分析，配合可视化过滤器、图表和 KPI 与列表并存，OData V4 完全支持。
- Overview Page（OVP）：用于以卡片汇总多个业务领域的仪表盘，OData V4 支持（Stack card 除外）。
- Object Page standalone：用于没有列表入口的单项详情，OData V4 完全支持。 当不确定时，推荐使用 List Report + Object Page（有时称为 LROP），这是最常见的 SAP Fiori Elements 模式，覆盖绝大多数事务型业务场景。
二、版本选型 对于使用 CAP 的新项目，应始终使用 OData V4。资料指出 V2 属于遗留方案，会失去 building blocks、flexible programming model 以及深度草稿集成。
三、生成方式 推荐使用 SAP Fiori tools 生成应用。在 CAP 项目根目录执行：
cds add fiori
或使用 VS Code 中的 Fiori tools Application Generator：Ctrl+Shift+P → “Fiori: Open Application Generator” → SAP Fiori elements → List Report Object Page → OData V4 → 选择你的 CAP 服务。
生成的目录结构如下：
app/ └── my-app/ ├── webapp/ │ ├── manifest.json ← 应用路由与设置 │ └── i18n/i18n.properties └── annotations.cds ← UI 注解放在这里
四、配置示例 List Report + Object Page 的 manifest.json 配置示例（含路由与目标）：
{ "sap.ui5": { "routing": { "routes": [{ "name": "OrdersList", "pattern": ":?query:", "target": "OrdersList" }, { "name": "OrdersObjectPage", "pattern": "Orders({key}):?query:", "target": "OrdersObjectPage" }], "targets": { "OrdersList": { "type": "Component", "id": "OrdersList", "name": "sap.fe.templates.ListReport", "options": { "settings": { "entitySet": "Orders", "initialLoad": true } } }, "OrdersObjectPage": { "type": "Component", "id": "OrdersObjectPage", "name": "sap.fe.templates.ObjectPage", "options": { "settings": { "entitySet": "Orders" } } } } } } }
Worklist 的 manifest.json 差异：在 SAP Fiori elements V4 中，Worklist 只是禁用过滤栏的 List Report 变体，只需一个设置：
"settings": { "entitySet": "Tasks", "initialLoad": true, "hideFilterBar": true ← 只需这一项 }
Flexible Column Layout（FCL）配置，用于让列表与对象页并排显示而非整页导航：
"sap.ui": { "fullWidth": false }, "sap.ui5": { "routing": { "config": { "flexibleColumnLayout": { "defaultTwoColumnLayoutType": "TwoColumnsMidExpanded" } } } }
注解文件位置（CAP 专用）：应将 UI 注解保留在 app/ 文件夹下独立的 .cds 文件中，不要内联在实体定义里，也不要放在 webapp/ 文件夹中。
app/ └── orders/ └── annotations.cds ← ✅ 正确 — 由 CAP 编译进 OData 元数据 webapp/ └── annotations.xml ← ❌ 避免 — 不会由 CAP 编译，会导致 label 问题
示例注解：
// app/orders/annotations.cds using OrderService from '../../srv/order-service';
annotate OrderService.Orders with @( UI.HeaderInfo: { TypeName: 'Order', TypeNamePlural: 'Orders', Title: { Value: orderNumber } }, UI.SelectionFields: [ status, customer_ID, orderDate ], UI.LineItem: [ { Value: orderNumber }, { Value: customer.name, Label: 'Customer' }, { Value: orderDate }, { Value: totalAmount }, { Value: status, Criticality: statusCriticality } ] );
五、常见错误与规避方式
- ❌ 新 CAP 项目选择 OData V2——会失去 flexible programming model、building blocks 与深度草稿支持；✅ 新项目始终使用 OData V4。
- ❌ 在 CAP 项目中把 UI 注解放在 webapp/annotations.xml——不会被编译进 OData 元数据，label 和 facets 会静默失效；✅ 把注解放到 app/<app-name>/annotations.cds。
- ❌ 在页面模板已覆盖 90% 用例时仍构建自定义 UI5 freestyle 应用——扩展可覆盖剩余 10%；✅ 从最接近的页面模板开始，再用 flexible programming model 扩展。
- ❌ 在 OData V4 上使用带 Stack cards 的 Overview Page——不受支持；✅ 其他 OVP 卡片类型在 V4 下可用。
- ❌ 手写 manifest.json 路由——容易出错；✅ 使用 SAP Fiori tools Application Generator 或 cds add fiori。
六、限制 资料未提供该技能的安装命令、收费或价格信息；OData V2 与 V4 的差异、各模板的具体支持范围以官方文档为准，本技能为参考性实践指引。