miércoles, 26 de junio de 2019

SAP Fiori 3: Asignar el tema en SAP Web IDE

En el artículo anterior, estuvimos viendo las cosas que ya habían ido saliendo de Fiori 3, incluyendo la nueva versión de SAPUI5, que justo en ese momento era la 1.66. Y creamos una aplicación sencilla para ver el nuevo Shellbar que nos venía con Fiori 3. Encima, nos enteramos de que comenzaba un curso de Fiori 3 en openSAP, ¡que comienza hoy mismo! Venga, dejamos un momento el blog y nos inscribimos en el curso... ya, si eso, ahora seguimos trasteando.

...

Ya nos hemos inscrito todos, ¿no? Bien, pues seguimos por donde íbamos. Que hoy vamos a hablar de como trastear con el nuevo tema de SAP Fiori 3, SAP Quartz Light, en nuestro SAP Web IDE, en lugar de usar el SAP Belize.



jueves, 23 de mayo de 2019

SAP Fiori 3 ya está aquí... al menos un poquito

Sí, sí, lo sé, llego tarde para contar cualquier novedad sobre Fiori 3 de SAP, ya que fue anunciado en las pasadas TechEd del 2018.

En cualquier caso, tenía pendiente un artículo al respecto desde hace ya tiempo, sobre todo para ir aclarándome yo mismo un poco las ideas porque no he podido estar muy al tanto del tema en estos últimos meses. Y es que, sin haber tenido oportunidad de trastear demasiado con Fiori 2.0, nos llega el 3 y nos vamos quedando ya obsoletos en nada y menos de tiempo. Porque sí, ya tenemos componentes de Fiori 3 con los que comenzar a invetigar más allá de las transparencias que SAP nos proporciona.


Así que vamos a aprovechar que Fiori 3 está ya apareciendo poquito a poco, en lugar de hacerlo de golpe, para aprender a nuestro ritmo, y que ya tenemos elementos con los que trabajar para practicar con lo que se nos viene encima.

En este artículo vamos a ver:


  • Vamos a contar... ¿novedades?
  • Ya podemos trastear con la 1.65... ¿y con la 1.66?
  • Habemus curso en openSAP.

martes, 21 de mayo de 2019

Utilizar librerías externas en nuestros proyectos SAPUI5


Hola a todos y perdonad el tiempo que llevo sin escribir, no voy a poner ninguna excusa porque aunque estemos hasta arriba siempre se puede sacar un rato.

Hoy os voy a hablar de cómo poder utilizar librerías externas en nuestros proyectos SAPUI5, ya que en JavaScript existen muchas bibliotecas con funcionalidades complejas listas para poder ser usadas en nuestros desarrollos y así facilitarnos mucho la vida.

Dos bibliotecas que utilizo a menudo:

Lodash: Contiene funciones que facilitan el trabajo con arrays. ( https://lodash.com/ )

MomentJS: Una biblioteca con funcionalidades adicionales de fecha y hora. ( https://momentjs.com )

Se pueden agregar de varias maneras, en este post os voy a indicar la forma más sencilla que va consistir en crear desde SAP WebIDE una carpeta (la llamaremos “libs”), donde vamos a disponer de todas las librerías externas que vamos a utilizar.

miércoles, 3 de abril de 2019

Error al usar servicio Northwind con SAPUI5 - Aprendiendo a buscar errores

La semana pasada, dos lectores comentaron que el ejemplo para crear una aplicación usando el servicio oData de Northwind no funcionaba. La verdad es que el error no era nada intuitivo, "HTTP request failed", así que probé a volver a crear la aplicación a ver qué fallaba. Y, efectivamente, ahí estaba el error.

Por todos los draconianos de Krynn, yo juraría que esto antes funcionaba

¿Qué es lo que podía pasar? ¿Por qué había comenzado a fallar? Había que investigar para descubrirlo.

miércoles, 27 de marzo de 2019

Crear un gráfico en SAPUI5 (IV) - Usar eventos de interacción

Ya hemos aprendido unas cuantas cosas relacionadas con los gráficos en SAPUI5, como han sido:


Ahora vamos a ver una opción adicional con los elementos del gráfico, y es que podemos realizar acciones cuando se seleccione uno de ellos, sin necesidad de mostrar un tooltip.

Para ello usaremos una propiedad de los Vizframe, la propiedad interaction.decorations, que nos permite ejecutar una función callback cuando se muestra el tooltip (al seleccionar) y cuando se oculta (al deseleccionar).

Podemos encontrar la ayuda en la documentación específica de Vizframes, buscando en el apartado de Propiedades.

Aunque esta propiedad nos la proponen para crear nuestros propios tooltips, ya que con las funciones callback podemos recuperar el elemento seleccionado y la posición (x e y), vamos a utilizarla para otro propósito: Para mostrar un panel informativo con los puntos seleccionados y la probabilidad. No lo haremos en un tooltip, sino en un panel desplegable, y obtendremos algo como lo siguiente:


Y los pasos que seguiremos serán:


  • Crear un modelo de datos para guardar los elementos seleccionados (un string concatenado) y el total de probabilidad.
  • Añadir una propiedad al gráfico (interaction.decorations), a la que podemos asignar dos valores: showDetail, para indicar una función callback que se ejecutará al seleccionar un elemento; y hideDetail, que se ejecutará cuando se deseleccione un elemento.
  • Definir las dos funciones que se llaman desde showDetail y hideDetail, para modificar el contenido del modelo de datos.
  • Añadir a la vista XML un panel expansible para mostrar los datos que hemos seleccionado, enlazándolo con el modelo de datos.

Al final del artículo, tenemos el enlace para descargar el ejemplo en GitHub.