<div id="topo" ng-init="carregaVariables()">
  <i class="mobile-menu flaticon-three"></i>
  <div class="logo" ng-class="{hidden:focused}">
  </div>
  <div class="direita">
    <input type="text" class="pesquisa" ng-class="{focusin:focused}" placeholder="Pesquisar" ng-model="procuraGeral"
      ng-init="focused = false" ng-blur="focused = false" ng-focus="focused = true"></input>
  </div>
</div>

<!-- MENU LATERAL  -->
<div id="menu" ng-class="{ showmobile : showMobileMenu}">
  <ul>
    <li ng-class="{'open': abaSelecionada=='style' }" ng-click="abaSelecionada = 'style'">
      <i class="flaticon-home"></i>
      <span>Layout</span>
    </li>
    <li ng-class="{'open': abaSelecionada=='config' }" ng-click="abaSelecionada = 'config'">
      <i class="flaticon-information-button"></i>
      <span>Configurações</span>
    </li>
    <li ng-class="{'open': abaSelecionada=='prospect' }" ng-click="abaSelecionada = 'prospect'">
      <i class="flaticon-technology"></i>
      <span>Prospects</span>
    </li>
    <li ng-class="{'open': abaSelecionada=='fones' }" ng-click="abaSelecionada = 'fones'">
      <i class="flaticon-call-answer"></i>
      <span>Telefones Úteis</span>
    </li>
    <li ng-class="{'open': abaSelecionada=='arquivos' }" ng-click="abaSelecionada = 'arquivos'">
      <i class="flaticon-file"></i>
      <span>Arquivos Úteis</span>
    </li>
    <!-- Unidade 890 - SEMAX integração com sistema próprio de monitoramento -->
    <li ng-class="{'open': abaSelecionada=='eventos' }" ng-click="abaSelecionada = 'eventos'"
      ng-show="eventosMonitoramento && unidades[0] != 890"> 
      <i class="flaticon-tool"></i>
      <span>Eventos</span>
    </li>
    <li ng-class="{'open': abaSelecionada=='acessos' }" ng-click="abaSelecionada = 'acessos'">
      <i class="flaticon-login"></i>
      <span>Acessos</span>
    </li>
    <li ng-click="logout()">
      <i class="flaticon-sign-out-option"></i>
      <span>Sair</span>
    </li>
  </ul>
</div>
<div class="shield" ng-class="{ showmobile : showMobileMenu}">

</div>

<div class="views">
  <div class="content cssConfig" ng-if="abaSelecionada=='style' && !bloqueiaLayout">
    <h1>Configurações de Estilo da Pagina</h1>
    <div layout="row">
      <input type="color" class="colorPicker" id="mainColor" ng-value="style.mainColor">
      <h2> Cor Principal </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="bgBody" ng-value="style.bgBody">
      <h2> Cor de fundo da pagina </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="bgMenu" ng-value="style.bgMenu">
      <h2>Cor de fundo do menu </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="iconMenu" ng-value="style.iconMenu">
      <h2> Cor do ícone do menu no mobile </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="menuColor" ng-value="style.menuColor">
      <h2> Cor icones e texto do menu </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="selectMenu" ng-value="style.selectMenu">
      <h2> Cor do icone do menu selecionado </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="borderMenu" ng-value="style.borderMenu">
      <h2> Cor da borda do menu selecionado </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="loginColor" ng-value="style.loginColor">
      <h2> Cor título da tela de login </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="buttonSave" ng-value="style.buttonSave">
      <h2> Cor botão salvar </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="buttonCancel" ng-value="style.buttonCancel">
      <h2> Cor botão cancelar </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="bgSearchButton" ng-value="style.bgSearchButton">
      <h2> Cor de fundo do campo de pesquisa </h2>
    </div>
    <div layout="row">
      <input type="color" class="colorPicker" id="atention" ng-value="style.atention">
      <h2> Cor boleto vencido </h2>
    </div>
    <!--<div class="logo">
      <h2> Imagem Logo </h2>
      <md-button ng-click="buscarLogo()" class="md-primary md-raised"></md-button>
      <img alt="Logo" style="background-color: {{style.mainColor}}; height:50px; padding:10px;" id="imagemLogo" ng-src="{{style.imageLogo}}">
    </div>-->
    <md-card id="cardImageLogo">
      <img class="md-card-image" alt="Background Login" id="imagemLogo" ng-src="{{style.imageLogo}}">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Logo do Sistema</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-title-text>
        Tamanho :
      </md-card-title-text>
      <md-slider ng-model="style.heigthLogo" aria-label="heigthLogo" md-discrete min="30" max="250" class="md-primary">
      </md-slider>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('imageLogo', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
      </md-card-actions>
    </md-card>
    <md-card>
      <img class="md-card-image imagemLogin" alt="Background Login" id="imagemLogin" ng-src="{{style.bgLogin}}">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Imagem de fundo da tela de login</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('bgLogin', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
      </md-card-actions>
    </md-card>
    <md-card>
      <img class="md-card-image imagemHome" alt="Background HOME" id="imagemHome" ng-src="{{style.bgHome}}">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Imagem de fundo da tela principal</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('bgHome', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
        <!--ngf-max-height="1000" ngf-max-size="1MB"-->
      </md-card-actions>
    </md-card>
    <md-card>
      <img class="md-card-image imagemLocacao" alt="Logo Recibo Locação" id="imagemLocacao"
        ng-src="img/imagemLogoReciboLocacaoPortal.jpg">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Logo exibido no recibo de locação</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('imagemLocacao', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
        <!--ngf-max-height="1000" ngf-max-size="1MB"-->
      </md-card-actions>
    </md-card>

    <md-card>
      <img class="md-card-image imagemQuitacao" alt="Logo Recibo Locação" id="imagemQuitacao"
        ng-src="img/imagemQuitacaoPortal.jpg">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Imagem relatório de quitação de débitos</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('imagemQuitacao', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
        <!--ngf-max-height="1000" ngf-max-size="1MB"-->
      </md-card-actions>
    </md-card>

    <md-input-container class="md-block" flex-gt-sm ng-if="!serviceNovo">
      <md-checkbox name="exibeAbertura" ng-model="style.exibeAbertura">
        Exibir imagem de abertura no aniversário de cadastro do cliente.
      </md-checkbox>
    </md-input-container>

    <md-card ng-if="style.exibeAbertura" ng-if="!serviceNovo">
      <img class="md-card-image imagemAbertura" alt="Logo Recibo Locação" id="imagemAbertura"
        ng-src="{{style.imagemAbertura}}">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Imagem de Abertura no aniversário do contrato</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('imagemAbertura', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
      </md-card-actions>
    </md-card>

    <md-input-container class="md-block" flex-gt-sm ng-if="!serviceNovo">
      <md-checkbox name="exibeAviso" ng-model="style.exibeAviso">
        Exibir imagem de abertura de aviso.
      </md-checkbox>
    </md-input-container>

    <md-card ng-if="style.exibeAviso" ng-if="!serviceNovo">
      <img class="md-card-image imagemAviso" alt="Logo de aviso" id="imagemAviso" ng-src="{{style.imagemAviso}}">
      <md-card-title>
        <md-card-title-text>
          <span class="md-headline">Imagem de Aviso</span>
        </md-card-title-text>
      </md-card-title>
      <md-card-actions layout="row" layout-align="end center">
        <md-button type="file" ngf-select="uploadFiles('imagemAviso', $file, $invalidFiles)" accept="image/*">Editar
        </md-button>
      </md-card-actions>
    </md-card>
    <md-button class="md-primary md-raised" ng-click="atualizaCores()">Gravar e Recarregar</md-button>
    <md-button class="md-primary md-raised" ng-click="resetStyle()">Reset</md-button>
  </div>

  <!-- CONFIGURACOES PORTAL POR UNIDADE -->
  <div class="content config" ng-if="abaSelecionada=='config'">
    <form name="formFones" ng-submit="validaInformacoes()">
      <h1>Configurações de Sistema</h1>

      <div ng-repeat="config in configs">
        <h2>Unidade: {{config.uniCodigo}} - {{config.uniUnidade}}</h2>
        <!-- REMETENTE DE EMAIL -->

        <h3>• Configurações de Envio de E-mail</h3>

        <!--<md-input-container class="md-block" flex-gt-sm>
          <label>Servidor SMTP</label>
          <input ng-model="config.servidorSmtp" maxlength="300">
        </md-input-container>-->

        <md-input-container class="md-block" flex-gt-sm>
          <label>E-mail Remetente</label>
          <input ng-model="config.email" maxlength="300">
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <label>Nome exibição</label>
          <input ng-model="config.nome" maxlength="300">
        </md-input-container>

        <!--<md-checkbox name="autentica" ng-model="config.autentica" required>
          O servidor requer autenticação?
        </md-checkbox>

        <md-input-container class="md-block" flex-gt-sm>
          <label>Usuário</label>
          <input ng-model="config.usuario" ng-disabled="!config.autentica" maxlength="50">
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <label>Senha</label>
          <input ng-model="config.senha" type="password" ng-disabled="!config.autentica" maxlength="50">
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <label>Porta SMTP</label>
          <input ng-model="config.porta" ng-disabled="!config.autentica" onkeypress='return event.charCode >= 48 && event.charCode <= 57'
            maxlength="5">
        </md-input-container>

        <md-radio-group ng-model="config.ssl" flex-gt-sm layout="row">
          <label>Protocolo de Segurança:</label>
          <md-radio-button value="0" class="md-primary">Nenhum</md-radio-button>
          <md-radio-button value="1"> SSL </md-radio-button>
          <md-radio-button value="2"> TLS </md-radio-button>
        </md-radio-group>
        -->
        <md-input-container class="md-block" flex-gt-sm>
          <!--<md-checkbox name="leitura" ng-model="config.leitura" required>
            Exige confirmação de leitura?
          </md-checkbox>-->

          <md-checkbox name="copia" ng-model="config.copia" required>
            Enviar cópia para o remetente do e-mail?
          </md-checkbox>
        </md-input-container>

        <md-button class="md-primary md-raised" ng-click="testarEmail($index)">Testar Envio de E-mail</md-button>

        <!-- AVISO DE VIAGEM -->
        <h3 ng-if="config.liberacoesPortal.viagem">• Aviso de viagem</h3>
        <md-input-container class="md-block" flex-gt-sm ng-if="config.liberacoesPortal.viagem">
          <md-checkbox name="enviaEmailViagem" ng-model="config.enviaEmailViagem" required>
            Enviar aviso por e-mail quando enviado aviso de viagem?
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm ng-if="config.liberacoesPortal.viagem">
          <label>E-mail destino</label>
          <input ng-model="config.emailViagem" maxlength="300" ng-pattern="/^.+@.+\..+$/">
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm ng-if="config.liberacoesPortal.viagem">
          <md-checkbox name="chaveResidencia" ng-model="config.chaveResidencia" required>
            Permitir que usuário deixe a chave da residencia com a central de monitoramento?
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm ng-if="config.liberacoesPortal.viagem">
          <md-checkbox name="exibeChavesAvisoViagem" ng-model="config.exibeChavesAvisoViagem" required>
            Incluir chaves dos clientes no corpo do email?
          </md-checkbox>
        </md-input-container>

        <!-- ORDENS DE SERVIÇO -->
        <h3 ng-if="config.liberacoesPortal.viagem">• Ordem de Serviço</h3>

        <md-checkbox name="exibeMensagemAbrirOs" ng-model="config.exibeMensagemAbrirOs" required>
          Exibir aviso ao abrir tela de OS no Portal do Cliente
        </md-checkbox>
        <md-input-container class="md-block" flex-gt-sm ng-if="config.exibeMensagemAbrirOs">
          <label>Mensagem a ser exibida ao cliente</label>
          <input ng-model="config.mensagemAberturaOs" maxlength="300" ng-required="config.exibeMensagemAbrirOs">
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm ng-if="config.liberacoesPortal.viagem">
          <md-checkbox name="limitaOs" ng-model="config.limitaOs" required>
            Bloqueia abertura de Ordem de Serviço quando já existir uma OS aberta para o cliente?
          </md-checkbox>
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="empresaPadraoOS" ng-model="config.empresaPadraoOS" required>
            Utilizar empresa padrão para todas as OSs?
          </md-checkbox>
        </md-input-container>

        <md-input-container class="md-block osEmpPad" flex-gt-sm ng-if="config.empresaPadraoOS">
          <label>Empresa Padrão</label>
          <input ng-model="
          config.osEmpresaPadrao" ng-pattern="/^[0-9]*$/" maxlength="4" ng-focus="desativarMensagemGravacao()"
            ng-blur="validaEmpresaPadrao(config.osEmpresaPadrao, config.uniCodigo, $event)"
            onkeypress="return event.charCode >= 48 && event.charCode <= 57">
          <div ng-messages="projectForm.osEmpresaPadrao.$error" role="alert">
            <div>Todos os clientes.</div>
          </div>
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="abrirOsSemFaturamento" ng-model="config.abrirOsSemFaturamento" required>
            Permitir abertura de Ordem de Serviço para clientes com Faturamento em lote DESATIVADO?
          </md-checkbox>
        </md-input-container>

        <md-input-container class="md-block osEmpPad" flex-gt-sm
          ng-if="config.abrirOsSemFaturamento && !config.empresaPadraoOS">
          <label>Empresa Padrão</label>
          <input ng-model="
          config.osEmpresaPadrao" ng-pattern="/^[0-9]*$/" maxlength="4"
            ng-blur="validaEmpresaPadrao(config.osEmpresaPadrao, config.uniCodigo, $event)"
            onkeypress="return event.charCode >= 48 && event.charCode <= 57">
          <div ng-messages="projectForm.osEmpresaPadrao.$error" role="alert">
            <div>Clientes sem faturamento.</div>
          </div>
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="exibirOsFechadas" ng-model="config.exibirOsFechadas" required>
            Exibir Ordens de Serviços fechadas.
          </md-checkbox>
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="enviarAvisoAberturaOs" ng-model="config.enviarAvisoAberturaOs" required>
            Enviar informação de abertura de Ordem de Serviço por e-mail.
          </md-checkbox>
        </md-input-container>
        
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="enviaListaChave" ng-model="config.enviaListaChave" required>
            Incluir chave do cliente no email de abertura de OS.
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm ng-disabled="!config.enviarAvisoAberturaOs">
          <label>E-mail destino</label>
          <input ng-model="config.emailOs" maxlength="300" ng-pattern="/^.+@.+\..+$/"
            ng-required="config.enviarAvisoAberturaOs">
        </md-input-container>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="osSemTecnico" ng-model="config.osSemTecnico" required>
            Gerar OS sem técnico. (Ignorar técnico padrão do cliente)
          </md-checkbox>
        </md-input-container>

        <div ng-if="config.permitePagamentoCartao">
          <h3> • Pagamento com Cartão de Crédito </h3>
          <md-input-container class="md-block" flex-gt-sm>
            <md-checkbox name="pagamentoCartaoAtivo" ng-model="config.pagamentoCartaoAtivo" required>
              Permite que o cliente pague faturas utilizando cartão de crédito (Necessário Integração PJBank)
            </md-checkbox>
          </md-input-container>

          <h2>Mensagem enviada após confirmação de pagamento</h2>
          <p class="titulo-variaveis-cartao"><b>Variáveis:</b></p>
          <p class="variaveis-cartao">Valor do pagamento: [valor]</p>
          <p class="variaveis-cartao">Nome no cartão: [nome]</p>
          <p class="variaveis-cartao">Quatro ult. digitos do cartão: [finalCartao]</p>

          <!-- SMS -->
          <h2>SMS</h2>
          <md-input-container class="md-block" flex-gt-sm ng-disabled="!config.pagamentoCartaoAtivo">
            <label>Mensagem</label>
            <textarea name="mensagemSmsCartao" id="mensagemSmsCartao" cols="3" rows="3"
              ng-model="config.mensagemSMSConfirmacaoPgto"
              placeholder="Digite aqui a mensagem de confirmação do pagamento para SMS"
              ng-disabled="!config.pagamentoCartaoAtivo" maxlength="200"></textarea>
            <p class="texto-sms">O texto de SMS será enviado somente se o pacote SMS Inside estiver contratado e
              configurado.</p>
            <p class="texto-sms">Para mais informações acesse: <a href="https://sms.insidesistemas.com.br/"
                target="_blank">SMS Inside</a>
            </p>
          </md-input-container>

          <!-- Email -->
          <h2>E-mail</h2>
          <md-input-container class="md-block" flex-gt-sm ng-disabled="!config.pagamentoCartaoAtivo">
            <label>Assunto</label>
            <input ng-model="config.assuntoEmailConfirmacaoPgto" maxlength="100">
          </md-input-container>
          <md-input-container class="md-block" flex-gt-sm ng-disabled="!config.pagamentoCartaoAtivo">
            <label>Mensagem</label>
            <textarea name="mensagemEmailCartao" id="mensagemEmailCartao" cols="3" rows="3"
              ng-model="config.mensagemEmailConfirmacaoPgto"
              placeholder="Digite aqui a mensagem de confirmação do pagamento para E-mail"
              ng-disabled="!config.pagamentoCartaoAtivo"></textarea>
          </md-input-container>
        </div>

        <h3> • Configurações de Boletos </h3>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="bolEntradaConfirmada" ng-model="config.bolEntradaConfirmada" required>
            Exibir somente boletos com entrada confirmada?
          </md-checkbox>
          <md-checkbox name="bolExibeOriginal" ng-model="config.bolExibeOriginal" required>
            Exibir opção de impressão de boletos originais?
          </md-checkbox>
        </md-input-container>

        <!-- ATUALIZAR BOLETOS  -->
        <md-checkbox name="bolAtualizaBoletos" ng-model="config.bolAtualizaBoletos" required>
          Atualizar Boletos?
        </md-checkbox>
        <div layout-gt-sm="row" ng-if="config.bolAtualizaBoletos">
          <table class="formaPagto">
            <thead>
              <tr>
                <th colspan="2">Formas de pagamento</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="fp in config.formasPagamentoAtualiza">
                <td>{{fp.descricao}}</td>
                <td width="50">
                  <md-button class="md-secondary buttonPrinter" ng-click="addFormaPagNaoAtualiza(config, fp, true)">
                    <md-icon md-font-icon="flaticon-plus"></md-icon>
                  </md-button>
                </td>
              </tr>
            </tbody>
          </table>
          <table class="formaPagto">
            <thead>
              <tr>
                <th colspan="2">Formas de Pagamento NÂO Atualizar</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="fp in config.formasPagamentoNaoAtualiza">
                <td>{{fp.descricao}}</td>
                <td width="50">
                  <md-button class="md-secondary buttonPrinter" ng-click="addFormaPagNaoAtualiza(config, fp, false)">
                    <md-icon md-font-icon="flaticon-delete"></md-icon>
                  </md-button>
                </td>
              </tr>
            </tbody>
          </table>
        </div>

        <!-- OCULTAR FORMAS DE PAGAMENTO  -->
        <md-checkbox name="bolOcultaFormasPgto" ng-model="config.bolOcultaFormasPgto" required>
          Selecionar Formas de Pagamento para serem ocultas ?
        </md-checkbox>
        <div layout-gt-sm="row" ng-if="config.bolOcultaFormasPgto">
          <table class="formaPagto">
            <thead>
              <tr>
                <th colspan="2">Formas de Pagamento</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="fp in config.formasPagamento">
                <td>{{fp.descricao}}</td>
                <td width="50">
                  <md-button class="md-secondary buttonPrinter" ng-click="addFormaPagOculto(config, fp, true)">
                    <md-icon md-font-icon="flaticon-plus"></md-icon>
                  </md-button>
                </td>
              </tr>
            </tbody>
          </table>
          <table class="formaPagto">
            <thead>
              <tr>
                <th colspan="2">Formas de Pagamento a Ocultar</th>
              </tr>
            </thead>
            <tbody>
              <tr ng-repeat="fp in config.formasPagamentoOcultas">
                <td>{{fp.descricao}}</td>
                <td width="50">
                  <md-button class="md-secondary buttonPrinter" ng-click="addFormaPagOculto(config, fp, false)">
                    <md-icon md-font-icon="flaticon-delete"></md-icon>
                  </md-button>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
        <h3> • Configurações de Notas Fiscais de Serviço </h3>

        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="nfsOcultarInfos" ng-model="config.nfsOcultarInfos" required>
            Ocultar informações adicionais da Nota Fiscal de Serviço?
          </md-checkbox>

          <md-checkbox name="nfsOcultarLink" ng-model="config.nfsOcultarLink" required>
            Ocultar link para vizualização da Nota Fiscal de Serviço?
          </md-checkbox>
        </md-input-container>

        <h3>• Alteração de Cartão de Crédito</h3>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="exibeAlteracaoCartao" ng-model="config.exibeAlteracaoCartao" required>
            Enviar informação de alteração de cartão de credito por e-mail.
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm ng-disabled="!config.exibeAlteracaoCartao">
          <label>E-mail destino</label>
          <input ng-model="config.emailAlteracaoCartao" maxlength="300" ng-pattern="/^.+@.+\..+$/"
            ng-required="config.emailAlteracaoCartao">
        </md-input-container>

        <md-input-container ng-if="usaIntegracaoCartaoInside" class="md-block" flex-gt-sm>
          <md-checkbox name="atualizaAutomaticoCartao" ng-model="config.atualizaAutomaticoCartao" required>
            Realizar atualização automática nos dados de faturamento.
          </md-checkbox>
        </md-input-container>
        
        <md-input-container ng-if="usaIntegracaoCartaoInside" class="md-block" flex-gt-sm>
          <md-checkbox ng-change="exibeAvisoCartaoCredito(config)" name="validaCartaoCredito" ng-model="config.validaCartaoCredito" required>
            Validar dados do cartão
          </md-checkbox>
        </md-input-container>

        <md-input-container ng-if="usaIntegracaoCartaoInside" class="md-block" flex-gt-sm>
          <md-checkbox name="visualizaFaturaCartaoVencida" ng-model="config.visualizaFaturaCartaoVencida" required>
            Visualizar faturas de cartão de crédito vencidas
          </md-checkbox>
        </md-input-container>

        <!-- ENVIAR EMAIL ALTERAÇÂO DADOS -->
        <h3>• Alteração de Dados Cadastrais</h3>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="exibeAlteracaoCadastro" ng-model="config.exibeAlteracaoCadastro" required>
            Exibir opção para enviar pedido de alteração de dados do cadastro.
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm ng-disabled="!config.exibeAlteracaoCadastro">
          <label>E-mail destino</label>
          <input ng-model="config.emailAlteracaoCadastro" maxlength="300" ng-pattern="/^.+@.+\..+$/"
            ng-required="config.exibeAlteracaoCadastro">
        </md-input-container>
        <h3>• Email SAC</h3>
        <md-input-container class="md-block" flex-gt-sm>
          <label>E-mail SAC</label>
          <input ng-model="config.emailSac" maxlength="300" ng-pattern="/^.+@.+\..+$/">
        </md-input-container>
        <h3>• Permissões dos Menus de Acesso</h3>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="os" ng-model="config.liberacoesPortal.os" required>
            OS
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="sa" ng-model="config.liberacoesPortal.sac" required>
            SAC
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="notaFiscal" ng-model="config.liberacoesPortal.notaFiscal" required>
            NFE
          </md-checkbox>
        </md-input-container>
        <md-input-container  class="md-block" flex-gt-sm>
          <md-checkbox name="boleto" ng-model="config.liberacoesPortal.boleto" required>
            Faturas
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="monitoramento" ng-model="config.liberacoesPortal.monitoramento" required>
            Eventos
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="viagem" ng-model="config.liberacoesPortal.viagem" required>
            Viagem
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="dadosConta" ng-model="config.liberacoesPortal.dadosConta" required>
            Dados Conta
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="cartao" ng-model="config.liberacoesPortal.cartao" required>
            Cartão de Crédito
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="telefonesUteis" ng-model="config.liberacoesPortal.telefonesUteis" required>
            Telefones Úteis
          </md-checkbox>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-sm>
          <md-checkbox name="documentosUteis" ng-model="config.liberacoesPortal.documentosUteis" required>
            Documentos Úteis
          </md-checkbox>
        </md-input-container>
        <hr>
      </div>
      <md-button class="md-primary md-raised" type="submit">Gravar</md-button>
    </form>
  </div>

  <div class="content config" ng-if="abaSelecionada=='prospect' ">
    <h1>Cadastro de Prospects</h1>

    <md-input-container class="md-block" flex-gt-sm>
      <md-checkbox name="ativo" ng-model="prospectConfig.ativo">
        Ativa cadastro de prospect pelo Portal do Cliente.
      </md-checkbox>
    </md-input-container>
    <div ng-if="configs.length > 0">
      <form name="formProspect">
        <md-input-container class="md-block" flex-gt-sm>
          <label>Descrição do Campo</label>
          <input name="descricaoProspect" md-no-asterisk ng-disabled="!prospectConfig.ativo"
            ng-model="prospectConfig.descricao" md-maxlength="50">
          <div ng-messages="formProspect.descricao.$error">
            <div ng-message="required">Campo obrigatório.</div>
            <div ng-message="md-maxlength">Este campo pode conter no máximo 50 caracteres.</div>
          </div>
        </md-input-container>

        <table>
          <thead>
            <tr>
              <th>Opções para cliente</th>
              <th width="100">Unidade</th>
              <th width="200">Área de interesse</th>
              <th width="200">E-mail</th>
              <th width="50"></th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="u in prospectConfig.areaInteresse">
              <td>{{u.descricao}}</td>
              <td width="100">{{u.unidade}}</td>
              <td width="100">{{u.interesse.descreve}}</td>
              <td width="100">{{u.email}}</td>
              <td width="50">
                <md-button class="md-secondary buttonPrinter" ng-click="removeUnidadeProspect(u)">
                  <md-icon md-font-icon="flaticon-delete"></md-icon>
                </md-button>
              </td>
            </tr>
          </tbody>
        </table>
        <h3>Adicionar nova opção para cliente</h3>
        <form name="formProspectItem">
          <div layout-gt-sm="row">
            <md-input-container class="md-block" flex-gt-sm>
              <label>Descrição</label>
              <input name="descricao" ng-required="opcaoProspect" maxlength="50" md-no-asterisk
                ng-model="opcaoProspect.descricao" md-maxlength="50">
              <div ng-messages="formProspectItem.descricao.$error">
                <div ng-message="required">Campo obrigatório.</div>
                <div ng-message="md-maxlength">Este campo pode conter no máximo 50 caracteres.</div>
              </div>
            </md-input-container>
            <md-input-container class="md-block" flex-gt-sm="2">
              <label>Unidade</label>
              <input name="descricao" ng-required="opcaoProspect"
                onkeypress="return event.charCode >= 48 && event.charCode <= 57" md-no-asterisk
                ng-model="opcaoProspect.unidade" md-maxlength="4" maxlength="4">
              <div ng-messages="formProspectItem.descricao.$error">
                <div ng-message="required">Campo obrigatório.</div>
                <div ng-message="md-maxlength">Este campo pode conter no máximo 50 caracteres.</div>
              </div>
            </md-input-container>
            <md-input-container flex-gt-sm="4">
              <label>Área de interesse</label>
              <md-select name="seleInteresse" ng-model="opcaoProspect.interesse">
                <md-option ng-repeat="interesse in prospectConfig.listaInteresse" ng-value="interesse">
                  {{interesse.descreve}}
                </md-option>
              </md-select>
            </md-input-container>
            <md-input-container class="md-block" flex-gt-sm="4">
              <label>E-mail</label>
              <input name="email" ng-required="opcaoProspect" md-asterisk ng-model="opcaoProspect.email"
                ng-pattern="/^.+@.+\..+$/" type="email" ng-required>
            </md-input-container>

            <md-input-container class="md-block" flex-gt-sm="2">
              <md-button class="md-secondary md-raised" ng-click="addOpcaoProspect()">Adicionar</md-button>
            </md-input-container>
          </div>
        </form>
        <md-button class="md-primary md-raised" ng-click="gravarProspectConfig()">Gravar</md-button>
      </form>
    </div>
  </div>

  <div class="content config" ng-if="abaSelecionada=='fones'">
    <h1>Cadastro de Telefones ùteis</h1>
    <form name="formFones" ng-submit="gravarFones(newFone)">
      <div layout-gt-sm="row">
        <md-input-container class="md-block" flex-gt-sm>
          <label>Descrição</label>
          <input name="descricao" ng-required="newFone" md-no-asterisk ng-model="newFone.descricao" md-maxlength="50">
          <div ng-messages="formFones.descricao.$error">
            <div ng-message="required">Campo obrigatório.</div>
            <div ng-message="md-maxlength">Este campo pode conter no máximo 50 caracteres.</div>
          </div>
        </md-input-container>
        <md-input-container class="md-block" flex-gt-xs md-flex="15">
          <label>Telefone</label>
          <input name="telefone" ng-required="newFone" ng-model="newFone.telefone" ui-br-phone-number required />
          <div class="hint" ng-show="showHints">(##) #####-####</div>
          <div ng-messages="formFones.telefone.$error">
            <div ng-message="required">Campo obrigatório.</div>
          </div>
        </md-input-container>
        <md-input-container flex="20">
          <label>Unidade</label>
          <md-select name="seleUnidade" ng-model="newFone.unidade">
            <md-option ng-repeat="u in unidades" ng-value="u"> {{u}}</md-option>
          </md-select>
        </md-input-container>
      </div>
      <md-button class="md-primary md-raised" type="submit">Gravar</md-button>
    </form>

    <h1>Telefones Cadastrados</h1>
    <md-toolbar class="min"></md-toolbar>
    <md-list>
      <md-list-item class="md-2-line" ng-repeat="fone in listaTelefonesUteis | filter:procuraGeral">
        <div class="md-list-item-text" layout-gt-sm="row" layout-align="space-between">
          <h3>
            <span>Unidade: </span>{{ !fone.unidade ? '0000' : fone.unidade }}
          </h3>
          <h3>
            <span>Descrição: </span>{{ fone.descricao }}
          </h3>
          <h3 ng-class="{vencida: boleto.atraso > 0}">
            <span>Telefone: </span>{{ fone.telefone }}
          </h3>
          <md-button class="md-secondary buttonPrinter" ng-click="deleteFone($index)">
            <md-tooltip md-direction="top">
              Deletar Telefone
            </md-tooltip>
            <md-icon md-font-icon="flaticon-delete"></md-icon>
          </md-button>
        </div>
      </md-list-item>
    </md-list>
  </div>

  <div class="content config" ng-if="abaSelecionada=='arquivos'">
    <div ng-repeat="u in arrArquivosUnidades" class="docUteis">
      <md-card>
        <md-card-title>
          <md-card-title-text>
            <span class="md-headline">{{u.unidade}} - {{u.descricao}}</span>
          </md-card-title-text>
        </md-card-title>
        <md-card-content style="overflow: auto;">
          <div ng-repeat="ar in u.arrArquivosUteisPortal">

            <div class="arqDelete" ng-click="removeArquivo(ar.nome, u.unidade)">
              <md-icon md-font-icon="flaticon-delete"></md-icon>
            </div>
            <a target="_self" ng-href="{{ urlArquivos + ar.nome }}" download="{{ar.nome}}">
              <div class="filesType" ng-class="getExt(ar.extencao)">

              </div>
              <span>{{ar.nome}}</span>
            </a>
          </div>
        </md-card-content>
        <md-card-actions layout="row" layout-align="end center">
          <md-button type="file" ngf-select="uploadArquivosUteis(u.unidade, $file, $invalidFiles)"
            accept=".xbm, .tif, .pjp, .jfif, .ico, .tiff, .gif, .svg, .jpeg, .svgz, .jpg, .webp, .png, .bmp, .pjpeg, .avif, .raw, .pdf, .doc, .docx, .odt, .xls, xlsx, .ods">
            Anexar
            novo Arquivo</md-button>
        </md-card-actions>
      </md-card>
    </div>
  </div>

  <div class="content config" ng-if="abaSelecionada=='eventos'">

    <form name="formConection" >
      <md-input-container flex-gt-sm="4"  id="formConection">
        <p>* Selecione uma conexão de monitoramento para exibir os eventos.</p>

        <label>Conexão de monitoramento</label>
        <md-select name="seleMonitoramento" ng-model="currentConexao.codigo" ng-change="listarEventosSigma()">
          <md-option ng-repeat="conexao in conexoesMonitoramento" ng-value="conexao.codigo">
            {{conexao.banco}} - {{conexao.idSigma}}
          </md-option>
        </md-select>
      </md-input-container>
    </form>

    <div>    
      <h1 >Ocultar Eventos de Alarme</h1>
      <p >* Caso nenhum evento seja selecionado para ser exibido, todos os eventos serão listados. </p>
      <div layout="row">
        <div flex>
          <h3>Eventos Exibidos</h3>
          <md-list>
            <md-list-item class="md-2-line" ng-repeat="ev in listaEventosExibidos  | filter: procuraGeral">
              <div class="md-list-item-text" layout-gt-sm="column">
                <div>
                  <md-button class="md-secondary buttonPrinter" ng-click="gravaOcultaEventos(ev, true)">
                    <md-icon md-font-icon="flaticon-delete"></md-icon>
                  </md-button>
                </div>
                <div layout-gt-sm="row">
                  <h3 flex-gt-sm="30">
                    <span>Evento: </span>{{ ev.codigoExibicao }}
                  </h3>
                  <h3 flex>
                    <span>Descrição: </span>{{ ev.descricao }}
                  </h3>
                </div>
              </div>
              <md-divider ng-if="!$last"></md-divider>
            </md-list-item>
          </md-list>
          </md-content>
        </div>

        <div flex>
          <div layout="row" layout-align="space-between center">
            <h3>Eventos Ocultos</h3>
          </div>
          <md-list style="border-left: 2px solid;">
            <md-list-item class="md-2-line" ng-repeat="ev in listaTipos | filter: procuraGeral">
              <div class="md-list-item-text" layout-gt-sm="column">
                <div>
                  <md-button class="md-secondary buttonPrinter" ng-click="gravaOcultaEventos(ev, false)">
                    <md-icon md-font-icon="flaticon-plus"></md-icon>
                  </md-button>
                </div>
                <div layout-gt-sm="row">
                  <h3 flex-gt-sm="30">
                    <span>Evento: </span>{{ ev.codigoExibicao }}
                  </h3>
                  <h3 flex>
                    <span>Descrição: </span>{{ ev.descricao }}
                  </h3>
                </div>
              </div>
              <md-divider ng-if="!$last"></md-divider>
            </md-list-item>
          </md-list>
          </md-content>
        </div>
      </div>
    </div>
  </div>

  <div class="content config" ng-if="abaSelecionada=='acessos'">
    <section class="content-header" layout-gt-sm="row" layout-align="space-between center">
      <h1>Log de Acessos</h1>
      <section class="filtro padding15" layout-align="flex-end center">
        <label for="data-inicial">
          <input 
            name="data-inicial" 
            type="date" 
            ng-model="dataInicialAcessos" />
        </label>
        <span>à</span>
        <label for="data-final">
          <input 
            name="data-final" 
            type="date" 
            ng-model="dataFinalAcessos" 
          />
        </label>
        <md-button
          class="md-primary md-raised"
          ng-click="buscarAcessosPeriodo(dataInicialAcessos, dataFinalAcessos)"
          style="width: 120px;"
        >
          <span>Buscar</span>
        </md-button>
      </section>
    </section>
    <div class="content-indicators" layout-gt-sm="row" layout-align="space-around center">
      <div class="acessos-count">
        <div class="periodo">Hoje</div>
        <div class="count">{{acesso.hoje}}</div>
      </div>
      <div class="acessos-count">
        <div class="periodo">Ontem</div>
        <div class="count">{{acesso.ontem}}</div>
      </div>
      <div class="acessos-count">
        <div class="periodo">Mês Atual</div>
        <div class="count">{{acesso.mes}}</div>
      </div>
      <div class="acessos-count">
        <div class="periodo">Mês Anterior</div>
        <div class="count">{{acesso.anterior}}</div>
      </div>
      <div class="acessos-count">
        <div class="periodo">Período Selecionado</div>
        <div class="count">{{acesso.periodo.length}}</div>
    </div>
    </div>
    <h1>Últimos 30 acessos</h1>
   
    <div layout-gt-sm="row" class="padding15"> 
      <div flex="60">
        <table>
          <thead>
            <tr>
              <th width="30">Código</th>
              <th width="200">Cliente</th>
              <th width="100">Data</th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="ac in acesso.ultimos">
              <td width="30">{{ac.codigo}}</td>
              <td width="200">{{ac.nome}}</td>
              <td width="100">{{ac.dataHora | date: 'dd/MM/yyyy HH:mm:ss'}}</td>
            </tr>
          </tbody>
        </table>
      </div>
      <div flex="35" style="padding-left: 15px;">
        <div layout="row" layout-align="space-between center">
          <h3>Acessos de Clientes </h3>
          <div>
            <input type="text" placeholder="Filtrar" ng-model="txtFiltrar">

            <md-button class="buttonPrinter" ng-click="atualizarAcessoClientes(txtFiltrar)">
              <md-tooltip md-direction="top">
                Atualizar
              </md-tooltip>
              <md-icon md-font-icon="flaticon-refresh"></md-icon>
            </md-button>
          </div>
        </div>
        <md-list style="border-left: 2px solid;">
          <md-list-item class="md-2-line" ng-repeat="e in paginate.result.data | orderBy: '-contador'">
            <div class="md-list-item-text" layout-gt-sm="column">
              <div>
                <h3>
                  <span>Cliente:</span> {{ e.codigo }}-{{ e.nome }}
                </h3>
                <h3>
                  <span>Acessos: </span>{{ e.contador }}
                </h3>
                <h3>
                  <span>Ultimo: </span>{{ e.dataHora | date: 'dd/MM/yyyy' }}
                </h3>
              </div>
            </div>
            <md-divider ng-if="!$last"></md-divider>
          </md-list-item>
        </md-list>
        <section layout="row" layout-align="space-between center" layout-sm="column" ng-if="paginate.result.data">
          <md-button class="md-primary" ng-click="paginate.prev()">
            << Anterior </md-button>
              <md-button class="md-primary" ng-click="paginate.next()"> Proximo >>
              </md-button>
        </section>
        <p ng-if="paginate.result.data">Exibindo registros de {{paginate.result.from}} até {{paginate.result.to}}
          de um
          total de {{paginate.total}}</p>
      </div>
    </div>
  </div>

</div>