[FE][Certs] Generate Matpel 3 carnet (complete)

This commit is contained in:
Araozu 2023-10-30 15:28:36 -05:00
parent 172ec76908
commit 1089da5f0f
5 changed files with 64 additions and 22 deletions

View File

@ -11,6 +11,18 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inconsolata&family=Inter:wght@400;700;900&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inconsolata&family=Inter:wght@400;700;900&display=swap" rel="stylesheet">
<style type="text/css">
@font-face {
font-family: "Amirt";
font-weight: bold;
src: url(/fonts/Amiri-Bold.ttf) format("truetype");
}
@font-face {
font-family: "'Franklin Gothic Demi Cond'";
font-weight: bold;
src: url(/fonts/FRADMCN.ttf) format("truetype");
}
</style>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>

Binary file not shown.

Binary file not shown.

View File

@ -6,6 +6,7 @@ import { formatDate, numberToMonth } from "../../utils/functions";
import { Canvg } from "canvg"; import { Canvg } from "canvg";
import { Show } from "solid-js"; import { Show } from "solid-js";
import { Person } from "../../types/Person"; import { Person } from "../../types/Person";
import QR from "qrcode";
export function RegisterSidebar(props: { export function RegisterSidebar(props: {
register: Register, register: Register,
@ -34,30 +35,43 @@ export function RegisterSidebar(props: {
const p = props.person; const p = props.person;
const r = props.register; const r = props.register;
const [,month] = r.register_display_date.split("-"); const [expiryYear, month] = r.register_display_date.split("-");
const monthStr = numberToMonth(parseInt(month, 10)); const expiryMonth = numberToMonth(parseInt(month, 10));
if (monthStr === null) { if (expiryMonth === null) {
alert(`El cert. tiene un mes invalido (${month}), no se puede generar carnet`); alert(`El cert. tiene un mes invalido (${month}), no se puede generar carnet`);
return; return;
} }
const svgHtml = genCarnet( // QR code
`${p.person_names} ${p.person_paternal_surname} ${p.person_maternal_surname}`, QR.toDataURL(`https://eegsac.com/certificado/${p.person_dni}`, {margin: 1}, (err, base64) => {
p.person_dni.toString(), if (err) {
r.register_code.toString().padStart(4, "0"), alert("Error creando codigo QR para el carnet.");
monthStr, console.error("Error creating QR code");
); console.error(err);
const v = Canvg.fromString(ctx, svgHtml); return;
v.start(); }
v.ready().then(() => {
canvas.toBlob((blob) => { const fullname = `${p.person_names} ${p.person_paternal_surname} ${p.person_maternal_surname}`;
if (blob !== null) { const svgHtml = genCarnet({
saveAs(blob, "carnet.png"); fullname,
} else { dni: p.person_dni.toString(),
console.log("blob is null... :c"); code: r.register_code.toString().padStart(4, "0"),
} expiryMonth,
expiryYear,
qrBase64: base64,
});
const v = Canvg.fromString(ctx, svgHtml);
v.start();
v.ready().then(() => {
canvas.toBlob((blob) => {
if (blob !== null) {
saveAs(blob, `CARNET MATPEL - ${fullname}.png`);
} else {
console.log("blob is null... :c");
}
});
}); });
}); });
}; };

File diff suppressed because one or more lines are too long