feat #6235 Added device label

css/style.css

@@ -26,6 +26,15 @@ h1 {
 span {
     color: #ED4947;
 }
+.device {
+    position: fixed;
+    bottom: 20px;
+    left: 20px;
+    float: left;
+    font-size: 1em;
+    font-weight: 400;
+    color: white;
+}
 .total {
     float: right;
     font-weight: bold;

index.html

@@ -82,6 +82,9 @@ and open the template in the editor.
         <h1>
             developed with <span>&hearts;</span> by Verdnatura
         </h1>
+        <span class="device">
+            <p id="deviceLabel"></p>
+        </h2>
         
         <div class="confirm">
             <div class="contConfirm">

js/index.js

@@ -7,12 +7,14 @@ $(document).ready(function () {
 
 function setEvents() {
     const heartEl = document.querySelector('body > h1 > span');
-    
+    refreshDeviceLabel()
+
     heartEl.addEventListener('click', function() {
         Swal.fire({
             title: 'Iniciar sesión',
             html:
-                `<input id="user" class="swal2-input" type="text" placeholder="Usuario" value="${localStorage.getItem('user') ?? ''}">
+                `<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="pass" class="swal2-input" type="password" placeholder="Contraseña">`,
             confirmButtonText: 'Login',
             showCloseButton: true,
@@ -21,7 +23,8 @@ function setEvents() {
             if(result.isConfirmed) {
                 const user = $('#user').val();
                 const pass = $('#pass').val();
-                signIn(user,pass);
+                const device = $('#device').val();
+                signIn(user, pass, device);
             }
         });
     }); 
@@ -36,8 +39,11 @@ function setEvents() {
         $("#txtPin").text("ID USUARIO");
     });
 
-    $(".btnOk").on("click", login);
-
+    $(".btnOk").on("click", function () {
+        if (pin) {
+            login();
+        };
+    });
 }
 
 function login() {
@@ -56,7 +62,7 @@ function login() {
     });
 }
 
-function signIn(user, password) {
+function signIn(user, password, device) {
     $.post({
         urlPath: 'vnUsers/sign-in',
         jsonData: {user, password},
@@ -65,9 +71,14 @@ function signIn(user, password) {
             localStorage.setItem("token", data.token);
             localStorage.setItem("ttl", data.ttl);
             localStorage.setItem("user", user);
-            localStorage.setItem("password", password);
+            localStorage.setItem("device", device);
             localStorage.setItem("created", Date.now());
             getTokenConfig();
+            refreshDeviceLabel();
         },
     })
+}
+
+function refreshDeviceLabel() {
+    $("#deviceLabel").text(localStorage.getItem('device') ?? '')
 }

js/main.js

@@ -66,11 +66,11 @@ $.ajaxPrefilter(function(xhr) {
     const token = localStorage.getItem('token')
 
     Object.assign(xhr, {
-        url: `api/${xhr.urlPath}`,
+        url: `/api/${xhr.urlPath}`,
         headers: {
             Authorization : token
         },
-        timeout: 2000,
+        timeout: 1000,
         contentType: 'application/json; charset=utf-8',
         dataType: 'json',
         processData: false,