# Personalización
# Botones
Sprout tiene una regla personalizada para botones virtuales. Donde, el usuario puede aplicar tamaños, colores, estilos e íconos con Font Awesome al crear un botón. Así, es posible, por defecto, adaptarlo al diseño de su sistema.
La regla se define fácilmente aplicando la referencia como prefijo al nombre del botón. Por ejemplo, para crear un botón grande, simplemente prefijo ms_le al nombre del botón: ms_le_btn_copy
Se puede aplicar más de una referencia al mismo botón, estando limitado solo por la cantidad de caracteres que la interfaz de Scriptcase permite para el nombre de un botón.
Por ejemplo, para crear un botón con ícono y clase , simplemente aplique los prefijos ms_del y ms_ldr al nombre del botón: ms_del_ms_ldr_del_user
Consulte a continuación la lista con todas las ** referencias ** de botones, disponibles en Sprout:
*Este estilo tiene una diferencia en el hover.
# Tamaños
Referencia | Descripción | Ejemplo |
---|---|---|
ms_sl | Class small | Ejemplo |
ms_le | Class large | Ejemplo |
# Colores
Referencia | Descripción | Ejemplo |
---|---|---|
ms_py | Class primary. Hex.: #3699ff ■ | Ejemplo |
ms_sy | Class secondary. Hex.: #e5eaee ■ | Ejemplo |
ms_ss | Class success. Hex.: #1bc5bd ■ | Ejemplo |
ms_dr | Class dander. Hex.: #f64e60 ■ | Ejemplo |
ms_wg | Class warning. Hex.: #ffa800 ■ | Ejemplo |
ms_io | Class info. Hex.: #8950fc ■ | Ejemplo |
ms_lt | Class light. Hex.: #f3f6f9 ■ | Ejemplo |
ms_dk | Class dark. Hex.: #212121 ■ | Ejemplo |
# Estilos Light
Referencia | Descripción | Ejemplo |
---|---|---|
ms_lss | Class light success | Ejemplo |
ms_lpy | Class light primary | Ejemplo |
ms_ldr | Class light danger | Ejemplo |
ms_lwg | Class light warning | Ejemplo |
ms_ldk | Class light dark | Ejemplo |
# Estilos Light hover*
*Este estilo tiene una diferencia en el hover.
Referencia | Descripción | Ejemplo |
---|---|---|
ms_lhss | Class light hover success | Ejemplo |
ms_lhpy | Class light hover primary | Ejemplo |
ms_lhdr | Class light hover danger | Ejemplo |
ms_lhwg | Class light hover warning | Ejemplo |
ms_lhdk | Class light hover dark | Ejemplo |
# Estilos Light background*
*Este estilo tiene una diferencia en el hover.
Referencia | Descripción | Ejemplo |
---|---|---|
ms_lbss | Class light background success | Ejemplo |
ms_lbpy | Class light background primary | Ejemplo |
ms_lbdr | Class light background danger | Ejemplo |
ms_lbwg | Class light background warning | Ejemplo |
ms_lbdk | Class light background dark | Ejemplo |
# Font Awesome
Referencia | Icono | Ejemplo | Referencia | Icono | Ejemplo |
---|---|---|---|---|---|
ms_close | Ejemplo | ms_rght | Ejemplo | ||
ms_ok | Ejemplo | ms_tab | Ejemplo | ||
ms_clear | Ejemplo | ms_srch | Ejemplo | ||
ms_undo | Ejemplo | ms_chrt | Ejemplo | ||
ms_save | Ejemplo | ms_list | Ejemplo | ||
ms_cancel | Ejemplo | ms_sort | Ejemplo | ||
ms_copy | Ejemplo | ms_tbl | Ejemplo | ||
ms_check | Ejemplo | ms_magic | Ejemplo | ||
ms_add | Ejemplo | ms_cog | Ejemplo | ||
ms_del | Ejemplo | ms_bar | Ejemplo | ||
ms_edit | Ejemplo | ms_line | Ejemplo | ||
ms_first | Ejemplo | ms_pie | Ejemplo | ||
ms_back | Ejemplo | ms_stck | Ejemplo | ||
ms_next | Ejemplo | ms_tach | Ejemplo | ||
ms_last | Ejemplo | ms_pdf | Ejemplo | ||
ms_remove | Ejemplo | ms_wrd | Ejemplo | ||
ms_up | Ejemplo | ms_prnt | Ejemplo | ||
ms_down | Ejemplo | ms_xls | Ejemplo | ||
ms_hide | Ejemplo | ms_xml | Ejemplo | ||
ms_view | Ejemplo | ms_csv | Ejemplo | ||
ms_max | Ejemplo | ms_img | Ejemplo | ||
ms_upl | Ejemplo | ms_mail | Ejemplo | ||
ms_clock | Ejemplo | ms_more | Ejemplo | ||
ms_gear | Ejemplo | ms_dwnl | Ejemplo | ||
ms_data | Ejemplo | ms_warn | Ejemplo | ||
ms_pw | Ejemplo | ms_fb | Ejemplo | ||
ms_exit | Ejemplo | ms_gogl | Ejemplo | ||
ms_event | Ejemplo | ms_papl | Ejemplo | ||
ms_alert | Ejemplo | ms_twtt | Ejemplo | ||
ms_ask | Ejemplo | ms_sad | Ejemplo | ||
ms_bell | Ejemplo | ms_home | Ejemplo | ||
ms_lft | Ejemplo |
# Macros
Además de personalizar los botones, Sprout también cuenta con macros exclusivas, diseñadas para brindar más dinamismo al sistema.
Macro | Descripción |
---|---|
sc_field_group() | Esta macro le permite agrupar varios valores en un solo campo de la consulta. |
sc_input_group() | Esta macro le permite crear agrupaciones de textos e iconos en entradas de formulario. |
sc_float_label() | Esta macro le permite transformar el marcador de posición como una etiqueta flotante en las entradas del formulario. |
sc_back_to_top() | Esta macro crea un botón, en el margen inferior mientras se desplaza por la página, redirigiendo a la parte superior. |
sc_add_notification() | Esta macro permite enviar mensajes de alerta o eventos del sistema. |
# sc_field_group
sc_field_group(text, array_config)
Esta macro permite agrupar varios valores en un solo campo de la consulta. A través de los parámetros, es posible informar los valores que se mostrarán y también una serie de configuraciones de visualización a través de un array.
El uso de esta macro está restringido al evento onRecord de la consulta.
Esta macro requiere el uso de la biblioteca interna fieldGroup.php, que está habilitada por defecto.
# Parámetros
Parámetro | Descripción | Tipo | |
---|---|---|---|
text | Este parámetro recibirá los valores que se mostrarán. Puede ser una cadena o un array con varios valores. | string ou array | Obligatorio |
array_config* | Este parámetro recibirá un array con dos índices de configuración: ms_initial e ms_list. Vea a continuación todos los parámetros disponibles y sus respectivas descripciones. | array | Opcional |
*Este parámetro no es obligatorio para que funcione la macro.
# ms_initial
Índice | Descripción | Tipo | |
---|---|---|---|
["ms_initial"]["img"]["field"] | Recibe valor del campo Imagen (nombre de archivo) | string | Opcional |
["ms_initial"]["img"]["path"] | Aplicar la ruta predeterminada a las imágenes de Scriptcase. (Y/N) | string | Opcional |
["ms_initial"]["img"]["viewer"] | Aplicar visor de imágenes al hacer clic en la imagen. (Y/N) | string | Opcional |
["ms_initial"]["icon"] | Recibe el valor del icono Font Awesome. | string | Opcional |
["ms_initial"]["text"] | Recibe la cantidad que se utilizará para aplicar la inicial. | string | Opcional |
# ms_list
Índice | Descripción | Tipo | |
---|---|---|---|
["ms_list"]["title"] | Título | string | Opcional |
["ms_list"]["note"]["theme"] | Texto small que recibirá color del tema seleccionado. | string | Opcional |
["ms_list"]["note"]["primary"] | Texto small que recibirá la clase primary. Hex.: #3699ff ■ | string | Opcional |
["ms_list"]["note"]["danger"] | Texto small que recibirá la clase danger. Hex.: #f64e60 ■ | string | Opcional |
["ms_list"]["note"]["warning"] | Texto small que recibirá la clase warning. Hex.: #ffa800 ■ | string | Opcional |
["ms_list"]["note"]["success"] | Texto small que recibirá la clase success. Hex.: #1bc5bd ■ | string | Opcional |
["ms_list"]["note"]["info"] | Texto small que recibirá la clase info. Hex.: #8950fc ■ | string | Opcional |
# Ejemplo
Grids - onRecord
$admin = (isset({set_admin}) && {set_admin} == "Y") ? {lang_sec_user_fld_set_admin} : ""; $set = array(); $set["ms_initial"]["img"]["field"] = {photo}; $set["ms_initial"]["img"]["viewer"] = "Y"; $set["ms_initial"]["text"] = {first_name}; $set["ms_list"]["title"] = {first_name} . " " . {last_name}; $set["ms_list"]["note"]["primary"] = $admin; {user} = sc_field_group({email}, $set);
Copied!
# sc_input_group
sc_input_group(array_fields, sc_seq_vert)
Esta macro permite crear grupos de texto y Icono en las entradas del formulario. A través de los parámetros es posible informar un array multidimensional que recibirá los campos, contenidos y tipos que pueden ser textos o iconos Font Awesome (opens new window).
El uso de esta macro está restringido a eventos onLoad y onLoadRecord de aplicaciones formulario, ** control** y calendario.
Esta macro requiere el uso de la biblioteca interna inputGroup.php, que está habilitada de forma predeterminada.
Desactive la opción Mostrar salida Ajax en la configuración de la aplicación.
# Parámetros
Parámetro | Descripción | Tipo | |
---|---|---|---|
array_fields | Este parámetro recibirá un array multidimensional con campos, contenidos y tipos que pueden ser textos o iconos.Font Awesome. | array | Obligatorio |
sc_seq_vert* | Este parámetro almacena el número de línea actual del registro que está ejecutando el evento. Siendo Obligatorio solo para orientaciones de forms horizontales. ($sc_seq_vert) | variable | Obligatorio |
*Este parámetro debe recibir la variable $ sc_seq_vert y solo es obligatorio para múltiples registros orientaciones, grid editable y grid editable (ver).
# Array Multidimensional
Posiciones | Descripción | Tipo | |
---|---|---|---|
Campo* | Recibe el nombre del campo. | string | Obligatorio |
Tipo | Recibir tipo de grupo. (text/icon) | string | Obligatorio |
Contenido** | Reciba el texto que se mostrará o icono. | string | Obligatorio |
Orientacion | Recibe la posición en la que se utilizará el grupo. (left/right) | string | Obligatorio |
*Ver tipos de campos admitidos.
**Para Iconos é necessário informar o atributo class do Font Awesome (opens new window). Ejemplo: fas fa-user.
# Tipos de campos admitidos
Tipos de Campos |
---|
Texto |
Número |
Decimal |
Moneda |
Tipo de tarjeta |
URL |
Color HMTL |
Fecha |
Tiempo |
# Ejemplos
Formularios de registro único, controles y calendarios - onLoad
$arr_fields = [ ['smtp_server', 'icon', 'fas fa-server', 'left'], ['smtp_email', 'icon', 'fas fa-at', 'left'], ['smtp_user', 'icon', 'fas fa-user', 'left'], ['smtp_pswd', 'icon', 'fas fa-key', 'left'] ]; sc_input_group($arr_fields);
Copied!
Formularios de Múltiples registro, grid editable y grid editable (view) - onLoadRecord
$arr_fields = [ ['mod', 'icon', 'fas fa-bars', 'left'] ]; sc_input_group($arr_fields, $sc_seq_vert);
Copied!
# sc_float_label
sc_float_label(array_fields, sc_seq_vert)
Esta [macro] (# macros) permite transformar el placeholder como una etiqueta flotante en las entradas de formularios. A través de los Parámetros es posible informar una array que recibirá todos los campos en los que se aplicará el recurso.
El uso de esta macro requiere que el campo utilizado contenga un placeholder (marca de agua).
El uso de esta macro está restringido a eventos onLoad y onLoadRecord de aplicaciones formulario, control y calendario.
Esta macro requiere el uso de la biblioteca interna floatLabel.php, que está habilitada por defecto.
Desactive la opción Mostrar salida Ajax en la configuración de la aplicación.
# Parámetros
Parámetro | Descripción | Tipo | |
---|---|---|---|
array_fields | Este parámetro recibirá un array con los campos. | array | Obligatorio |
sc_seq_vert* | Este parámetro almacena el número de línea actual del registro que está ejecutando el evento. Siendo obligatorio solo para pautas de forma horizontal. | variable | Obligatorio |
*Este parámetro debe recibir la variable $ sc_seq_vert y solo es obligatorio para múltiples registros orientaciones, grid editable y grid editable (view).
# Array
Posições | Descripción | Tipo | |
---|---|---|---|
Campo* | Recibe el nombre del campo. | string | Obligatorio |
*Ver tipos de campos admitidos.
# Tipos de Campos Admitidos
Tipos de Campos |
---|
Texto |
Número |
Decimal |
Moneda |
Tipo de tarjeta |
URL |
Color HMTL |
Fecha |
Tiempo |
# Ejemplos
Formularios de registro único, controles y calendarios - onLoad
$arr_fields = ['smtp_server', 'smtp_email', 'smtp_user', 'smtp_pswd']; sc_float_label($arr_fields);
Copied!
Formularios de Múltiples registro, grid editable y grid editable (view) - onLoadRecord
$arr_fields = ['mod', 'icon']; sc_float_label($arr_fields, $sc_seq_vert);
Copied!
# sc_back_to_top
sc_back_to_top(position)
Esta macro crea un botón, en el margen inferior mientras se desplaza por la página, redirigiendo a la parte superior. A través del parámetro, es posible definir la posición del botón como izquierda o derecha.
El uso de esta macro es aplicable a eventos de carga de página como onExecute, onLoad y onScriptInit.
Esta macro requiere el uso de la biblioteca interna backTop.php, que está habilitada por defecto.
Desactive la opción Mostrar salida Ajax en la configuración de la aplicación.
# Parámetros
Parámetro | Descripción | Tipo | |
---|---|---|---|
position | Este parámetro recibirá el valor de posición. (left/right) En ausencia del parámetro, el valor predeterminado es right. | string | Opcional |
# Ejemplos
Grid - onScriptInit
sc_back_to_top();
Copied!
Form - onLoad
sc_back_to_top("left");
Copied!
# sc_add_notification
sc_add_notification(type, rec_type, receiver, text, link, sender)
Esta macro permite el envío de mensajes de alerta o eventos del sistema. A través de los Parámetros es posible determinar para qué usuarios y departamentos se mostrará el mensaje.
Esta macro requiere el uso de la biblioteca interna notification.php, que está habilitada por defecto.
# Parámetros
Parámetro | Descripción | Tipo | |
---|---|---|---|
type | Este parámetro define el tipo de mensaje enviado. Dónde, se puede enviar como un mensaje de alerta (alerta) o un evento del sistema (evento). Eventos del sistema se puede definir como situaciones comunes en las que se notificará al usuario. Cómo, por ejemplo sería el registro de un nuevo usuario o la finalización de un pedido. Para esto, use el valor "event". Mensajes de alerta se puede definir como situaciones que requieren la intervención de un administrador para notificar a un usuario o un grupo de usuarios. Para esto, use el valor "alert". | string | Obligatorio |
rec_type | Este parámetro define a quién se enviará el mensaje. Puede ser all_users para todos los usuarios, grupo para uno o más grupos de usuarios y usuario para uno o más usuarios. Para grupo y usuario es necesario que el parámetro receptor sea de departamento (s) o usuario (s). Si el parámetro utilizado es all_users, el parámetro receptor puede ignorarse. | string | Obligatorio |
receiver | Este parámetro solo tiene efecto cuando se aplica junto con el parámetro rec_type que pasa los valores de grupo o usuario. De lo contrario, se puede ignorar pasando el parámetro como NULL. | integer ou string | Obligatorio |
text | Este parámetro define el contenido del mensaje que se enviará. | string | Obligatorio |
link | Este parámetro recibe una aplicación como parámetro y permite que el mensaje se muestre con un enlace que apunta a la aplicación definida. Es fundamental para una buena experiencia de usuario que el usuario tenga privilegios de acceso a la aplicación que se ha definido. | string | Obligatorio |
sender | Este parámetro define qué usuario envió el mensaje, el remitente. | ||
integer ou string | Obligatorio |
# Ejemplo
switch ({receiver_type}) { case "all_users": $receiver = null; break; case "group": $receiver = {receiver_group}; break; case "user": break; default: $receiver = null; break; } $sender = null; if (isset([usr_login])) { $sender = [usr_login]; } sc_add_notification({type}, {receiver_type}, $receiver, {text}, {link_app}, $sender);
Copied!