← Volver a tutoriales

El stack clásico de SAP · Lección 2 de 2

De una CDS a un tile en el Fiori Launchpad: app Fiori Elements, catálogo y rol

Publica la CDS con anotaciones UI como servicio OData, genera una app Fiori Elements, despliégala al repositorio ABAP y llévala al Launchpad con catálogo, tile, target mapping y rol.

Also available in English →

En la parte 1 creamos la tabla ZSO_HDR y la CDS Z_C_SalesOrderHdr, con anotaciones @UI y @OData.publish: true. Ahora llevamos esa CDS hasta el usuario final: un tile en el SAP Fiori Launchpad que abre una app de lista y detalle, sin escribir una línea de UI5.

Tabla Z → CDS con anotaciones → servicio OData → app Fiori Elements
       → repositorio ABAP (BSP) → catálogo + tile + target mapping → rol → Launchpad

Lo que necesitas

Herramienta Para qué
ADT La CDS de la parte 1
/IWFND/MAINT_SERVICE, /IWFND/GW_CLIENT Activar y probar el servicio
SAP Business Application Studio (o VS Code con Fiori tools) Generar y desplegar la app
/UI2/FLPD_CUST o /UI2/FLPCM_CUST Catálogo, tile y target mapping
PFCG, SU01 Rol y usuario

1. Datos de prueba

Si la tabla está vacía, carga un par de pedidos con SE16N o con una clase de consola. Usa los tres estados para ver los tres colores de la criticality:

SALES_ORDER   ORDER_TYPE  SOLD_TO_PARTY  STATUS  CURRENCY  GROSS_AMOUNT
9000000001    OR          100000         N       USD       100.00
9000000002    OR          100001         A       USD       250.00
9000000003    RE          100002         R       USD        80.00

Comprueba en ADT, con Open With → Data Preview sobre Z_C_SalesOrderHdr, que salen los registros y el campo calculado StatusCriticality.

2. Activar el servicio generado por la CDS

Gracias a @OData.publish: true, al activar la CDS el sistema generó el servicio Z_C_SALESORDERHDR_CDS. Solo falta registrarlo:

  1. /IWFND/MAINT_SERVICE → Add Service.
  2. Elige el System Alias (normalmente LOCAL).
  3. Busca Z_C_SALESORDERHDR_CDS y agrégalo.
  4. Comprueba que su nodo ICF quedó activo.

Pruébalo en /IWFND/GW_CLIENT:

GET /sap/opu/odata/sap/Z_C_SALESORDERHDR_CDS/$metadata
GET /sap/opu/odata/sap/Z_C_SALESORDERHDR_CDS/Z_C_SalesOrderHdr?$top=5
GET /sap/opu/odata/sap/Z_C_SALESORDERHDR_CDS/Z_C_SalesOrderHdr?$filter=OrderType eq 'OR'

El nombre exacto del entity set puede variar según la versión: si la segunda petición falla, búscalo en el $metadata.

3. Generar la app Fiori Elements

En SAP Business Application Studio, crea un proyecto con el generador de Fiori:

  1. Plantilla SAP Fiori Elements → List Report Page (lista + Object Page).
  2. Origen de datos: tu sistema (vía destination) y el servicio Z_C_SALESORDERHDR_CDS.
  3. Entidad principal: Z_C_SalesOrderHdr.

Ejecuta la vista previa. Todo lo que ves sale de las anotaciones de la CDS:

En pantalla Viene de
Columnas de la tabla @UI.lineItem
Filtros @UI.selectionField
Campos del detalle @UI.identification
Título del detalle @UI.headerInfo
Importe con su moneda @Semantics.amount.currencyCode
Estado en verde, amarillo o rojo criticality: 'StatusCriticality'

Si no aparecen las anotaciones: refresca el $metadata (en el Gateway, con la caché de metadatos limpia), comprueba que la CDS activa es la publicada y vuelve a generar.

4. La navegación semántica en manifest.json

El Launchpad no abre apps por URL, sino por intención (intent): un objeto semántico más una acción. Declárala en webapp/manifest.json, dentro de sap.app:

"crossNavigation": {
  "inbounds": {
    "SalesOrder-display": {
      "semanticObject": "SalesOrder",
      "action": "display",
      "title": "Sales Orders Z",
      "subTitle": "CDS UI Tutorial",
      "signature": {
        "parameters": {},
        "additionalParameters": "allowed"
      }
    }
  }
}

La intención resultante es #SalesOrder-display. Comprueba también que el dataSource apunta al servicio:

"dataSources": {
  "mainService": {
    "uri": "/sap/opu/odata/sap/Z_C_SALESORDERHDR_CDS/",
    "type": "OData",
    "settings": { "odataVersion": "2.0" }
  }
}

5. Desplegar al repositorio ABAP

Despliega la app como aplicación BSP. En Business Application Studio se configura con Add Deployment Configuration y se despliega con npm run deploy:

BSP Application: ZUI5_SO_CDS
Description:     Sales Orders CDS UI
Package:         tu paquete (o $TMP para practicar)

Al terminar, la app vive en /sap/bc/ui5_ui5/sap/zui5_so_cds.

6. Catálogo, tile y target mapping

En /UI2/FLPD_CUST (el diseñador clásico):

Catálogo:

Catalog ID:    Z_BC_SO_CDS
Catalog Title: Sales Orders CDS Catalog

Tile (estático) dentro del catálogo:

Title:    Sales Orders Z
Subtitle: CDS View UI
Icon:     sap-icon://sales-order
Intent:   #SalesOrder-display

Target mapping, que traduce la intención a la app:

Semantic Object:  SalesOrder
Action:           display
Application Type: SAPUI5 Fiori App
URL:              /sap/bc/ui5_ui5/sap/zui5_so_cds
ID:               el id de la app en manifest.json (sap.app/id)

En sistemas más nuevos se usa /UI2/FLPCM_CUST (Launchpad Content Manager): ahí creas el catálogo, agregas la app con su objeto semántico, acción y componente UI5, y la asignas a un espacio y una página en lugar de a un grupo.

7. El rol

Un tile solo aparece si el usuario tiene un rol que incluya su catálogo. En PFCG:

  1. Crea un rol individual, por ejemplo Z_SO_CDS_USER.
  2. En Menú, añade el catálogo Z_BC_SO_CDS (SAP Fiori Tile Catalog). En el modelo nuevo, añade además el espacio y la página.
  3. Añade también la autorización del servicio OData: en Menú → Authorization Default → TADIR Service, tipo IWSG, servicio Z_C_SALESORDERHDR_CDS_0001. Sin esto, el tile se ve pero la app no carga datos.
  4. Genera el perfil en la pestaña Autorizaciones.
  5. En Usuario, asigna el rol y ejecuta el user comparison.

8. Probar en el Launchpad

Entra al Launchpad, busca el tile Sales Orders Z (en el grupo, en la página o con el buscador) y ábrelo. Comprueba que carga los pedidos, que los filtros funcionan, que el estado sale de color y que el detalle muestra todos los campos.

Si algo falla

Síntoma Dónde mirar
El servicio da error /IWFND/ERROR_LOG, /IWBEP/ERROR_LOG, y que esté activo en /IWFND/MAINT_SERVICE
La app abre pero sin datos dataSource del manifest.json, nombre del entity set y autorización del servicio (paso 7.3)
El tile no aparece Catálogo en el rol, rol asignado, user comparison, grupo o página, y la caché del Launchpad
El tile abre «app no encontrada» El target mapping: objeto semántico, acción, URL e id de la app deben coincidir con el manifest.json

Checklist

  • Datos de prueba en ZSO_HDR y Data Preview de la CDS correcto
  • Servicio Z_C_SALESORDERHDR_CDS activo y $metadata probado
  • App Fiori Elements generada y probada en la vista previa
  • crossNavigation con la intención #SalesOrder-display
  • App desplegada como BSP ZUI5_SO_CDS
  • Catálogo, tile y target mapping creados
  • Rol con catálogo y autorización del servicio, asignado al usuario
  • Tile visible y app funcionando en el Launchpad

Con esto cierras el ciclo completo del stack clásico: de una tabla Z a una app en manos del usuario. En RAP el camino es el mismo, pero el servicio sale de un service binding en lugar de @OData.publish.