RECURSOS:
Sistema trabaja con Apps Script, los códigos a continuación:
ARCHIVO JSON:
{/*Se agrega llamado a librería email para que el usuario pueda recibir correo, Pierre*/
«timeZone»: «America/Caracas»,
«exceptionLogging»: «STACKDRIVER»,
«runtimeVersion»: «V8»,
«webapp»: {
«executeAs»: «USER_DEPLOYING»,
«access»: «ANYONE_ANONYMOUS»
},
«oauthScopes»: [
«https://www.googleapis.com/auth/spreadsheets.currentonly»,
«https://www.googleapis.com/auth/userinfo.email»,
«https://www.googleapis.com/auth/script.send_mail»
]
}
ARCHIVO GS. (SCRIPT)
// Adaptado por Pierre García Barre para UAV
function doGet(e){
var tpl = HtmlService.createTemplateFromFile(«page.html»);
tpl.data = e.parameters;
tpl.data.id = SpreadsheetApp.getActiveSpreadsheet().getId();
return tpl.evaluate();
}
function checkin(userid, control, llave, materia){
if(userid && control){
var now = Date();
SpreadsheetApp.getActiveSpreadsheet().getSheetByName(«Registro»).appendRow([userid,control,now,llave, materia]);
MailApp.sendEmail(userid,
«Acceso QR Universidad Audiovisual de Venezuela»,
`${now} – Has registrado una: ${control}`);
return now.toLocaleString();
}
}
ARCHIVO HTML:
<!doctype html>
<html lang=»en»>
<head>
<!– Required meta tags –>
<!– Reprogramado por Pierre García Barre para UAV –>
<meta charset=»utf-8″>
<meta name=»viewport» content=»width=device-width, initial-scale=1″>
<!– Bootstrap CSS –>
<link href=»https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css» rel=»stylesheet» integrity=»sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3″ crossorigin=»anonymous»>
<link rel=»stylesheet» href=»https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css»>
<title>Control de acceso QR</title>
</head>
<body>
<div align=»center»>
<img src=»https://uav.edu.ve/wp-content/uploads/2022/04/Logo-nuevo-UAV-color-PNG.png» width=»700″ height=»234″><br>
</div>
<div id=»loader» class=»spinner-grow» role=»status» style=»display: none»>
</div>
<div id=»success» class=»alert alert-success» role=»alert» style=»display: none; font-size: 3em;»>
</div>
<div id=»error» class=»alert alert-danger» role=»alert» style=»display: none; font-size: 3em;»>
</div>
<script>
const STORAGE_KEY = ‘userid_’ + <?=data[«id»]?>;
window.onload = function () {
var action = «<?=data[«action»]?>»;
var control = «<?=data[«control»]?>»;
var userid = «<?=data[«userid»]?>»;
var llave = «<?=data[«llave»]?>»;
var materia = «<?=data[«materia»]?>»;
switch(action){
case «register»:
if(userid){
localStorage.setItem(STORAGE_KEY,userid, materia);
$(‘#success’).html(`<i class=»bi bi-person-check-fill»></i> Te has registrado como <b>${userid}<br>De la materia: ${materia}</b>`);
$(‘#success’).show();
}else{
localStorage.removeItem(STORAGE_KEY);
}
break;
case «checkin»:
var regUserid = localStorage.getItem(STORAGE_KEY);
if(!regUserid){
$(‘#error’).html(`<i class=»bi bi-exclamation-circle-fill»></i> Debes registrarte para registrar.`);
$(‘#error’).show();
}else{
$(‘#loader’).show();
google.script.run
.withSuccessHandler(function(ret){
$(‘#success’).html(`<i class=»bi bi-alarm»></i> ${ret}<br/><b>${control}</b>: ${regUserid} | ${materia}`);
$(‘#loader’).hide();
$(‘#success’).show();
})
.withFailureHandler(function(err){
$(‘#error’).html(`<i class=»bi bi-exclamation-circle-fill»></i> Se ha producido un error: ${err}`);
$(‘#loader’).hide();
$(‘#error’).show();
})
.checkin(regUserid,control,llave,materia);
}
break;
default:
var regUserid = localStorage.getItem(STORAGE_KEY);
if(!regUserid){
$(‘#error’).html(`<i class=»bi bi-exclamation-circle-fill»></i> Debes registrarte para registrar.`);
$(‘#error’).show();
}else{
$(‘#success’).html(`<i class=»bi bi-person-badge»></i> Estas registrad@ como <b>${regUserid}</b>`);
$(‘#success’).show();
}
break;
}
}
</script>
<script src=»https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js» integrity=»sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p» crossorigin=»anonymous»></script>
<script src=»https://code.jquery.com/jquery-3.6.0.min.js» integrity=»sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=» crossorigin=»anonymous»></script>
<br><br><br>
<div align=»center»><h1><b>Para cerrar X arriba a la izquierda</b></h1>
<br>
<div align=»center»><b><h1>Se le envía al email el recibo</h1></b>
</div>
</body>
</html>
Los demás recursos están en el mismo archivo, si necesitas una copia escribe a: pierre.garcia@uav.edu.ve