Saltar al contenido

Cómo Utilizar el Widget de Organigrama

Este artículo proporciona una descripción general del uso del widget Organigrama en App Builder para lograr un diagrama de organigrama en un panel de una aplicación.

Nota

El widget Organigrama está disponible en la Biblioteca de descarga de widgets

Ejemplo de organigrama

Configurar App Builder ser una API

  1. Vaya a la App Builder Centro de control > Proveedores de seguridad desde el menú Conectar

  2. Desde el panel de Autenticación de usuario en el lado derecho, haga clic en Crear

    1. Dale un Nombre al Proveedor. Por ejemplo: 'OrgChartAPI'
    2. Para Tipo, seleccione Clave API
    3. Haga clic en Guardar

  3. Navega hasta el App Builder Centro de control > desde el menú Generar, haga clic en APIs REST y webhooks > seleccione la aplicación que está configurando y haga clic en Administrar Extremos

  4. Localice la aplicación que está configurando en la pantalla resultante y haga clic en el ícono de lápiz Editar
  5. Introduzca el valor en el que la API accederá al recurso en el campo Extremo. Por ejemplo: "gráficos".
  6. Haga clic en la x para salir de la pantalla.
  7. Haga clic en Crear en Objetos de negocio y seleccione la tabla u objeto que contiene los datos de su organigrama y establezca un valor para el Extremo. Por ejemplo: 'roster'
  8. Al hacer clic en el ícono de Estructura podrá controlar qué campos están disponibles en la API si desea desactivar cualquier columna que no sea necesaria para el organigrama.
  9. Al hacer clic en el ícono emergente podrá establecer la cantidad de filas que la API puede devolver. Aumente esta cantidad si es necesario, según la cantidad de niveles de su organigrama.
  10. Navega hasta el App Builder App Workbench > Seguridad > Gestión de usuarios

  11. Seleccione un usuario existente o cree un nuevo usuario para utilizar en la llamada API

    1. El usuario debe estar configurado con el tipo de inicio de sesión interactivo.
    2. El usuario no necesita tener autenticación local

  12. En la pantalla emergente del usuario seleccionado/creado, haga clic en Teclas

  13. Haga clic en Crear y elija el proveedor de API creado en el paso 2. Copie el valor de la clave que se genera para el usuario.
  14. Opcionalmente, configure cualquier rol o grupo de seguridad adicional que pueda ser necesario para el objeto.

Configurar el Widget del Organigrama

  1. Cargue el widget Organigrama en App Builder, a una colección a la que la aplicación con la que desea trabajar tiene acceso.
  2. Configure todos los parámetros requeridos por el widget, como se enumera en la Biblioteca de descarga de widgets. Los valores ingresados distinguen entre mayúsculas y minúsculas, y el valor jsonURL se puede recuperar desde Centro de control > APIs REST y webhooks > busque la entrada de la aplicación configurada anteriormente y haga clic en el ícono de documento correspondiente. La URL resultante se verá así https://localhost/rest/v1/roster/org_chart

Si desea cambiar los colores del organigrama, debe modificar los archivos en el archivo .Zip para el widget.

  1. Los valores de color para la etiqueta y el borde están en \Css\vinyl.orgchart.css. Valores en hexadecimal
  2. Los valores de color de las líneas, el color al pasar el mouse, etc. están en \Css\jquery.orgchart.css. Valores en RGB

Añade el Widget a an App Builder página

  1. Vaya a la página de la aplicación donde desea mostrar el widget y agregue un panel de fila única que siempre devolverá un registro. Por ejemplo: use la tabla de parámetros o de usuarios.
  2. Agregue un control de texto y agregue el widget de organigrama al control.

  3. Si no se muestra el organigrama, opcionalmente puede:

    1. Configure la fuente de datos que utiliza el panel para tener un registro que devuelva la clave API y la URL JSON que utiliza el organigrama.
    2. Agrega 2 controles de texto ocultos al panel, que se asignan a la clave API y la URL JSON. Puedes almacenar estos valores desde una tabla de parámetros, por ejemplo.