145 lines
4.6 KiB
Markdown
145 lines
4.6 KiB
Markdown
# Résumé des Corrections - Signatures DocuSeal
|
|
|
|
## Date: 14 octobre 2025
|
|
|
|
## Problème identifié
|
|
|
|
❌ **Erreur** : `Unable to find form with slug 'mj9RzzWW2LbvnT?data-allow-typed-signature=false'`
|
|
|
|
**Cause** : Les paramètres `data-*` étaient ajoutés à l'URL du slug DocuSeal, ce qui causait une erreur 404.
|
|
|
|
## Solution implémentée
|
|
|
|
Les attributs `data-*` de DocuSeal doivent être passés comme **attributs HTML** sur le composant `<docuseal-form>`, **pas dans l'URL** `data-src`.
|
|
|
|
### ✅ Modifications effectuées
|
|
|
|
#### 1. Composant `<docuseal-form>`
|
|
|
|
**Fichiers modifiés** :
|
|
- `/app/(app)/contrats/[id]/page.tsx`
|
|
- `/app/(app)/signatures-electroniques/page.tsx`
|
|
|
|
**Avant** (❌ incorrect) :
|
|
```tsx
|
|
<docuseal-form
|
|
data-src="https://docuseal.eu/s/mj9RzzWW2LbvnT?data-allow-typed-signature=false">
|
|
</docuseal-form>
|
|
```
|
|
|
|
**Après** (✅ correct) :
|
|
```tsx
|
|
<docuseal-form
|
|
data-src="https://docuseal.eu/s/mj9RzzWW2LbvnT"
|
|
data-language="fr"
|
|
data-with-title="false"
|
|
data-background-color="#fff"
|
|
data-allow-typed-signature="false">
|
|
</docuseal-form>
|
|
```
|
|
|
|
#### 2. Génération des URLs propres
|
|
|
|
**Fichiers modifiés** :
|
|
- `/app/(app)/contrats/[id]/page.tsx` (lignes ~703-710, ~736-744)
|
|
- `/app/(app)/signatures-electroniques/page.tsx` (lignes ~203-218, ~243-251)
|
|
- `/app/api/docuseal-signature/route.ts` (lignes ~225-233)
|
|
|
|
**Changement** : Les URLs DocuSeal sont maintenant générées **sans paramètres de requête**.
|
|
|
|
```typescript
|
|
// ✅ Correct
|
|
embed = `https://docuseal.eu/s/${docusealId}`;
|
|
|
|
// ❌ Ancien (incorrect)
|
|
embed = `https://docuseal.eu/s/${docusealId}?data-allow-typed-signature=false`;
|
|
```
|
|
|
|
## État actuel de la fonctionnalité
|
|
|
|
### ✅ Désactivation de la saisie manuelle
|
|
|
|
**Statut** : Implémenté et fonctionnel
|
|
|
|
L'attribut `data-allow-typed-signature="false"` est ajouté sur le composant `<docuseal-form>` dans :
|
|
- Page de détail d'un contrat (`/contrats/[id]`)
|
|
- Page des signatures électroniques (`/signatures-electroniques`)
|
|
|
|
### ⏳ Pré-remplissage de la signature (EN COURS)
|
|
|
|
**Statut** : Implémentation partielle
|
|
|
|
**Ce qui fonctionne** :
|
|
- ✅ Colonne `signature_b64` créée dans `organization_details`
|
|
- ✅ L'API récupère la signature depuis la base de données
|
|
- ✅ Le paramètre `orgId` est passé depuis les composants
|
|
|
|
**Ce qui reste à faire** :
|
|
- [ ] Ajouter `data-signature` dynamiquement sur `<docuseal-form>`
|
|
- [ ] Récupérer la signature côté client ou la passer via le serveur
|
|
- [ ] Tester avec une vraie signature base64
|
|
|
|
## Comment tester
|
|
|
|
### Test 1 : Désactivation de la saisie manuelle
|
|
|
|
1. Créer une nouvelle signature électronique depuis :
|
|
- `/staff/contrats/[id]` (bouton "Lancer signature électronique")
|
|
- Ou `/staff/contrats` (sélection multiple + signature groupée)
|
|
|
|
2. Ouvrir le lien de signature (en tant qu'employeur)
|
|
|
|
3. **Vérifier** :
|
|
- ❌ L'option "Saisir" ne doit PAS être disponible
|
|
- ✅ Les options "Dessiner" et "Charger" doivent être disponibles
|
|
|
|
### Test 2 : Pré-remplissage de la signature (à venir)
|
|
|
|
1. Ajouter une signature dans la base :
|
|
```sql
|
|
UPDATE organization_details
|
|
SET signature_b64 = 'data:image/png;base64,iVBORw0KG...'
|
|
WHERE org_id = 'VOTRE_ORG_ID';
|
|
```
|
|
|
|
2. Créer une signature électronique pour un contrat de cette organisation
|
|
|
|
3. **Vérifier** :
|
|
- La signature devrait être pré-remplie pour l'employeur
|
|
- L'employeur peut la valider ou la remplacer
|
|
|
|
## Prochaines étapes
|
|
|
|
### Pour le pré-remplissage de la signature
|
|
|
|
**Option A** : Via l'API DocuSeal (recommandé)
|
|
- Utiliser le paramètre `values` lors de la création de la soumission
|
|
- Nécessite de connaître le nom exact du champ de signature dans le template
|
|
|
|
**Option B** : Côté client
|
|
- Récupérer la signature depuis Supabase côté client
|
|
- L'injecter dans l'attribut `data-signature` du composant
|
|
- Plus complexe mais plus flexible
|
|
|
|
**Option C** : URL encode dans signature_link
|
|
- Stocker la signature encodée dans le lien de signature
|
|
- L'extraire et l'ajouter dynamiquement au composant
|
|
- Limite de taille d'URL potentielle
|
|
|
|
## Documentation de référence
|
|
|
|
- **DocuSeal Embed Documentation** : https://docs.docuseal.co/embed
|
|
- **Attributs data-*** :
|
|
- `data-allow-typed-signature`: boolean (default: true)
|
|
- `data-signature`: string (base64, URL, ou texte)
|
|
- `data-language`: string (ex: "fr")
|
|
- `data-with-title`: boolean
|
|
- `data-background-color`: string
|
|
|
|
## Notes importantes
|
|
|
|
⚠️ Les attributs `data-*` de DocuSeal sont des **attributs HTML**, pas des paramètres d'URL.
|
|
|
|
⚠️ L'URL `data-src` doit pointer vers le slug DocuSeal pur sans query parameters.
|
|
|
|
⚠️ Pour le pré-remplissage, le format base64 doit être complet : `data:image/png;base64,...`
|