Lenguaje de plantillas </a></li><li><a href="/es/topics/templates2.html" aria-current="page" class="active sidebar-link">Lenguaje de plantillas </a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#page-construction" class="sidebar-link">Construcción de páginas </a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#template-engine" class="sidebar-link">Motor de plantillas </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#create-pages" class="sidebar-link">Creación de páginas </a></li></ul></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#logicor-template-language" class="sidebar-link">Lenguaje de plantillas Logicor </a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#logicor-overview" class="sidebar-link">Visión general de Logicor </a></li></ul></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#logicor-function-classification" class="sidebar-link">Clasificación de funciones de Logicor </a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#operations-on-variables" class="sidebar-link">Operaciones en variables </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#navigational-operations" class="sidebar-link">Operaciones de navegación. </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#data-manipulation" class="sidebar-link">Operaciones de datos </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#data-presentation" class="sidebar-link">Presentación de datos </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#accepting-of-data" class="sidebar-link">Aceptación de datos </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#data-formatting-elements" class="sidebar-link">Elementos de formato de datos </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#form-elements" class="sidebar-link">Elementos de formulario </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#operations-on-code-blocks" class="sidebar-link">Operaciones en bloques de código </a></li></ul></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#logicor-function-references" class="sidebar-link">Referencias de funciones de Logicor </a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#address" class="sidebar-link">Address </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#addresstoid" class="sidebar-link">AddressToId </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#addtoolbutton" class="sidebar-link">AddToolButton </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#and" class="sidebar-link">And </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#appparam" class="sidebar-link">AppParam </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#arraytosource" class="sidebar-link">ArrayToSource </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#binary" class="sidebar-link">Binary </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#button" class="sidebar-link">Button </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#calculate" class="sidebar-link">Calculate </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#chart" class="sidebar-link">Chart </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#cmptime" class="sidebar-link">CmpTime </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#code" class="sidebar-link">Code </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#codeasis" class="sidebar-link">CodeAsIs </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#data" class="sidebar-link">Data </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#custom" class="sidebar-link">Custom </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#datetime" class="sidebar-link">DateTime </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#dbfind" class="sidebar-link">DBFind </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#div" class="sidebar-link">Div </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#ecosysparam" class="sidebar-link">EcosysParam </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#em" class="sidebar-link">Em </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#forlist" class="sidebar-link">ForList </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#form" class="sidebar-link">Form </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#getcolumntype" class="sidebar-link">GetColumnType </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#gethistory" class="sidebar-link">GetHistory </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#getvar" class="sidebar-link">GetVar </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#hint" class="sidebar-link">Hint </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#if" class="sidebar-link">If </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#image" class="sidebar-link">Image </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#imageinput" class="sidebar-link">ImageInput </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#include" class="sidebar-link">Include </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#input" class="sidebar-link">Input </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#inputerr" class="sidebar-link">InputErr </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#inputmap" class="sidebar-link">InputMap </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#jsontosource" class="sidebar-link">JsonToSource </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#label" class="sidebar-link">Label </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#langres" class="sidebar-link">LangRes </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#linkpage" class="sidebar-link">LinkPage </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#map" class="sidebar-link">Map </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#menugroup" class="sidebar-link">MenuGroup </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#menuitem" class="sidebar-link">MenuItem </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#money" class="sidebar-link">Money </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#or" class="sidebar-link">Or </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#p" class="sidebar-link">P </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#qrcode" class="sidebar-link">QRcode </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#radiogroup" class="sidebar-link">RadioGroup </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#range" class="sidebar-link">Range </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#select" class="sidebar-link">Select </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#settitle" class="sidebar-link">SetTitle </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#setvar" class="sidebar-link">SetVar </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#span" class="sidebar-link">Span </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#strong" class="sidebar-link">Strong </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#sysparam" class="sidebar-link">SysParam </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#table" class="sidebar-link">Table </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#transactioninfo" class="sidebar-link">TransactionInfo </a></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#varasis" class="sidebar-link">VarAsIs </a></li></ul></li><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#app-styles-for-mobile-devices" class="sidebar-link">Estilo de aplicación adaptado para dispositivos móviles </a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/es/topics/templates2.html#layout" class="sidebar-link">Layout </a></li></ul></li></ul></li><li><a href="/es/topics/vm.html" class="sidebar-link">Compilador y máquina virtual </a></li><li><a href="/es/topics/daemons.html" class="sidebar-link">Demonio </a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="template-language"><a href="#template-language" class="header-anchor">#</a> Lenguaje de plantillas </h1> <ul><li><a href="#page-construction">Construcción de páginas</a> <ul><li><a href="#template-engine">Motor de plantillas</a></li> <li><a href="#create-pages">Creación de páginas</a> <ul><li><a href="#visual-page-designer">Diseñador de páginas visual</a></li> <li><a href="#applicable-styles">Uso de estilos</a></li> <li><a href="#page-module">Módulos de página</a></li> <li><a href="#language-resource-editor">Editor de recursos multilingües</a></li></ul></li></ul></li> <li><a href="#logicor-template-language">Lenguaje de plantillas Logicor</a> <ul><li><a href="#logicor-overview">Visión general de Logicor</a> <ul><li><a href="#use-pageparams-to-pass-parameters-to-pages">Use PageParams to pass parameters to pages</a></li> <li><a href="#calling-contracts">Calling contracts</a></li></ul></li></ul></li> <li><a href="#logicor-function-classification">Clasificación de funciones de Logicor</a> <ul><li><a href="#operations-on-variables">Operaciones en variables</a></li> <li><a href="#navigational-operations">Operaciones de navegación</a></li> <li><a href="#data-manipulation">Operaciones de datos</a></li> <li><a href="#data-presentation">Presentación de datos</a></li> <li><a href="#accepting-of-data">Aceptación de datos</a></li> <li><a href="#data-formatting-elements">Elementos de formato de datos</a></li> <li><a href="#form-elements">Elementos de formulario</a></li> <li><a href="#operations-on-code-blocks">Operaciones en bloques de código</a></li></ul></li> <li><a href="#logicor-function-references">Referencias de funciones de Logicor</a> <ul><li><a href="#address">Address</a></li> <li><a href="#addresstoid">AddressToId</a></li> <li><a href="#addtoolbutton">AddToolButton</a></li> <li><a href="#and">And</a></li> <li><a href="#appparam">AppParam</a></li> <li><a href="#arraytosource">ArrayToSource</a></li> <li><a href="#binary">Binary</a></li> <li><a href="#button">Button</a></li> <li><a href="#calculate">Calculate</a></li> <li><a href="#chart">Chart</a></li> <li><a href="#cmptime">CmpTime</a></li> <li><a href="#code">Code</a></li> <li><a href="#codeasis">CodeAsIs</a></li> <li><a href="#data">Data</a></li> <li><a href="#custom">Custom</a></li> <li><a href="#datetime">DateTime</a></li> <li><a href="#dbfind">DBFind</a></li> <li><a href="#div">Div</a></li> <li><a href="#ecosysparam">EcosysParam</a></li> <li><a href="#em">Em</a></li> <li><a href="#forlist">ForList</a></li> <li><a href="#form">Form</a></li> <li><a href="#getcolumntype">GetColumnType</a></li> <li><a href="#gethistory">GetHistory</a></li> <li><a href="#getvar">GetVar</a></li> <li><a href="#hint">Hint</a></li> <li><a href="#if">If</a></li> <li><a href="#image">Image</a></li> <li><a href="#imageinput">ImageInput</a></li> <li><a href="#include">Include</a></li> <li><a href="#input">Input</a></li> <li><a href="#inputerr">InputErr</a></li> <li><a href="#inputmap">InputMap</a></li> <li><a href="#jsontosource">JsonToSource</a></li> <li><a href="#label">Label</a></li> <li><a href="#langres">LangRes</a></li> <li><a href="#linkpage">LinkPage</a></li> <li><a href="#map">Map</a></li> <li><a href="#menugroup">MenuGroup</a></li> <li><a href="#menuitem">MenuItem</a></li> <li><a href="#money">Money</a></li> <li><a href="#or">Or</a></li> <li><a href="#p">P</a></li> <li><a href="#qrcode">QRcode</a></li> <li><a href="#radiogroup">RadioGroup</a></li> <li><a href="#range">Range</a></li> <li><a href="#select">Select</a></li> <li><a href="#settitle">SetTitle</a></li> <li><a href="#setvar">SetVar</a></li> <li><a href="#span">Span</a></li> <li><a href="#strong">Strong</a></li> <li><a href="#sysparam">SysParam</a></li> <li><a href="#table">Table</a></li> <li><a href="#transactioninfo">TransactionInfo</a></li> <li><a href="#varasis">VarAsIs</a></li></ul></li> <li><a href="#app-styles-for-mobile-devices">Estilo de aplicación adaptado para dispositivos móviles.</a> <ul><li><a href="#layout">Layout</a> <ul><li><a href="#title">Título</a></li> <li><a href="#strong-class-names">Nombres de clase de énfasis</a></li> <li><a href="#color">Color</a></li></ul></li> <li><a href="#grid">Cuadrícula</a></li> <li><a href="#panel">Panel</a></li> <li><a href="#form-app">Formulario</a></li> <li><a href="#button-app">Botón</a></li> <li><a href="#icon">Icono</a></li></ul></li></ul> <h2 id="page-construction"><a href="#page-construction" class="header-anchor">#</a> Construcción de páginas </h2> <p>El entorno de desarrollo integrado de Weaver se crea utilizando la biblioteca <em>JavaScript React</em>, que incluye un editor de páginas y un diseñador de páginas visual. Las páginas son la parte fundamental de la aplicación, que proporcionan la recuperación y visualización de datos de tablas de bases de datos, la creación de formularios para recibir datos de entrada de los usuarios, la transmisión de datos a contratos y la navegación entre páginas de la aplicación.</p> <p>Las páginas, al igual que los contratos, se almacenan en la cadena de bloques, lo que garantiza que no se puedan manipular cuando se cargan en el cliente de software.</p> <h3 id="template-engine"><a href="#template-engine" class="header-anchor">#</a> Motor de plantillas </h3> <p>Los elementos de la página (página y menú) son creados por los desarrolladores en el editor de páginas de Weaver utilizando lenguaje de plantillas en el <em>motor de plantillas</em> de los nodos de validación.</p> <p>Todas las páginas están construidas utilizando el lenguaje Logicor desarrollado por el equipo de desarrollo de la plataforma blockchain IBAX. Se utiliza el comando de API <em>content/...</em> para solicitar páginas desde un nodo en la red.</p> <p>El motor de plantillas envía como respuesta a este tipo de solicitudes no una página HTML, sino un código JSON compuesto por etiquetas HTML que forman un árbol según la estructura de la plantilla. Si desea probar el motor de plantillas, consulte la interfaz de API <a href="/es/reference/api2.html#content">content</a>.</p> <h3 id="create-pages"><a href="#create-pages" class="header-anchor">#</a> Creación de páginas </h3> <p>Puede utilizar el editor de páginas para crear y editar páginas, que se puede encontrar en la sección <strong>Páginas</strong> de las herramientas de administración de Weaver. Este editor proporciona:</p> <ul><li>Escribir código de página, resaltando las palabras clave del lenguaje de plantillas Logicor;</li> <li>Selección de menús que se mostrarán en la página;</li> <li>Edición de la página de menú;</li> <li>Configuración para cambiar los permisos de la página, especificando los nombres de contrato con permisos en la función <em>ContractConditions</em>, o especificando directamente los permisos de acceso en <em>Cambiar condiciones</em>;</li> <li>Iniciar el diseñador de páginas visual;</li> <li>Vista previa de la página.</li></ul> <h4 id="visual-page-designer"><a href="#visual-page-designer" class="header-anchor">#</a> Diseñador de páginas visual </h4> <p>El diseñador de páginas visual permite crear diseños de páginas sin necesidad de utilizar código de interfaz de usuario en Logicor.</p> <p>El diseñador visual utiliza la función de arrastrar y soltar para establecer la posición de los elementos del formulario y el texto en la página, así como para configurar el tamaño de los bloques de la página.</p> <p>El diseñador visual proporciona un conjunto de bloques listos para usar para mostrar modelos de datos estándar: con títulos, formularios y paneles de información. Después de crear una página en el diseñador visual, se puede escribir la lógica del programa que recibe los datos y las estructuras condicionales en el editor de la página.</p> <p>En el futuro, planeamos crear un diseñador de páginas visual más completo.</p> <h4 id="applicable-styles"><a href="#applicable-styles" class="header-anchor">#</a> Uso de estilos </h4> <p>El estilo predeterminado para mostrar la página es el estilo de Bootstrap Angle de Angular. Si es necesario, el usuario puede crear su propio estilo. El estilo se almacena en el parámetro de estilo <em>stylesheet</em> de la tabla de parámetros del ecosistema.</p> <h4 id="page-module"><a href="#page-module" class="header-anchor">#</a> Módulos de página </h4> <p>Para utilizar fragmentos de código en varias páginas, puedes crear módulos de página e incrustarlos en el código de la página. En los <strong>Bloques de módulos</strong> de Weaver puedes crear y editar estos módulos de página. Al igual que con las páginas, puedes definir permisos de edición.</p> <h4 id="language-resource-editor"><a href="#language-resource-editor" class="header-anchor">#</a> Editor de recursos multilingües </h4> <p>Weaver incluye un mecanismo para localizar páginas utilizando la función de lenguaje de plantilla Logicor <strong>LangRes</strong>. Reemplaza las etiquetas de recursos de idioma en la página con las líneas de texto correspondientes para el idioma seleccionado por el usuario en el cliente de software o navegador. La sintaxis <strong>$label$</strong> se puede usar en lugar de la función <strong>LangRes</strong>. La traducción de mensajes en ventanas emergentes iniciadas por el contrato se realiza mediante la función <strong>LangRes</strong> del lenguaje Needle.</p> <p>Los recursos de idioma se pueden crear y editar en la sección <strong>Recursos de idioma</strong> de Weaver. Un recurso de idioma consta de un nombre de etiqueta y su traducción en diferentes idiomas, marcados con el identificador de idioma de dos caracteres correspondiente (EN, ZH, JP, etc.).</p> <p>Los permisos para agregar y modificar recursos de idioma se pueden definir y administrar de la misma manera que para otras tablas de datos.</p> <h2 id="logicor-template-language"><a href="#logicor-template-language" class="header-anchor">#</a> Lenguaje de plantillas Logicor </h2> <p>La función Logicor ofrece las siguientes operaciones:</p> <ul><li>Recuperar valores de la base de datos: <code>DBFind</code>, que representa los datos recuperados de la base de datos como tablas y gráficos;</li> <li>Operaciones de asignación y visualización de valores de variables: <code>SetVar, GetVar, Data</code>;</li> <li>Visualización y comparación de valores de fecha/hora: <code>DateTime, Now, CmpTime</code>;</li> <li>Construir formularios con varios campos de entrada de datos de usuario: <code>Form, ImageInput, Input, RadioGroup, Select</code>;</li> <li>Validar los datos en los campos del formulario y mostrar mensajes de error: <code>Validate, InputErr</code>;</li> <li>Mostrar elementos de navegación: <code>AddToolButton, LinkPage, Button</code>;</li> <li>Llamar a contratos: <code>Button</code>;</li> <li>Crear elementos de diseño de página HTML, incluyendo varias etiquetas y clases CSS opcionales: <code>Div, P, Span, etc.</code>;</li> <li>Insertar imágenes en la página y cargar imágenes: <code>Image, ImageInput</code>;</li> <li>Mostrar fragmentos de diseño de página condicionalmente: <code>If, ElseIf, Else</code>;</li> <li>Crear menús de varios niveles;</li> <li>Localizar la página.</li></ul> <h3 id="logicor-overview"><a href="#logicor-overview" class="header-anchor">#</a> Visión general de Logicor </h3> <p>La página de plantilla de Logicor utiliza un lenguaje funcional que permite llamar funciones con la sintaxis <code>FuncName(parametros)</code> y anidar funciones dentro de otras. Los parámetros pueden ser especificados sin comillas y se pueden eliminar los que no sean necesarios.</p> <div class="language-text extra-class"><pre class="language-text"><code>Text FuncName(parameter number 1, parameter number 2) another text. FuncName(parameter 1,,,parameter 4) </code></pre></div><p>Si un parámetro contiene una coma, debe estar entre comillas (backticks o comillas dobles). Si una función solo puede tener un parámetro, se puede usar una coma sin comillas. Además, si un parámetro tiene paréntesis derechos no emparejados, se deben usar comillas.</p> <div class="language-text extra-class"><pre class="language-text"><code>FuncName("parameter number 1, the second part of first paremeter") FuncName(`parameter number 1, the second part of first paremeter`) </code></pre></div><p>Si se colocan los parámetros entre comillas, pero los parámetros en sí mismos contienen comillas, se pueden usar diferentes tipos de comillas o varias comillas en el texto.</p> <div class="language-text extra-class"><pre class="language-text"><code>FuncName("parameter number 1, ""the second part of first"" paremeter") FuncName(`parameter number 1, "the second part of first" paremeter`) </code></pre></div><p>En la definición de una función, cada parámetro tiene un nombre específico. Puede llamar a la función en el orden en que se declararon los parámetros y especificar los argumentos, o especificar cualquier conjunto de argumentos en cualquier orden mediante <code>Parameter_name: Parameter_value</code>. Este método permite agregar nuevos parámetros de función de manera segura sin romper la compatibilidad con la plantilla actual.</p> <div class="language-text extra-class"><pre class="language-text"><code>FuncName(myclass, This is value, Div(divclass, This is paragraph.)) FuncName(Body: Div(divclass, This is paragraph.)) FuncName(myclass, Body: Div(divclass, This is paragraph.)) FuncName(Value: This is value, Body: Div(divclass, This is paragraph.) ) FuncName(myclass, Value without Body) </code></pre></div><p>La función puede devolver texto, generar elementos HTML (por ejemplo, <code>Input</code>), o crear elementos HTML con elementos HTML anidados (<code>Div, P, Span</code>). En este último caso, se utiliza un parámetro con el nombre predefinido <strong>Body</strong> para definir los elementos anidados. Por ejemplo, para anidar dos divs dentro de otro div, se puede hacer lo siguiente:</p> <div class="language-text extra-class"><pre class="language-text"><code>Div(Body: Div(class1, This is the first div.) Div(class2, This is the second div.) ) </code></pre></div><p>Para definir los elementos anidados descritos en el parámetro <strong>Body</strong>, puedes usar la siguiente notación: <code>FuncName(...){...}</code>. Los elementos anidados se especifican utilizando llaves:</p> <div class="language-text extra-class"><pre class="language-text"><code>Div(){ Div(class1){ P(This is the first div.) Div(class2){ Span(This is the second div.) } } } </code></pre></div><p>Si necesitas especificar repetidamente la misma función, puedes usar un punto <code>.</code> en lugar de escribir el nombre de la función cada vez. Por ejemplo, estos son equivalentes:</p> <div class="language-text extra-class"><pre class="language-text"><code>Span(Item 1)Span(Item 2)Span(Item 3) Span(Item 1).(Item 2).(Item 3) </code></pre></div><p>El lenguaje permite el uso de la función <strong>SetVar</strong> para asignar variables, y el valor de la variable se puede referenciar usando <code>#name#</code>.</p> <div class="language-text extra-class"><pre class="language-text"><code>SetVar(name, My Name) Span(Your name: #name#) </code></pre></div><p>Para hacer referencia a los recursos de lenguaje en el ecosistema, puedes usar <code>$langres$</code>, donde <em>langres</em> es el nombre de la fuente de lenguaje.</p> <div class="language-text extra-class"><pre class="language-text"><code>Span($yourname$: #name#) </code></pre></div><p>Se han predefinido las siguientes variables:</p> <ul><li><code>#key_id#</code> - Dirección de cuenta del usuario actual;</li> <li><code>#ecosystem_id#</code> - ID del ecosistema actual;</li> <li><code>#guest_key#</code> - Dirección de cuenta de invitado;</li> <li><code>#isMobile#</code> - Si Weaver se está ejecutando en un dispositivo móvil, es 1.</li></ul> <h4 id="use-pageparams-to-pass-parameters-to-pages"><a href="#use-pageparams-to-pass-parameters-to-pages" class="header-anchor">#</a> PageParams </h4> <p>Utiliza PageParams para pasar parámetros a la página.</p> <p>Hay muchas funciones que admiten el parámetro <strong>PageParams</strong>, que se utiliza para pasar parámetros al redirigir a una nueva página. Por ejemplo: <code>PageParams: "param1=value1,param2=value2"</code>.</p> <p>Los valores de los parámetros pueden ser simples cadenas o variables con valores de referencia. Al pasar los parámetros a la página, se crean variables con los nombres de los parámetros. Por ejemplo, <code>#param1#</code> y <code>#param2#</code>.</p> <ul><li><code>PageParams: "hello=world"</code> - la nueva página recibe el parámetro hello con el valor world;</li> <li><code>PageParams: "hello=#world#"</code> - la nueva página recibe el parámetro hello con el valor de la variable world.</li></ul> <h4 id=""><a href="#" class="header-anchor">#</a> Val (#val)</h4> <p>Además, la función <strong>Val</strong> permite obtener datos del formulario que se especifican en la redirección.</p> <ul><li><code>PageParams: "hello=Val(world)"</code> - La nueva página recibe el parámetro hello con el valor del elemento del formulario world.</li></ul> <h4 id="calling-contracts"><a href="#calling-contracts" class="header-anchor">#</a> Llamar a un contrato inteligente. </h4> <p>Logicor utiliza la función <strong>Button</strong> para realizar llamadas de contrato haciendo clic en un botón en el formulario. Una vez que se inicia este evento, los datos ingresados por el usuario en los campos del formulario de la página se pasarán al contrato.</p> <p>Si el nombre del campo del formulario coincide con el nombre de la variable en la sección de datos del contrato que se llama, los datos se transferirán automáticamente.</p> <p>La función <strong>Button</strong> permite abrir una ventana modal para que el usuario verifique la ejecución del contrato y, después de una ejecución exitosa del contrato, inicie una redirección a una página específica y pase algunos parámetros a esa página.</p> <h2 id="logicor-function-classification"><a href="#logicor-function-classification" class="header-anchor">#</a> Clasificación de funciones de Logicor </h2> <h3 id="operations-on-variables"><a href="#operations-on-variables" class="header-anchor">#</a> Operaciones en variables </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#getvar">GetVar</a></td> <td><a href="#setvar">SetVar</a></td> <td><a href="#varasis">VarAsIs</a></td></tr></tbody></table> <h3 id="navigational-operations"><a href="#navigational-operations" class="header-anchor">#</a> Operaciones de navegación. </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#addtoolbutton">AddToolButton</a></td> <td><a href="#button">Button</a></td> <td><a href="#linkpage">LinkPage</a></td></tr></tbody></table> <h3 id="data-manipulation"><a href="#data-manipulation" class="header-anchor">#</a> Operaciones de datos </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#calculate">Calculate</a></td> <td><a href="#datetime">DateTime</a></td> <td><a href="#money">Money</a></td></tr> <tr><td><a href="#cmptime">CmpTime</a></td> <td></td> <td></td></tr></tbody></table> <h3 id="data-presentation"><a href="#data-presentation" class="header-anchor">#</a> Presentación de datos </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#code">Code</a></td> <td><a href="#hint">Hint</a></td> <td><a href="#menuitem">MenuItem</a></td></tr> <tr><td><a href="#codeasis">CodeAsIs</a></td> <td><a href="#image">Image</a></td> <td><a href="#qrcode">QRcode</a></td></tr> <tr><td><a href="#chart">Chart</a></td> <td><a href="#menugroup">MenuGroup</a></td> <td><a href="#table">Table</a></td></tr> <tr><td><a href="#forlist">ForList</a></td> <td></td> <td></td></tr></tbody></table> <h3 id="accepting-of-data"><a href="#accepting-of-data" class="header-anchor">#</a> Aceptación de datos </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#address">Address</a></td> <td><a href="#ecosysparam">EcosysParam</a></td> <td><a href="#langres">LangRes</a></td></tr> <tr><td><a href="#addresstoid">AddressToId</a></td> <td><a href="#gethistory">GetHistory</a></td> <td><a href="#range">Range</a></td></tr> <tr><td><a href="#appparam">AppParam</a></td> <td><a href="#getcolumntype">GetColumnType</a></td> <td><a href="#sysparam">SysParam</a></td></tr> <tr><td><a href="#data">Data</a></td> <td><a href="#jsontosource">JsonToSource</a></td> <td><a href="#binary">Binary</a></td></tr> <tr><td><a href="#dbfind">DBFind</a></td> <td><a href="#arraytosource">ArrayToSource</a></td> <td><a href="#transactioninfo">TransactionInfo</a></td></tr></tbody></table> <h3 id="data-formatting-elements"><a href="#data-formatting-elements" class="header-anchor">#</a> Elementos de formato de datos </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#div">Div</a></td> <td><a href="#settitle">SetTitle</a></td> <td><a href="#span">Span</a></td></tr> <tr><td><a href="#em">Em</a></td> <td><a href="#label">Label</a></td> <td><a href="#strong">Strong</a></td></tr> <tr><td><a href="#p">P</a></td> <td></td> <td></td></tr></tbody></table> <h3 id="form-elements"><a href="#form-elements" class="header-anchor">#</a> Elementos de formulario </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#form">Form</a></td> <td><a href="#inputerr">InputErr</a></td> <td><a href="#inputmap">InputMap</a></td></tr> <tr><td><a href="#imageinput">ImageInput</a></td> <td><a href="#radiogroup">RadioGroup</a></td> <td><a href="#map">Map</a></td></tr> <tr><td><a href="#input">Input</a></td> <td><a href="#select">Select</a></td> <td></td></tr></tbody></table> <h3 id="operations-on-code-blocks"><a href="#operations-on-code-blocks" class="header-anchor">#</a> Operaciones en bloques de código </h3> <table><thead><tr><th></th> <th></th> <th></th></tr></thead> <tbody><tr><td><a href="#if">If</a></td> <td><a href="#or">Or</a></td> <td><a href="#include">Include</a></td></tr> <tr><td><a href="#and">And</a></td> <td></td> <td></td></tr></tbody></table> <h2 id="logicor-function-references"><a href="#logicor-function-references" class="header-anchor">#</a> Referencias de funciones de Logicor </h2> <h3 id="address"><a href="#address" class="header-anchor">#</a> Address </h3> <p>La función devuelve la dirección de la billetera <code>xxxx-xxxx-...-xxxx</code> de la cuenta especificada; si no se especifica una dirección, se utiliza la dirección de la cuenta actual como parámetro.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Address(account) </code></pre></div><ul><li><p>Address</p> <ul><li><p>account</p> <p>账户地址。</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Span(Your wallet: Address(#account#)) </code></pre></div><h3 id="addresstoid"><a href="#addresstoid" class="header-anchor">#</a> AddressToId </h3> <p>Esta función devuelve la dirección de la cuenta para la dirección de la billetera especificada <code>xxxx-xxxx-...-xxxx</code>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>AddressToId(Wallet) </code></pre></div><ul><li><p>AddressToId</p> <ul><li><p>Wallet</p> <p>Dirección de billetera en formato <code>XXXX-...-XXXX</code>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>AddressToId(#wallet#) </code></pre></div><h3 id="addtoolbutton"><a href="#addtoolbutton" class="header-anchor">#</a> AddToolButton </h3> <p>Crear un panel de botones con el elemento <strong>addtoolbutton</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>AddToolButton(Title, Icon, Page, PageParams) [.Popup(Width, Header)] </code></pre></div><ul><li><p>AddToolButton</p> <ul><li><p>Title</p> <p>Título del botón.</p></li> <li><p>Icon</p> <p>Estilo del icono del botón.</p></li> <li><p>Page</p> <p>Nombre de la página a la que se redirige.</p></li> <li><p>Pageparams</p> <p>Parámetros que se pasan a la página.</p></li> <li><p>Popup</p> <p>Ventana emergente modal.</p></li> <li><p>Header</p> <p>Título de la ventana.</p></li> <li><p>Width</p> <p>Porcentaje de ancho de la ventana.</p> <p>El valor de este parámetro está en el rango de 1 a 100.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>AddToolButton(Title: $@1broadcast$, Page: @1notifications_broadcast, Icon: icon-plus).Popup(Header: $@1notifications_broadcast$, Width: "50") </code></pre></div><h3 id="and"><a href="#and" class="header-anchor">#</a> And </h3> <p>La función devuelve el resultado de la operación lógica <strong>and</strong> de todos los argumentos listados entre paréntesis, separados por comas. Si uno de los argumentos es una cadena vacía, cero o <code>false</code>, su valor es <code>false</code>. En cualquier otro caso, su valor es <code>true</code>. Si el valor del argumento es <code>true</code>, la función devuelve <code>1</code>, en cualquier otro caso devuelve <code>0</code>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>And(parameters) </code></pre></div><p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>If(And(#myval1#,#myval2#), Span(OK)) </code></pre></div><h3 id="appparam"><a href="#appparam" class="header-anchor">#</a> AppParam </h3> <p>Muestra el valor del parámetro de la aplicación, tomado de la tabla <em>app_params</em> del ecosistema actual. Si existe un recurso de idioma con el nombre especificado, su valor se sustituirá automáticamente.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>AppParam(App, Name, Index, Source) </code></pre></div><ul><li><p>AppParam</p> <ul><li><p>App</p> <p>Identificación de la aplicación.</p></li> <li><p>Name</p> <p>Nombre del parámetro.</p></li> <li><p>Index</p> <p>Cuando el valor del parámetro es una lista separada por comas, se puede utilizar este parámetro.</p> <p>El índice del elemento del parámetro comienza en 1. Por ejemplo, si <code>type = full,light</code>, entonces <code>AppParam(1, type, 2)</code> devuelve <code>light</code>.</p> <p>Este parámetro no se puede utilizar junto con el parámetro <em>Source</em>.</p></li> <li><p>Source</p> <p>Cuando el valor del parámetro es una lista separada por comas, se puede utilizar este parámetro.</p> <p>Crea un objeto <em>data</em> cuyos elementos son los valores especificados del parámetro. Este objeto se puede utilizar como fuente de datos para las funciones <a href="#table">Table</a> y <a href="#select">Select</a>.</p> <p>Este parámetro no se puede utilizar junto con el parámetro <em>Index</em>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>AppParam(1, type, Source: mytype) </code></pre></div><h3 id="arraytosource"><a href="#arraytosource" class="header-anchor">#</a> ArrayToSource </h3> <p>Crear un elemento <strong>arraytosource</strong> y llenarlo con pares clave-valor de un arreglo JSON. Los datos resultantes se colocan en el elemento <em>Source</em>, que luego se puede utilizar en una función de entrada de origen (por ejemplo, <a href="#Table">Table</a>).</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>ArrayToSource(Source, Data) </code></pre></div><ul><li><p>ArrayToSource</p> <ul><li><p>Source</p> <p>Nombre de la fuente de datos.</p></li></ul></li> <li><p>Data</p> <p>Una matriz JSON o un nombre de variable (<code>#name#</code>) que contiene una matriz JSON.</p></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>ArrayToSource(src, #myjsonarr#) ArrayToSource(dat, [1, 2, 3]) </code></pre></div><h3 id="binary"><a href="#binary" class="header-anchor">#</a> Binary </h3> <p>Devolver el enlace al archivo estático almacenado en la tabla binaria <em>binaries</em>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Binary(Name, AppID, MemberID)[.ById(ID)][.Ecosystem(ecosystem)] </code></pre></div><ul><li><p>Binary</p> <ul><li><p>Name</p> <p>Nombre del archivo.</p></li> <li><p>AppID</p> <p>Identificación de la aplicación.</p></li> <li><p>MemberID</p> <p>Dirección de cuenta, por defecto 0.</p></li> <li><p>ID</p> <p>ID de archivo estático.</p></li> <li><p>ecosystem</p> <p>ID del ecosistema. Si no se especifica este parámetro, se solicita el archivo binario desde el ecosistema actual.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Image(Src: Binary("my_image", 1)) Image(Src: Binary().ById(2)) Image(Src: Binary().ById(#id#).Ecosystem(#eco#)) </code></pre></div><h3 id="button"><a href="#button" class="header-anchor">#</a> Button </h3> <p>Crea un elemento HTML <strong>button</strong>. Este elemento crea un botón que se utiliza para llamar a un contrato o abrir una página.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Button(Body, Page, Class, Contract, Params, PageParams) [.CompositeContract(Contract, Data)] [.Alert(Text, ConfirmButton, CancelButton, Icon)] [.Popup(Width, Header)] [.Style(Style)] [.ErrorRedirect((ErrorID,PageName,PageParams)] </code></pre></div><ul><li><p>Button</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Page</p> <p>Nombre de la página redirigida.</p></li> <li><p>Class</p> <p>Botón.</p></li> <li><p>Contract</p> <p>Nombre del contrato inteligente invocado.</p></li> <li><p>Params</p> <p>Lista de valores pasados al contrato. Por lo general, los valores de los parámetros del contrato (parte <code>data</code>) se obtienen de los elementos HTML con nombres similares al <code>id</code>.</p> <p>Si el <code>id</code> del elemento es diferente al nombre del parámetro del contrato, se debe asignar en el formato <code>contractField1=idname1, contractField2=idname2</code>.</p> <p>Este parámetro se devuelve como un objeto <code>{contractField1: idname1, contractField2: idname2}</code> en <em>attr</em>.</p></li> <li><p>PageParams</p> <p>El formato de los parámetros pasados a la página de redirección es <code>pageField1=idname1, pageField2=idname2</code>.</p> <p>Las variables con los nombres de parámetros de destino <code>#pageField1</code> y <code>#pageField2</code> se crean en la página de destino y se les asignan los valores especificados. Para obtener más información sobre la especificación de pasos de parámetros, consulte <a href="#pageparams">Cómo pasar parámetros a una página usando PageParams</a>.</p></li></ul></li> <li><p>CompositeContract</p> <p>"Se utiliza para agregar contratos adicionales a un botón. CompositeContract se puede utilizar varias veces."</p> <ul><li><p>Name</p> <p>Nombre del contrato.</p></li> <li><p>Data</p> <p>The contract parameters are a JSON array.</p></li></ul></li> <li><p>Alert</p> <p>Mostrar mensaje.</p> <ul><li><p>Text</p> <p>Mensaje de texto.</p></li> <li><p>ConfirmButton</p> <p>El título del botón de confirmación.</p></li> <li><p>CancelButton</p> <p>Título del botón Cancelar.</p></li> <li><p>Icon</p> <p>Icono de botón.</p></li></ul></li> <li><p>Popup</p> <p>Output ventana modal.</p> <ul><li><p>Header</p> <p>Título de la ventana.</p></li> <li><p>Width</p> <p>Ancho de la ventana en porcentaje.</p> <p>El valor de este parámetro varía de 1 a 100.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li> <li><p>ErrorRedirect</p> <p>Especifique una página de redireccionamiento que se utilizará cuando la función <code>contractfundef-Throw</code>{.interpreted-text role="ref"} genere un error durante la ejecución del contrato.</p> <p>Puede haber varias llamadas a <em>ErrorRedirect</em>. Por lo tanto, al devolver el atributo <em>errredirect</em>, su clave es <em>ErrorID</em> y su valor es una lista de parámetros.</p> <ul><li><p>ErrorID</p> <p>ID de error.</p></li> <li><p>PageName</p> <p>Nombre de la página de redireccionamiento.</p></li> <li><p>PageParams</p> <p>Parámetros pasados a esta página.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Button(Submit, default_page, mybtn_class).Alert(Alert message) Button(Contract: MyContract, Body:My Contract, Class: myclass, Params:"Name=myid,Id=i10,Value") </code></pre></div><h3 id="calculate"><a href="#calculate" class="header-anchor">#</a> Calculate </h3> <p>La función devuelve el resultado de la expresión aritmética pasada en el parámetro <strong>Exp</strong>. Se pueden utilizar las siguientes operaciones: <code>+, -, *, /</code> y paréntesis <code>()</code>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Calculate(Exp, Type, Prec) </code></pre></div><ul><li><p>Calculate</p> <ul><li><p>Exp</p> <p>Arithmetic expression. Puede contener números y variables <em>nombre</em>.</p></li> <li><p>Type</p></li></ul> <p>Resultado del tipo de datos: int, float, dinero.</p> <p>Si no se especifica, si hay números con decimales, el tipo de resultado será float, en otros casos será int.</p> <ul><li><p>Prec</p> <p>El tipo de datos <strong>float</strong> y <strong>money</strong> especifican la cantidad de dígitos significativos después del punto decimal.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Calculate( Exp: (342278783438+5000)\*(#val#-932780000), Type: money, Prec:18 ) Calculate(10000-(34+5)\*#val#) Calculate("((10+#val#-45)\*3.0-10)/4.5 + #val#", Prec: 4) </code></pre></div><h3 id="chart"><a href="#chart" class="header-anchor">#</a> Chart </h3> <p>Crear gráficos HTML.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Chart(Type, Source, FieldLabel, FieldValue, Colors) </code></pre></div><ul><li><p>Chart</p> <ul><li><p>Type</p> <p>Tipo de gráfico.</p></li> <li><p>Source</p> <p>Nombre de la fuente de datos, por ejemplo, obtenido de la función <a href="#DBFind">DBFind</a>.</p></li> <li><p>FieldLabel</p> <p>Nombre de los campos del encabezado.</p></li> <li><p>FieldValue</p> <p>Nombre del campo de valor.</p></li> <li><p>Colors</p> <p>Lista de colores.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Data(mysrc,"name,count"){ John Silver,10 "Mark, Smith",20 "Unknown ""Person""",30 } Chart(Type: "bar", Source: mysrc, FieldLabel: "name", FieldValue: "count", Colors: "red, green") </code></pre></div><h3 id="cmptime"><a href="#cmptime" class="header-anchor">#</a> CmpTime </h3> <p>Esta función compara dos valores de tiempo en el mismo formato.</p> <p>El formato admite unixtime, <code>YYYY-MM-DD HH:MM:SS</code>, y cualquier formato de tiempo, como desde el año hasta el segundo <code>YYYYMMDD</code>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>CmpTime(Time1, Time2) </code></pre></div><p><strong>Valor de retorno</strong></p> <ul><li><code>-1</code> - Time1 < Time2；</li> <li><code>0</code> - Time1 = Time2；</li> <li><code>1</code> - Time1 > Time2。</li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>If(CmpTime(#time1#, #time2#)<0){...} </code></pre></div><h3 id="code"><a href="#code" class="header-anchor">#</a> Code </h3> <p>Crear un elemento <strong>code</strong> para mostrar el código especificado.</p> <p>La función reemplaza el valor de la variable con el valor de la variable (por ejemplo, <code>#name#</code>).</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Code(Text) </code></pre></div><ul><li><p>Code</p> <ul><li><p>Text</p> <p>Código fuente.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Code( P(This is the first line. Span(This is the second line.)) ) </code></pre></div><h3 id="codeasis"><a href="#codeasis" class="header-anchor">#</a> CodeAsIs </h3> <p>Crear un elemento <strong>code</strong> para mostrar el código especificado.</p> <p>Esta función no reemplazará las variables por sus valores. Por ejemplo, <code>#name#</code> se mostrará tal cual.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>CodeAsIs(Text) </code></pre></div><ul><li><p>CodeAsIs</p> <ul><li><p>Text</p> <p>Código fuente.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>CodeAsIs( P(This is the #test1#. Span(This is the #test2#.)) ) </code></pre></div><h3 id="data"><a href="#data" class="header-anchor">#</a> Data </h3> <p>Crear un elemento <strong>data</strong> y llenarlo con los datos especificados y colocarlo en <em>Source</em>, luego se puede recibir <em>Source</em> como entrada de datos en <a href="#Table">Table</a> y otras funciones. La secuencia de nombres de columna corresponde a la secuencia de valores de entrada de <em>data</em>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Data(Source,Columns,Data) [.Custom(Column){Body}] </code></pre></div><ul><li><p>Data</p> <ul><li><p>Source</p> <p>Nombre de la fuente de datos. Puede asignar cualquier nombre que desee y luego pasarlo como origen de datos a otras funciones más adelante.</p></li> <li><p>Columns</p> <p>Lista de nombres de columna separados por comas.</p></li> <li><p>Data</p></li></ul> <p>conjunto de datos.</p> <p>Cada registro debe estar en una línea separada. Los valores de las columnas deben estar separados por comas. <em>Data</em> y <em>Columns</em> deben tener el mismo orden.</p> <p>Para valores que contienen comas, se deben colocar entre comillas dobles (<code>"ejemplo1, ejemplo2", 1, 2</code>).</p> <p>Para valores que contienen comillas, se deben colocar entre dos comillas dobles (<code>""ejemplo", "ejemplo2"", 1, 2</code>).</p></li></ul> <h3 id="custom"><a href="#custom" class="header-anchor">#</a> Custom </h3> <p>Se puede asignar columnas de cálculo a <em>Data</em>. Por ejemplo, puede especificar plantillas de campo para botones y otros elementos de diseño de página. Estas plantillas de campo generalmente se asignan a <a href="#Table">Table</a> y otras funciones para recibir datos.</p> <p>Si desea asignar varias columnas de cálculo, utilice varias funciones <em>Custom</em>.</p> <ul><li><p>Column</p> <p>Columna. Debe especificar un nombre único.</p></li> <li><p>Body</p> <p>Fragmento de código. Puede usar <code>#nombredecolumna#</code> para obtener valores de otras columnas en esta entrada y luego usar esos valores en el fragmento de código.</p></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Data(mysrc,"id,name"){ "1",John Silver 2,"Mark, Smith" 3,"Unknown ""Person""" }.Custom(link){Button(Body: View, Class: btn btn-link, Page: user, PageParams: "id=#id#"} </code></pre></div><h3 id="datetime"><a href="#datetime" class="header-anchor">#</a> DateTime </h3> <p>Muestra la hora y la fecha en el formato especificado.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>DateTime(DateTime, Format) </code></pre></div><ul><li><p>DateTime</p> <ul><li><p>DateTime</p> <p>Representa la hora y la fecha <code>2006-01-02T15:04:05</code> en formato unixtime o estándar.</p></li> <li><p>Format</p> <p>Formato de plantilla: formato de año de 2 dígitos <code>YY</code>, formato de año de 4 dígitos <code>YYYY</code>, mes <code>MM</code>, día <code>DD</code>, hora <code>HH</code>, minutos <code>MM</code>, segundos <code>SS</code>, por ejemplo: <code>YY/MM/DD HH:MM</code>.</p> <p>Si no se especifica o falta este parámetro, se utilizará el formato <code>YYYY-MM-DD HH:MI:SS</code>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>DateTime(2017-11-07T17:51:08) DateTime(#mytime#,HH:MI DD.MM.YYYY) </code></pre></div><h3 id="dbfind"><a href="#dbfind" class="header-anchor">#</a> DBFind </h3> <p>Crear el elemento <strong>dbfind</strong>, llenarlo con los datos de la tabla <em>table</em> y colocarlo en la estructura <em>Source</em>. Esta estructura <em>Source</em> puede ser utilizada posteriormente como entrada de datos para la función <a href="#Table">Table</a> y otras funciones que requieran datos de entrada de <em>Source</em>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>DBFind(table, Source) [.Columns(columns)] [.Where(conditions)] [.WhereId(id)] [.Order(name)] [.Limit(limit)] [.Offset(offset)] [.Count(countvar)] [.Ecosystem(id)] [.Cutoff(columns)] [.Custom(Column){Body}] [.Vars(Prefix)] </code></pre></div><ul><li><p>DBFind</p> <ul><li><p>table</p> <p>Nombre de la tabla de datos.</p></li> <li><p>Source</p> <p>Nombre de la fuente de datos.</p></li></ul></li> <li><p>Columns</p> <ul><li><p>columns</p> <p>La lista de campos devuelta, si no se especifica, devolverá todos los campos. Si hay campos de tipo JSON, se puede utilizar la siguiente sintaxis para manejar los campos de registro: <code>columnname->fieldname</code>. En este caso, el nombre del campo generado es <code>columnname.fieldname</code>.。</p></li></ul></li> <li><p>Where</p> <ul><li><p>conditions</p> <p>Condiciones de búsqueda de datos. Consulte <code>contractfundef-DBFind</code>{.interpreted-text role="ref"}.</p> <p>Si hay campos de tipo JSON, se puede utilizar la siguiente sintaxis para manejar los campos de registro: <code>columnname->fieldname</code>.</p></li></ul></li> <li><p>WhereId</p> <p>Según el ID de consulta, por ejemplo, <code>.WhereId(1)</code>.</p> <ul><li><p>id</p> <p>ID del elemento.</p></li> <li><p>Order</p> <p>Ordenar por campo.</p> <p>Para obtener más información sobre la sintaxis de ordenación, consulte <a href="#DBFind">DBFind</a>.</p></li> <li><p>name</p> <p>Nombre del campo.</p></li></ul></li> <li><p>Limit</p> <ul><li><p>limit</p> <p>El número de entradas devueltas. El valor predeterminado es de 25 entradas y el máximo es de 10,000 entradas.</p></li></ul></li> <li><p>offset</p> <p>Es la cantidad de desplazamiento.</p></li> <li><p>Count</p> <p>Se refiere al número total de filas que cumplen con la condición especificada en la cláusula <em>Where</em>.</p> <p>Además de almacenarse en una variable, también se devuelve el recuento total en el parámetro <em>count</em> del elemento <em>dbfind</em>.</p> <p>Si no se especifica <em>Where</em> y <em>WhereID</em>, se devolverá el número total de filas de la tabla de datos.</p></li> <li><p>countvar</p> <p>Es el nombre de la variable que almacena el recuento de filas.</p></li> <li><p>Ecosystem</p> <ul><li><p>id</p> <p>ID del ecosistema. Por defecto, los datos provienen de la tabla especificada en el ecosistema actual.</p></li></ul></li> <li><p>Cutoff</p> <p>Utilizado para cortar y mostrar grandes cantidades de datos de texto.</p> <ul><li><p>columns</p> <p>Una lista de campos separados por comas que deben ser procesados por la función <em>Cutoff</em>.</p> <p>Los valores de los campos son reemplazados por un objeto JSON que tiene dos campos: enlace <em>link</em> y título <em>title</em>. Si el valor del campo es mayor a 32 caracteres, se devuelve un <em>link</em> que apunta a los primeros 32 caracteres del texto completo. Si el valor es exactamente de 32 caracteres o menos, el <em>link</em> está vacío y el <em>title</em> contiene el valor completo del campo.</p></li></ul></li> <li><p>Custom</p> <p>Se puede asignar columnas de cálculo para <em>Data</em>. Por ejemplo, puede asignar plantillas de campo para botones y otros elementos de diseño de página.</p> <p>Estas plantillas de campo generalmente se asignan a <code>templatefundef-Table</code>{.interpreted-text role="ref"} y otras funciones para recibir datos.</p> <p>Si desea asignar varias columnas de cálculo, utilice varias funciones <em>Custom</em>.</p> <ul><li><p>Column</p> <p>Column name. Unique name must be specified.</p></li> <li><p>Body</p> <p>Snippet de código. Puedes usar <code>#columnname#</code> para obtener valores de otras columnas en esta entrada y luego usar esos valores en el snippet de código.</p></li></ul></li> <li><p>Vars</p> <p>La primera fila obtenida mediante la consulta genera un conjunto de variables con valores. Al especificar esta función, el parámetro <em>Limit</em> se establece automáticamente en 1 y solo se devuelve un registro.</p> <ul><li><p>Prefix</p> <p>Agregue un prefijo al nombre de la variable. El formato es <code>#prefijo_nombredecolumna#</code>, donde el nombre de la columna va seguido inmediatamente por un guión bajo. Si hay columnas que contienen campos JSON, las variables generadas usarán el siguiente formato: <code>#prefijo_nombredecolumna_campo#</code>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>DBFind(parameters,myparam) DBFind(parameters,myparam).Columns(name,value).Where({name:"money"}) DBFind(parameters,myparam).Custom(myid){Strong(#id#)}.Custom(myname){ Strong(Em(#name#))Div(myclass, #company#) } </code></pre></div><h3 id="div"><a href="#div" class="header-anchor">#</a> Div </h3> <p>Crear un elemento HTML <strong>div</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Div(Class, Body) [.Style(Style)] [.Show(Condition)] [.Hide(Condition)] </code></pre></div><ul><li><p>Div</p> <ul><li><p>Class</p> <p>El nombre de la clase de este <em>div</em>.</p></li> <li><p>Body</p> <p>elementos secundarios.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li> <li><p>Show</p> <p>Definir la condición para mostrar un Div.</p> <ul><li><p>Condition</p> <p>Ver <em>Ocultar</em> a continuación.</p></li></ul></li> <li><p>Hide</p> <p>Defina la condición para ocultar un Div.</p> <ul><li>Condition</li></ul> <p>El formato de la expresión es <code>InputName=Value</code>. Cuando todas las expresiones son verdaderas, <em>Condition</em> es verdadero. <em>Condition</em> es verdadero cuando el valor de <code>InputName</code> es igual a <code>Value</code>.</p> <p>Si se llaman múltiples <em>Show</em> o <em>Hide</em>, al menos un parámetro <em>Condition</em> debe ser verdadero.</p></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Form(){ Div(text-left){ Input(Name: "broadcast", Type: "checkbox", Value: "false") } Div(text-left){ hello }.Show("broadcast=false") Div(text-left){ world }.Hide("broadcast=false") } </code></pre></div><h3 id="ecosysparam"><a href="#ecosysparam" class="header-anchor">#</a> EcosysParam </h3> <p>Esta función recupera los valores de los parámetros de la tabla de parámetros del ecosistema actual. Si el nombre del resultado devuelto tiene recursos de idioma, se traducirá en consecuencia.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>EcosysParam(Name, Index, Source) </code></pre></div><ul><li><p>EcosysParam</p> <ul><li><p>Name</p> <p>Nombre del parámetro.</p></li> <li><p>Index</p> <p>Si los parámetros de solicitud son una lista de elementos separados por comas, se puede especificar un índice que comience en 1. Por ejemplo, si <code>gender = male,female</code>, entonces <code>gender = male,female</code> devuelve <code>female</code>.</p> <p>Este parámetro no se puede utilizar junto con el parámetro <em>Source</em>.</p></li> <li><p>Source</p> <p>Cuando el valor del parámetro es una lista separada por comas, se puede utilizar este parámetro.</p> <p>Crea un objeto <em>data</em> cuyos elementos son los valores especificados del parámetro. Este objeto se puede utilizar como fuente de datos para las funciones <a href="#Table">Table</a> y <a href="#Select">Select</a>.</p> <p>Este parámetro no se puede utilizar junto con el parámetro <em>Index</em>.</p></li></ul></li></ul> <div class="language-text extra-class"><pre class="language-text"><code>Address(EcosysParam(founder_account)) EcosysParam(gender, Source: mygender) EcosysParam(Name: gender_list, Source: src_gender) Select(Name: gender, Source: src_gender, NameColumn: name, ValueColumn: id) </code></pre></div><h3 id="em"><a href="#em" class="header-anchor">#</a> Em </h3> <p>Crea un elemento HTML <strong>em</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Em(Body, Class) </code></pre></div><ul><li><p>Em</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Class</p> <p>El nombre de la clase de <em>em</em>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>This is an Em(important news). </code></pre></div><h3 id="forlist"><a href="#forlist" class="header-anchor">#</a> ForList </h3> <p>Display the list of elements from the <em>Source</em> data source using the template format set in the <em>Body</em>, and create the <strong>forlist</strong> element.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>ForList(Source, Index){Body} </code></pre></div><ul><li><p>ForList</p> <ul><li><p>Source</p> <p>Datos obtenidos de la función <a href="#dbfind">DBFind</a> o <a href="#data">Data</a>.</p></li> <li><p>Index</p> <p>La variable del contador de iteración. El conteo comienza en 1.</p> <p>Parámetro opcional. Si no se especifica, el valor del contador de iteración se escribirá en la variable <em>[Source] _index</em>.</p></li> <li><p>Body</p> <p>Template para insertar elementos.</p></li></ul></li></ul> <div class="language-text extra-class"><pre class="language-text"><code>ForList(mysrc){Span(#mysrc_index#. #name#)} </code></pre></div><h3 id="form"><a href="#form" class="header-anchor">#</a> Form </h3> <p>Crear el elemento HTML <strong>form</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Form(Class, Body) [.Style(Style)] </code></pre></div><ul><li><p>Form</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Class</p> <p>El nombre de la clase de este <em>form</em>.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Form(class1 class2, Input(myid)) </code></pre></div><h3 id="getcolumntype"><a href="#getcolumntype" class="header-anchor">#</a> GetColumnType </h3> <p>Devolver los tipos de datos de los campos en una tabla especificada.</p> <p>Los siguientes tipos son devueltos: <code>texto, varchar, número, dinero, doble, bytes, json, datetime, doble</code>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>GetColumnType(Table, Column) </code></pre></div><ul><li><p>GetColumnType</p> <ul><li><p>Table</p> <p>Nombre de la tabla de datos.</p></li> <li><p>Column</p> <p>Nombre del campo.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SetVar(coltype,GetColumnType(members, member_name))Div(){#coltype#} </code></pre></div><h3 id="gethistory"><a href="#gethistory" class="header-anchor">#</a> GetHistory </h3> <p>Crear el elemento <strong>gethistory</strong>, que utiliza el registro de cambios históricos de las entradas de una tabla de datos especificada para llenarlo. Los datos generados se colocarán en el elemento <em>Source</em>.</p> <p>Este elemento se puede utilizar más adelante en una función de entrada de origen, como <a href="#Table">Table</a>.</p> <p>El arreglo se ordena en orden de cambios más recientes. El campo <em>id</em> en el arreglo apunta al campo <em>id</em> de la tabla <em>rollback_tx</em>. <em>block_id</em> representa el ID del bloque y <em>block_time</em> representa la marca de tiempo de generación del bloque.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>GetHistory(Source, Name, Id, RollbackId) </code></pre></div><ul><li><p>GetHistory</p> <ul><li><p>Source</p> <p>Nombre de la fuente de datos.</p></li> <li><p>Name</p> <p>Nombre de la tabla de datos.</p></li> <li><p>Id</p> <p>ID de entrada.</p></li> <li><p>RollbackId</p> <p>Optional parameter. Si se especifica, devuelve solo un registro de la tabla <em>rollback_tx</em> con el ID especificado.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>GetHistory(blocks, BlockHistory, 1) </code></pre></div><h3 id="getvar"><a href="#getvar" class="header-anchor">#</a> GetVar </h3> <p>Esta función devuelve el valor de la variable especificada si ya existe, de lo contrario devuelve una cadena vacía.</p> <p>Solo se creará el elemento <strong>getvar</strong> al solicitar la edición del árbol. La diferencia entre <code>GetVar(varname)</code> y <code>#varname#</code> es que si <em>varname</em> no existe, <em>GetVar</em> devolverá una cadena vacía, mientras que <em>#varname#</em> se interpretará como un valor de cadena.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>GetVar(Name) </code></pre></div><ul><li><p>GetVar</p> <ul><li><p>Name</p> <p>Variable name.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>If(GetVar(name)){#name#}.Else{Name is unknown} </code></pre></div><h3 id="hint"><a href="#hint" class="header-anchor">#</a> Hint </h3> <p>Crear un elemento <strong>hint</strong> para proporcionar una sugerencia o pista.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Hint(Icon,Title,Text) </code></pre></div><ul><li><p>Hint</p> <ul><li><p>Icon</p> <p>Nombre del icono.</p></li> <li><p>Title</p> <p>Título rápido.</p></li> <li><p>Text</p> <p>Texto rápido.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Hint(Icon: "icon-wrench",Title:$@1pa_settings$,Text: This is a hint text) </code></pre></div><h3 id="if"><a href="#if" class="header-anchor">#</a> If </h3> <p>Declaración de condición.</p> <p>Devuelve el primer elemento secundario de <em>If</em> o <em>ElseIf</em> que cumpla con la <em>Condición</em>. De lo contrario, devuelve los elementos secundarios de <em>Else</em>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>If(Condition){ Body } [.ElseIf(Condition){ Body }] [.Else{ Body }] </code></pre></div><ul><li><p>If</p> <ul><li><p>Condition</p> <p>Si la condición es igual a una <em>empty string</em>, <em>0</em>, o <em>false</em>, se considera que no se cumple la condición. En todos los demás casos, se considera que la condición se cumple.</p></li> <li><p>Body</p> <p>elementos secundarios.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>If(#value#){ Span(Value) }.ElseIf(#value2#){Span(Value 2) }.ElseIf(#value3#){Span(Value 3)}.Else{ Span(Nothing) } </code></pre></div><h3 id="image"><a href="#image" class="header-anchor">#</a> Image </h3> <p>Crear el elemento HTML <strong>imagen</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Image(Src, Alt, Class) [.Style(Style)] </code></pre></div><ul><li><p>Image</p> <ul><li><p>Src</p> <p>Imagen de origen, archivo o <code>data:...</code>.</p></li> <li><p>Alt</p> <p>Texto alternativo cuando no se puede mostrar una imagen.</p></li> <li><p>Сlass</p> <p>Nombre de la clase de imagen.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Image(Src: Binary().ById(#id#), Class: preview).Style(height: 40px; widht 40px;) </code></pre></div><h3 id="imageinput"><a href="#imageinput" class="header-anchor">#</a> ImageInput </h3> <p>Crear un elemento <strong>imageinput</strong> para cargar imágenes.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>ImageInput(Name, Width, Ratio, Format) </code></pre></div><ul><li><p>ImageInput</p> <ul><li><p>Name</p> <p>Nombre del elemento.</p></li> <li><p>Width</p> <p>Ancho de recorte de la imagen.</p></li> <li><p>Ratio</p> <p>Relación de aspecto o altura de la imagen.</p></li> <li><p>Format</p> <p>El formato de carga de imágenes.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>ImageInput(avatar, 100, 2/1) </code></pre></div><h3 id="include"><a href="#include" class="header-anchor">#</a> Include </h3> <p>Inserta la plantilla con el nombre especificado en el código de la página.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Include(Name) </code></pre></div><ul><li><p>Include</p> <ul><li><p>Name</p> <p>Nombre de la plantilla.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Div(myclass, Include(mywidget)) </code></pre></div><h3 id="input"><a href="#input" class="header-anchor">#</a> Input </h3> <p>Crear el elemento HTML <strong>input</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Input(Name, Class, Placeholder, Type, Value, Disabled) [.Validate(validation parameters)] [.Style(Style)] </code></pre></div><ul><li><p>Input</p> <ul><li><p>Name</p> <p>Nombre del elemento.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li> <li><p>Placeholder</p> <p>Mensaje de sugerencia para el valor esperado del campo de entrada.</p></li> <li><p>Type</p> <p><em>entrada</em> tipo.</p></li> <li><p>Value</p> <p>Valor del elemento.</p></li> <li><p>Disabled</p> <p>Desactivar el elemento <em>input</em>.</p></li></ul></li> <li><p>Validate</p> <p>Validación de parámetros.</p></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Input(Name: name, Type: text, Placeholder: Enter your name) Input(Name: num, Type: text).Validate(minLength: 6, maxLength: 20) </code></pre></div><h3 id="inputerr"><a href="#inputerr" class="header-anchor">#</a> InputErr </h3> <p>Crear el elemento <strong>inputerr</strong> para validar el texto de error.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>InputErr(Name,validation errors)] </code></pre></div><ul><li><p>InputErr</p> <ul><li><p>Name</p> <p>Nombre del elemento correspondiente a <a href="#Input">Input</a>.</p></li> <li><p>validation errors</p> <p>Mensaje de error de validación de uno o varios parámetros.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>InputErr(Name: name, minLength: Value is too short, maxLength: The length of the value must be less than 20 characters) </code></pre></div><h3 id="inputmap"><a href="#inputmap" class="header-anchor">#</a> InputMap </h3> <p>Create un campo de entrada de texto para la dirección. Proporcionar la funcionalidad de seleccionar coordenadas en el mapa.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>InputMap(Name, Type, MapType, Value) </code></pre></div><ul><li><p>InputMap</p> <ul><li><p>Name</p> <p>Nombre del elemento.</p></li> <li><p>Value</p> <p>Valor predeterminado.</p> <p>Este valor es un objeto en formato de cadena. Por ejemplo, <code>{"coords":[{"lat":number,"lng":number},]}</code> o <code>{"zoom":int, "center":{"lat":number,"lng":number}}</code>.</p> <p>Cuando se crea un InputMap utilizando un valor predefinido <em>Value</em>, el campo de dirección puede ser utilizado para almacenar el valor de la dirección, por lo que el campo de dirección no estará vacío.</p></li> <li><p>Type</p> <p>Tipos de medición de puntos en el mapa:</p> <ul><li><em>Polygon</em> - representa un área cerrada de múltiples puntos;</li> <li><em>Line</em> - representa una línea de múltiples puntos sin cerrar;</li> <li><em>Point</em> - representa una sola coordenada.</li></ul></li> <li><p>MapType</p> <p>Tipo de mapa.</p> <p>Este parámetro tiene los siguientes valores: <code>hybrid</code>, <code>roadmap</code>, <code>satellite</code>, <code>terrain</code>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>InputMap(Name: Coords,Type: polygon, MapType: hybrid, Value: `{"zoom":8, "center":{"lat":55.749942860682545,"lng":37.6207172870636}}`) </code></pre></div><h3 id="jsontosource"><a href="#jsontosource" class="header-anchor">#</a> JsonToSource </h3> <p>Crear un elemento <strong>jsontosource</strong> y llenarlo con pares de clave-valor de un arreglo JSON. Los datos resultantes se colocan en el elemento <em>Source</em>, que luego se puede utilizar en una función de entrada de origen, como <a href="#Table">Table</a>. Los registros en los datos resultantes se ordenan por orden alfabético de las claves JSON.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>JsonToSource(Source, Data) </code></pre></div><ul><li><p>JsonToSource</p> <ul><li><p>Source</p> <p>Nombre de la fuente de datos.</p></li> <li><p>Data</p> <p>JSON object or variable name containing a JSON object (<code>#name#</code>).</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>JsonToSource(src, #myjson#) JsonToSource(dat, {"param":"value", "param2": "value 2"}) </code></pre></div><h3 id="label"><a href="#label" class="header-anchor">#</a> Label </h3> <p>Crear el elemento HTML <strong>label</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Label(Body, Class, For) [.Style(Style)] </code></pre></div><ul><li><p>Label</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li> <li><p>For</p> <p>Vincular a un elemento de formulario específico.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Label(The first item). </code></pre></div><h3 id="langres"><a href="#langres" class="header-anchor">#</a> LangRes </h3> <p>Devuelve el recurso de idioma especificado. Si se solicita la edición del árbol, devuelve el elemento <strong>langres</strong>, que se puede referenciar utilizando el símbolo de formato abreviado <strong>$langres$.</strong></p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>LangRes(Name) </code></pre></div><ul><li><p>LangRes</p> <ul><li><p>Name</p> <p>Nombre de los recursos de lenguaje.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>LangRes(name) LangRes(myres) </code></pre></div><h3 id="linkpage"><a href="#linkpage" class="header-anchor">#</a> LinkPage </h3> <p>Crear un elemento <strong>linkpage</strong> que enlace a la página.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>LinkPage(Body, Page, Class, PageParams) [.Style(Style)] </code></pre></div><ul><li><p>LinkPage</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Page</p> <p>Nombre de la página redirigida.</p></li> <li><p>Class</p> <p>Nombre de la categoría de botones.</p></li> <li><p>PageParams</p> <p>Parámetros de la página redirigida.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>LinkPage(Class: #style_link# h5 text-bold, Page: @1roles_view, PageParams: "v_role_id=#recipient.role_id#") </code></pre></div><h3 id="map"><a href="#map" class="header-anchor">#</a> Map </h3> <p>Create un mapa visual y muestra las coordenadas en cualquier formato.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Map(Hmap, MapType, Value) </code></pre></div><ul><li><p>Map</p> <ul><li><p>Hmap</p> <p>Altura de los elementos HTML en la página.</p> <p>El valor predeterminado es 100.</p></li> <li><p>Value</p> <p>Valor del mapa, objeto en formato de cadena.</p> <p>Por ejemplo, <code>{"coords":[{"lat":número,"lng":número},]}</code> o <code>{"zoom":entero, "center":{"lat":número,"lng":número}}</code>.</p> <p>Si no se especifica <code>center</code>, la ventana del mapa se ajustará automáticamente en función de las coordenadas especificadas.</p></li> <li><p>MapType</p> <p>Tipo de mapa.</p> <p>Este parámetro tiene los siguientes valores: <code>hybrid</code>, <code>roadmap</code>, <code>satellite</code>, <code>terrain</code>.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Map(MapType:hybrid, Hmap:400, Value:{"coords":[{"lat":55.58774531752405,"lng":36.97260184619233},{"lat":55.58396161622043,"lng":36.973803475831005},{"lat":55.585222890513975,"lng":36.979811624024364},{"lat":55.58803635636347,"lng":36.978781655762646}],"area":146846.65783403456,"address":"Unnamed Road, Moscow, Russia, 143041"}) </code></pre></div><h3 id="menugroup"><a href="#menugroup" class="header-anchor">#</a> MenuGroup </h3> <p>Crear un submenú anidado en el menú y devolver el elemento <strong>menugroup</strong>. Antes de usar la sustitución de recursos de idioma, el parámetro <strong>name</strong> devuelve el valor de <strong>Title</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>MenuGroup(Title, Body, Icon) </code></pre></div><ul><li><p>MenuGroup</p> <ul><li><p>Title</p> <p>Nombre del elemento del menú.</p></li> <li><p>Body</p> <p>Elementos secundarios en un submenú.</p></li> <li><p>Icon</p> <p>Icono.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>MenuGroup(My Menu){ MenuItem(Interface, sys-interface) MenuItem(Dahsboard, dashboard_default) } </code></pre></div><h3 id="menuitem"><a href="#menuitem" class="header-anchor">#</a> MenuItem </h3> <p>Crear un elemento de menú y devolver el elemento <strong>menuitem</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>MenuItem(Title, Page, Params, Icon) </code></pre></div><ul><li><p>MenuItem</p> <ul><li><p>Title</p> <p>Nombre del elemento del menú.</p></li> <li><p>Page</p> <p>Nombre de la página redirigida.</p></li> <li><p>Params</p> <p>Parámetros de la página redirigida.</p></li> <li><p>Icon</p> <p>Icono.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>MenuItem(Title:$@1roles$, Page:@1roles_list, Icon:"icon-pie-chart") </code></pre></div><h3 id="money"><a href="#money" class="header-anchor">#</a> Money </h3> <p>Returna el valor de cadena de <em>exp / 10 ^ digit</em>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Money(Exp, Digit) </code></pre></div><ul><li><p>Money</p> <ul><li><p>Exp</p> <p>Formato de cadena de números.</p></li> <li><p>Digit</p> <p>La expresión <code>exp/10^digit</code> tiene un exponente de 10, que puede ser positivo o negativo. Un valor positivo determina la cantidad de decimales después del punto decimal.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Money(Exp, Digit) </code></pre></div><h3 id="or"><a href="#or" class="header-anchor">#</a> Or </h3> <p>La función devuelve el resultado de la operación lógica <strong>if</strong> con todos los argumentos listados entre paréntesis separados por comas. Si un argumento no es una cadena vacía, cero o <code>false</code>, su valor es <code>true</code>, de lo contrario su valor es <code>false</code>.</p> <p>Si el valor del argumento es <code>true</code>, la función devuelve <code>1</code>, de lo contrario devuelve <code>0</code>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Or(parameters) </code></pre></div><p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>If(Or(#myval1#,#myval2#), Span(OK)) </code></pre></div><h3 id="p"><a href="#p" class="header-anchor">#</a> P </h3> <p>Crear un elemento HTML <strong>p</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>P(Body, Class) [.Style(Style)] </code></pre></div><ul><li><p>P</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>P(This is the first line. This is the second line.) </code></pre></div><h3 id="qrcode"><a href="#qrcode" class="header-anchor">#</a> QRcode </h3> <p>Crea un código QR con el texto especificado y genera un elemento <strong>qrcode</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>QRcode(Text) </code></pre></div><ul><li><p>QRcode</p> <ul><li><p>Text</p> <p>Código QR.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>QRcode(#name#) </code></pre></div><h3 id="radiogroup"><a href="#radiogroup" class="header-anchor">#</a> RadioGroup </h3> <p>Crear un elemento <strong>radiogroup</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>RadioGroup(Name, Source, NameColumn, ValueColumn, Value, Class) [.Validate(validation parameters)] [.Style(Style)] </code></pre></div><ul><li><p>RadioGroup</p> <ul><li><p>Name</p> <p>Nombre del elemento.</p></li> <li><p>Source</p> <p>Desde la fuente de datos obtenida de la función <a href="#DBFind">DBFind</a> o <a href="#Data">Data</a>.</p></li> <li><p>NameColumn</p> <p>Nombre de campo de la fuente de datos.</p></li> <li><p>ValueColumn</p> <p>Nombre del valor de la fuente de datos.</p> <p>Los campos creados con <a href="#data">Custom</a> no deben usarse en este parámetro.</p></li> <li><p>Value</p> <p>Valor predeterminado.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li></ul></li> <li><p>Validate</p> <p>Validación de parámetros.</p></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>RadioGroup(Name: type_decision, Source: numbers_type_decisions, NameColumn: name, ValueColumn: value) </code></pre></div><h3 id="range"><a href="#range" class="header-anchor">#</a> Range </h3> <p>Crear un elemento <strong>range</strong>, utilizando el paso <em>Step</em> desde <em>From</em> hasta <em>To</em> (sin incluir <em>To</em>) para rellenar elementos enteros. Los datos generados se colocarán en <em>Source</em>, que se puede utilizar más adelante en una función de entrada de origen (por ejemplo, <a href="#Table">Table</a>). Si se especifican argumentos no válidos, se devolverá un <em>Source</em> vacío.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Range(Source,From,To,Step) </code></pre></div><ul><li><p>Range</p> <ul><li><p>Source</p> <p>Nombre de la fuente de datos.</p></li> <li><p>From</p> <p>Valor inicial (i = From).</p></li> <li><p>To</p> <p>Valor final (i < To).</p></li> <li><p>Step</p> <p>El paso de cambio de valor, si no se especifica este parámetro, es 1 por defecto.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Range(my,0,5) SetVar(from, 5).(to, -4).(step,-2) Range(Source: neg, From: #from#, To: #to#, Step: #step#) </code></pre></div><h3 id="select"><a href="#select" class="header-anchor">#</a> Select </h3> <p>Crear un elemento HTML <strong>select</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Select(Name, Source, NameColumn, ValueColumn, Value, Class) [.Validate(validation parameters)] [.Style(Style)] </code></pre></div><ul><li><p>Select</p> <ul><li><p>Name</p> <p>Nombre de los elementos.</p></li> <li><p>Source</p> <p>Fuente de datos obtenida de la función <a href="#dbfind">DBFind</a> o <a href="#data">Data</a>.</p></li> <li><p>NameColumn</p> <p>Nombre de campo de la fuente de datos.</p></li> <li><p>ValueColumn</p> <p>Nombre del valor de la fuente de datos.</p> <p>Los campos creados con <a href="#custom">Custom</a> no deben usarse en este parámetro.</p></li> <li><p>Value</p> <p>Valor predeterminado.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li></ul></li> <li><p>Validate</p> <p>Validación de parámetros.</p> <ul><li><p>Style</p> <p>Especifique los estilos CSS.</p></li> <li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>DBFind(mytable, mysrc) Select(mysrc, name) </code></pre></div><h3 id="settitle"><a href="#settitle" class="header-anchor">#</a> SetTitle </h3> <p>Crear un elemento <strong>settitle</strong> para establecer el título de la página.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SetTitle(Title) </code></pre></div><ul><li><p>SetTitle</p> <ul><li><p>Title</p> <p>Título de la página.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SetTitle(My page) </code></pre></div><h3 id="setvar"><a href="#setvar" class="header-anchor">#</a> SetVar </h3> <p>Asignar el valor <em>Value</em> a la variable especificada <em>Name</em>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SetVar(Name, Value) </code></pre></div><ul><li><p>SetVar</p> <ul><li><p>Name</p> <p>Variable name.</p></li> <li><p>Value</p> <p>Un valor de variable, que puede contener una referencia a otra variable.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SetVar(name, John Smith).(out, I am #name#) Span(#out#) </code></pre></div><h3 id="span"><a href="#span" class="header-anchor">#</a> Span </h3> <p>Crear un elemento HTML <strong>span</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Span(Body, Class) [.Style(Style)] </code></pre></div><ul><li><p>Span</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>This is Span(the first item, myclass1). </code></pre></div><h3 id="strong"><a href="#strong" class="header-anchor">#</a> Strong </h3> <p>Crear el elemento HTML <strong>strong</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Strong(Body, Class) </code></pre></div><ul><li><p>Strong</p> <ul><li><p>Body</p> <p>Subtexto o elemento.</p></li> <li><p>Class</p> <p>Nombre de la clase.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>This is Strong(the first item, myclass1). </code></pre></div><h3 id="sysparam"><a href="#sysparam" class="header-anchor">#</a> SysParam </h3> <p>Obtener el valor de un parámetro específico en la tabla de parámetros de la plataforma (<em>platform ecosystem</em>).</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SysParam(Name) </code></pre></div><ul><li><p>SysParam</p> <ul><li><p>Name</p> <p>Nombre del parámetro de la plataforma.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SysParam(max_columns) </code></pre></div><h3 id="table"><a href="#table" class="header-anchor">#</a> Table </h3> <p>Crear el elemento HTML <strong>table</strong>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>Table(Source, Columns) [.Style(Style)] </code></pre></div><ul><li><p>Table</p> <ul><li><p>Source</p> <p>El nombre del origen de datos especificado.</p></li> <li><p>Columns</p> <p>Título y nombres de columna correspondientes, por ejemplo: <code>Título1=columna1, Título2=columna2</code>.</p></li></ul></li> <li><p>Style</p> <p>Especifique los estilos CSS.</p> <ul><li><p>Style</p> <p>Estilos CSS.</p></li></ul></li></ul> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>DBFind(mytable, mysrc) Table(mysrc,"ID=id,Name=name") </code></pre></div><h3 id="transactioninfo"><a href="#transactioninfo" class="header-anchor">#</a> TransactionInfo </h3> <p>La función busca una transacción por un valor de hash especificado y devuelve información sobre el contrato ejecutado y sus parámetros.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>TransactionInfo(Hash) </code></pre></div><ul><li><p>TransactionInfo</p> <ul><li><p>Hash</p> <p>Formato de cadena hexadecimal de hash de transacción.</p></li></ul></li></ul> <p><strong>Valor de retorno</strong></p> <p>La función devuelve una cadena en formato JSON:</p> <p><code>{"contract":"NombreDelContrato", "params":{"clave": "val"}, "block": "N"}</code></p> <p>Donde:</p> <ul><li><em>contract</em> - Nombre del contrato;</li> <li><em>params</em> - Datos que se pasan como parámetros al contrato;</li> <li><em>block</em> - ID del bloque que procesa la transacción. <strong>Ejemplo</strong></li></ul> <div class="language-text extra-class"><pre class="language-text"><code>P(TransactionInfo(#hash#)) </code></pre></div><h3 id="varasis"><a href="#varasis" class="header-anchor">#</a> VarAsIs </h3> <p>Asistente virtual: Asignar el valor <em>Value</em> a la variable especificada <em>Name</em>. El valor de la variable especificada es el nombre de la variable en lugar de su valor.</p> <p>Para la versión con reemplazo de variables, consulte <a href="#setvar">SetVar</a>.</p> <p><strong>Gramática</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>VarAsIs(Name, Value) </code></pre></div><ul><li><p>VarAsIs</p> <ul><li><p>Name</p> <p>Variable name.</p></li> <li><p>Value</p> <p>El valor de la variable, incluyendo el nombre de la variable dentro del valor, no será reemplazado. Por ejemplo, si <em>Value</em> es <code>ejemplo #nombredevariable#</code>, entonces el valor de la variable también será <code>ejemplo #nombredevariable#</code>.</p></li></ul></li></ul> <p>El valor de la variable, incluyendo el nombre de la variable dentro del valor, no será reemplazado. Por ejemplo, si <em>Value</em> es <code>example #varname#</code>, entonces el valor de la variable también será <code>example #varname#</code>.</p> <p><strong>Ejemplo</strong></p> <div class="language-text extra-class"><pre class="language-text"><code>SetVar(Name,"John") VarAsIs(name, I am #Name#) Span(#name#) // I am #Name# </code></pre></div><h2 id="app-styles-for-mobile-devices"><a href="#app-styles-for-mobile-devices" class="header-anchor">#</a> Estilo de aplicación adaptado para dispositivos móviles </h2> <h3 id="layout"><a href="#layout" class="header-anchor">#</a> Layout </h3> <h4 id="title"><a href="#title" class="header-anchor">#</a> Título </h4> <ul><li><code>h1</code> ... <code>h6</code></li></ul> <h4 id="strong-class-names"><a href="#strong-class-names" class="header-anchor">#</a> Nombres de clase de énfasis </h4> <ul><li><code>.text-muted</code></li> <li><code>.text-primary</code></li> <li><code>.text-success</code></li> <li><code>.text-info</code></li> <li><code>.text-warning</code></li> <li><code>.text-danger</code></li></ul> <h4 id="color"><a href="#color" class="header-anchor">#</a> Color </h4> <ul><li><code>.bg-danger-dark</code></li> <li><code>.bg-danger</code></li> <li><code>.bg-danger-light</code></li> <li><code>.bg-info-dark</code></li> <li><code>.bg-info</code></li> <li><code>.bg-info-light</code></li> <li><code>.bg-primary-dark</code></li> <li><code>.bg-primary</code></li> <li><code>.bg-primary-light</code></li> <li><code>.bg-success-dark</code></li> <li><code>.bg-success</code></li> <li><code>.bg-success-light</code></li> <li><code>.bg-warning-dark</code></li> <li><code>.bg-warning</code></li> <li><code>.bg-warning-light</code></li> <li><code>.bg-gray-darker</code></li> <li><code>.bg-gray-dark</code></li> <li><code>.bg-gray</code></li> <li><code>.bg-gray-light</code></li> <li><code>.bg-gray-lighter</code></li></ul> <h4 id="grid"><a href="#grid" class="header-anchor">#</a> Cuadrícula </h4> <ul><li><code>.row</code></li> <li><code>.row.row-table</code></li> <li><code>.col-xs-1</code> a <code>.col-xs-12</code> solo se pueden usar dentro de <code>.row.row-table</code>.</li></ul> <h4 id="panel"><a href="#panel" class="header-anchor">#</a> Panel </h4> <ul><li><code>.panel</code></li> <li><code>.panel.panel-heading</code></li> <li><code>.panel.panel-body</code></li> <li><code>.panel.panel-footer</code></li></ul> <h4 id="form-app"><a href="#form-app" class="header-anchor">#</a> Formulario </h4> <ul><li><code>.form-control</code></li></ul> <h4 id="button-app"><a href="#button-app" class="header-anchor">#</a> Botón </h4> <ul><li><code>.btn.btn-default</code></li> <li><code>.btn.btn-link</code></li> <li><code>.btn.btn-primary</code></li> <li><code>.btn.btn-success</code></li> <li><code>.btn.btn-info</code></li> <li><code>.btn.btn-warning</code></li> <li><code>.btn.btn-danger</code></li></ul> <h4 id="icon"><a href="#icon" class="header-anchor">#</a> Icono </h4> <ul><li>Todos los iconos de la clase "fa" provienen de FontAwesome: <code>fa fa-<nombre-del-icono></nombre-del-icono></code>.</li> <li>Todos los iconos de la clase "icon" provienen de SimpleLineIcons: <code>icon-<nombre-del-icono></code>.</li></ul></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/IBAX-io/documentation/edit/master/docs/es/topics/templates2.md" target="_blank" rel="noopener noreferrer">Edita esta página en GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Última actualización:</span> <span class="time">4/7/2023, 11:08:51</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev"> ← <a href="/es/topics/script.html" class="prev"> Contratos inteligentes {#smart-contracts} </a></span> <span class="next"><a href="/es/topics/vm.html"> Compilador y máquina virtual </a> → </span></p></div> </main></div><div class="global-ui"></div></div> <script src="/assets/js/app.d049f7ab.js" defer></script><script src="/assets/js/2.8d94a0db.js" defer></script><script src="/assets/js/45.12ff259b.js" defer></script> </body> </html>