Objective
After completing this lesson, you will be able to crear diálogos personalizados para botones mediante ventanas emergentes y scripting.
Escenario: Crear diálogos personalizados con ventanas emergentes
Vea este vídeo para obtener más información sobre el requisito del equipo de botones ampliados y diálogos personalizados para su historia de planificación.
¿No?
Su equipo ha empezado a trabajar con la historia de planificación ampliada y el planificador ha estado copiando versiones y el año con el botón de acción de datos ampliada que ha creado. Acuden a usted para pedirle consejo, ya que tienen una serie de acciones de datos nuevas que se requieren debido a las diferentes combinaciones de versión y año en la historia de planificación.
Le sugerimos que amplíe aún más el botón de acción de datos con una ventana emergente en la que, en lugar de simplemente ejecutar la acción de datos, se pedirá a los planificadores que seleccionen la versión fuente y de destino y el año necesarios.
También desean una forma de crear fácilmente versiones privadas y eliminar versiones privadas cuando la historia está en modo de vista, así como publicar una versión privada como una nueva versión pública.
Trabaja con su colega Kevin para comprender completamente el requisito empresarial y crea una serie de botones y ventanas emergentes personalizadas que:
- Crea una versión privada copiando una versión existente, dando al planificador la opción de copiar la versión con o sin datos.
- Ejecuta una acción de datos con una petición para permitir que el planificador seleccione el año de origen y de destino cuando selecciona Copiar datos por versión y fecha. También les proporciona un diálogo personalizado cuando la acción de datos copia y actualiza los datos en la tabla, como se muestra a continuación.
- Actualiza y ordena los nuevos miembros de forma alfanumérica cada vez que se abre la página, lo que garantiza que los planificadores tengan las opciones más actualizadas para seleccionar.
- Les permite publicar una versión privada como una nueva versión pública.
- Les permite eliminar una versión privada que ya no es necesaria.
Configuración de historia
Antes de añadir el scripting, primero debe añadir los botones necesarios a su historia y crear y configurar las ventanas emergentes que utilizará.
Copiar versión con o sin datos
El equipo desea poder copiar una versión existente para crear una nueva versión privada directamente desde la historia. Quieren tener la opción de crearlos con o sin datos. Para ello, cree el botón BTN_CopyVersion y la ventana emergente POPUP_CopyVersion.
La ventana emergente POPUP_CopyVersion está configurada como se muestra:
Copiar datos por versión y fecha
El equipo desea tener una acción de datos que le permita seleccionar versiones y años en lugar de tener varios iniciadores de acciones de datos en la historia. Quieren una ventana emergente personalizada que les pida que esperen hasta que la acción de datos haya terminado de copiar los datos.
Para ello, cambie el nombre de BTN_Copy a BTN_CopyData y cree los popups POPUP_CopyData y POPUP_Wait.
La ventana emergente POPUP_CopyData está configurada como se muestra:
La ventana emergente POPUP_Wait está configurada como se muestra:
Publicar versión privada como una nueva versión pública
El equipo desea poder publicar sus versiones privadas como nuevas versiones públicas y hacerlo directamente desde la historia. Para ello, cree el botón BTN_PublishAs y la ventana emergente POPUP_PublishAs.
La ventana emergente POPUP_PublishAs está configurada como se muestra:
Eliminar una versión privada
Si no se requiere una versión privada, el equipo desea tener la capacidad de eliminarla de la historia. Para ello, cree el botón BTN_Delete y la ventana emergente POPUP_Delete.
La ventana emergente POPUP_Delete está configurada como se muestra a continuación:
Código utilizado en el escenario
Copiar versión
El equipo desea poder copiar una versión existente para crear una nueva versión privada directamente desde la historia. Quieren tener la opción de crearlos con o sin datos.
El siguiente código se agrega al evento BTN_CopyVersion - onClick:
1
POPUP_CopyVersion.open();
A continuación, se añade el siguiente código al evento POPUP_CopyVersion - onButtonClick:
1234567891011121314151617181920212223
// Copy with Data
if (buttonId === "Btn_Copy") {
var oPlanning = TBLPLANNING.getPlanning();
if (oPlanning) {
var oBudgetVersion = oPlanning.getPublicVersion(DD_Copy_PublicVersion.getSelectedKey());
if (oBudgetVersion) {
oBudgetVersion.copy(INF_Copy.getValue(), PlanningCopyOption.AllData, SO_Planning.getPlanningCategory(CategoryDropdown));
SO_Planning.updateDropdowns("");
}
}
}
//Copy without Data
else if (buttonId === "Btn_Copy_wo_Data") {
oPlanning = TBLPLANNING.getPlanning();
if (oPlanning) {
oBudgetVersion = oPlanning.getPublicVersion(DD_Copy_PublicVersion.getSelectedKey());
if (oBudgetVersion) {
oBudgetVersion.copy(INF_Copy.getValue(), PlanningCopyOption.NoData, SO_Planning.getPlanningCategory(CategoryDropdown));
SO_Planning.updateDropdowns("");
}
}
}
POPUP_CopyVersion.close();
Copiar datos por versión y fecha
Cuando se selecciona el botón Copiar datos por versión y año en la historia, desea:
- Las listas desplegables de versiones y años disponibles se actualizan y clasifican.
- Se inicia el diálogo emergente de espera.
- La ventana emergente de copia de datos solicita a los planificadores que especifiquen los valores de los cuatro parámetros mediante las listas desplegables.
- La acción de datos copia y actualiza los datos de la tabla mientras la ventana emergente de espera está en pantalla.
- La ventana emergente de espera se cierra cuando la acción de datos ha terminado de ejecutarse.
- Se cierra la ventana emergente de copia de datos.
Para abrir la ventana emergente POPUP_CopyData cuando se selecciona el botón Copiar datos por versión y año en la historia, se añade el siguiente script al evento BTN_CopyData - onClick:
Antes de que los planificadores seleccionen la versión y la fecha necesarias, la lista de versiones deberá actualizarse y clasificarse. Se ha añadido el siguiente código al evento POPUP_CopyData - onButtonClick:
123
TBLPLANNING.getDataSource().refreshData();
//Call Global Script function to update and sort version and year
SO_Planning.updateVerYear();
A continuación, también se añade el siguiente código al evento POPUP_CopyData - onButtonClick:
1234567891011
if (buttonId === "Btn_CopyData") {
POPUP_Wait.open();
DataAction_1.setParameterValue("SourceVersion", DD_Source_Ver.getSelectedKey());
DataAction_1.setParameterValue("TargetVersion", DD_Target_Ver.getSelectedKey());
DataAction_1.setParameterValue("SourceYear", DD_Source_Yr.getSelectedKey());
DataAction_1.setParameterValue("TargetYear", DD_Target_Yr.getSelectedKey());
DataAction_1.execute();
TBLPLANNING.getDataSource().refreshData();
POPUP_Wait.close();
}
POPUP_CopyData.close();
Publicar versión privada como una nueva versión pública
El equipo desea poder publicar sus versiones privadas como nuevas versiones públicas y hacerlo directamente desde la historia.
Para abrir la ventana emergente POPUP_PublishAs cuando se selecciona el botón Publicar como en la historia, se añade el siguiente script al evento BTN_PublishAs - onClick:
12
INF_PublishAs.setValue("");
POPUP_PublishAs.open();
A continuación, se añade el siguiente código al evento POPUP_PublishAs - onButtonClick:
123456789101112131415161718
if (buttonId === "Btn_Ok") {
var newName = INF_PublishAs.getValue();
console.log(["newName", newName]);
if (newName !== "") {
// publish private version myActual as public version with name
var myVersion = TBLPLANNING.getPlanning().getPrivateVersion(DD_PublishAs_Versions.getSelectedText());
console.log(["myVers", myVersion.getId()]);
if (myVersion) {
console.log(["myActualVersion ID", myVersion.getId()]);
myVersion.publishAs(newName, SO_Planning.getPlanningCategory(DD_PublishAs_Category));
}
SO_Planning.updateDropdowns("");
}
}
POPUP_PublishAs.close();
Eliminar una versión privada
Si no se requiere una versión privada, el equipo desea tener la capacidad de eliminarla de la historia.
Para abrir la ventana emergente POPUP_Delete cuando se selecciona el botón Eliminar en la historia, se añade el siguiente script al evento BTN_Delete - onClick:
El siguiente código también se añade a POPUP_Delete - onButtonClick:
12345678910111213141516171819202122232425
if (buttonId === "Btn_Yes") {
var oPlanning = TBLPLANNING.getPlanning();
var versionName = DD_Delete_Version.getSelectedText();
//Delete all versions
if (versionName === "All versions") {
var oPrivatversions = TBLPLANNING.getPlanning().getPrivateVersions();
console.log(["Version ", oPrivatversions]);
for (var i = 0; i < oPrivatversions.length; i++) {
console.log(["Version ", oPrivatversions[i].getId()]);
oPrivatversions[i].deleteVersion();
}
}
else {
//delete specific version
if (oPlanning) {
var oPrivateVersion = oPlanning.getPrivateVersion(versionName);
if (oPrivateVersion) {
oPrivateVersion.deleteVersion();
SO_Planning.updateDropdowns("");
}
}
}
}
POPUP_Delete.close();
Actualizar al inicializar la página o al actualizar la tabla
El siguiente script se añade tanto a Page_1 - onInitialization como a TBLPLANNING - onResultChanged:
123456
//Call Global Script function to check for private versions
SO_Planning.updateButtonVisibility();
//Call Global Script function to populate dropdowns with private version names
SO_Planning.updateDropdowns("");
//Call Global Script function to update and sort version and year
SO_Planning.updateVerYear();
Objetos de script
El siguiente script se añade a SO_Planning - updateDropdowns:
123456789101112131415161718192021222324
// clean up the dropdowns before adding values to them
DD_PublishAs_Versions.removeAllItems();
DD_Delete_Version.removeAllItems();
// retrieve all private versions available in the model
var privVersions = TBLPLANNING.getPlanning().getPrivateVersions();
//if private version exists
if (privVersions.length > 0) {
// iterate over the private versions
for (var i=0; i<privVersions.length; i++ ) {
// add them to the dropdown boxes
DD_PublishAs_Versions.addItem(privVersions[i].getId(),privVersions[i].getDisplayId());
DD_Delete_Version.addItem(privVersions[i].getId(),privVersions[i].getDisplayId());
if (selectedPrivateVersion === "" && i === 0) {
DD_PublishAs_Versions.setSelectedKey(privVersions[i].getId());
DD_Delete_Version.setSelectedKey(privVersions[i].getId());
}
}
DD_Delete_Version.addItem("ALL","All versions");
DD_Delete_Version.setSelectedKey("ALL");
}
El siguiente script se añade a SO_Planning - updateVerYear:
123456789101112131415161718192021222324252627282930313233343536373839404142
var i = 0;
var count_of_year = 0;
var version_mbr = TBLPLANNING.getDataSource().getMembers("Version");
var year_mbr = TBLPLANNING.getDataSource().getMembers("YearMonth");
var sort_list_version = ArrayUtils.create(Type.string);
var sort_list_year= ArrayUtils.create(Type.string);
var temp = ArrayUtils.create(Type.string);
for (i = 0;i<version_mbr.length; i++)
{
sort_list_version[i] = version_mbr[i].description + "," +version_mbr[i].id;
}
sort_list_version.sort();
for (i = 0;i<sort_list_version.length; i++)
{
temp = sort_list_version[i].split(",");
DD_Source_Ver.addItem( temp[1], temp[0]);
DD_Target_Ver.addItem( temp[1], temp[0]);
}
for (i = 0;i<year_mbr.length; i++)
{
if (year_mbr[i].description.length === 4)
{
console.log (year_mbr[i].description);
sort_list_year[i] = year_mbr[i].description + "," + year_mbr[i].id;
count_of_year++;
}
}
sort_list_year.sort();
for (i = 0;i < count_of_year; i++)
{
temp = sort_list_year[i].split(",");
DD_Source_Yr.addItem( temp[1], temp[0]);
DD_Target_Yr.addItem( temp[1], temp[0]);
}
El siguiente script se añade a SO_Planning - updateButtonVisibility:
12345678910111213
// retrieve all private versions available in the model
var selectedPrivateVersion = TBLPLANNING.getPlanning().getPrivateVersions();
//if private version exists
if (selectedPrivateVersion.length > 0) {
BTN_PublishAs.setVisible(true);
BTN_Delete.setVisible(true);
BTN_CopyData.setVisible(true);
} else {
BTN_Delete.setVisible(false);
BTN_PublishAs.setVisible(false);
BTN_CopyData.setVisible(false);
}
Crear diálogos personalizados con ventanas emergentes
Flujo de tareas: en este ejercicio práctico, podrá:
- Cree una ventana emergente de diálogo de selección de datos personalizada con listas desplegables.
- Cree una ventana emergente de mensaje de espera personalizada.
- Añada scripts para ejecutar el diálogo de selección de datos y mostrar un mensaje de espera cuando se ejecute la acción de datos.
- Añada scripts al botón, la página y las ventanas emergentes para asegurarse de que se ejecuten y estén siempre actualizados.