value: {{retornoInputText}}
<sbm-input-text [(ngModel)]='retornoInputText'></sbm-input-text>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | 'test1' |
css | string | '' |
require | boolean | true, false |
minlength | number | 10 |
maxlength | number | 12 |
pattern | string | '[A-Za-z]{{'{'}}3{{'}'}}' |
columns | number | |
label | string | |
digittext | string | 'M', 'm', 'Mm' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
$(id).setLabel(string)
$(id).setMinLength(string)
$(id).setMaxLength(string)
$(id).setsecurityid(string)
$(id).setVisible(boolean)
$(id).setCss(string)
$(id).setPattern(string)
$(id).setRequire(boolean)
$(id).setValue(string)
$(id).getValue(): String
<sbm-input-mask [(ngModel)]='retornoInputMask' mask='00.000-000'></sbm-input-mask>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
mask | padrão com zeros e letras | LLL-0000 |
columns | number | 6 |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
Para Configurar a mascara com letras e números basta definir com (L) as letras e (0) para números |
$(id).setLabel(string)
$(id).setsecurityid(string)
$(id).setVisible(boolean)
$(id).setCss(string)
$(id).setRequire(boolean)
$(id).setValue(string)
$(id).getValue(): String
<sbm-input-password
[(ngModel)]='retornoInputPassword'></sbm-input-password>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
require | boolean | true, false |
minLength | number | 10 |
maxLength | number | 12 |
columns | number | 6 |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
$(id).setLabel(string)
$(id).setMinLength(string)
$(id).setMaxLength(string)
$(id).setsecurityid(string)
$(id).setVisible(boolean)
$(id).setCss(string)
$(id).setRequire(boolean)
$(id).setValue(string)
$(id).getValue(): String
<sbm-input-email [(ngModel)]='retornoInputEmail'></sbm-input-email>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
require | boolean | true, false |
columns | number | 6 |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
$(id).setLabel(string)
$(id).setsecurityid(string)
$(id).setVisible(boolean)
$(id).setCss(string)
$(id).setRequire(boolean)
$(id).setValue(string)
$(id).getValue(): String
<sbm-input-telefone [(ngModel)]='retornoTelefone'></sbm-input-telefone>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
require | boolean | true, false |
columns | number | 6 |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
$(id).setLabel(string)
$(id).setsecurityid(string)
$(id).setVisible(boolean)
$(id).setCss(string)
$(id).setRequire(boolean)
$(id).setValue(string)
$(id).getValue(): String
<sbm-input-cep [(ngModel)]='retornoInputCep' (_onclick)='cliqueCEP($event)'></sbm-input-cep>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
columns | number | 6 |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onclick | object | resultado, resultado_txt, uf, cidade, bairro, tipo_logradouro, logradouro |
onblur | object | |
onkeyup | object |
$(id).setLabel(string)
$(id).setsecurityid(string)
$(id).setVisible(boolean)
$(id).setCss(string)
$(id).setRequire(boolean)
$(id).setValue(string)
$(id).getValue(): String
<sbm-input-cpf [(ngModel)]='retornoInputCPF'></sbm-input-cpf>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
columns | number | 6 |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
<sbm-input-cnpj [(ngModel)]='retornoInputCNPJ'></sbm-input-cnpj>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
columns | number | 6 |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
<sbm-datebox [type]="dbEnumType" min="2/1/2016" max="31/12/2016"
[value]="retornoInputDatebox" (_onclick)='cliqueDateBox($event)'>
</sbm-datebox>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
min | date | 2016-10-15 |
max | date | 2016-12-31 |
type | DateboxEnumType | date, time, datetime |
columns | number | 6 |
selectionmode | modeEnum | 'single'|'range'|'multiple' |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onclick | object | 2016/11/17 22:00:00 |
<sbm-input-number (onblur)='blur($event)' [(ngModel)]='retornoInputNumber'
css='sbm-input-default' min='5' max='10'
[spinButtons]='true'></sbm-input-number>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
ngModel | any | any |
placeholder | string | Informe um valor |
css | string | '' |
columns | number | 6 |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | |
onkeyup | object |
<sbm-autocomplete placeholder="Digite aqui" [datasource]='dataAutocomplete'
text='titulo' (_onclick)='itemClicado($event)'></sbm-autocomplete>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
datasource | any[] | any[] |
placeholder | string | Digite aqui |
text | string[] | [] |
columns | number | 6 |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onclick | object | object |
<sbm-textarea placeholder='Digite algum valor' [(ngModel)]='textareavalue'></sbm-textarea>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
placeholder | string | '- Selecione -' |
ngModel | any | any |
id | string | '' |
maxLength | number | '' |
require | boolean | true, false |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | element | document |
onkeyup | element | document |
<sbm-radio text='titulo' (_onclick)='cliqueRadio($event)'>
<sbm-radio-option value="São Paulo">São Paulo</sbm-radio-option>
</sbm-radio>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
value | any | any |
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
layout | RadioEnumOrientation | vertical, horizontal |
require | boolean | true, false |
columns | number | 12 |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onclick | object | [] |
Select passando objeto
<sbm-select placeholder='- Selecione -' [datasource]='colEstados' text='titulo'
(_onclick)='cliqueUF($event)'></sbm-select>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
placeholder | string | '- Selecione -' |
datasource | any[] | any[] |
require | boolean | true, false |
text | string[] | [] |
label | string | '' |
text | string | '' |
textseparator | string | ' - ' |
actionbutton | string | '' |
urlbutton | string | '' |
valuefield | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onclick | object | [] |
{{listviewvalue | json}}
<sbm-list-view selectionMultiple='true' [datasource]='colEstados' text='sigla'
(_onclick)='cliqueListView($event)'>
<sbm-list-option value='São Paulo'>'</sbm-list-option>
</sbm-list-view>
Titulo | Tipo | Exemplo |
---|---|---|
value | any | any |
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
selectionmultiple | boolean | true/false |
Titulo | Tipo | Retorno |
---|---|---|
onclick | object[] | [] |
<sbm-money prefix="{{ 'i18n.sabium-framework.money.prefix' | translate }}"
decimal=","
thousands="."
[(ngModel)]='moneyvalue'>
Conteudo dinamico
</sbm-money>
Titulo | Tipo | Exemplo |
---|---|---|
prefix | string | 'R$' |
decimal | string | ',' |
thousands | string | '.' |
decimaldigits | number | 3 |
ngModel | any | '' |
require | boolean | true, false |
placeholder | string | '' |
label | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
onblur | object | [] |
onkeyup | object | [] |
<sbm-menu [datasource]='colMenu' orientation='vertical'
(_onclick)='cliqueMenu($event)'>
<sbm-item-menu value="Monitores"></sbm-item-menu>
</sbm-menu>
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
value | string | '' |
icon | string | '' |
Titulo | Tipo | Exemplo |
---|---|---|
securityid | string | '' |
datasource | ItemMenu[] | id, title, name?, items?, iconSrc? |
orientation | MenuComponentEnum | vertical, horizontal |
Titulo | Tipo | Retorno |
---|---|---|
onclick | ItemMenu | id, title, name?, items?, iconSrc? |
<sbm-grid #report
datasource='/sabium/api/servidor/arquivo'
pagination='2'
[grouping]='true'>
<sbm-column dataField="codigo" width="150" caption="Código">
</sbm-column>
</sbm-grid>
Titulo | Tipo | Exemplo |
---|---|---|
dataField | string | '' |
caption | string | '' |
format | string | '' |
dateType | string | '' |
width | number | 200 |
Titulo | Tipo | Exemplo |
---|---|---|
columns | object | [] |
datasource | string | 'https://js.devexpress.com/Demos/WidgetsGallery/data/orderItems' |
pagination | number | 0 |
gruping | boolean | true, false |
Por padrão o componente grid faz requisiçoes passando parametros "p=1" pagina,
"l=10" numero de
registros a
serem retornados e "sort=id" ordenação de registros Atualizar Grid
@ViewChild('report') report; Colunas da Grid
{{exampleColunas | json}}
dataField: campo a ser buscado do retorno da requisição caption: label da coluna dataType: tipo de retorno do valor da coluna format: formato do valor da coluna |
<sbm-rotator [datasource]='rotatorData' [loop]='true' [showButtons]='false'
[showIndicator]='false' time='4000' height='500'></sbm-rotator>
Titulo | Tipo | Exemplo |
---|---|---|
datasource | object | [] |
loop | boolean | true, false |
showbuttons | boolean | true, false |
showindicator | boolean | true, false |
time | number | 2000 |
height | number | 300 |
<p label='i18n.PRINCIPAL.titulo | translatePipe'></p>
Incluir no "app.module", no bloco de "providers" o serviço "TranslateService" No controller na aplicação: this.traducao = new i18n(_translateService, _sharedService); this.traducao.projectName = _projectName; this.getJSONen().subscribe(retTraducao => {{'{'}} this.traducao.iniciarIdioma(); {{'}'}}); this.getJSONpt().subscribe(retTraducao => {{'{'}} this.traducao.iniciarIdioma(); {{'}'}}); public getJSONen(): Observable<> {{'{'}} return this._http.get("assets/i18n/en.json").map((res: any) => res.json()); {{'}'}} public getJSONpt(): Observable<> {{'{'}} return this._http.get("assets/i18n/pt.json").map((res: any) => res.json()); {{'}'}} |
[{{'{'}} "menu.home": "Inicio", "menu.principal": "Principal", "erro.titulo": "Detalhamento do Erro" {{'}'}}] |
setIdioma(idioma: any) {{'{'}} this.setLocalStorageShared('idioma', idioma); {{'}'}} getIdioma() {{'{'}} return this.getLocalStorageShared('idioma'); {{'}'}}
this._sharedService.setIdioma(idiomaPadrao);
this._sharedService.getIdioma();
<sbm-breadcrumb></sbm-breadcrumb>
<sbm-breadcrumb-crud></sbm-breadcrumb-crud>
let alert = new AlertComponent();
alert.show('Título', 'Ok', 'mensagem do alerta lorem ipson etc...', 'warning');
Titulo | Tipo | Exemplo |
---|---|---|
titulo | string | '' |
mensagem | string | '' |
tipo do alerta | string | success, error, warning, info |
botão cancelar | boolean | true, false |
texto botão sucesso | string | '' |
texto botão cancelar | string | '' |
Titulo | Tipo | Retorno |
---|---|---|
boolean | true, false |