SpModal - Cliente

Mostra alertas, prompts e caixas de diálogo de confirmação em Portal de serviços widgets. . SpModal a classe está disponível em Portal de serviços scripts de cliente.

. SpModal A classe é um wrapper leve para a inicialização da IU angular UibModal . Você pode usar SpModal.open() método para exibir um widget em uma caixa de diálogo modal.

SpModal - alert(mensagem de cadeia de caracteres).then(fn)

Exibe um alerta.

Tabela 1. Parâmetros

Nome	Tipo	Descrição
message	Cadeia de caracteres	A mensagem a ser exibida.

Tabela 2. Retornos

Tipo	Descrição
Booliano	A promessa contém um único argumento que contém verdadeiro ou falso.

// HTML template 
<button ng-click="c.onAlert()" class="btn btn-default">
    Alert
  </button>

// Client script
function(spModal) {
    var c = this;
  c.onAlert = function () {
        spModal.alert('How do you feel today?').then(function (answer) {
            c.simple = answer;
        });
    }
 }

SpModal - Confirmar(mensagem de cadeia de caracteres).Em seguida(fn)

Exibe uma mensagem de confirmação.

Tabela 3. Parâmetros

Nome	Tipo	Descrição
message	Cadeia de caracteres	A mensagem a ser exibida.

Tabela 4. Retornos

Tipo	Descrição
Booliano	A promessa contém um único argumento que contém verdadeiro ou falso.

// HTML template 
 <button ng-click="c.onConfirm()" class="btn btn-default"> Confirm </button> 
<span>{{c.confirmed}}</span>   

// Client script
function(spModal) {
  var c = this;
  c.onConfirm = function() {
        c.confirmed = "asking";
        spModal.confirm("Can you confirm or deny this?").then(function(confirmed) {
            c.confirmed = confirmed; // true or false
        })
    }
 } 

Confirmar com mensagem HTML:

//HTML template 
<button ng-click="c.onConfirmEx()" class="btn btn-default">
    Confirm - HTML message
  </button>
  <span>{{c.confirmed}}</span>

// Client script
function(spModal) {
  var c = this;
  // more control, passing options
    c.onConfirmEx = function() {
        c.confirmed = "asking";
        var warn = '<i class="fa fa-warning" aria-hidden="true"></i>';
        spModal.open({
            title: 'Delete this Thing?',
            message: warn + ' Are you <b>sure</b> you want to do that?'
        }).then(function(confirmed) {
            c.confirmed = confirmed;
        })
    }
}

SpModal - Abrir (opções de objeto).Em seguida (fn)

Abre uma janela modal usando as opções especificadas.

Tabela 5. Parâmetros

Nome	Tipo	Descrição
opções	Objeto	Um objeto que pode ter essas propriedades. Plano de fundo: Booliano|Cadeia de caracteres. Controla a presença de um plano de fundo. Valores válidos: Verdadeiro: Exibe o plano de fundo. Falso: Sem plano de fundo. Estático: Desabilita o fechamento modal selecionando o plano de fundo. Padrão: verdadeiro Botões: Matriz. Botões a serem exibidos na caixa de diálogo. O padrão é Cancelar e OK. Entrada: Booliano. Quando verdadeiro, mostra um campo de entrada na caixa de diálogo. Padrão: falso Teclado: Booliano. Quando verdadeiro, indica que a caixa de diálogo pode ser fechada usando a tecla Esc. Padrão: verdadeiro Mensagem: Cadeia de caracteres. HTML que vai no cabeçalho. Vazio NoDismit: Booliano. Quando verdadeiro, indica que a seção do cabeçalho que contém o ícone Fechar não está presente. Padrão: falso Compartilhado: Objeto do lado do cliente. Compartilha dados com o script do cliente do widget incorporado. Tamanho: Cadeia de caracteres. Tamanho da janela. Valores válidos: 'Sm' ou 'lg'. Vazio Título: Cadeia de caracteres. HTML que vai no cabeçalho. Vazio Valor: Cadeia de caracteres. Valor do campo de entrada. Vazio Widget: Cadeia de caracteres. ID do widget ou sys_id a ser incorporado na caixa de diálogo. Vazio WidgetInput: Objeto. Enviado para o widget incorporado como entrada. Padrão: Nulo

Tabela 6. Retornos

Tipo	Descrição
vazio

O exemplo de código a seguir mostra como criar um prompt com um rótulo.

//HTML template
<button ng-click="c.onOpen()" class="btn btn-default">
    Prompt with label
  </button>
  <div ng-show="c.name">
    You answered <span>{{c.name}}</span>
  </div>

//Client code
function(spModal) {
  var c = this;
  c.onOpen = function() {
        //ask the user for a string
        spModal.open({
            title: 'Give me a name',
            message: 'What would you like to name it?',
            input: true,
            value: c.name
        }).then(function(name) {
            c.name = name;
        })
    }
}

O exemplo de código a seguir mostra como usar a opção de botões personalizados.

//HTML template
<button ng-click="c.onAgree()" class="btn btn-default">
    Agree
  </button>
  <div ng-show="c.agree">
    You answered {{c.agree}}
  </div>

//Client script
function(spModal) {
  var c = this;
  c.onAgree = function() {
        // ask the user for a string
        // note embedded html in message
        var h = '<h4>Apple likes people to agree to lots of stuff</h4>'
        // Line feeds added to the following lines for presentation formatting.
        var m = 'Your use of Apple software or hardware products is based 
on the software license and other terms and conditions in effect for the 
product at the time of purchase. Your agreement to these terms is required 
to install or use the product. '
        spModal.open({
            title: 'Do you agree?',
            message: h + m,
            buttons: [
                {label:'✘ ${No}', cancel: true},
                {label:'✔ ${Yes}', primary: true}
            ]
        }).then(function() {
            c.agree = 'yes';
        }, function() {
            c.agree = 'no';
        })
    }
}

O exemplo de código a seguir mostra como usar a opção de widget incorporado.

//HTML template
<button ng-click="c.onWidget('widget-cool-clock')" class="btn btn-default">
    Cool Clock
  </button>

//Client script
function(spModal) {
  var c = this;
  c.onWidget = function(widgetId, widgetInput) {
        spModal.open({
            title: 'Displaying widget ' + widgetId,
            widget: widgetId, 
            widgetInput: widgetInput || {}
        }).then(function(){
            console.log('widget dismissed');
        })      
    }
}

SpModal - prompt (mensagem de cadeia de caracteres, cadeia de caracteres padrão).then(fn)

Exibe um prompt para entrada do usuário.

Tabela 7. Parâmetros

Nome	Tipo	Descrição
message	Cadeia de caracteres	A mensagem a ser exibida.
padrão (opcional)	Cadeia de caracteres	Um valor padrão a ser usado se o usuário não fornecer uma resposta.

Tabela 8. Retornos

Tipo	Descrição
Cadeia de caracteres	A promessa contém a resposta do usuário ou o valor padrão se o usuário não inserir uma resposta.

//HTML template
 <button ng-click="c.onPrompt()" class="btn btn-default">
    Prompt
  </button>
  <div ng-show="c.name">
    You answered <span>{{c.name}}</span>
  </div>

// Client script
function(spModal) {
  var c = this;
  c.onPrompt = function() {
        spModal.prompt("Your name please", c.name).then(function(name) {
            c.name = name;
        })
    }
}