templates/usuarios/login.twig line 1

Open in your IDE?
  1. {% import "_macros.twig" as forms %}
  2. {% extends 'baseLogin.twig' %}
  4. {% block content %}
  5. <div class="inner-wrap" id="div_login">
  6.     <div id="div_entrar" class="">
  7.         <div class="form-card">
  8.             <div class="">
  9.                 <figure class="image container  is-128x128">
  10.                     <img class="" style="max-width: 100px;" src="/images/logo.png">
  11.                 </figure>
  12.             </div>
  13.             <div class="auth-head">
  14.                 <h2 data-bind="text:labels.titulo">Bienvenido</h2>
  15.                 {% if error %}
  16.                 <div class="message is-danger">
  17.                     {{ errorCredenciales }}
  18.                 </div>
  19.                 {% endif %}
  20.             </div>
  21.             <form action="{{ path('app_login') }}" method="post">
  22.                 <div id="signin-form" class="login-form">
  23.                     {{ forms.input('_username', 'labels.nomUsuario', 'nomUsuario') }}
  24.                     {{ forms.contra('_password', 'labels.contra', 'contra') }}
  25.                     <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">
  26.                     <!-- <input type="hidden" name="claCliente" value="claCliente" > -->
  27.                     <div class="control login">
  28.                         <button class="button h-button is-primary is-bold is-fullwidth is-raised"
  29.                             data-bind="text:labels.entrar,css: { 'is-loading': enProgreso()}, click:enviar">Sign
  30.                             In</button>
  31.                     </div>
  32.                 </div>
  33.             </form>
  34.         </div>
  35.         <div class="forgot-link has-text-centered">
  36.             <a data-bind="text:labels.olvido, click:olvido" href="#">Forgot Password?</a>
  37.         </div>
  38.     </div>
  39.     <div id="div_olvido" class="is-hidden">
  40.         <div class="form-card">
  41.             <div class="">
  42.                 <figure class="image container  is-128x128">
  43.                     <img class="" style="max-width: 100px;" src="/images/logo.png">
  44.                 </figure>
  45.             </div>
  46.             <div class="auth-head">
  47.                 <h2 data-bind="text:labels.olvidoTitulo">Bienvenido</h2>
  48.             </div>
  49.             <form>
  50.                 <div id="signin-form" class="login-form">
  51.                     {{ forms.input('txtCorreo', 'labels.correo', 'correo') }}
  52.                     <div class="control login">
  53.                         <button class="button h-button is-primary is-bold is-fullwidth is-raised"
  54.                             data-bind="text:labels.recuperar,css:{'is-loading': enProgreso()}, click:olvidoEnviar"></button>
  55.                     </div>
  56.                 </div>
  57.             </form>
  58.         </div>
  59.         <div class="forgot-link has-text-centered">
  60.             <a data-bind="text:labels.cancelar, click:cancelar" href="#"></a>
  61.         </div>
  62.     </div>
  63. </div>
  64. {% endblock %}
  66. {% block js %}
  67. {#///#}
  68. <script type="text/javascript">
  69.     var rotulos = JSON.parse("{{rotulos|e('js')}}");
  70.     var valores = JSON.parse("{{valores|e('js')}}");
  71.     ///
  72.     var ViewModel = function () {
  73.         var self = this;
  75.         self.labels = {};
  76.         for (rotulo in rotulos) {
  77.             self.labels[rotulo] = ko.observable(rotulos[rotulo]);
  78.         }
  80.         ///
  81.         self.valores = {};
  82.         for (var i = 0; i < valores.length; i++) {
  83.             self.valores[valores[i].alias] = ko.observable(valores[i].valor);
  84.         }
  85.         self.nomUsuario = ko.observable(valores.nomUsuario).extend(
  86.             { required: { message: self.labels.nomUsuarioAviso() } }
  87.         );
  88.         self.contra = ko.observable().extend(
  89.             { required: { message: self.labels.contraAviso() } }
  90.         );
  91.         self.correo = ko.observable('').extend(
  92.             {
  93.                 required: { message: self.labels.correoAviso() },
  94.                 email: { message: self.labels.correoAviso() }
  95.             }
  96.         );
  98.         self.enProgreso = ko.observable(false);
  99.         ///
  100.         self.enviar = function () {
  101.             self.enProgreso(true);
  102.             if (loginVM.errorsLogin().length > 0) {
  103.                 loginVM.errorsLogin.showAllMessages();
  104.                 setTimeout(function () {
  105.                     self.enProgreso(false);
  106.                 }, 2000);
  107.                 return;
  108.             }
  109.             self.enProgreso(false);
  110.             return true;
  111.         };
  112.         ///
  113.         self.olvidoEnviar = function () {
  114.             self.enProgreso(true);
  115.             if (loginVM.errorsOlvido().length > 0) {
  116.                 loginVM.errorsOlvido.showAllMessages();
  117.                 setTimeout(function () {
  118.                     self.enProgreso(false);
  119.                 }, 2000);
  120.                 return;
  121.             }
  122.             $.ajax('/usuarios/contraRecuperarEnviar', {
  123.                 type: 'post',
  124.                 data: {
  125.                     correo: self.correo(),
  126.                 },
  127.                 success: function (respuesta) {
  128.                     if (typeof (respuesta.resultado) == "undefined") {
  129.                         //si la sesion expiro
  130.                         $("#div_html_base").html(respuesta);
  131.                         return;
  132.                     }
  133.                     if (respuesta.resultado === 1) {
  135.                     } else {
  137.                     }
  138.                     self.enProgreso(false);
  139.                     alertify.alert('Invent', respuesta.mensaje).set('closable', false).set('label', '{{ cerrar }}');
  140.                 }
  141.             });
  142.         };
  143.         ///
  144.         self.olvido = function () {
  145.             $("#div_olvido").removeClass("is-hidden");
  146.             $("#div_entrar").addClass("is-hidden");
  147.         };
  148.         ///
  149.         self.cancelar = function () {
  150.             $("#div_entrar").removeClass("is-hidden");
  151.             $("#div_olvido").addClass("is-hidden");
  152.         };
  153.     };// viewModel
  154.     window.loginVM = new ViewModel();
  155.     loginVM.errorsLogin = ko.validation.group([loginVM.nomUsuario, loginVM.contra]);
  156.     loginVM.errorsOlvido = ko.validation.group([loginVM.correo]);
  157.     ko.applyBindings(loginVM, $("#div_login").get(0));
  159.     $('#_username').ready(function () {
  160.         $('#_username').focus();
  161.         var divs = document.getElementsByTagName('div');
  162.         var numIdInvent = 0;
  163.         for (var i = 0; i < divs.length; i++) {
  164.             if (divs[i].id.indexOf('invent-app') != -1) {
  165.                 numIdInvent++;
  166.             }
  167.         }
  168.         if (numIdInvent > 1) {
  169.             window.location = "/login";
  170.         }
  171.     });
  172. </script>
  173. {% endblock %}