Os métodos citados abaixo estão disponíveis e objetivam auxiliar o desenvolvedor a configurar os campos de maneira mais detalhada de acordo com o seu fim.
Tal subdivisão tem como propósito facilitar a utilização e compreensão do propósito de cada conjunto de métodos. Portanto, assim ocorre a citada subdivisão: métodos e configurações globais, métodos relativos à comportamentos e eventos, métodos relativos ao tipo de campo, métodos relativos ao tratamento de formulários e métodos relativos ao tratamento de tabelas.
addField (name: string)
É o responsável por permitir a adição de um novo campo ao Schema. Permite o acréscimo de configurações mais específicas aos elementos de campo.
fieldVisible (condition: Function)
Controla a visibilidade do campo a partir de uma condição (que é definida através de uma função, passada como argumento ao método).
this.addField('exemplo')
.fieldVisible(function () {
return this.scope !== SCOPES.SCOPE_ADD
})
this.addField('exemplo')
.fieldVisible(function () {
const { ativo } = $store.getters['auth/getUser']
return ativo
})
const USUARIO_ESTA_ATIVO = function () {
const { ativo } = $store.getters['auth/getUser']
return ativo
}
this.addField('exemplo')
.fieldVisible(USUARIO_ESTA_ATIVO)
O resultado será o mesmo alcançado pelo exemplo 2. Porém desta forma conseguimos isolar o método em um arquivo auxiliar afim de obter uma maior coesão.
fieldScopes (scopes: string[])
Define em quais escopos o campo estará disponível.
this.addField('exemplo')
.fieldScopes([SCOPES.SCOPE_VIEW, SCOPES.SCOPE_EDIT])
fieldScopesExcept (scopes: string[])
Disponibiliza o campo em todos os escopos, exceto no(s) informado(s).
this.addField('exemplo')
.fieldScopesExcept([SCOPES.SCOPE_EDIT])
fieldScopesAppend (scopes: string[])
Disponibiliza o campo em outros escopos. Em aplicações complexas, é comum a necessidade de se criar escopos personalizados conforme alguma regra de negócio.
fieldGroup (group: string)
Define um grupo para o campo.
fieldType (type: string)
fieldAppendAttrs (attrs: Record<string, unknown>)
fieldPrimaryKey (primaryKey = true)
fieldConfigure (configure: Function)
fieldOn (event: string, callable: Function, reset = false)
fieldWatch (callable: Function, options: Record<string, unknown> = {})
fieldAvoid()
Atenção: grande parte dos métodos citados abaixo aceitam, se necessário, um argumento nomeado como attrs, que faz referência aos atributos que podem ser passados ao campo.
fieldIsInput (maxlength = 255, attrs = {})
fieldIsNumber (attrs = {}): Schema
Define o campo como um number (número). Ou seja, não será aceito outros caracteres a não ser números.
Saiba mais clicando aqui.
fieldIsDigits (this: Schema, digits = 2, attrs = {}): Schema
fieldIsPassword (attrs = {}): Schema
fieldIsEmail (attrs = {}): Schema
fieldIsLabel (attrs = {}): Schema
fieldIsText (rows = 6, attrs = {}): Schema
fieldIsTextEditor (attrs = {}): Schema
fieldIsCheckbox (attrs = {}): Schema
fieldIsRadio (options: Record<string, unknown>[] | Record<string, unknown> = [], attrs: Record<string, unknown> = {}): Schema
fieldIsSelect (options: Record<string, unknown>[] | Record<string, unknown> = [], attrs: Record<string, unknown> = {}): Schema
Define o campo como um elemento HTML select. Utilize o argumento options para passar as opções que estarão disponíveis/visíveis ao usuário.
Exemplo de uso onde OPTIONS vem da internacionalização(i18n) do projeto
this.addField('exemplo')
.fieldIsSelect()
.fieldTableShow()
status: {
label: 'exemplo',
options: [
{
value: 'open',
label: 'Aberto'
},
{
value: 'cancel',
label: 'Cancelado'
},
{
value: 'closed',
label: 'Fechado'
}
]
}
fieldIsSelectRemote (attrs: Record<string, unknown> = {}): Schema
this.addField('exemplo')
.fieldIsSelectRemote(ExemploSchema.provideRemote())
.fieldFormWidth(100)
fieldIsSelectRemoteMultiple (attrs = {}): Schema
fieldIsToggle (attrs = {}): Schema
fieldIsDate (attrs = {}): Schema
fieldIsDateRange (attrs = {}): Schema
fieldIsDatetime (attrs = {}): Schema
fieldIsInputPlan (maxlength = 255, attrs = {}): Schema
fieldIsUrl (maxlength = 255, attrs = {}): Schema
fieldIsArray (attrs = {}, lazy = false): Schema
fieldIsBuiltin (attrs = {}): Schema
fieldIsCurrency (attrs = {}): Schema
fieldIsPercentage (attrs = {}): Schema
Tem como base o mesmo componente usado no fieldIsCurrency
a diferença são as propriedades passadas. Pode ser personalizado de várias formas.
A seguir algumas configurações de unidades famosas de medida.
this.addField('exemplo')
.fieldIsPercentage({
decimal: ',',
thousands: '.',
prefix: '',
suffix: 'kg',
precision: 3,
masked: false,
fallback: ' - ',
value: 0
})
this.addField('exemplo')
.fieldIsPercentage({
decimal: ',',
thousands: '.',
prefix: '',
suffix: '°C',
precision: 1,
masked: false,
fallback: ' - ',
value: 0
})
fieldIsButton (click: Function, options: Record<string, unknown> = {}): Schema
Define o campo como um botão clicável. Tal método recebe como primeiro argumento uma função que será executada quando o evento de clique ocorrer.
fieldIsEmbed (this: Skeleton, attrs = {}): Schema
fieldIsTree (attrs: Record<string, unknown> = {}): Schema
fieldIsImage (attrs = {}): Schema
fieldIsFile (attrs = {}): Schema
fieldIsFileAsync (this: Schema, attrs: Record<string, unknown> = {}): Schema
fieldIsFileSync (attrs = {}): Schema
fieldIsInternationalPhone (attrs = {}): Schema
fieldIsNumeric (attrs = {}): Schema
Define o campo de forma em que aceita somente valores numéricos. Diferentemente do fiedIsNumber
é renderizado com outro componente. Tem dois botões na esquerda e direita. O botão da esquerda decresce o valor digitado. O botão da direita acresce o valor digitado.
this.addField('exemplo')
.fieldIsNumeric({ min: 1 })
fieldIsTable (attrs = {}): Schema
Atenção: grande parte dos métodos citados abaixo aceitam um argumento definido como scopes, ou seja, há a possibilidade de delimitar em quais scopes as definições serão setadas.
fieldFormWidth (formWidth: number, scopes?: Record<string, unknown>): Schema
Define qual será a largura do campo/formulário.
fieldFormHeight (formHeight: number, scopes?: Record<string, unknown>): Schema
Define qual será a altura do campo/formulário.
fieldFormHidden (formHidden = true, scopes?: Record<string, unknown>): Schema
Permite esconder o campo.
fieldFormName (formName: string, scopes?: Record<string, unknown>): Schema
Permite nomear o campo.
fieldFormDisabled (disable = true, scopes?: Record<string, unknown>): Schema
Permite desabilitar o campo.
fieldFormAutofocus (autofocus = true, scopes?: Record<string, unknown>): Schema
Adiciona o atributo autofocus (e o seta como true) ao campo.
fieldFormDefaultValue (value: unknown, scopes?: Record<string, unknown>): Schema
Adiciona o atributo value, permitindo que o desenvolvedor sete um valor predefinido ao campo.
fieldFormUpperCase (upperCase = true, scopes?: Record<string, unknown>): Schema
Transforma, de maneira integral, o texto contido no campo para letras maiúsculas.
fieldFormPlaceholder (placeholder = '', scopes?: Record<string, unknown>): Schema
Possibilita a inclusão de um placeholder ao campo.
fieldFormBackground (formBackground: string, scopes?: Record<string, unknown>): Schema
fieldFormErrorHide (scopes?: Record<string, unknown>): Schema
fieldFormErrorShow (scopes?: Record<string, unknown>): Schema
fieldFormOrder (order: number, updateOthers = false, scopes?: Record<string, unknown>): Schema
fieldFormFill (filler?: string | Function, parameters?: Record<string, unknown>): Schema
review
fieldIs (is: string): Schema
- Define o nome do componente que será usado como referência para configurar a apresentação do campo.
fieldTableWidth (tableWidth: number | string): Schema
fieldTableShow (show = true): Schema
fieldTableWhere (tableWhere: string | null = OPERATORS.AUTOMATIC, tableWhereComponent?: unknown): Schema
fieldTableWhereOperator (fieldTableWhereOperator: string): Schema
fieldTableFilter (tableFilter: Function): Schema
fieldTableRequired (tableRequired: boolean): Schema
fieldTableName (tableName: string): Schema
fieldTableAlign (tableAlign: string): Schema
fieldTableSortable (tableSortable: boolean): Schema
fieldTableFormat (tableFormat: Function): Schema
fieldTableOrder (order: number, updateOthers = false): Schema