blob: 02206164f0231feeefe0c1cef5954051bfbc9d0e (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
|
<script setup lang="ts">
import verifyPDF from 'pdf-signature-reader';
import type { SignatureInfo } from './pdf-signature-checker.types';
import { formatBytes } from '@/utils/convert';
const signatures = ref<SignatureInfo[]>([]);
const status = ref<'idle' | 'parsed' | 'error' | 'loading'>('idle');
const file = ref<File | null>(null);
async function onVerifyClicked(uploadedFile: File) {
file.value = uploadedFile;
const fileBuffer = await uploadedFile.arrayBuffer();
status.value = 'loading';
try {
const { signatures: parsedSignatures } = verifyPDF(fileBuffer);
signatures.value = parsedSignatures;
status.value = 'parsed';
}
catch (e) {
signatures.value = [];
status.value = 'error';
}
}
</script>
<template>
<div style="flex: 0 0 100%">
<div mx-auto max-w-600px>
<c-file-upload title="Drag and drop a PDF file here, or click to select a file" accept=".pdf" @file-upload="onVerifyClicked" />
<c-card v-if="file" mt-4 flex gap-2>
<div font-bold>
{{ file.name }}
</div>
<div>
{{ formatBytes(file.size) }}
</div>
</c-card>
<div v-if="status === 'error'">
<c-alert mt-4>
No signatures found in the provided file.
</c-alert>
</div>
</div>
</div>
<div v-if="status === 'parsed' && signatures.length" style="flex: 0 0 100%" mt-5 flex flex-col gap-4>
<div v-for="(signature, index) of signatures" :key="index">
<div mb-2 font-bold>
Signature {{ index + 1 }} certificates :
</div>
<pdf-signature-details :signature="signature" />
</div>
</div>
</template>
|
