espace-paie-odentas/templates-mails/otp-signature.html
odentas b790faf12c feat: Implémentation complète du système Odentas Sign
- Remplacement de DocuSeal par solution souveraine Odentas Sign
- Système d'authentification OTP pour signataires (bcryptjs + JWT)
- 8 routes API: send-otp, verify-otp, sign, pdf-url, positions, status, webhook, signers
- Interface moderne avec canvas de signature et animations (framer-motion, confetti)
- Système de templates pour auto-détection des positions de signature (CDDU, RG, avenants)
- PDF viewer avec @react-pdf-viewer (compatible Next.js)
- Stockage S3: source/, signatures/, evidence/, signed/, certs/
- Tables Supabase: sign_requests, signers, sign_positions, sign_events, sign_assets
- Evidence bundle automatique (JSON metadata + timestamps)
- Templates emails: OTP et completion
- Scripts Lambda prêts: pades-sign (KMS seal) et tsaStamp (RFC3161)
- Mode test détecté automatiquement (emails whitelist)
- Tests complets avec PDF CDDU réel (2 signataires)
2025-10-27 19:03:07 +01:00

118 lines
5.5 KiB
HTML

<!doctype html>
<html>
<body style="margin:0;padding:0;background:#f7f9fc;">
<!-- Preheader (masqué) -->
<div style="display:none;font-size:1px;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;">
Code de vérification pour signer votre document électroniquement avec Odentas Sign.
</div>
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="background:#f7f9fc;">
<tr>
<td align="center" style="padding:24px;">
<table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="max-width:600px;background:#ffffff;border-radius:8px;">
<!-- Logo -->
<tr>
<td style="padding:24px;text-align:center;">
<img src="https://newstaging.odentas.fr/wp-content/uploads/2025/08/Odentas-Logo-Bleu-Fond-Transparent-4-1.png" width="200" alt="Odentas" style="display:block;border:0;outline:none;text-decoration:none;margin:0 auto;height:auto;">
</td>
</tr>
<!-- Titre -->
<tr>
<td style="padding:0 24px 8px 24px;text-align:center;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:22px;font-weight:bold;color:#333;">
🔐 Code de vérification
</div>
</td>
</tr>
<!-- Sous-titre -->
<tr>
<td style="padding:8px 24px 0 24px;text-align:center;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:14px;color:#666;">
Signature électronique Odentas Sign
</div>
</td>
</tr>
<!-- Message -->
<tr>
<td style="padding:16px 24px 0 24px;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:16px;line-height:1.5;color:#333;">
Bonjour <strong>{{name}}</strong>,<br><br>
Vous avez demandé à signer électroniquement le document suivant :<br>
<strong>{{documentTitle}}</strong> <span style="color:#666;">({{documentRef}})</span>
</div>
</td>
</tr>
<!-- Code OTP (grand format) -->
<tr>
<td align="center" style="padding:24px;">
<div style="background:linear-gradient(135deg, #667eea 0%, #764ba2 100%);border-radius:12px;padding:24px;">
<div style="font-family:'Courier New', monospace;font-size:42px;font-weight:bold;color:#ffffff;letter-spacing:8px;text-align:center;">
{{otpCode}}
</div>
<div style="font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#ffffff;opacity:0.9;text-align:center;margin-top:8px;">
Code de vérification
</div>
</div>
</td>
</tr>
<!-- Instructions -->
<tr>
<td style="padding:0 24px 16px 24px;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:14px;line-height:1.5;color:#555;">
📌 <strong>Instructions :</strong><br>
1. Saisissez ce code sur la page de signature<br>
2. Dessinez ou uploadez votre signature<br>
3. Acceptez les conditions de signature électronique<br>
4. Validez pour signer le document
</div>
</td>
</tr>
<!-- Sécurité -->
<tr>
<td style="padding:0 24px 16px 24px;">
<div style="background:#fff3cd;border-left:4px solid #ffc107;padding:12px;border-radius:4px;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:13px;color:#856404;">
⚠️ <strong>Sécurité :</strong><br>
• Ce code expire dans <strong>{{expirationMinutes}} minutes</strong><br>
• Maximum 3 tentatives de saisie<br>
• Ne partagez jamais ce code
</div>
</div>
</td>
</tr>
<!-- Infos légales -->
<tr>
<td style="padding:0 24px 24px 24px;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#666;line-height:1.4;">
<strong>📋 Conformité eIDAS</strong><br>
Votre signature électronique aura la même valeur juridique qu'une signature manuscrite.
Le document signé sera scellé numériquement (PAdES), horodaté (RFC3161) et archivé pendant 10 ans
avec un système de conformité immutable.
</div>
</td>
</tr>
<!-- Footer -->
<tr>
<td style="padding:16px 24px;border-top:1px solid #e5e7eb;background:#f9fafb;border-radius:0 0 8px 8px;">
<div style="font-family:Arial, Helvetica, sans-serif;font-size:12px;color:#666;text-align:center;line-height:1.4;">
Vous recevez cet email car une signature électronique a été demandée pour vous.<br>
Si vous n'êtes pas à l'origine de cette demande, ignorez ce message.<br><br>
<a href="mailto:support@odentas.fr" style="color:#2563eb;text-decoration:none;">support@odentas.fr</a>
</div>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>