validacion validad

2020-09-18 04:58:45 -05:00
parent fe672e6662
commit 6d8dc1a5ea
7 changed files with 2276 additions and 973 deletions
@@ -11,61 +11,205 @@
              <h1>Iniciar Sesión</h1>
          </div>

+          
+
          <form>
-            <input type="text" id="login" class="fadeIn second" name="login" placeholder="Correo">
-            <input type="password" id="password" class="fadeIn third" name="login" placeholder="Contraseña">
-            <input type="submit" class="fadeIn fourth" value="Log In">
+            <input type="text" id="login" class="fadeIn second" name="login" placeholder="Correo" v-model="correo">
+            <input type="password" id="password" class="fadeIn third" name="login" placeholder="Contraseña" v-model="password">
+            <input type="button" class="fadeIn fourth"  @click="login()" value="Ingresar">
          </form>

          <div id="formFooter">
-            <a class="underlineHover" href="#">Registrate</a> <br/>
+            <router-link to="/registro"><a class="underlineHover" href="#" >Registrate</a></router-link> <br/>
            <a class="underlineHover"  href="#" v-b-modal.enviarPass >¿ Olvidaste tu Contraseña ?</a>
          </div>

        </div>
+
+
        <b-modal
          id="enviarPass"
          ref="modal"
          title="Enviar correo con constraseña nueva"
-          @show="resetModal"
-          @hidden="resetModal"
-          @ok="handleOk"
          hide-footer
        >
-          <form ref="form" @submit.stop.prevent="handleSubmit">
-            <b-form-group
-              :state="nameState"
-              label="Correo"
-              label-for="name-input"
-              invalid-feedback="Es necesario el correo"
-            >
-              <b-form-input
-                id="name-input"
-                v-model="name"
-                :state="nameState"
-                required
-                style="width: 100%; x"
-              ></b-form-input>
-            </b-form-group>
-          </form>
-          <b-button  class="btn btn-outline-danger" @click="$bvModal.hide('enviarPass')">Cancelar</b-button>
-          <b-button   class="btn btn-outline-success float-right" @click="$bvModal.hide('enviarPass')" >Enviar</b-button>
+          
+          <div class="loader" v-if="enviando">Loading...</div>
+           
+        
+          <div v-else>
+            <form ref="form" @submit.stop.prevent="handleSubmit">
+              <b-form-group
+              
+                label="Correo"
+                
+              >
+                <b-form-input
+                  id="name-input"
+                  v-model="enviarPass"
+                  style="width: 100%; "
+                ></b-form-input>
+              </b-form-group>
+            </form>
+          
+            <b-button   class="btn btn-outline-success float-right" @click="enviarPassword()" style="width: 100%; ">Enviar</b-button>
+          </div>
+
+          
        </b-modal>
      </div>
    </div>
 </template>

 <script>
+import axios from "axios";
+import config from "../config/config.js";
+import Swal from "sweetalert2";
+
 export default {
  name: 'Login',
-  props: {
-    msg: String
-  }
+   data() {
+    return {
+      correo: "",
+      password: "",
+      enviarPass: "",
+      enviando: false
+    };
+  },
+   methods: {
+    async login() {
+      try {
+        const data ={
+          correo: this.correo,
+          password: this.password
+        }
+        let response = await axios.post(
+          `${config.api}/loginPersona`, data
+        )
+        if( typeof (response.data.entro) !== 'undefined'){
+          Swal.fire({
+            title: "Bienvenido",
+            text: response.data.msj || response,
+            icon: 'success'
+          });
+        }
+        else{
+
+          response = await axios.post(
+            `${config.api}/loginAdmin`, data
+          )
+
+           if( typeof (response.data.entro) !== 'undefined'){
+              Swal.fire({
+                title: "Bienvenido Admin",
+                text: response.data.msj || response,
+                icon: 'success'
+              });
+           }
+           else{
+              Swal.fire({
+                title: "¿Aún no tienes cuenta?",
+                text: response.data.msj || response,
+                icon: 'error'
+              });
+           }
+        }
+
+        
+      }
+      catch(error){
+      
+         Swal.fire({
+            title: "Error",
+            text: error.response.data.msj || error,
+            icon: "error"
+          });
+      }
+
+    },
+    async enviarPassword(){
+      try{
+        this.enviando=true;
+        let response = await axios.post(
+            `${config.api}/enviarPassword`, {correo: this.enviarPass}
+          )
+        this.enviando=false;
+        if( typeof (response.data.enviado) !== 'undefined'){
+          await Swal.fire({
+                title: "Enviado",
+                text: `Se ha enviado la nueva contraseña`,
+                icon: 'success'
+              });
+          location.reload();
+        }
+        else{
+            await Swal.fire({
+            title: "Error",
+            text: response.data.msj || 'No existe',
+            icon: "error"
+          });
+        }
+      }
+      catch(error){
+          this.enviando=false;
+           await Swal.fire({
+            title: "Error",
+            text: error.response.data.msj || error,
+            icon: "error"
+          });
+      }
+     
+    }
+    
+  },
 }
 </script>

 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped>
+.loader,
+.loader:after {
+  border-radius: 50%;
+  width: 10em;
+  height: 10em;
+}
+.loader {
+  margin: 60px auto;
+  font-size: 10px;
+  position: relative;
+  text-indent: -9999em;
+  border-top: 1.1em solid rgba(0,44,148, 0.2);
+  border-right: 1.1em solid rgba(0,44,148, 0.2);
+  border-bottom: 1.1em solid rgba(0,44,148, 0.2);
+  border-left: 1.1em solid #002c94;
+  -webkit-transform: translateZ(0);
+  -ms-transform: translateZ(0);
+  transform: translateZ(0);
+  -webkit-animation: load8 1.1s infinite linear;
+  animation: load8 1.1s infinite linear;
+}
+@-webkit-keyframes load8 {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+@keyframes load8 {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+    transform: rotate(360deg);
+  }
+}
+
+
  .banner{
    position: realtive; 
    top: 0;