ray
75 lines
3.3 KiB
Markdown
75 lines
3.3 KiB
Markdown
# v2 PDF Generation — Known Issues and Fixes
|
|
|
|
## jspdf 4.x Array-Based `doc.text()` Causes Text Overlap
|
|
|
|
**Symptom:** Text in the generated PDF overlaps heavily — job titles, descriptions, prices, and status flags render on top of each other.
|
|
|
|
**Root cause:** When you pass a string array to `doc.text(array, x, y)`, jspdf 4.x uses internal matrix-based line spacing that does NOT match manual `yPos += array.length * lineHeight` calculations. This causes yPos to desync from where jspdf actually rendered the text, cascading into overlap throughout the entire document.
|
|
|
|
**Fix:** NEVER pass arrays to `doc.text()`. Instead, iterate through each line and render individually:
|
|
|
|
```typescript
|
|
// BROKEN (jspdf 4.x):
|
|
const lines = doc.splitTextToSize(message, maxWidth);
|
|
doc.text(lines, x, yPos); // jspdf uses its own spacing
|
|
yPos += lines.length * 6 + 15; // does NOT match actual render position
|
|
|
|
// FIXED:
|
|
const lines = doc.splitTextToSize(message, maxWidth);
|
|
lines.forEach((line) => {
|
|
doc.text(line, x, yPos);
|
|
yPos += 6; // explicit control per line
|
|
});
|
|
yPos += 15;
|
|
```
|
|
|
|
## Service Height Calculation Must Match Actual yPos Increments
|
|
|
|
The page-break estimator (`serviceHeight`) must use the EXACT same multipliers as the actual yPos advances. Mismatched values cause services to overflow the page edge without triggering a page break.
|
|
|
|
| Element | Actual yPos advance | Required in estimate |
|
|
|---------|-------------------|---------------------|
|
|
| Customer decision badge | `yPos += 5` | `serviceHeight += 5` |
|
|
| Service name + price | `yPos += 6` | `serviceHeight += 6` |
|
|
| Priority (label + reason) | `yPos += 6; yPos += 10` | `serviceHeight += 16` |
|
|
| Recommendation | `yPos += 8` | `serviceHeight += 8` |
|
|
| Explanation (per line) | `yPos += 5` then `yPos += 2` | `lines.length * 5 + 2` |
|
|
| Parts flags (each) | `yPos += 8` (or 16 with extra line) | `8` or `16` |
|
|
| Separator | `yPos += 6` | `serviceHeight += 6` |
|
|
|
|
## `boxBottomY` Stale After Summary Page Break
|
|
|
|
When the pricing summary box triggers a page break, `boxBottomY` must be updated to the new page's coordinates. Declare it with `let` (not `const`) and reassign in the page-break branch:
|
|
|
|
```typescript
|
|
let boxBottomY = boxTopY + boxPadding + boxContentHeight + boxPadding;
|
|
if (boxBottomY + 50 > PAGE_HEIGHT - 20) {
|
|
doc.addPage();
|
|
// ... re-render box ...
|
|
boxBottomY = bby; // update for new page position
|
|
}
|
|
// ...
|
|
yPos = boxBottomY + 10; // consistent regardless of page break
|
|
```
|
|
|
|
## Customer Info Not Populating When Loading Saved Quote
|
|
|
|
**Symptom:** Services load from PocketBase but customer info fields remain empty.
|
|
|
|
**Causes and fixes:**
|
|
|
|
1. **`reset()` ordering:** `reset()` wipes all state including `customerInfo`. Must call `reset()` BEFORE `setCustomerInfo()`:
|
|
```typescript
|
|
reset();
|
|
if (data.customerInfo) setCustomerInfo(data.customerInfo); // after reset
|
|
```
|
|
|
|
2. **PocketBase JSON field type:** If the PocketBase collection stores `customerInfo` as a text field (not json), the retrieved value is a JSON string. Handle both cases:
|
|
```typescript
|
|
const ci = typeof data.customerInfo === 'string'
|
|
? JSON.parse(data.customerInfo)
|
|
: data.customerInfo;
|
|
if (ci && typeof ci === 'object') setCustomerInfo(ci);
|
|
```
|
|
Apply the same defensive parsing to `services` and `discount` fields.
|