[FE] Add button to copy a certificate's code
This commit is contained in:
parent
31c3b7a7ff
commit
f3a182028e
@ -53,7 +53,7 @@ export function Registers(props: { person: Person | null, lastUpdate: number })
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<div class="grid grid-cols-2 gap-2 font-mono">
|
<div class="grid grid-cols-2 gap-1 font-mono">
|
||||||
<CopyButton
|
<CopyButton
|
||||||
copyText={`${props.person!.nombres} ${props.person!.apellidoPaterno} ${props.person!.apellidoMaterno}`}
|
copyText={`${props.person!.nombres} ${props.person!.apellidoPaterno} ${props.person!.apellidoMaterno}`}
|
||||||
>
|
>
|
||||||
@ -68,7 +68,7 @@ export function Registers(props: { person: Person | null, lastUpdate: number })
|
|||||||
</CopyButton>
|
</CopyButton>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="grid grid-cols-[2fr_2fr_1fr_1fr] gap-2 font-mono">
|
<div class="grid grid-cols-[2fr_2fr_1fr_1fr] gap-1 font-mono">
|
||||||
<CopyButton
|
<CopyButton
|
||||||
copyText={`${props.person!.nombres}`}
|
copyText={`${props.person!.nombres}`}
|
||||||
>
|
>
|
||||||
@ -202,11 +202,21 @@ function Register(props: { cert: RegisterReturn, onUpdate: () => void }) {
|
|||||||
setDownloading(false);
|
setDownloading(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const certCode = () => props.cert.codigo.toString().padStart(4, "0");
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<tr class="odd:bg-c-surface-variant">
|
<tr class="odd:bg-c-surface-variant">
|
||||||
<td class="py-2 px-4">{props.cert.curso_nombre}</td>
|
<td class="py-2 px-4">{props.cert.curso_nombre}</td>
|
||||||
<td class="py-2 px-4 font-mono">{props.cert.fecha_inscripcion.toString()}</td>
|
<td class="py-2 px-4 font-mono">{props.cert.fecha_inscripcion.toString()}</td>
|
||||||
<td class="py-2 px-4">{props.cert.codigo}</td>
|
<td class="py-1 px-2">
|
||||||
|
<CopyButton
|
||||||
|
copyText={certCode()}
|
||||||
|
>
|
||||||
|
<span class="py-1 px-2 font-mono">
|
||||||
|
{certCode()}
|
||||||
|
</span>
|
||||||
|
</CopyButton>
|
||||||
|
</td>
|
||||||
<td class="py-2 px-2">
|
<td class="py-2 px-2">
|
||||||
<Show when={props.cert.generatable}>
|
<Show when={props.cert.generatable}>
|
||||||
<button
|
<button
|
||||||
@ -243,7 +253,7 @@ function Register(props: { cert: RegisterReturn, onUpdate: () => void }) {
|
|||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
function CopyButton(props: {copyText: string, children: Array<JSX.Element>}) {
|
function CopyButton(props: {copyText: string, children: Array<JSX.Element> | JSX.Element}) {
|
||||||
const [successAnimation, setSuccessAnimation] = createSignal(false);
|
const [successAnimation, setSuccessAnimation] = createSignal(false);
|
||||||
|
|
||||||
const onclick = () => {
|
const onclick = () => {
|
||||||
|
Loading…
Reference in New Issue
Block a user