Un control de tipo Botón (o Button) de BIZUIT, cuenta con la siguiente estructura JSON
{
"type": "object",
"properties": {
"name": {
"type": "string"
},
"component": {
"type": "string"
},
"x": {
"type": "integer"
},
"y": {
"type": "integer"
},
"rows": {
"type": "integer"
},
"cols": {
"type": "integer"
},
"props": {
"type": "array",
"items": [
{
"type": "object",
"properties": {
"class": {
"type": "string"
},
"name": {
"type": "string"
},
"title": {
"type": "string"
},
"label": {
"type": "string"
},
"value": {
"type": "string"
},
"tooltip": {
"type": "string"
},
"tooltipPosition": {
"type": "string"
},
"font": {
"type": "string"
},
"align": {
"type": "string"
},
"fontWeight": {
"type": "string"
},
"fontColor": {
"type": "string"
},
"backgroundColor": {
"type": "string"
},
"fontSize": {
"type": "integer"
},
"enabled": {
"type": "boolean"
},
"parentEnabled": {
"type": "boolean"
},
"visible": {
"type": "boolean"
},
"vertical": {
"type": "boolean"
},
"fontEffectLineThrough": {
"type": "boolean"
},
"fontEffectUnderline": {
"type": "boolean"
},
"properties": {
"type": "array",
"items": [
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
},
{
"type": "string"
}
]
},
"labelValue": {
"type": "string"
},
"layer": {
"type": "integer"
},
"validateOnHiddenControl": {
"type": "boolean"
},
"isSubForm": {
"type": "boolean"
},
"isMainForm": {
"type": "boolean"
}
},
"required": [
"class",
"name",
"title",
"label",
"value",
"tooltip",
"tooltipPosition",
"font",
"align",
"fontWeight",
"fontColor",
"backgroundColor",
"fontSize",
"enabled",
"parentEnabled",
"visible",
"vertical",
"fontEffectLineThrough",
"fontEffectUnderline",
"properties",
"labelValue",
"layer",
"validateOnHiddenControl",
"isSubForm",
"isMainForm"
]
},
{
"type": "object",
"properties": {
"class": {
"type": "string"
},
"backgroundColor": {
"type": "string"
},
"title": {
"type": "string"
},
"classType": {
"type": "string"
},
"icon": {
"type": "string"
},
"width": {
"type": "null"
},
"height": {
"type": "null"
}
},
"required": [
"class",
"backgroundColor",
"title",
"classType",
"icon",
"width",
"height"
]
},
{
"type": "object",
"properties": {
"class": {
"type": "string"
},
"title": {
"type": "string"
},
"rules": {
"type": "array",
"items": {
}
}
},
"required": [
"class",
"title",
"rules"
]
},
{
"type": "object",
"properties": {
"class": {
"type": "string"
},
"cssCode": {
"type": "string"
}
},
"required": [
"class",
"cssCode"
]
},
{
"type": "object",
"properties": {
"class": {
"type": "string"
},
"events": {
"type": "array",
"items": {
}
},
"focusOn": {
"type": "null"
},
"basicEvent": {
"type": "integer"
},
"selectedSecondaryDatasources": {
"type": "array",
"items": {
}
},
"selectedSecondaryDatasource": {
"type": "string"
},
"selectedColumnTrace": {
"type": "integer"
},
"executeValidation": {
"type": "boolean"
},
"selectedSubForm": {
"type": "string"
},
"subFormSize": {
"type": "object",
"properties": {
"width": {
"type": "integer"
},
"widthUnit": {
"type": "string"
},
"height": {
"type": "integer"
},
"heightUnit": {
"type": "string"
}
},
"required": [
"width",
"widthUnit",
"height",
"heightUnit"
]
},
"addDocumentsToDataSource": {
"type": "boolean"
},
"selectedDocumentControl": {
"type": "string"
},
"modalType": {
"type": "string"
},
"modalTitle": {
"type": "string"
},
"modalMessage": {
"type": "string"
},
"modalUseOKButton": {
"type": "boolean"
},
"modalUseTimer": {
"type": "boolean"
},
"modalTimeout": {
"type": "integer"
},
"showMessageOnSuccess": {
"type": "boolean"
},
"clearControlsAfterExecute": {
"type": "boolean"
}
},
"required": [
"class",
"events",
"focusOn",
"basicEvent",
"selectedSecondaryDatasources",
"selectedSecondaryDatasource",
"selectedColumnTrace",
"executeValidation",
"selectedSubForm",
"subFormSize",
"addDocumentsToDataSource",
"selectedDocumentControl",
"modalType",
"modalTitle",
"modalMessage",
"modalUseOKButton",
"modalUseTimer",
"modalTimeout",
"showMessageOnSuccess",
"clearControlsAfterExecute"
]
}
]
},
"children": {
"type": "array",
"items": {
}
},
"layerIndex": {
"type": "integer"
}
},
"required": [
"name",
"component",
"x",
"y",
"rows",
"cols",
"props",
"children",
"layerIndex"
]
}
Este JSON se coloca dentro del array de objetos JSON del nodo children de un control Formulario
[
{
"name": "Button",
"component": "MainFormComponent",
"x": 0,
"y": 0,
"rows": 0,
"cols": 0,
"props": [
{
"class": "BasicPropertiesComponent",
"name": "Button",
"title": "PROPERTIES.BASIC.TITLE",
"label": "Button",
"value": "",
"tooltip": "",
"tooltipPosition": "above",
"font": "Quicksand",
"align": "center-container",
"fontWeight": "inherit",
"fontColor": "#FFFFFF",
"backgroundColor": "#FFFFFF",
"fontSize": 12,
"enabled": true,
"parentEnabled": true,
"visible": true,
"vertical": false,
"fontEffectLineThrough": false,
"fontEffectUnderline": false,
"properties": ["fontColor"],
"labelValue": "value",
"layer": 1,
"validateOnHiddenControl": false,
"isSubForm": false,
"isMainForm": true
},
{
"class": "FormPropertiesComponent",
"title": "PROPERTIES.FORM.TITLE",
"showMessageOnSuccess": true,
"messagesParametersOnSuccess": [],
"messageOnSuccess": "La operación se completó con éxito.",
"showMessageOnError": true,
"messageOnError": "Ha ocurrido un error.",
"closeOnSuccess": true,
"controlType": "standard",
"cols": 6,
"rowHeight": 70,
"themeUseDefaultSettings": true,
"theme": "bizuit",
"modalType": "swal",
"modalTitle": "",
"modalUseOKButton": true,
"modalUseTimer": false,
"modalUseDefaultSettings": true,
"modalTimeout": 0,
"useRaiseEventAsync": false,
"processingWaitTime": 5
},
{
"class": "CustomCodePropertiesComponent",
"events": [],
"focusOn": null,
"basicEvent": 1,
"selectedSecondaryDatasources": [],
"selectedSecondaryDatasource": "",
"selectedColumnTrace": 0,
"executeValidation": true,
"selectedSubForm": "",
"subFormSize": {
"width": 60,
"widthUnit": "percentage",
"height": 60,
"heightUnit": "percentage"
},
"addDocumentsToDataSource": false,
"selectedDocumentControl": "",
"modalType": "swal",
"modalTitle": "",
"modalMessage": "",
"modalUseOKButton": true,
"modalUseTimer": false,
"modalTimeout": 5,
"showMessageOnSuccess": true,
"clearControlsAfterExecute": false
},
{ "class": "CustomStylesPropertiesComponent", "cssCode": "" },
{
"class": "SecurityPropertiesComponent",
"name": "",
"title": "PROPERTIES.SECURITY.TITLE",
"label": "",
"value": "",
"requiresAuthentication": false,
"securityList": []
}
],
"children": [
{
"name": "Button1",
"component": "ButtonComponent",
"x": 0,
"y": 1,
"rows": 1,
"cols": 1,
"props": [
{
"class": "BasicPropertiesComponent",
"name": "Button1",
"title": "PROPERTIES.BASIC.TITLE",
"label": "Button1",
"value": "",
"tooltip": "",
"tooltipPosition": "above",
"font": "Quicksand",
"align": "center-container",
"fontWeight": "inherit",
"fontColor": "#FFFFFF",
"backgroundColor": "#FFFFFF",
"fontSize": 9,
"enabled": true,
"parentEnabled": true,
"visible": true,
"vertical": false,
"fontEffectLineThrough": false,
"fontEffectUnderline": false,
"properties": [
"label",
"font",
"align",
"fontWeight",
"fontColor",
"fontSize",
"enabled",
"visible",
"tooltip"
],
"labelValue": "value",
"layer": 1,
"validateOnHiddenControl": false,
"isSubForm": false,
"isMainForm": false
},
{
"class": "ButtonPropertiesComponent",
"backgroundColor": "primary",
"title": "PROPERTIES.BUTTON.TITLE",
"classType": "mat-raised-button",
"icon": "",
"width": null,
"height": null
},
{
"class": "FormattingPropertiesComponent",
"title": "PROPERTIES.FORMATTING.TITLE",
"rules": []
},
{ "class": "CustomStylesPropertiesComponent", "cssCode": "" },
{
"class": "CustomCodePropertiesComponent",
"events": [],
"focusOn": null,
"basicEvent": 1,
"selectedSecondaryDatasources": [],
"selectedSecondaryDatasource": "",
"selectedColumnTrace": 0,
"executeValidation": true,
"selectedSubForm": "",
"subFormSize": {
"width": 60,
"widthUnit": "percentage",
"height": 60,
"heightUnit": "percentage"
},
"addDocumentsToDataSource": false,
"selectedDocumentControl": "",
"modalType": "swal",
"modalTitle": "",
"modalMessage": "",
"modalUseOKButton": true,
"modalUseTimer": false,
"modalTimeout": 5,
"showMessageOnSuccess": true,
"clearControlsAfterExecute": false
}
],
"children": [],
"layerIndex": 1
}
],
"layerIndex": 1
}
]
Es fundamental que todos los nodos del array props se encuentren presentes.
Cuando incluyas un JSON de un control dentro del array del nodo children de un formulario, asegúrate de codificar las comillas dobles (por ejemplo, "class" debe escribirse como \”class\”) para mantener la validez del JSON en contextos que procesen estas cadenas de caracteres.
{
"name": "FormWithButton",
"controls": "[{\"name\":\"FormWithButton\",\"component\":\"MainFormComponent\",\"x\":0,\"y\":0,\"rows\":0,\"cols\":0,\"props\":[{\"class\":\"BasicPropertiesComponent\",\"name\":\"Button\",\"title\":\"PROPERTIES.BASIC.TITLE\",\"label\":\"Button\",\"value\":\"\",\"tooltip\":\"\",\"tooltipPosition\":\"above\",\"font\":\"Quicksand\",\"align\":\"center-container\",\"fontWeight\":\"inherit\",\"fontColor\":\"#FFFFFF\",\"backgroundColor\":\"#FFFFFF\",\"fontSize\":12,\"enabled\":true,\"parentEnabled\":true,\"visible\":true,\"vertical\":false,\"fontEffectLineThrough\":false,\"fontEffectUnderline\":false,\"properties\":[\"fontColor\"],\"labelValue\":\"value\",\"layer\":1,\"validateOnHiddenControl\":false,\"isSubForm\":false,\"isMainForm\":true},{\"class\":\"FormPropertiesComponent\",\"title\":\"PROPERTIES.FORM.TITLE\",\"showMessageOnSuccess\":true,\"messagesParametersOnSuccess\":[],\"messageOnSuccess\":\"La operación se completó con éxito.\",\"showMessageOnError\":true,\"messageOnError\":\"Ha ocurrido un error.\",\"closeOnSuccess\":true,\"controlType\":\"standard\",\"cols\":6,\"rowHeight\":70,\"themeUseDefaultSettings\":true,\"theme\":\"bizuit\",\"modalType\":\"swal\",\"modalTitle\":\"\",\"modalUseOKButton\":true,\"modalUseTimer\":false,\"modalUseDefaultSettings\":true,\"modalTimeout\":0,\"useRaiseEventAsync\":false,\"processingWaitTime\":5},{\"class\":\"CustomCodePropertiesComponent\",\"events\":[],\"focusOn\":null,\"basicEvent\":1,\"selectedSecondaryDatasources\":[],\"selectedSecondaryDatasource\":\"\",\"selectedColumnTrace\":0,\"executeValidation\":true,\"selectedSubForm\":\"\",\"subFormSize\":{\"width\":60,\"widthUnit\":\"percentage\",\"height\":60,\"heightUnit\":\"percentage\"},\"addDocumentsToDataSource\":false,\"selectedDocumentControl\":\"\",\"modalType\":\"swal\",\"modalTitle\":\"\",\"modalMessage\":\"\",\"modalUseOKButton\":true,\"modalUseTimer\":false,\"modalTimeout\":5,\"showMessageOnSuccess\":true,\"clearControlsAfterExecute\":false},{\"class\":\"CustomStylesPropertiesComponent\",\"cssCode\":\"\"},{\"class\":\"SecurityPropertiesComponent\",\"name\":\"\",\"title\":\"PROPERTIES.SECURITY.TITLE\",\"label\":\"\",\"value\":\"\",\"requiresAuthentication\":false,\"securityList\":[]}],\"children\":[{\"name\":\"Button1\",\"component\":\"ButtonComponent\",\"x\":0,\"y\":1,\"rows\":1,\"cols\":1,\"props\":[{\"class\":\"BasicPropertiesComponent\",\"name\":\"Button1\",\"title\":\"PROPERTIES.BASIC.TITLE\",\"label\":\"Button1\",\"value\":\"\",\"tooltip\":\"\",\"tooltipPosition\":\"above\",\"font\":\"Quicksand\",\"align\":\"center-container\",\"fontWeight\":\"inherit\",\"fontColor\":\"#FFFFFF\",\"backgroundColor\":\"#FFFFFF\",\"fontSize\":9,\"enabled\":true,\"parentEnabled\":true,\"visible\":true,\"vertical\":false,\"fontEffectLineThrough\":false,\"fontEffectUnderline\":false,\"properties\":[\"label\",\"font\",\"align\",\"fontWeight\",\"fontColor\",\"fontSize\",\"enabled\",\"visible\",\"tooltip\"],\"labelValue\":\"value\",\"layer\":1,\"validateOnHiddenControl\":false,\"isSubForm\":false,\"isMainForm\":false},{\"class\":\"ButtonPropertiesComponent\",\"backgroundColor\":\"primary\",\"title\":\"PROPERTIES.BUTTON.TITLE\",\"classType\":\"mat-raised-button\",\"icon\":\"\",\"width\":null,\"height\":null},{\"class\":\"FormattingPropertiesComponent\",\"title\":\"PROPERTIES.FORMATTING.TITLE\",\"rules\":[]},{\"class\":\"CustomStylesPropertiesComponent\",\"cssCode\":\"\"},{\"class\":\"CustomCodePropertiesComponent\",\"events\":[],\"focusOn\":null,\"basicEvent\":1,\"selectedSecondaryDatasources\":[],\"selectedSecondaryDatasource\":\"\",\"selectedColumnTrace\":0,\"executeValidation\":true,\"selectedSubForm\":\"\",\"subFormSize\":{\"width\":60,\"widthUnit\":\"percentage\",\"height\":60,\"heightUnit\":\"percentage\"},\"addDocumentsToDataSource\":false,\"selectedDocumentControl\":\"\",\"modalType\":\"swal\",\"modalTitle\":\"\",\"modalMessage\":\"\",\"modalUseOKButton\":true,\"modalUseTimer\":false,\"modalTimeout\":5,\"showMessageOnSuccess\":true,\"clearControlsAfterExecute\":false}],\"children\":[],\"layerIndex\":1}],\"layerIndex\":1}]",
"dataSources": "[]",
"Version": 1,
"Description": "",
"Category": "",
"Subcategory": ""
}