fix(frontend): #37 punti 1,4,5,6 - 502 backend giù, barcode quotato, apici Alpine, paginazione ricette

1. api_client.py: ConnectionError/Timeout restituisce status_code=502 invece
   di 0 (nessuna route confrontava == 0, verificato); i proxy che inoltrano
   resp.get("status_code", 500) ereditano il fix senza altre modifiche.
4. measure.py lookup_barcode: code non stringa -> 400 (prima 500 su
   code.strip()); urllib.parse.quote(code, safe="") prima di comporre l'URL
   verso il backend - un barcode con '/' o '../' non spezza più il path né
   raggiunge altri GET con i permessi dell'utente.
5. Ogni "'{{ _(...) }}'" dentro un attributo Alpine (x-text, :title,
   :placeholder, @click) sostituito con "{{ _(...)|tojson_attr }}": la
   traduzione EN di admin/stations.html:105 ("Clear the station's recipes")
   ha un apostrofo che l'IT non ha, e rompeva quel binding e basta - non è
   un XSS, ma stessa classe di difetto di #10. File toccati: admin/stations,
   admin/users, maker/recipe_list, maker/recipe_editor, maker/task_editor,
   maker/task_drawing, components/caliper_status, measure/select_recipe.
   Le occorrenze dentro <script>...</script> (non attributi) sono fuori
   perimetro per questo punto.
6. statistics.py dashboard(): ciclo sulle pagine (per_page=100, il massimo
   del backend) invece di un'unica chiamata che troncava la tendina ricette
   alla centesima.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-21 23:03:06 +02:00
parent c0583da478
commit 72f0cb1f1b
15 changed files with 218 additions and 50 deletions
@@ -86,13 +86,13 @@
:class="station.active
? 'bg-emerald-100 dark:bg-emerald-900/30 text-emerald-700 dark:text-emerald-300'
: 'bg-red-100 dark:bg-red-900/30 text-red-700 dark:text-red-300'"
x-text="station.active ? '{{ _('Attiva') }}' : '{{ _('Disattivata') }}'"></span>
x-text="station.active ? {{ _('Attiva')|tojson_attr }} : {{ _('Disattivata')|tojson_attr }}"></span>
</td>
<td class="px-4 py-3 text-right" @click.stop>
<div class="flex items-center justify-end gap-1">
<button @click="openAssignmentsModal(station)"
class="p-1.5 rounded-lg text-[var(--text-secondary)] hover:text-primary hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-colors"
:title="'{{ _('Gestisci ricette') }}'">
:title="{{ _('Gestisci ricette')|tojson_attr }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/>
</svg>
@@ -102,22 +102,22 @@
class="p-1.5 rounded-lg text-[var(--text-secondary)] hover:text-amber-600 hover:bg-amber-50 dark:hover:bg-amber-900/20 transition-colors
disabled:opacity-30 disabled:cursor-not-allowed disabled:hover:text-[var(--text-secondary)] disabled:hover:bg-transparent"
:title="(station.recipes && station.recipes.length)
? '{{ _('Azzera le ricette della stazione') }}'
: '{{ _('Nessuna ricetta da azzerare') }}'">
? {{ _('Azzera le ricette della stazione')|tojson_attr }}
: {{ _('Nessuna ricetta da azzerare')|tojson_attr }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M16.023 9.348h4.992V4.356m-.582 9.66a8.25 8.25 0 01-15.356 2.008M3.985 14.652h4.992v4.992m.581-9.66a8.25 8.25 0 0115.356-2.008"/>
</svg>
</button>
<button @click="openEditModal(station)"
class="p-1.5 rounded-lg text-[var(--text-secondary)] hover:text-primary hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-colors"
:title="'{{ _('Modifica') }}'">
:title="{{ _('Modifica')|tojson_attr }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
</svg>
</button>
<button @click="confirmDelete(station)"
class="p-1.5 rounded-lg text-[var(--text-secondary)] hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors"
:title="'{{ _('Elimina') }}'">
:title="{{ _('Elimina')|tojson_attr }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6M1 7h22M9 7V4a1 1 0 011-1h4a1 1 0 011 1v3"/>
</svg>
@@ -160,7 +160,7 @@
<div class="flex items-center justify-between px-6 py-4 border-b border-[var(--border-color)]">
<h2 class="text-lg font-semibold text-[var(--text-primary)]"
x-text="isEditing ? '{{ _('Modifica Stazione') }}' : '{{ _('Nuova Stazione') }}'"></h2>
x-text="isEditing ? {{ _('Modifica Stazione')|tojson_attr }} : {{ _('Nuova Stazione')|tojson_attr }}"></h2>
<button @click="closeModal()" class="p-1 rounded-lg text-[var(--text-secondary)] hover:bg-[var(--bg-secondary)] transition-colors">
<svg class="w-5 h-5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"/>
@@ -237,7 +237,7 @@
:disabled="saving"
class="px-4 py-2 bg-primary text-white text-sm font-medium rounded-lg
hover:bg-primary-700 transition-colors shadow-sm disabled:opacity-50">
<span x-show="!saving" x-text="isEditing ? '{{ _('Salva Modifiche') }}' : '{{ _('Crea Stazione') }}'"></span>
<span x-show="!saving" x-text="isEditing ? {{ _('Salva Modifiche')|tojson_attr }} : {{ _('Crea Stazione')|tojson_attr }}"></span>
<span x-show="saving" x-cloak>{{ _('Salvataggio...') }}</span>
</button>
</div>
@@ -299,7 +299,7 @@
:disabled="saving"
class="ml-2 inline-flex items-center gap-1 px-2.5 py-1 bg-primary text-white text-xs font-medium rounded-md
hover:bg-primary-700 transition-colors shadow-sm disabled:opacity-50"
:title="'{{ _('Assegna a questa stazione') }}'">
:title="{{ _('Assegna a questa stazione')|tojson_attr }}">
<svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" stroke-width="2.5" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4"/>
</svg>
@@ -332,7 +332,7 @@
<button @click="unassignRecipe(r.id)"
:disabled="saving"
class="ml-2 p-1.5 rounded-md text-[var(--text-secondary)] hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 transition-colors disabled:opacity-50"
:title="'{{ _('Rimuovi assegnazione') }}'">
:title="{{ _('Rimuovi assegnazione')|tojson_attr }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"/>
</svg>
@@ -93,11 +93,11 @@
:class="user.active
? 'bg-emerald-100 dark:bg-emerald-900/30 text-emerald-700 dark:text-emerald-300'
: 'bg-red-100 dark:bg-red-900/30 text-red-700 dark:text-red-300'"
x-text="user.active ? '{{ _('Attivo') }}' : '{{ _('Disattivato') }}'"></span>
x-text="user.active ? {{ _('Attivo')|tojson_attr }} : {{ _('Disattivato')|tojson_attr }}"></span>
</td>
<td class="px-4 py-3 text-right" @click.stop>
<div class="flex items-center justify-end gap-1">
<button @click="openEditModal(user)" class="p-1.5 rounded-lg text-[var(--text-secondary)] hover:text-primary hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-colors" :title="'{{ _('Modifica') }}'">
<button @click="openEditModal(user)" class="p-1.5 rounded-lg text-[var(--text-secondary)] hover:text-primary hover:bg-primary-50 dark:hover:bg-primary-900/20 transition-colors" :title="{{ _('Modifica')|tojson_attr }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
</svg>
@@ -106,7 +106,7 @@
:class="user.active
? 'text-[var(--text-secondary)] hover:text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20'
: 'text-[var(--text-secondary)] hover:text-emerald-600 hover:bg-emerald-50 dark:hover:bg-emerald-900/20'"
:title="user.active ? '{{ _('Disattiva') }}' : '{{ _('Riattiva') }}'">
:title="user.active ? {{ _('Disattiva')|tojson_attr }} : {{ _('Riattiva')|tojson_attr }}">
<svg x-show="user.active" class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M18.364 18.364A9 9 0 005.636 5.636m12.728 12.728A9 9 0 015.636 5.636m12.728 12.728L5.636 5.636"/>
</svg>
@@ -158,7 +158,7 @@
<!-- Modal Header -->
<div class="flex items-center justify-between px-6 py-4 border-b border-[var(--border-color)]">
<h2 class="text-lg font-semibold text-[var(--text-primary)]"
x-text="isEditing ? '{{ _('Modifica Utente') }}' : '{{ _('Nuovo Utente') }}'"></h2>
x-text="isEditing ? {{ _('Modifica Utente')|tojson_attr }} : {{ _('Nuovo Utente')|tojson_attr }}"></h2>
<button @click="closeModal()" class="p-1 rounded-lg text-[var(--text-secondary)] hover:bg-[var(--bg-secondary)] transition-colors">
<svg class="w-5 h-5" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"/>
@@ -211,7 +211,7 @@
<input type="password" x-model="form.password"
class="w-full px-3 py-2 rounded-lg border border-[var(--border-color)] bg-[var(--bg-card)]
text-sm text-[var(--text-primary)] focus:outline-none focus:ring-2 focus:ring-primary/30 focus:border-primary transition-colors"
:placeholder="isEditing ? '{{ _('Nuova password (opzionale)') }}' : '{{ _('Password') }}'"
:placeholder="isEditing ? {{ _('Nuova password (opzionale)')|tojson_attr }} : {{ _('Password')|tojson_attr }}"
minlength="6">
</div>
@@ -295,7 +295,7 @@
:disabled="saving"
class="px-4 py-2 bg-primary text-white text-sm font-medium rounded-lg
hover:bg-primary-700 transition-colors shadow-sm disabled:opacity-50">
<span x-show="!saving" x-text="isEditing ? '{{ _('Salva Modifiche') }}' : '{{ _('Crea Utente') }}'"></span>
<span x-show="!saving" x-text="isEditing ? {{ _('Salva Modifiche')|tojson_attr }} : {{ _('Crea Utente')|tojson_attr }}"></span>
<span x-show="saving" x-cloak>{{ _('Salvataggio...') }}</span>
</button>
</div>
@@ -310,7 +310,7 @@
x-transition
class="relative bg-[var(--bg-card)] rounded-xl border border-[var(--border-color)] shadow-xl w-full max-w-sm p-6">
<h3 class="text-lg font-semibold text-[var(--text-primary)] mb-2"
x-text="toggleUser?.active ? '{{ _('Conferma Disattivazione') }}' : '{{ _('Conferma Riattivazione') }}'"></h3>
x-text="toggleUser?.active ? {{ _('Conferma Disattivazione')|tojson_attr }} : {{ _('Conferma Riattivazione')|tojson_attr }}"></h3>
<p class="text-sm text-[var(--text-secondary)] mb-4">
<span x-text="toggleUser?.active
? &quot;{{ _('Sei sicuro di voler disattivare l\'utente') }}&quot;
@@ -326,7 +326,7 @@
:disabled="saving"
class="px-4 py-2 text-sm font-medium text-white rounded-lg shadow-sm disabled:opacity-50 transition-colors"
:class="toggleUser?.active ? 'bg-red-600 hover:bg-red-700' : 'bg-emerald-600 hover:bg-emerald-700'">
<span x-text="toggleUser?.active ? '{{ _('Disattiva') }}' : '{{ _('Riattiva') }}'"></span>
<span x-text="toggleUser?.active ? {{ _('Disattiva')|tojson_attr }} : {{ _('Riattiva')|tojson_attr }}"></span>
</button>
</div>
</div>
@@ -12,8 +12,8 @@
? 'bg-green-50 dark:bg-green-900/20 border-green-300 dark:border-green-700 shadow-md shadow-green-100 dark:shadow-green-900/30'
: 'bg-[var(--bg-card)] border-[var(--border-color)]'"
:title="readingCount > 0
? '{{ _('Letture calibro') }}: ' + readingCount
: '{{ _('Calibro USB') }}'">
? {{ _('Letture calibro')|tojson_attr }} + ': ' + readingCount
: {{ _('Calibro USB')|tojson_attr }}">
<!-- Status dot -->
<span class="relative flex h-2.5 w-2.5">
@@ -43,7 +43,7 @@
<!-- Label -->
<span class="text-xs font-medium transition-colors duration-300"
:class="active ? 'text-green-700 dark:text-green-300' : 'text-slate-600 dark:text-slate-400'"
x-text="active ? '{{ _('Lettura calibro') }}' : '{{ _('Calibro USB') }}'"></span>
x-text="active ? {{ _('Lettura calibro')|tojson_attr }} : {{ _('Calibro USB')|tojson_attr }}"></span>
<!-- Last reading value (shows when active or when there's a recent reading) -->
<span x-show="lastReading !== null"
@@ -104,7 +104,7 @@
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"/>
</svg>
<span x-text="saving ? '{{ _('Salvataggio...') }}' : '{{ _('Salva') }}'"></span>
<span x-text="saving ? {{ _('Salvataggio...')|tojson_attr }} : {{ _('Salva')|tojson_attr }}"></span>
</button>
{% if not is_new %}
@@ -487,7 +487,7 @@
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"/>
</svg>
<span x-text="saving ? '{{ _('Salvataggio...') }}' : '{{ _('Salva Ricetta') }}'"></span>
<span x-text="saving ? {{ _('Salvataggio...')|tojson_attr }} : {{ _('Salva Ricetta')|tojson_attr }}"></span>
</button>
<a href="{{ url_for('maker.recipe_list') }}"
@@ -48,11 +48,11 @@
this.deleteTarget = null;
} else {
const data = await resp.json();
alert(data.error || '{{ _('Errore durante eliminazione') }}');
alert(data.error || {{ _('Errore durante eliminazione')|tojson_attr }});
}
} catch (err) {
console.error(err);
alert('{{ _('Errore di connessione') }}');
alert({{ _('Errore di connessione')|tojson_attr }});
}
},
@@ -121,7 +121,7 @@
<input type="text"
x-model="search"
class="tmf-input !pl-10"
:placeholder="'{{ _('Cerca per nome, codice o descrizione...') }}'">
:placeholder="{{ _('Cerca per nome, codice o descrizione...')|tojson_attr }}">
</div>
</div>
@@ -141,7 +141,7 @@
<div class="mb-5">
<p class="text-sm text-[var(--text-secondary)]">
<span x-text="filteredRecipes.length"></span>
<span x-text="filteredRecipes.length === 1 ? '{{ _('ricetta trovata') }}' : '{{ _('ricette trovate') }}'"></span>
<span x-text="filteredRecipes.length === 1 ? {{ _('ricetta trovata')|tojson_attr }} : {{ _('ricette trovate')|tojson_attr }}"></span>
</p>
</div>
@@ -183,7 +183,7 @@
<!-- Status Badge -->
<span class="badge"
:class="recipe.active ? 'badge-pass' : 'badge-fail'"
x-text="recipe.active ? '{{ _('Attiva') }}' : '{{ _('Disattivata') }}'">
x-text="recipe.active ? {{ _('Attiva')|tojson_attr }} : {{ _('Disattivata')|tojson_attr }}">
</span>
</div>
@@ -278,7 +278,7 @@
<!-- Clear All -->
<button type="button"
class="anno-btn text-red-500 hover:text-red-600"
@click="if (confirm('{{ _('Eliminare tutte le annotazioni?') }}')) clearAllAnnotations()"
@click="if (confirm({{ _('Eliminare tutte le annotazioni?')|tojson_attr }})) clearAllAnnotations()"
title="{{ _('Cancella tutto') }}">
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round"
@@ -219,7 +219,7 @@
<div class="mb-4 flex items-center justify-between">
<p class="text-sm text-[var(--text-secondary)]">
<span x-text="tasks.length"></span>
<span x-text="tasks.length === 1 ? '{{ _('task') }}' : '{{ _('task') }}'"></span>
<span x-text="tasks.length === 1 ? {{ _('task')|tojson_attr }} : {{ _('task')|tojson_attr }}"></span>
</p>
<div class="flex items-center gap-2">
<button @click="showAddTask = true; $nextTick(() => $refs.newTaskTitle && $refs.newTaskTitle.focus())"
@@ -679,7 +679,7 @@
x-transition
class="p-3 rounded-lg bg-[var(--bg-secondary)] border border-[var(--border-color)]">
<p class="text-xs font-semibold text-[var(--text-secondary)] uppercase tracking-wide mb-3"
x-text="editingSubtaskId ? '{{ _('Modifica Misurazione') }}' : '{{ _('Nuova Misurazione') }}'">
x-text="editingSubtaskId ? {{ _('Modifica Misurazione')|tojson_attr }} : {{ _('Nuova Misurazione')|tojson_attr }}">
</p>
<div class="grid grid-cols-2 sm:grid-cols-4 lg:grid-cols-6 gap-3">
<!-- Marker Number -->
@@ -791,7 +791,7 @@
<circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/>
<path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8v4a4 4 0 00-4 4H4z"/>
</svg>
<span x-text="editingSubtaskId ? '{{ _('Aggiorna Misurazione') }}' : '{{ _('Aggiungi Misurazione') }}'"></span>
<span x-text="editingSubtaskId ? {{ _('Aggiorna Misurazione')|tojson_attr }} : {{ _('Aggiungi Misurazione')|tojson_attr }}"></span>
</button>
</div>
</div>
@@ -27,8 +27,8 @@
when the production opens - this is only the earlier answer. */
missingTraceability(recipe) {
const missing = [];
if (recipe.requires_lot && !this.lot_number.trim()) missing.push('{{ _('lotto') }}');
if (recipe.requires_serial && !this.serial_number.trim()) missing.push('{{ _('seriale') }}');
if (recipe.requires_lot && !this.lot_number.trim()) missing.push({{ _('lotto')|tojson_attr }});
if (recipe.requires_serial && !this.serial_number.trim()) missing.push({{ _('seriale')|tojson_attr }});
return missing;
},
/* Straight into the first task. Choosing a recipe used to open the full
@@ -57,14 +57,14 @@
});
const data = await resp.json();
if (data.error) {
this.barcodeError = data.detail || '{{ _("Ricetta non trovata") }}';
this.barcodeError = data.detail || {{ _("Ricetta non trovata")|tojson_attr }};
} else {
// The scanner is a way in like any other: a recipe that demands a lot
// demands it here too, or the rule would last exactly as long as it
// took someone to reach for the barcode reader.
const missing = this.missingTraceability(data);
if (missing.length) {
this.barcodeError = '{{ _("Compila prima:") }} ' + missing.join(', ');
this.barcodeError = {{ _("Compila prima:")|tojson_attr }} + ' ' + missing.join(', ');
return;
}
this.barcodeModal = false;
@@ -72,7 +72,7 @@
window.location.href = this.buildTaskUrl(data.id);
}
} catch (e) {
this.barcodeError = '{{ _("Errore di connessione") }}';
this.barcodeError = {{ _("Errore di connessione")|tojson_attr }};
} finally {
this.barcodeLoading = false;
}
@@ -239,7 +239,7 @@
<!-- Description -->
<p class="mt-1 text-sm text-[var(--text-secondary)] line-clamp-2 leading-relaxed"
x-text="recipe.description || '{{ _('Nessuna descrizione disponibile') }}'">
x-text="recipe.description || {{ _('Nessuna descrizione disponibile')|tojson_attr }}">
</p>
</div>
</div>
@@ -277,7 +277,7 @@
<svg class="w-3.5 h-3.5 shrink-0 mt-px" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z"/>
</svg>
<span x-text="'{{ _('Compila prima:') }} ' + missingTraceability(recipe).join(', ')"></span>
<span x-text="{{ _('Compila prima:')|tojson_attr }} + ' ' + missingTraceability(recipe).join(', ')"></span>
</p>
</template>