Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

A tela de editar, como mencionado é a mesma de incluit, basicamente possui um cabeçalho, onde são exibidos o identificador do regitro da tabela, possui operações para cancelar a edição/inclusão e salvar o registro. No conteudo da pagina é exibido o formulario para o usuário informar os dados do registro.

Bloco de código
languagexml
firstline1
titleArquivo message.detail.html
linenumberstrue
collapsetrue
<totvs-page type="edit">
	<totvs-page-navbar>	
		<totvs-page-breadcrumb>
			<breadcrumb link="#/">Home</breadcrumb>
			<breadcrumb link="#/">Sample</breadcrumb>
			<breadcrumb link="#/html-sample/message">{{'l-message' | i18n}}</breadcrumb>
			<breadcrumb>Editar {{controller.model['cod-mensagem']}}</breadcrumb>
		</totvs-page-breadcrumb>    
		<totvs-page-header>
			<totvs-page-header-title title="{{controller.model['cod-mensagem']}}" placeholder="Nova mensagem"></totvs-page-header-title>        
			<totvs-page-header-operation>
				<totvs-page-header-operation-action>
				</totvs-page-header-operation-action>
			</totvs-page-header-operation>
		</totvs-page-header>    
	</totvs-page-navbar>
    <totvs-page-content>		
		<totvs-page-form>
			<fieldset>				
				<field type="input"
					   data-ng-disabled="controller.idDisabled"
					   class="col-lg-2 col-md-2 col-sm-2 col-xs-12"
					   data-ng-model="controller.model['cod-mensagem']"
					   required>
					<label>{{ 'l-id' | i18n }}</label>
				</field>
				<field type="input"
					   class="col-lg-8 col-md-8 col-sm-8 col-xs-12"
					   data-ng-model="controller.model['descricao']"
					   required>
					<label>{{ 'l-description' | i18n }}</label>
				</field>
				<field type="textarea"
					   class="col-lg-12 col-md-12 col-sm-12 col-xs-12"
					   data-ng-model="controller.model['texto-mensag']">
					<label>{{ 'l-text' | i18n }}</label>
				</field>				
			</fieldset>            
        </totvs-page-form>		
    </totvs-page-content>	
</totvs-page>

 

Linha 1 - Como na listagem temos a tag <ttovs-page> porem o type="edit"

 

Linha 10 - No header na tag <totvs-page-header-title> o atributo title  recebe o identificador do registro.

 

Linhas 12-13 Na tag <totvs-page-header-operation-action> não ha ações relacionadas

 

Linha 18 - e definido a tag <totvs-page-form> para montar o formulario

 

Linha 19 - seguido de um <fieldset> para montar um grupo de campos

 

Linhas 20-37 Dentro da tag <fieldset> são colocadas varias tags <field> para cada campo que será incluido no formulario, cada <field> possui atributos para exibir o campo corretamente.

 

Linha 21 - o <field> do codigo apenas fica habilitado na inclusão, de acordo com o atributo idDisabled do controller

 

O resultado desta tela no modo edição é o seguinte:

Image Added

O resultado desta tela no modo inclusão é o seguinte:

Image Added