• Inicio
  • Novedades
  • Academia SAP
  • FAQ
  • Blog
  • Contacto
S4PCADEMY_Logo
  • Inicio
  • Novedades
  • Academia SAP
  • FAQ
  • Blog
  • Contacto
Twitter Linkedin Instagram

S4PCADEMY_Logo
  • Inicio
  • Novedades
  • Academia SAP
  • FAQ
  • Blog
  • Contacto
Twitter Linkedin Instagram
Technical Articles

Cómo configurar una página de objetos de Fiori Elements como una página de detalles de la aplicación SAP My Inbox

By s4pcademy 


Introducción:

Este blog muestra el enfoque que tomé para lograr el requisito de personalizar la aplicación SAP My Inbox. Aunque se trata de muchas posibilidades de extensión, como extender la página de detalles (enfoque de extensión regular) o agregar más atributos a la página de detalles. Pero lograr el requisito cuando su aplicación es Fiori Elements fue un desafío.

Requisito:

Como parte de otros requisitos, habíamos desarrollado una aplicación Página de lista -> Página de objeto. Para la página de detalles de la aplicación My Inbox, queríamos reutilizar esta página de objetos desarrollada anteriormente. En lugar de crear una nueva aplicación para la página de detalles, queríamos reutilizarla para reducir los esfuerzos de desarrollo y mantenimiento.

Arquitectura:

Creé una nueva aplicación contenedora UI5, que consumía el FE como un componente. Tenía la lógica de cargar la aplicación de elementos FE y luego navegar a la página de objetos con el contexto seleccionado. El siguiente diagrama lo explica.

Diagrama%20Arquitectónico

Diagrama Arquitectónico

Veamos ahora los detalles.

El primer paso fue crear una nueva aplicación UI5 como se muestra a continuación.

Se creó una aplicación SAPUI5 personalizada y Concepto de reutilización de componentes fue utilizado.

Contenedor de componentes: “usage=dashboard” es el nombre de la aplicación que figura en el manifiesto

Componente%20Contenedor%20-

Contenedor de componentes –

Manifiesto%20Cambios

Cambios manifiestos

Rutas –

Una ruta específica se define como se menciona en el blog anterior. Y esta ruta contiene la ruta:”detalle/{scenarioid}/{wfInstanceId}/{taskPath}” y el componente de la aplicación Dashboard como objetivo. Esta es la misma ruta que se activará desde Mi bandeja de entrada cuando se seleccione una tarea.

“&/detalle/LOCAL_TGW/000001577878/TaskCollection(SAP__Origin=’LOCAL_TGW’,InstanceID=’000001577878′)”

Manifiesto – Rutas ->

(Nota de Pls: el prefijo como niño se usó para saber si la aplicación Dashboard se ejecuta desde My-Inbox, se encontró de esta manera genial de manejar)

Ruta%20Definición

Definición de ruta

Objetivo%20Definición

Definición de objetivo

Tenga en cuenta: en nuestro caso, no se requiere ningún parámetro Routingmacthed, ya que estamos reutilizando el componente y la aplicación Detail es una aplicación Fiori Elements.

Siguiente parámetro de la Ruta- “&/Niño/zgc_c_requests(req_uuid=guid’00505694-0AD9-1EED-A4CD-A9CC33EA8180′,IsActiveEntity=true)”

Entonces, en Init de ListReportExt.controller, el parámetro hashkey se verifica para el parámetro «Niño» y nav.a motivado.

HashKey%20Parameter%20-%20%26%23x60%3BChild%26%23x60%3B

Parámetro Hashkey – ‘Niño’

Ahora vamos a configurar la aplicación recién creada.

Nueva entrada creada para nuestra tarea con «Navegación basada en la intención». Se requiere al menos una entrada para «SEMANTIC_OBJECT» y «ACTION» que luego se utiliza en la configuración de Fiori.

Entrada creada con el SWFVISU transacción

entrada%20creación%20en%20SWFVISU%20Transacción

creación de entrada en SWFVISU Transaction

Configuración de Fiori: asignación de destino (objeto semántico, acción y el parámetro a continuación)

Fiori%20Configuración

Configuración de Fiori

Intentemos cargar la aplicación y hacer clic en un elemento. Pero toda la aplicación se carga en lugar de cargar solo la página de detalles

Nuestra%20Aplicación

Nuestra aplicación

Después de mucho análisis, se escribió nav.to arriba para la navegación y se escribió otra verificación para habilitar la página de detalles Pantalla completa (Por favor, avíseme si hay alguna solución mejor, me pareció adecuada para ese momento.)

Código%20Fragmento%20para%20Pantalla%20completa

Fragmento de código para pantalla completa

Problemas después de la implementación-

  • La barra de herramientas flotante de la página de detalles de la aplicación infantil se muestra a continuación -> puede ocultarse obteniendo la identificación de la barra de herramientas y haciéndola visible (falso)
  • Problema con el diseño del encabezado y la barra de pie de página de Mi bandeja de entrada -> puede solucionar este problema de diseño manejando la altura de la aplicación personalizada al 85%.

Conclusión:

En conclusión, así es como pude mostrar la tarea de usuario personalizada usando una aplicación contenedora UI5. Espero que lo encuentre útil y comparta el suyo conmigo en los comentarios.

Nuestra aplicación en Mi bandeja de entrada Tarea de usuario

Nota SAP – 2305401 – Integración de aplicaciones SAPUI5 Fiori en My Inbox 2.0 – SAP ONE Support Launchpad

SDK- Habilitación de enrutamiento en componentes anidados – Documentación – Kit de demostración – SAPUI5 SDK (ondemand.com)

¡¡Sigue aprendiendo y sigue compartiendo!!

Un agradecimiento especial a @KrishnaKammaje



Source link


aplicacióncomoConfigurardetallesElementsFioriInboxobjetospáginaSAPuna

Artículos relacionados


Technical Articles
Cree contenido fiscal para países no localizados en SAP Cloud Applications Studio: parte 2
async-profiler  ·  openjdk  ·  Technical Articles
AP-Loader: una nueva forma de usar e integrar async-profiler
Event Information
¿Qué sigue para SAP CodeJam en 2023?

Deja tu comentario Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*

*

Comprobación de preparación de SAP para SAP S/4HANA: archivo de entrada del analizador de notas
Previo
¿Qué hacen los profesionales de UX? Descubriendo los roles de los arquitectos, diseñadores, escritores e investigadores de UX
Siguiente

Madrid

Calle Eloy Gonzalo, 27
Madrid, Madrid.
Código Postal 28010

México

Paseo de la Reforma 26
Colonia Juárez,  Cuauhtémoc
Ciudad de México 06600

Costa Rica

Real Cariari
Autopista General Cañas, 
San José, SJ 40104

Perú

Av. Jorge Basadre 349
San Isidro
Lima, LIM 15073

Twitter Linkedin Instagram
Copyright 2022 | All Right Reserved.
Cookies Para que este sitio funcione adecuadamente, a veces instalamos en los dispositivos de los usuarios pequeños ficheros de datos, conocidos como cookies. La mayoría de los grandes sitios web también lo hacen.
Aceptar
Cambiar ajustes
Configuración de Cookie Box
Configuración de Cookie Box

Ajustes de privacidad

Decida qué cookies quiere permitir. Puede cambiar estos ajustes en cualquier momento. Sin embargo, esto puede hacer que algunas funciones dejen de estar disponibles. Para obtener información sobre eliminar las cookies, por favor consulte la función de ayuda de su navegador. Aprenda más sobre las cookies que usamos.

Con el deslizador, puede habilitar o deshabilitar los diferentes tipos de cookies:

  • Bloquear todas
  • Essentials
  • Funcionalidad
  • Análisis
  • Publicidad

Este sitio web hará:

Este sitio web no:

  • Esencial: recuerde su configuración de permiso de cookie
  • Esencial: Permitir cookies de sesión
  • Esencial: Reúna la información que ingresa en un formulario de contacto, boletín informativo y otros formularios en todas las páginas
  • Esencial: haga un seguimiento de lo que ingresa en un carrito de compras
  • Esencial: autentica que has iniciado sesión en tu cuenta de usuario
  • Esencial: recuerda la versión de idioma que seleccionaste
  • Functionality: Remember social media settings
  • Functionality: Remember selected region and country
  • Analytics: Keep track of your visited pages and interaction taken
  • Analytics: Keep track about your location and region based on your IP number
  • Analytics: Keep track of the time spent on each page
  • Analytics: Increase the data quality of the statistics functions
  • Advertising: Tailor information and advertising to your interests based on e.g. the content you have visited before. (Currently we do not use targeting or targeting cookies.
  • Advertising: Gather personally identifiable information such as name and location
  • Recuerde sus detalles de inicio de sesión
  • Esencial: recuerde su configuración de permiso de cookie
  • Esencial: Permitir cookies de sesión
  • Esencial: Reúna la información que ingresa en un formulario de contacto, boletín informativo y otros formularios en todas las páginas
  • Esencial: haga un seguimiento de lo que ingresa en un carrito de compras
  • Esencial: autentica que has iniciado sesión en tu cuenta de usuario
  • Esencial: recuerda la versión de idioma que seleccionaste
  • Functionality: Remember social media settings
  • Functionality: Remember selected region and country
  • Analytics: Keep track of your visited pages and interaction taken
  • Analytics: Keep track about your location and region based on your IP number
  • Analytics: Keep track of the time spent on each page
  • Analytics: Increase the data quality of the statistics functions
  • Advertising: Tailor information and advertising to your interests based on e.g. the content you have visited before. (Currently we do not use targeting or targeting cookies.
  • Advertising: Gather personally identifiable information such as name and location
Guardar y cerrar