Efecto al Login

This commit is contained in:
2022-11-07 03:30:51 -05:00
parent 65dcdb2894
commit 036e23dbfe
6 changed files with 177 additions and 74 deletions

View File

@@ -56,7 +56,11 @@ function stringTo_md5(data_string){
console.log("MD5: ", md5); console.log("MD5: ", md5);
return md5; return md5;
} }
//********* APP-PEDIDOS-SIGMA ********// //************* FORM LOGIN DEMO ****************//
controlador.login_test = (req, res) => {
res.render('login_test');
};
//********* FORM APP-PEDIDOS-SIGMA ********//
controlador.app_sigma = (req, res) => { controlador.app_sigma = (req, res) => {
res.render('app_pedidos'); res.render('app_pedidos');
}; };
@@ -110,6 +114,12 @@ function stringTo_md5(data_string){
}); });
}); });
}; };
controlador.recibe_pedidos = (req, res) => {
console.log("Data: "+req.body);
req.getConnection((err, conn) => {
res.json({sision:"exitosa"});
});
};
//********* APP-panel control ********// //********* APP-panel control ********//
controlador.panel_control = (req, res) => { controlador.panel_control = (req, res) => {

View File

@@ -178,7 +178,8 @@ controlador.app_consultaItemsPrecios = (req,res) => {
//if(err) return res.status(500).send("Error en Consulta de Items"); //if(err) return res.status(500).send("Error en Consulta de Items");
rows.map( rows.map(
dat => { dat => {
//console.log(var_b64(dat.imagen)); //console.log(blob_a_b64(dat.imagen));
dat.imagen = blob_a_b64(dat.imagen);
//fs.writeFileSync(path.join(__dirname,"../img/db_img"+image.codigo_prdcto+".png"),image.imagen); //fs.writeFileSync(path.join(__dirname,"../img/db_img"+image.codigo_prdcto+".png"),image.imagen);
} }
) )
@@ -189,20 +190,15 @@ controlador.app_consultaItemsPrecios = (req,res) => {
}); });
}; };
let blob_b64 = (blob) =>{ function blob_a_b64(blob) {
return new Promise((resolve,reject)=>{ var b64;
const reader = new FileReader(); if(blob!=null){
reader.readAsDataURL(blob); b64 = blob.toString('base64');
reader.onloadend = () => { }else{
resolve(reader.result); b64="";
} }
}) return b64;
}; }
var_b64 = (blob) => {
const reader = new FileReader();
return reader.readAsDataURL(blob);
};
//********* CONSULTA ADICIONALES X MODIFICAR ********// //********* CONSULTA ADICIONALES X MODIFICAR ********//
controlador.cierresCaja = (req, res) => { controlador.cierresCaja = (req, res) => {

View File

@@ -1,16 +1,92 @@
body{ @import url('https://fonts.googleapis.com/css?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
background: #084C6D; *{
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Poppins', sans-serif,sigma_tipografia;
} }
body{
/*background: #084C6D;*/
display: flex;
justify-content:center;
align-items: center;
min-height: 100vh;
background: #23242a;
}
@font-face {
font-family: sigma_tipografia;
src: url(../tipografias/sigma_font.ttf) format('truetype'), url(../tipografias/sigma_font.otf) format('truetype');
font-style: normal;
}
.login-page{ .login-page{
background-color: #084C6D; background-color: #084C6D;
} }
.login-logo a, .register-logo a{ .login-logo a, .register-logo a{
color: #b5daff color: #b5daff
} }
.nom_app{
font-family: sigma_tipografia;
}
.login-logo{ .login-logo{
font-size:32px; font-size:32px;
font-family: 'SIGMA-FONT', sigma_font, sigma_tipografia; font-family: sigma_tipografia;
} }
.login-box-msg{ .login-box-msg{
font-family: 'SIGMA-FONT', sigma_font, sigma_tipografia; font-family: 'SIGMA-FONT', sigma_font, sigma_tipografia;
}
.box{
position: relative;
width: 380px;
height: 420px;
background-color: #1c1c1c;
border-radius: 8px;
overflow: hidden;
}
.box::before{
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 370px;
height: 420px;
background: linear-gradient(0deg,transparent,#45f3ff,#45f3ff);
transform-origin: bottom right;
animation: animar 6s linear infinite;
}
.box::after{
content: '';
position: absolute;
top: -50%;
left: -50%;
width: 370px;
height: 420px;
background: linear-gradient(0deg,transparent,#45f3ff,#45f3ff);
transform-origin: bottom right;
animation: animar 6s linear infinite;
animation-delay: -3s;
}
@keyframes animar{
0%{
transform: rotate(0deg);
}
100%{
transform: rotate(360deg);
}
}
.form-box {
position: absolute;
inset: 2px;
background: #28292d;
z-index: 10;
}
.login-box{
position: absolute;
inset: 2px;
background: #28292d;
z-index: 10;
width: 99%;
margin-top: 0rem;
border-radius: 8px;
} }

View File

@@ -10,7 +10,10 @@ rutas.get('/gp_precios', controlador_init.app_GpPrecios);//consulta grupo precio
rutas.get('/origen_pedidos', controlador_init.app_ORIGENES);//consulta grupo precios rutas.get('/origen_pedidos', controlador_init.app_ORIGENES);//consulta grupo precios
rutas.get('/panel_control', controlador_init.panel_control);//consulta grupo precios rutas.get('/panel_control', controlador_init.panel_control);//consulta grupo precios
rutas.get('/pedidos', controlador_init.app_sigma);//Una app para PEDIDOS rutas.get('/pedidos', controlador_init.app_sigma);//Una app para PEDIDOS
rutas.get('/', controlador_init.app_login);//Una app para PEDIDOS rutas.get('/recepcionPedidos', controlador_init.recibe_pedidos);//receptar pedidos
rutas.post('/login', controlador_init.auth);//Una app para PEDIDOS
rutas.get('/', controlador_init.app_login);//FORM LOGIN DE LA APP
rutas.post('/login', controlador_init.auth);//Authenticacion de APP
rutas.get('/login_test', controlador_init.login_test);//login testing css / dev
module.exports = rutas; module.exports = rutas;

View File

@@ -7,56 +7,60 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title> <title>Document</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&amp;display=fallback"> <link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&amp;display=fallback">
<link rel="stylesheet" href="../../plugins/fontawesome-free/css/all.min.css"> <link rel="stylesheet" href="../../plugins/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="../../plugins/icheck-bootstrap/icheck-bootstrap.min.css"> <link rel="stylesheet" href="../../plugins/icheck-bootstrap/icheck-bootstrap.min.css">
<link rel="stylesheet" href="../../dist/css/adminlte.min.css?v=3.2.0"> <link rel="stylesheet" href="../../dist/css/adminlte.min.css?v=3.2.0">
<link rel="stylesheet" href="./css/login.css"> <link rel="stylesheet" href="./css/login.css">
<link rel="icon" sizes="192x192" href="./img/favicon-32x32.png"> <link rel="icon" sizes="192x192" href="./img/favicon-32x32.png">
<link rel="icon" sizes="64x64" href="./img/favicon-64x64.png"> <link rel="icon" sizes="64x64" href="./img/pedidos64.png">
</head> </head>
<body class="login-page" style="min-height: 497.361px;"> <body class="login-page" style="min-height: 497.361px;">
<div class="login-box"> <div class="box">
<div class="login-logo"> <div class="login-box">
<a href="https://sigmac.app"><b><img src="img/pedidos64.png" alt="logo" width="52"> SIGMA</b> Pedidos</a> <div class="login-logo">
</div> <a href="https://sigmac.app"><strong><img src="img/pedidos64.png" alt="logo" width="52"> <span class="nom_app">SIGMA</span></strong>
<div class="card"> Pedidos</a>
<div class="card-body login-card-body"> </div>
<p class="login-box-msg">iniciar tu sesión</p> <div class="card">
<form action="/login" method="post" name="form_login"> <div class="card-body login-card-body">
<div class="input-group mb-3"> <p class="login-box-msg">iniciar tu sesión</p>
<input type="text" class="form-control" placeholder="Usuario" id="usr" name="usuario"> <form action="/login" method="post" name="form_login">
<div class="input-group-append"> <div class="input-group mb-3">
<div class="input-group-text"> <input type="text" class="form-control" placeholder="Usuario" id="usr" name="usuario">
<span class="fas fa-user"></span> <div class="input-group-append">
<div class="input-group-text">
<span class="fas fa-user"></span>
</div>
</div> </div>
</div> </div>
</div> <div class="input-group mb-3">
<div class="input-group mb-3"> <input type="password" class="form-control" placeholder="Contraseña" id="pwd"
<input type="password" class="form-control" placeholder="Contraseña" id="pwd" name="password"> name="password">
<div class="input-group-append"> <div class="input-group-append">
<div class="input-group-text"> <div class="input-group-text">
<span class="fas fa-lock"></span> <span class="fas fa-lock"></span>
</div>
</div> </div>
</div> </div>
</div> <div class="row">
<div class="row"> <div class="col-8">
<div class="col-8"> <div class="icheck-primary">
<div class="icheck-primary"> <input type="checkbox" id="remember">
<input type="checkbox" id="remember"> <label for="remember">Recordar Me</label>
<label for="remember">Recordar Me</label> </div>
</div> </div>
</div>
<div class="col-4"> <div class="col-4">
<button type="submit" class="btn btn-primary btn-block" id="btn">Ingresar</button> <button type="submit" class="btn btn-primary btn-block" id="btn">Ingresar</button>
</div> </div>
</div> </div>
</form> </form>
<!--div class="social-auth-links text-center mb-3"> <!--div class="social-auth-links text-center mb-3">
<p>- OR -</p> <p>- OR -</p>
<a href="#" class="btn btn-block btn-primary"> <a href="#" class="btn btn-block btn-primary">
<i class="fab fa-facebook mr-2"></i> Ingresar Usando Facebook <i class="fab fa-facebook mr-2"></i> Ingresar Usando Facebook
@@ -66,14 +70,15 @@
</a> </a>
</div--> </div-->
<p class="mb-1"> <p class="mb-1">
<a href="forgot-password.html">Olvide mi Contraseña</a> <a href="forgot-password.html">Olvide mi Contraseña</a>
</p> </p>
<p class="mb-0"> <p class="mb-0">
<a href="register.html" class="text-center">Crear Cuenta</a> <a href="register.html" class="text-center">Crear Cuenta</a>
</p> </p>
</div> </div>
</div>
</div> </div>
</div> </div>
<script src="../../plugins/jquery/jquery.min.js"></script> <script src="../../plugins/jquery/jquery.min.js"></script>
@@ -83,26 +88,22 @@
var usr = document.getElementById('usr'); var usr = document.getElementById('usr');
var pwd = document.getElementById('pwd'); var pwd = document.getElementById('pwd');
var btn = document.getElementById('btn'); var btn = document.getElementById('btn');
btn.addEventListener('click', function(event){ btn.addEventListener('click', function (event) {
event.preventDefault(); event.preventDefault();
if(usr.value==""){ if (usr.value == "") {
alert("Ingresa Usuario"); alert("Ingresa Usuario");
}else if(pwd.value==""){ } else if (pwd.value == "") {
alert("Ingresa Pasword"); alert("Ingresa Pasword");
}else{ } else {
document.form_login.submit(); document.form_login.submit();
} }
}) })
</script> </script>
<script src="https://www.gstatic.com/dialogflow-console/fast/messenger/bootstrap.js?v=1"></script> <script src="https://www.gstatic.com/dialogflow-console/fast/messenger/bootstrap.js?v=1"></script>
<df-messenger <df-messenger intent="WELCOME" chat-title="Chat SIAX" agent-id="eea5ca65-ded3-4c89-bd8a-9e6378cb4686"
intent="WELCOME" language-code="es" chat-icon="https://telcotronics.com/app/ftp/logo/logoTelcotronics36.png"
chat-title="Chat SIAX" class="pulse-button">
agent-id="eea5ca65-ded3-4c89-bd8a-9e6378cb4686" </df-messenger>
language-code="es"
chat-icon="https://telcotronics.com/app/ftp/logo/logoTelcotronics36.png"
class="pulse-button" >
</df-messenger>
</body> </body>
</html> </html>

17
src/views/login_test.ejs Normal file
View File

@@ -0,0 +1,17 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./css/login.css">
</head>
<body>
<div class="box">
<div class="form-box">
</div>
</div>
</body>
</html>