Custom Selection Menu

This type of pattern is available in Vue and it's a replacement for the F11 menu present in backoffice applications. This allows the user to have a "chooser" with custom data that can be updated dynamically with the help of manwins.

Definition

Main Routine

To define this type of pattern, first the user needs to create a SELECTION_ROUTINE which will be responsible for inserting the records into the table in the menu.

Component Properties

There are some properties that the developer can use to insert the data or maybe hide the menu in case of error.

This is the string array that is loaded into the table. Here is where the options should be saved. this.selectFields = ["test1", "test2", "test3"]

This is a boolean that allows the developer to control if the individual components inside the form are shown or hidden. this.hideCustomSelection = false;

The popup form itself can also be closed programmatically with the following piece of code: this.removeModal('form-custom-selection');

(Optional) Back-end Routine

In case the user wants to fetch the fields list from the database or needs the back-end to process something, a MANUAL_CONTROLLER manwin can be declared and called from the main routine.

Definition in Genio

Lastly, the routine needs to be associated with the desired field in Genio. To do that, the old F11 definition was reused and the user simply needs to fill it with the routine's name.