feat(referto): mostra l'icona del servizio a inizio set
Aggiunge un'icona nera (nuovo asset serv-nero.png, più visibile del serv.png bianco su sfondo chiaro) accanto al nome della squadra che serviva all'inizio di ogni set nel referto stampabile. Corregge inoltre generaReferto: la stampa partiva subito dopo document.close(), prima che l'icona (risorsa esterna asincrona) finisse di caricare, risultando in un riquadro vuoto. Ora attende l'evento 'load' della finestra popup prima di chiamare print().
This commit is contained in:
Binary file not shown.
|
After Width: | Height: | Size: 4.1 KiB |
+9
-2
@@ -81,6 +81,10 @@ export function buildRefertoHtml(state, now = new Date()) {
|
||||
const nomeVinc = vinc === 'h' ? nomi.home : vinc === 'g' ? nomi.guest : ''
|
||||
const etichettaVinc = nomeVinc ? ` · vinto da <strong>${nomeVinc}</strong>` : ''
|
||||
|
||||
const servIcon = '<img src="/serv-nero.png" class="serv-icon" alt="Servizio">'
|
||||
const servHomeIcon = s.serv === 'h' ? servIcon : ''
|
||||
const servGuestIcon = s.serv === 'g' ? servIcon : ''
|
||||
|
||||
const puntiHtml = punti.map(p =>
|
||||
`<span class="punto punto-${p.chi}">${p.h}-${p.g}</span>`
|
||||
).join('')
|
||||
@@ -90,7 +94,7 @@ export function buildRefertoHtml(state, now = new Date()) {
|
||||
<div class="set-barra"><span>SET</span><span class="set-numero">${i + 1}</span></div>
|
||||
<div class="set-corpo">
|
||||
<div class="set-header">
|
||||
${nomi.home} <strong>${h}</strong> · <strong>${g}</strong> ${nomi.guest}${etichettaVinc}
|
||||
${servHomeIcon}${nomi.home} <strong>${h}</strong> · <strong>${g}</strong> ${nomi.guest}${servGuestIcon}${etichettaVinc}
|
||||
</div>
|
||||
<div class="form-inizio">
|
||||
<div class="form-inizio-label">Formazione di partenza</div>
|
||||
@@ -144,6 +148,7 @@ export function buildRefertoHtml(state, now = new Date()) {
|
||||
.set-numero { font-weight: bold; font-size: 15px; }
|
||||
.set-corpo { flex: 1; min-width: 0; }
|
||||
.set-header { background: #eaf7fb; padding: 6px 12px; font-size: 13px; border-bottom: 1px solid #111; }
|
||||
.serv-icon { width: 12px; height: 12px; vertical-align: middle; margin: 0 3px; }
|
||||
|
||||
.punti-grid { display: flex; flex-wrap: wrap; gap: 0; padding: 0; border-top: 1px solid #111; }
|
||||
.punto { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; padding: 3px 4px; font-size: 11px; font-family: 'Courier New', monospace; white-space: nowrap; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; }
|
||||
@@ -219,5 +224,7 @@ export function generaReferto(state) {
|
||||
const w = window.open('', '_blank')
|
||||
w.document.write(html)
|
||||
w.document.close()
|
||||
w.print()
|
||||
// Aspetta il caricamento delle immagini (icona servizio) prima di stampare,
|
||||
// altrimenti la stampa parte con risorse ancora in caricamento e appaiono vuote.
|
||||
w.addEventListener('load', () => w.print())
|
||||
}
|
||||
|
||||
@@ -11,10 +11,12 @@ describe('generaReferto (referto.js)', () => {
|
||||
vi.restoreAllMocks()
|
||||
})
|
||||
|
||||
it('apre una nuova scheda, scrive il referto e avvia la stampa', () => {
|
||||
it('apre una nuova scheda, scrive il referto e avvia la stampa dopo il caricamento', () => {
|
||||
const listeners = {}
|
||||
const popup = {
|
||||
document: { write: vi.fn(), close: vi.fn() },
|
||||
print: vi.fn(),
|
||||
addEventListener: vi.fn((evt, cb) => { listeners[evt] = cb }),
|
||||
}
|
||||
const openSpy = vi.spyOn(window, 'open').mockReturnValue(popup)
|
||||
|
||||
@@ -26,6 +28,9 @@ describe('generaReferto (referto.js)', () => {
|
||||
expect(popup.document.write).toHaveBeenCalledTimes(1)
|
||||
expect(popup.document.write.mock.calls[0][0]).toContain('Antoniana')
|
||||
expect(popup.document.close).toHaveBeenCalledTimes(1)
|
||||
expect(popup.print).not.toHaveBeenCalled()
|
||||
|
||||
listeners.load()
|
||||
expect(popup.print).toHaveBeenCalledTimes(1)
|
||||
})
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user