103 lines
3.3 KiB
Markdown
103 lines
3.3 KiB
Markdown
# Reset des Positions de Signature (Test Pourcentages)
|
|
|
|
## Context
|
|
Passage du système de coordonnées en millimètres vers un système en **pourcentages**.
|
|
Cela permet d'avoir un rendu indépendant de la résolution/taille du PDF.
|
|
|
|
## Changements Effectués
|
|
|
|
### 1. Types Modifiés
|
|
- `EstimatedPosition` : x, y, width, height maintenant en POURCENTAGES (%)
|
|
- `ExtractedPosition` : x, y, width, height maintenant en POURCENTAGES (%)
|
|
|
|
### 2. Fonctions Modifiées
|
|
|
|
#### `extractPrecisePositionsFromPdf()`
|
|
```typescript
|
|
// AVANT : Stockage en mm
|
|
const xMm = textPosition.x * PT_TO_MM;
|
|
const yMm = pageHeightMm - (textPosition.y * PT_TO_MM);
|
|
|
|
// APRÈS : Conversion en pourcentages
|
|
const xMm = textPosition.x * PT_TO_MM;
|
|
const yMm = pageHeightMm - (textPosition.y * PT_TO_MM);
|
|
const xPercent = (xMm / pageWidthMm) * 100;
|
|
const yPercent = (yMm / pageHeightMm) * 100;
|
|
const widthPercent = (widthMm / pageWidthMm) * 100;
|
|
const heightPercent = (heightMm / pageHeightMm) * 100;
|
|
```
|
|
|
|
#### `estimatePositionsFromPlaceholders()`
|
|
```typescript
|
|
// AVANT : Positions en mm absolus
|
|
const x = isEmployee ? A4_WIDTH_MM - MARGIN_X_MM - width : MARGIN_X_MM;
|
|
const y = A4_HEIGHT_MM - MARGIN_BOTTOM_MM - height;
|
|
|
|
// APRÈS : Positions en pourcentages
|
|
const widthPercent = ((ph.width || 150) / 210) * 100;
|
|
const heightPercent = ((ph.height || 60) / 297) * 100;
|
|
const xPercent = isEmployee ? 100 - MARGIN_X_PERCENT - widthPercent : MARGIN_X_PERCENT;
|
|
const yPercent = 100 - MARGIN_BOTTOM_PERCENT - heightPercent;
|
|
```
|
|
|
|
### 3. Composant PDFImageViewer
|
|
```typescript
|
|
// AVANT : Conversion mm → %
|
|
const leftPercent = (pos.x / pageWidthMm) * 100;
|
|
const topPercent = (pos.y / pageHeightMm) * 100;
|
|
|
|
// APRÈS : Utilisation directe des pourcentages
|
|
style={{
|
|
left: `${pos.x}%`,
|
|
top: `${pos.y}%`,
|
|
width: `${pos.width}%`,
|
|
height: `${pos.height}%`,
|
|
}}
|
|
```
|
|
|
|
## Avantages
|
|
|
|
✅ **Indépendant de la résolution** : Peu importe la taille du rendu (petit écran, grand écran, zoom), les positions relatives restent correctes
|
|
|
|
✅ **Simplifie le code** : Plus besoin de connaître les dimensions réelles en mm du PDF
|
|
|
|
✅ **Cohérence** : Le placeholder est à X% du haut → le cadre s'affiche à X% du haut
|
|
|
|
✅ **Responsive** : Fonctionne sur mobile, tablette, desktop sans recalcul
|
|
|
|
## Pour Tester
|
|
|
|
1. Supprimer les anciennes positions en base (elles sont en mm) :
|
|
```sql
|
|
DELETE FROM sign_positions WHERE request_id = '2e187e3d-770b-46a1-b7c8-de7a01726059';
|
|
```
|
|
|
|
2. Recharger la page de signature : `/signer/2e187e3d-770b-46a1-b7c8-de7a01726059/xxx`
|
|
|
|
3. L'API va :
|
|
- Détecter qu'il n'y a pas de positions en DB
|
|
- Lancer l'extraction précise depuis le PDF
|
|
- Calculer les positions en POURCENTAGES
|
|
- Les stocker en DB
|
|
- Les renvoyer au front
|
|
|
|
4. Le front va :
|
|
- Recevoir les positions en pourcentages
|
|
- Les appliquer directement sans conversion
|
|
- Afficher les cadres proportionnellement à la taille du conteneur
|
|
|
|
## Vérification Console
|
|
|
|
Vous devriez voir :
|
|
```
|
|
[PLACEHOLDER] Trouvé sur page 3: Signature Employeur (Employeur)
|
|
Position: x=9.5%, y=70.0%, w=35.7%, h=10.1%
|
|
[PLACEHOLDER] Trouvé sur page 3: Signature Salarié (Salarié)
|
|
Position: x=54.8%, y=70.0%, w=35.7%, h=10.1%
|
|
```
|
|
|
|
Au lieu de :
|
|
```
|
|
originalMm: {x: 20, y: 260, w: 150, h: 60}
|
|
percentCalculated: {left: '9.52', top: '87.54', width: '71.43', height: '20.20'}
|
|
```
|