[FE] Fixes #25: Load cert images lazily

master
Araozu 2023-12-14 15:30:30 -05:00
parent 840ed0187d
commit 1a236dc505
17 changed files with 1875 additions and 1855 deletions

View File

@ -10,49 +10,56 @@ import {
import { cmText, createSimpleText, getImage, getQR } from "./utils";
import { CertData } from "./CertData";
const {
export async function _4X4Cert(props: CertData<null>): Promise<Document> {
// All these resources compose the certificate.
// They load images from the server,
// and so are here, so they are loaded only when the certificate is generated,
// and not when the app is loaded.
const {
Document, Paragraph, PageOrientation,
FrameAnchorType,
TextRun,
AlignmentType,
BorderStyle,
} = window.docx;
} = window.docx;
const imgFondoDoc = getImage({
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -61,20 +68,20 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// MANEJO EN 4x4 ROAD DANGER
const tCourse = createSimpleText({
// MANEJO EN 4x4 ROAD DANGER
const tCourse = createSimpleText({
xPosition: 1.8,
yPosition: 8.4,
width: 20.92,
@ -82,10 +89,10 @@ const tCourse = createSimpleText({
text: "MANEJO EN 4x4 ROAD DANGER",
size: 44,
bold: true,
});
});
// (caminos peligrosos)
const tCourseDesc = createSimpleText({
// (caminos peligrosos)
const tCourseDesc = createSimpleText({
xPosition: 9.7,
yPosition: 9.6,
width: 5,
@ -93,10 +100,10 @@ const tCourseDesc = createSimpleText({
text: "(CAMINOS PELIGROSOS)",
size: 20,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleText({
// En temas de...
const tTopics = createSimpleText({
xPosition: 2.3,
yPosition: 10.4,
width: 20.92,
@ -105,10 +112,10 @@ const tTopics = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.LEFT,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleText({
// Se expide certificado...
const tFinishLabel = createSimpleText({
xPosition: 5.95,
yPosition: 11.65,
width: 12.38,
@ -117,11 +124,11 @@ const tFinishLabel = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -150,10 +157,8 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function _4X4Cert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -9,41 +9,43 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function cargadorFrontal(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -52,21 +54,21 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -95,10 +97,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function cargadorFrontal(props: CertData<null>): Promise<Document> {
const hasCustomLabel = (props.certCustomLabel?.length ?? 0) > 0;
const customLabelYOffset = 0.8;

View File

@ -9,41 +9,44 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function excavadoraHidraulica(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -52,21 +55,21 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// En temas de...
const tTopics = createSimpleText({
// En temas de...
const tTopics = createSimpleText({
xPosition: 2.3,
yPosition: 10.4,
width: 20.92,
@ -75,10 +78,10 @@ const tTopics = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.LEFT,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleText({
// Se expide certificado...
const tFinishLabel = createSimpleText({
xPosition: 5.95,
yPosition: 11.9,
width: 12.38,
@ -87,11 +90,11 @@ const tFinishLabel = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -120,10 +123,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function excavadoraHidraulica(props: CertData<null>): Promise<Document> {
// OPERADOR PROFESIONAL DE EXCAVADORA HIDRÁULICA
const tCourse = createSimpleText({
xPosition: 2.2,

View File

@ -10,35 +10,36 @@ const {
} = window.docx;
export async function extintores(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
const imgFondoDoc = getImage({
name: "fondo_certificado_manejo_defensivo.png",
height: 21.23,
width: 29.8,
horizontalOffset: 0,
verticalOffset: -0.05,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.52,
verticalOffset: 15.24,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_2_logo.png",
height: 0.94,
width: 5.14,
horizontalOffset: 1,
verticalOffset: 19.21,
});
});
// MTC: R.D.N° ...
const tMTCLabel = createSimpleText({
// MTC: R.D.N° ...
const tMTCLabel = createSimpleText({
xPosition: -1.51,
yPosition: 18,
width: 6,
@ -49,10 +50,10 @@ const tMTCLabel = createSimpleText({
alignment: AlignmentType.LEFT,
color: "FFFFFF",
bold: true,
});
});
// CERTIFICADO
const tCertificate = createSimpleTextP({
// CERTIFICADO
const tCertificate = createSimpleTextP({
xPosition: 0.17,
yPosition: 5.9,
width: 11.05,
@ -61,20 +62,20 @@ const tCertificate = createSimpleTextP({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: -1.08,
yPosition: 5.4,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// IPERC
const tCourse = createSimpleText({
// IPERC
const tCourse = createSimpleText({
xPosition: -0.44,
yPosition: 8,
width: 20.92,
@ -82,10 +83,10 @@ const tCourse = createSimpleText({
text: "USO Y MANEJO DE EXTINTORES",
size: 44,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleTextP({
// En temas de...
const tTopics = createSimpleTextP({
xPosition: 2,
yPosition: 11.5,
width: 20.92,
@ -94,10 +95,10 @@ const tTopics = createSimpleTextP({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
xPosition: 1.9,
yPosition: 12.6,
width: 20.92,
@ -106,10 +107,10 @@ const tFinishLabel = createSimpleTextP({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(23.35),
@ -138,9 +139,10 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function extintores(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -11,35 +11,37 @@ const {
const imgFondoDoc = getImage({
export async function ipercCert(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_manejo_defensivo.png",
height: 21.23,
width: 29.8,
horizontalOffset: 0,
verticalOffset: -0.05,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.52,
verticalOffset: 15.24,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.6,
width: 2.25,
horizontalOffset: 0.34,
verticalOffset: 17.99,
});
});
// CERTIFICADO
const tCertificate = createSimpleTextP({
// CERTIFICADO
const tCertificate = createSimpleTextP({
xPosition: 0.17,
yPosition: 5.9,
width: 11.05,
@ -48,20 +50,20 @@ const tCertificate = createSimpleTextP({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: -1.08,
yPosition: 5.4,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// IPERC
const tCourse = createSimpleText({
// IPERC
const tCourse = createSimpleText({
xPosition: -0.44,
yPosition: 8,
width: 20.92,
@ -69,10 +71,10 @@ const tCourse = createSimpleText({
text: "IDENTIFICACIÓN DE PELIGROS, EVALUACIÓN DE RIESGOS Y CONTROLES (IPERC)",
size: 44,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleTextP({
// En temas de...
const tTopics = createSimpleTextP({
xPosition: 2,
yPosition: 12.7,
width: 20.92,
@ -81,10 +83,10 @@ const tTopics = createSimpleTextP({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
xPosition: 1.9,
yPosition: 13.8,
width: 20.92,
@ -93,10 +95,10 @@ const tFinishLabel = createSimpleTextP({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(23.35),
@ -125,9 +127,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function ipercCert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -11,28 +11,30 @@ const {
const imgFondoDoc = getImage({
export async function luchaContraIncendiosCert(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_manejo_defensivo.png",
height: 21.23,
width: 29.8,
horizontalOffset: 0,
verticalOffset: -0.05,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.52,
verticalOffset: 15.24,
});
});
// CERTIFICADO
const tCertificate = createSimpleTextP({
// CERTIFICADO
const tCertificate = createSimpleTextP({
xPosition: 0.17,
yPosition: 5.9,
width: 11.05,
@ -41,20 +43,20 @@ const tCertificate = createSimpleTextP({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: -1.08,
yPosition: 5.4,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// IPERC
const tCourse = createSimpleText({
// IPERC
const tCourse = createSimpleText({
xPosition: -0.44,
yPosition: 8,
width: 20.92,
@ -62,10 +64,10 @@ const tCourse = createSimpleText({
text: "LUCHA CONTRA INCENDIOS",
size: 44,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleTextP({
// En temas de...
const tTopics = createSimpleTextP({
xPosition: 2,
yPosition: 11.5,
width: 20.92,
@ -74,10 +76,10 @@ const tTopics = createSimpleTextP({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
xPosition: 1.9,
yPosition: 12.6,
width: 20.92,
@ -86,10 +88,10 @@ const tFinishLabel = createSimpleTextP({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(23.35),
@ -118,9 +120,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function luchaContraIncendiosCert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -9,41 +9,44 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function manejoDefensivoCert(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_manejo_defensivo.png",
height: 21.23,
width: 29.8,
horizontalOffset: 0,
verticalOffset: -0.05,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.52,
verticalOffset: 15.24,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_2_logo.png",
height: 0.94,
width: 5.14,
horizontalOffset: 3.11,
verticalOffset: 19.21,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.6,
width: 2.25,
horizontalOffset: 0.34,
verticalOffset: 17.99,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 2.42,
yPosition: 4.2,
width: 11.05,
@ -52,20 +55,20 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: -1.08,
yPosition: 5.4,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// MANEJO DEFENSIVO
const tCourse = createSimpleText({
// MANEJO DEFENSIVO
const tCourse = createSimpleText({
xPosition: -0.44,
yPosition: 8,
width: 20.92,
@ -73,10 +76,10 @@ const tCourse = createSimpleText({
text: "MANEJO DEFENSIVO",
size: 44,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleText({
// En temas de...
const tTopics = createSimpleText({
xPosition: -0.44,
yPosition: 9.4,
width: 20.92,
@ -85,10 +88,10 @@ const tTopics = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleText({
// Se expide certificado...
const tFinishLabel = createSimpleText({
xPosition: -0.44,
yPosition: 10.5,
width: 20.92,
@ -97,10 +100,10 @@ const tFinishLabel = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// MTC: R.D.N° ...
const tMTCLabel = createSimpleText({
// MTC: R.D.N° ...
const tMTCLabel = createSimpleText({
xPosition: 0.6,
yPosition: 18,
width: 6,
@ -111,11 +114,11 @@ const tMTCLabel = createSimpleText({
alignment: AlignmentType.LEFT,
color: "FFFFFF",
bold: true,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(23.35),
@ -144,10 +147,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function manejoDefensivoCert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -1,113 +1,12 @@
import { Matpel, cmText, getImage, getMatpelHours, getMatpelLabel, getQR } from "./utils";
import { CertData } from "./CertData";
/*
import {
Document, Packer, Paragraph, PageOrientation,
FrameAnchorType,
TextRun,
AlignmentType,
} from "docx";
// */
//*
const {
Document, Paragraph, PageOrientation,
FrameAnchorType,
TextRun,
AlignmentType,
} = window.docx;
// */
const imgFondoDoc = getImage({
name: "fondo_certificado.png",
height: 20.97,
width: 29.8,
horizontalOffset: 0,
verticalOffset: 0,
behindDocument: true,
});
const imgMatpel = getImage({
name: "matpel-logo.png",
height: 2.81,
width: 2.81,
horizontalOffset: 0.7,
verticalOffset: 0.7,
});
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 0.91,
verticalOffset: 3.64,
});
const imgCEE = getImage({
name: "cee_logo.png",
height: 2.22,
width: 3.11,
horizontalOffset: 0.29,
verticalOffset: 18,
});
const imgMTC = getImage({
name: "mtc_logo.png",
height: 1.3,
width: 4.08,
horizontalOffset: 5.13,
verticalOffset: 19.33,
});
const imgEEG = getImage({
name: "eeg_f_logo.png",
height: 4.39,
width: 6.4,
horizontalOffset: 23.35,
verticalOffset: 0,
});
const imgOSHA = getImage({
name: "osha_logo.png",
height: 1.55,
width: 4.46,
horizontalOffset: 24.34,
verticalOffset: 4.95,
});
const imgAguila = getImage({
name: "aguila_logo.png",
height: 2.62,
width: 2.68,
horizontalOffset: 25.45,
verticalOffset: 6.57,
});
const imgMichigan = getImage({
name: "michigan_logo.png",
height: 2.47,
width: 2.6,
horizontalOffset: 25.59,
verticalOffset: 9.54,
});
const imgCEEM = getImage({
name: "ceem_logo.jpg",
height: 1,
width: 3.99,
horizontalOffset: 24.97,
verticalOffset: 12.5,
});
const imgEATE = getImage({
name: "eate_logo.jpg",
height: 2.21,
width: 3.28,
horizontalOffset: 25.54,
verticalOffset: 14.09,
});
@ -118,6 +17,98 @@ const imgEATE = getImage({
* @returns A buffer of the DOCX document
*/
export async function matpelCert(props: CertData<Matpel>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado.png",
height: 20.97,
width: 29.8,
horizontalOffset: 0,
verticalOffset: 0,
behindDocument: true,
});
const imgMatpel = getImage({
name: "matpel-logo.png",
height: 2.81,
width: 2.81,
horizontalOffset: 0.7,
verticalOffset: 0.7,
});
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 0.91,
verticalOffset: 3.64,
});
const imgCEE = getImage({
name: "cee_logo.png",
height: 2.22,
width: 3.11,
horizontalOffset: 0.29,
verticalOffset: 18,
});
const imgMTC = getImage({
name: "mtc_logo.png",
height: 1.3,
width: 4.08,
horizontalOffset: 5.13,
verticalOffset: 19.33,
});
const imgEEG = getImage({
name: "eeg_f_logo.png",
height: 4.39,
width: 6.4,
horizontalOffset: 23.35,
verticalOffset: 0,
});
const imgOSHA = getImage({
name: "osha_logo.png",
height: 1.55,
width: 4.46,
horizontalOffset: 24.34,
verticalOffset: 4.95,
});
const imgAguila = getImage({
name: "aguila_logo.png",
height: 2.62,
width: 2.68,
horizontalOffset: 25.45,
verticalOffset: 6.57,
});
const imgMichigan = getImage({
name: "michigan_logo.png",
height: 2.47,
width: 2.6,
horizontalOffset: 25.59,
verticalOffset: 9.54,
});
const imgCEEM = getImage({
name: "ceem_logo.jpg",
height: 1,
width: 3.99,
horizontalOffset: 24.97,
verticalOffset: 12.5,
});
const imgEATE = getImage({
name: "eate_logo.jpg",
height: 2.21,
width: 3.28,
horizontalOffset: 25.54,
verticalOffset: 14.09,
});
const certificateName = new Paragraph({
frame: {
position: {

View File

@ -9,32 +9,34 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function mecanicaBasicaCert(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_mecanica_basica.jpg",
height: 21.23,
width: 29.8,
horizontalOffset: 0,
verticalOffset: 0,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 0.22,
verticalOffset: 16.45,
});
});
const imgMichigan = getImage({
const imgMichigan = getImage({
name: "michigan_logo.png",
height: 1.96,
width: 2.22,
horizontalOffset: 0.31,
verticalOffset: 18.86,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.75,
yPosition: 1.64,
width: 9,
@ -42,20 +44,20 @@ const tCertificate = createSimpleText({
text: "CERTIFICADO",
size: 60,
bold: true,
});
});
// Se expide el presente certificado a:
const tExpediteText = createSimpleText({
// Se expide el presente certificado a:
const tExpediteText = createSimpleText({
xPosition: 0.76,
yPosition: 3.45,
width: 7.88,
height: 1,
text: "Se expide el presente certificado a:",
size: 22,
});
});
// MECANICA BASICA
const tCourse = createSimpleText({
// MECANICA BASICA
const tCourse = createSimpleText({
xPosition: 1.7,
yPosition: 7,
width: 20.08,
@ -63,10 +65,10 @@ const tCourse = createSimpleText({
text: "MECÁNICA BÁSICA",
size: 72,
bold: true,
});
});
// En los temas de...
const tTopics = createSimpleText({
// En los temas de...
const tTopics = createSimpleText({
xPosition: 1.7,
yPosition: 8.9,
width: 19.31,
@ -74,10 +76,10 @@ const tTopics = createSimpleText({
text: "En los temas de: Lineamientos del Ministerio de Transportes y Comunicaciones (MTC), Operatividad efectiva del equipo. Procedimiento de operación correcta. Equipamiento y mantenimiento preventivo, Medidas de Control y Tipos de IPERC, Cuidados de la maquina durante la operación, Uso de pedales y controles, Funcionamiento del motor;",
size: 22,
alignment: AlignmentType.JUSTIFIED,
});
});
// Con una duracion de...
const tDuration = createSimpleText({
// Con una duracion de...
const tDuration = createSimpleText({
xPosition: 1.7,
yPosition: 11,
width: 19.31,
@ -85,10 +87,10 @@ const tDuration = createSimpleText({
text: "Con una duración de 12 horas lectivas.",
size: 22,
alignment: AlignmentType.JUSTIFIED,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleText({
// Se expide certificado...
const tFinishLabel = createSimpleText({
xPosition: 1.52,
yPosition: 11.65,
width: 20.1,
@ -97,10 +99,10 @@ const tFinishLabel = createSimpleText({
size: 22,
alignment: AlignmentType.CENTER,
italics: true,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.5),
@ -129,9 +131,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function mecanicaBasicaCert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -9,41 +9,44 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function minicargador(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -52,22 +55,22 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -96,10 +99,10 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function minicargador(props: CertData<null>): Promise<Document> {
const hasCustomLabel = (props.certCustomLabel?.length ?? 0) > 0;
const customLabelYOffset = 0.8;

View File

@ -9,33 +9,36 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function primerosAuxiliosCert(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_manejo_defensivo.png",
height: 21.23,
width: 29.8,
horizontalOffset: 0,
verticalOffset: -0.05,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.52,
verticalOffset: 15.24,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_2_logo.png",
height: 0.94,
width: 5.14,
horizontalOffset: 1,
verticalOffset: 19.21,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 2.42,
yPosition: 4.2,
width: 11.05,
@ -44,20 +47,20 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: -1.08,
yPosition: 5.4,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// PRIMEROS AUXILIOS
const tCourse = createSimpleText({
// PRIMEROS AUXILIOS
const tCourse = createSimpleText({
xPosition: -0.44,
yPosition: 8,
width: 20.92,
@ -65,10 +68,10 @@ const tCourse = createSimpleText({
text: "PRIMEROS AUXILIOS",
size: 44,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleText({
// En temas de...
const tTopics = createSimpleText({
xPosition: -0.44,
yPosition: 9.4,
width: 20.92,
@ -77,10 +80,10 @@ const tTopics = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.LEFT,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleText({
// Se expide certificado...
const tFinishLabel = createSimpleText({
xPosition: -0.44,
yPosition: 11.3,
width: 20.92,
@ -89,10 +92,10 @@ const tFinishLabel = createSimpleText({
size: 22,
font: "Times New Roman",
alignment: AlignmentType.CENTER,
});
});
// MTC: R.D.N° ...
const tMTCLabel = createSimpleText({
// MTC: R.D.N° ...
const tMTCLabel = createSimpleText({
xPosition: -1.51,
yPosition: 18,
width: 6,
@ -103,11 +106,11 @@ const tMTCLabel = createSimpleText({
alignment: AlignmentType.LEFT,
color: "FFFFFF",
bold: true,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(23.35),
@ -136,10 +139,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function primerosAuxiliosCert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -9,41 +9,44 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function retroexcavadora(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -52,22 +55,22 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -96,10 +99,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function retroexcavadora(props: CertData<null>): Promise<Document> {
const hasCustomLabel = (props.certCustomLabel?.length ?? 0) > 0;
const customLabelYOffset = 0.8;

View File

@ -9,51 +9,54 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function segOpMaqPesCert(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_seg_op_maq_pes.png",
height: 21.02,
width: 29.63,
horizontalOffset: 0.03,
verticalOffset: 0.04,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.02,
width: 2.02,
horizontalOffset: 25.53,
verticalOffset: 14.17,
});
});
const imgMundomaq = getImage({
const imgMundomaq = getImage({
name: "mundo_maq.png",
height: 4.82,
width: 6.73,
horizontalOffset: 20.87,
verticalOffset: 0.9,
});
});
const imgHazescorp = getImage({
const imgHazescorp = getImage({
name: "logo_hazescorp.png",
height: 2.95,
width: 3.33,
horizontalOffset: 0.4,
verticalOffset: 17.73,
});
});
const imgEEG = getImage({
const imgEEG = getImage({
name: "eeg_logo.png",
height: 2.38,
width: 4.94,
horizontalOffset: 1.66,
verticalOffset: 1.6,
});
});
// SEGURIDAD EN LA OPERACIÓN DE MAQUINARIA PESADA
const tCourse = createSimpleText({
// SEGURIDAD EN LA OPERACIÓN DE MAQUINARIA PESADA
const tCourse = createSimpleText({
xPosition: 5.5,
yPosition: 6.65,
width: 12.83,
@ -61,10 +64,10 @@ const tCourse = createSimpleText({
text: "SEGURIDAD EN LA OPERACIÓN DE MAQUINARIA PESADA",
size: 44,
bold: true,
});
});
// En temas de...
const tTopics = createSimpleText({
// En temas de...
const tTopics = createSimpleText({
xPosition: 1.65,
yPosition: 8.9,
width: 20.42,
@ -73,10 +76,10 @@ const tTopics = createSimpleText({
size: 22,
font: "Arial",
alignment: AlignmentType.JUSTIFIED,
});
});
// Con una duracion...
const tHours = createSimpleText({
// Con una duracion...
const tHours = createSimpleText({
xPosition: 1.65,
yPosition: 10.7,
width: 13.15,
@ -85,10 +88,10 @@ const tHours = createSimpleText({
size: 22,
font: "Arial",
alignment: AlignmentType.LEFT,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleText({
// Se expide certificado...
const tFinishLabel = createSimpleText({
xPosition: 5.3,
yPosition: 11.5,
width: 13.15,
@ -98,11 +101,11 @@ const tFinishLabel = createSimpleText({
font: "Arial",
italics: true,
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(22.62),
@ -131,10 +134,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function segOpMaqPesCert(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -9,58 +9,61 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function supervisorEscolta(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_super_escolta.png",
height: 20.99,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0,
behindDocument: true,
});
});
const imgEEG = getImage({
const imgEEG = getImage({
name: "eeg_f_logo.png",
height: 4.39,
width: 6.4,
horizontalOffset: 1.19,
verticalOffset: 0.94,
});
});
const imgEATE = getImage({
const imgEATE = getImage({
name: "eate_logo.jpg",
height: 2.28,
width: 3.39,
horizontalOffset: 0.94,
verticalOffset: 15.67,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_logo.png",
height: 1.6,
width: 5,
horizontalOffset: 0.9,
verticalOffset: 18.3,
});
});
const imgOSHA = getImage({
const imgOSHA = getImage({
name: "osha_logo.png",
height: 1.99,
width: 5.72,
horizontalOffset: 22.58,
verticalOffset: 1.29,
});
});
const imgMatpelTransparent = getImage({
const imgMatpelTransparent = getImage({
name: "logo_matpel_transparente.png",
height: 18.63,
width: 18.63,
horizontalOffset: 5.38,
verticalOffset: 1.38,
});
});
const tCertificate = createSimpleTextP({
const tCertificate = createSimpleTextP({
xPosition: 9.18,
yPosition: 2.91,
width: 11.3,
@ -69,10 +72,10 @@ const tCertificate = createSimpleTextP({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Se expide el presente
const tLabel3 = createSimpleTextP({
// Se expide el presente
const tLabel3 = createSimpleTextP({
xPosition: 11.08,
yPosition: 5.43,
width: 7.74,
@ -80,10 +83,10 @@ const tLabel3 = createSimpleTextP({
text: "Se expide el presente a:",
size: 22,
font: "Arial",
});
});
// SUPERVISOR ESCOLTA MATPEL
const tCourse = createSimpleTextP({
// SUPERVISOR ESCOLTA MATPEL
const tCourse = createSimpleTextP({
xPosition: 7.28,
yPosition: 8.75,
width: 15.42,
@ -91,10 +94,10 @@ const tCourse = createSimpleTextP({
text: "SUPERVISOR ESCOLTA MATPEL",
size: 52,
bold: true,
});
});
// Por haber aprobado la dormacion...
const tLabel2 = createSimpleTextP({
// Por haber aprobado la dormacion...
const tLabel2 = createSimpleTextP({
xPosition: 10.93,
yPosition: 7.95,
width: 7.74,
@ -102,10 +105,10 @@ const tLabel2 = createSimpleTextP({
text: "Por haber aprobado la formación en el curso",
size: 22,
font: "Arial",
});
});
// Temas tratados...
const tTopics = createSimpleTextP({
// Temas tratados...
const tTopics = createSimpleTextP({
xPosition: 5.04,
yPosition: 10.3,
width: 19.34,
@ -114,10 +117,10 @@ const tTopics = createSimpleTextP({
size: 22,
font: "Arial",
alignment: AlignmentType.JUSTIFIED,
});
});
// Respaldado por:
const tHours = createSimpleTextP({
// Respaldado por:
const tHours = createSimpleTextP({
xPosition: 1.15,
yPosition: 15,
width: 3.07,
@ -127,10 +130,10 @@ const tHours = createSimpleTextP({
font: "Arial",
italics: true,
alignment: AlignmentType.LEFT,
});
});
// Chile
const tChile = createSimpleTextP({
// Chile
const tChile = createSimpleTextP({
xPosition: 3.07,
yPosition: 17.83,
width: 1.43,
@ -140,10 +143,10 @@ const tChile = createSimpleTextP({
font: "Times New Roman",
bold: true,
alignment: AlignmentType.LEFT,
});
});
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
// Se expide certificado...
const tFinishLabel = createSimpleTextP({
xPosition: 8.22,
yPosition: 12.68,
width: 13.15,
@ -153,11 +156,11 @@ const tFinishLabel = createSimpleTextP({
font: "Arial",
italics: true,
alignment: AlignmentType.CENTER,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(25),
@ -190,10 +193,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function supervisorEscolta(props: CertData<null>): Promise<Document> {
const imgQR = await getQR({
iid: props.certIId,
dni: props.personDni,

View File

@ -9,41 +9,44 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function tractorOruga(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -52,22 +55,22 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -96,10 +99,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function tractorOruga(props: CertData<null>): Promise<Document> {
const hasCustomLabel = (props.certCustomLabel?.length ?? 0) > 0;
const customLabelYOffset = 0.8;

View File

@ -9,41 +9,44 @@ const {
BorderStyle,
} = window.docx;
const imgFondoDoc = getImage({
export async function volquete(props: CertData<null>): Promise<Document> {
const imgFondoDoc = getImage({
name: "fondo_certificado_4x4.png",
height: 21.03,
width: 29.69,
horizontalOffset: 0,
verticalOffset: 0.01,
behindDocument: true,
});
});
const imgCIP = getImage({
const imgCIP = getImage({
name: "colegio_ingenieros_logo.png",
height: 2.15,
width: 2.15,
horizontalOffset: 26.76,
verticalOffset: 12.26,
});
});
const imgCEE = getImage({
const imgCEE = getImage({
name: "cee_dark_logo.png",
height: 1.5,
width: 2.1,
horizontalOffset: 26.89,
verticalOffset: 17.06,
});
});
const imgMTC = getImage({
const imgMTC = getImage({
name: "mtc_transparente.png",
height: 1.65,
width: 5.16,
horizontalOffset: 23.92,
verticalOffset: 18.83,
});
});
const tCertificate = createSimpleText({
const tCertificate = createSimpleText({
xPosition: 7.7,
yPosition: 3.7,
width: 11.05,
@ -52,22 +55,22 @@ const tCertificate = createSimpleText({
size: 72,
font: "Times New Roman",
bold: true,
});
});
// Otorgado a
const tExpediteText = createSimpleText({
// Otorgado a
const tExpediteText = createSimpleText({
xPosition: 4.2,
yPosition: 5.5,
width: 3,
height: 0.7,
text: "Otorgado a:",
size: 22,
});
});
// Recuadro de foto
const photoSection = new Paragraph({
// Recuadro de foto
const photoSection = new Paragraph({
frame: {
position: {
x: cmText(-1.68),
@ -96,10 +99,9 @@ const photoSection = new Paragraph({
},
},
alignment: AlignmentType.LEFT,
});
});
export async function volquete(props: CertData<null>): Promise<Document> {
const hasCustomLabel = (props.certCustomLabel?.length ?? 0) > 0;
const customLabelYOffset = 0.8;

View File

@ -14,10 +14,6 @@ function isoDateToLocalDate(date: string): string {
return `${day}/${month}`;
}
function wait(ms: number) {
return new Promise((resolve) => setTimeout(resolve, ms));
}
// TODO: Refactor
export function RegisterPreview(props: {selections: Array<RegistrationPreview>, personId: number | null, onDelete: (v: number) => void, onRegister: () => void}) {
const [error, setError] = createSignal("");