refactor: refs #6555 create call fn & WIP: replace jquery
gitea/worker-time-control/pipeline/pr-test This commit looks good Details

This commit is contained in:
jorgep 2024-06-04 14:38:09 +02:00
parent 08830756d1
commit 9d323bdb21
2 changed files with 170 additions and 184 deletions

View File

@ -1,31 +1,24 @@
let pin = ""; let pin = "";
if ("addEventListener" in document) {
$(document).ready(function () { document.addEventListener("DOMContentLoaded", () => {
FastClick.attach(document.body); FastClick.attach(document.body);
setEvents();
});
function setEvents() { const heartEl = document.querySelector("body > h1 > span");
const heartEl = document.querySelector('body > h1 > span'); refreshDeviceLabel();
refreshDeviceLabel()
heartEl.addEventListener('click', function() { heartEl.addEventListener("click", () => {
Swal.fire({ Swal.fire({
title: 'Iniciar sesión', title: "Iniciar sesión",
html: html: `
`<input id="device" class="swal2-input" type="text" placeholder="Dispositivo" value="${localStorage.getItem('device') ?? ''}"> <input id="device" class="swal2-input" type="text" placeholder="Dispositivo" value="${localStorage.getItem("device") ?? ""}">
<input id="user" class="swal2-input" type="text" placeholder="Usuario" value="${localStorage.getItem('user') ?? ''}"> <input id="user" class="swal2-input" type="text" placeholder="Usuario" value="${localStorage.getItem("user") ?? ""}">
<input id="pass" class="swal2-input" type="password" placeholder="Contraseña">`, <input id="pass" class="swal2-input" type="password" placeholder="Contraseña">`,
confirmButtonText: 'Login', confirmButtonText: "Login",
showCloseButton: true, showCloseButton: true,
showCancelButton: false, showCancelButton: false,
}).then(async (result) => { }).then(async (result) => {
if(result.isConfirmed) { if (result.isConfirmed)
const user = $('#user').val(); signIn(document.querySelector("#user").value, document.querySelector("#pass").value, document.querySelector("#device").value);
const pass = $('#pass').val();
const device = $('#device').val();
signIn(user, pass, device);
}
}); });
}); });
@ -42,32 +35,32 @@ function setEvents() {
$(".btnOk").on("click", function () { $(".btnOk").on("click", function () {
if (pin) { if (pin) {
login(); login();
}; }
});
}); });
} }
function login() { async function login() {
$.post({ try {
urlPath: 'WorkerTimeControls/login', const res = await call("WorkerTimeControls/login", {
jsonData: {pin}, method: "POST",
processData: false, body: { pin },
success: function (data) { });
const data = await res.json();
localStorage.setItem("userData", JSON.stringify(data)); localStorage.setItem("userData", JSON.stringify(data));
window.location = "clockIn.html"; window.location = "clockIn.html";
}, } catch (e) {
error: function() { document.querySelector("#txtPin").textContent = "ID USUARIO";
$("#txtPin").text("ID USUARIO");
pin = ""; pin = "";
} }
});
} }
function signIn(user, password, device) { async function signIn(user, password, device) {
$.post({ const res = await call("vnUsers/sign-in", {
urlPath: 'vnUsers/sign-in', method: "POST",
jsonData: {user, password}, body: { user, password },
processData: false, });
success: function (data) { const data = await res.json();
localStorage.setItem("token", data.token); localStorage.setItem("token", data.token);
localStorage.setItem("ttl", data.ttl); localStorage.setItem("ttl", data.ttl);
localStorage.setItem("user", user); localStorage.setItem("user", user);
@ -75,10 +68,6 @@ function signIn(user, password, device) {
localStorage.setItem("created", Date.now()); localStorage.setItem("created", Date.now());
getTokenConfig(); getTokenConfig();
refreshDeviceLabel(); refreshDeviceLabel();
},
})
} }
function refreshDeviceLabel() { const refreshDeviceLabel = () => (document.querySelector("#deviceLabel").textContent = localStorage.getItem("device") ?? "");
$("#deviceLabel").text(localStorage.getItem('device') ?? '')
}

View File

@ -1,130 +1,127 @@
const renewPeriod = localStorage.getItem('renewPeriod'); const renewPeriod = localStorage.getItem("renewPeriod");
let intervalId, isCheckingToken; let intervalId, isCheckingToken;
const txtConfirm = document.querySelector(".txtConfirm");
const confirm = document.querySelector(".confirm");
function confirmReset() { function confirmReset() {
$(".confirm").removeClass('confirmKO'); confirm.classList.remove("confirmKO");
$(".txtConfirm").empty(); confirm.style.display = "none";
txtConfirm.textContent = "";
} }
// WIP: fadeIn / fadeOut
function printError(msg) { function printError(msg) {
confirmReset(); confirmReset();
$(".txtConfirm").append(msg); const txtConfirm = document.querySelector(".txtConfirm");
$(".confirm").addClass('confirmKO'); txtConfirm.textContent = msg;
const confirm = document.querySelector(".confirm");
confirm.classList.add("confirmKO");
confirm.style.display = "block";
$(".confirm").fadeIn(200); $(".confirm").fadeIn(200);
setTimeout(function() { setTimeout(() => {
$(".confirm").fadeOut(200); $(".confirm").fadeOut(200);
setTimeout(confirmReset, 200); setTimeout(confirmReset, 200);
}, 2300); }, 2300);
} }
function renewToken() { async function renewToken() {
$.post({ const res = await call("AccessTokens/renewToken", {});
urlPath: 'vnUsers/renewToken',
processData: false, const data = await res.json();
success: function (data) {
localStorage.setItem("token", data.id);
localStorage.setItem("ttl", data.ttl); localStorage.setItem("ttl", data.ttl);
localStorage.setItem("created", Date.now()); localStorage.setItem("created", Date.now());
},
})
} }
function getTokenConfig() { async function getTokenConfig() {
const filter = {fields: ['renewInterval', 'renewPeriod']}; const res = await call("AccessTokenConfigs/findOne", {
$.get({ params: JSON.stringify({
urlPath: 'AccessTokenConfigs/findOne', filter: { fields: ["renewInterval", "renewPeriod"] },
jsonData: filter, }),
processData: false, });
success: function (data) {
const data = await res.json();
if (!data) return; if (!data) return;
localStorage.setItem('renewPeriod', data.renewPeriod);
clearInterval(intervalId);
intervalId = setInterval(() => checkValidity(), data.renewInterval * 1000);
},
})
}
function checkValidity() { localStorage.setItem("renewPeriod", data.renewPeriod);
const created = +localStorage.getItem('created'); clearInterval(intervalId);
const ttl = localStorage.getItem('ttl');
intervalId = setInterval(() => {
const created = +localStorage.getItem("created");
const ttl = localStorage.getItem("ttl");
if (isCheckingToken || !created) return; if (isCheckingToken || !created) return;
isCheckingToken = true; isCheckingToken = true;
const renewPeriodInSeconds = Math.min(ttl, renewPeriod) * 1000; const renewPeriodInSeconds = Math.min(ttl, renewPeriod) * 1000;
const maxDate = created + renewPeriodInSeconds; const maxDate = created + renewPeriodInSeconds;
const now = new Date();
if (now.getTime() <= maxDate) return isCheckingToken = false; if (new Date().getTime() <= maxDate) return (isCheckingToken = false);
renewToken(); renewToken();
isCheckingToken = false; isCheckingToken = false;
}, data.renewInterval * 1000);
} }
$.ajaxPrefilter(function(xhr) { /// WIP: MUST try thru it!
const orgErrorHandler = xhr.error; async function call(url, { method = "GET", body = {}, params = {} }) {
const token = localStorage.getItem('token') const controller = new AbortController();
const { signal } = controller;
Object.assign(xhr, { const timeoutId = setTimeout(() => controller.abort(), 2000);
url: `/api/${xhr.urlPath}`, let mensaje;
const opts = {
method,
headers: { headers: {
Authorization : token Authorization: localStorage.getItem("token"),
"Content-Type": "application/json; charset=utf-8",
}, },
timeout: 2000, signal,
contentType: 'application/json; charset=utf-8', };
dataType: 'json',
processData: false, if (method === "GET") url += "?" + new URLSearchParams(params).toString();
data: JSON.stringify(xhr.jsonData), else if (method === "POST") opts.body = JSON.stringify(body);
error: function(xhr, textStatus, err) {
if (orgErrorHandler) {
try { try {
orgErrorHandler(xhr, textStatus, err); const res = await fetch(`/api/${url}`, opts);
clearTimeout(timeoutId);
return res;
} catch (e) { } catch (e) {
err = e; switch (e.name) {
} case "SyntaxError":
} mensaje = "Requested JSON parse failed";
if(xhr?.responseJSON?.error?.code == 'periodNotExceeded') return;
switch (textStatus){
case 'parsererror':
mensaje = 'Requested JSON parse failed';
break; break;
case 'timeout': case "TimeoutError":
mensaje = 'Time out error'; mensaje = "Time out error";
break; break;
case 'abort': case "AbortError":
mensaje = 'Ajax request aborted'; mensaje = "Ajax request aborted";
break; break;
case 'error': case "UserError":
if (xhr?.responseJSON?.error?.name == 'UserError') { mensaje = e.message;
mensaje = xhr.responseJSON.error.message;
break; break;
} case "error":
switch (xhr.status){ switch (e.code) {
case 0: case 0:
mensaje = 'Not connect: Verify Network'; mensaje = "Not connect: Verify Network";
break; break;
case 504: case 504:
mensaje = 'No se ha podido conectar con Salix, consulta con informática'; mensaje = "No se ha podido conectar con Salix, consulta con informática";
break; break;
case 555: case 555:
mensaje = JSON.parse(xhr.statusText).Message; mensaje = e.message;
break;
case e.code >= 400 && e.code < 500:
mensaje = e.name;
break; break;
default: default:
if (xhr.status >= 400 && xhr.status < 500) mensaje = "Ha ocurrido un error, consulta con informática";
mensaje = xhr.statusText;
else
mensaje = 'Ha ocurrido un error, consulta con informática';
} }
break; break;
default: default:
mensaje = 'Ha ocurrido un error, consulta con informática'; mensaje = "Ha ocurrido un error, consulta con informática";
} }
printError(mensaje); printError(mensaje);
} }
}); }
});
if (renewPeriod) getTokenConfig(); if (renewPeriod) getTokenConfig();