feat(web): editare celule in preview + Acasa unificata (PRD 3.6)

Implementeaza PRD 3.6 (US-001..007), pe canalul de import + stratul web;
worker / masina stari / idempotenta / mapare raman neatinse.

- US-003/004: tab-ul "Trimiteri" eliminat; Trimiterile devin sectiune
  permanenta sub upload pe Acasa ("Trimiterile tale"); upload comprimat la
  bara slim (hero pastrat la first-run); ?tab=coada si /_fragments/coada
  servesc Acasa (fara fragment orfan); poll gated pe visibilityState.
- US-001: coloana noua import_rows.override_json (nullable, Fernet, Approach B)
  + _migrate defensiv; ruta v1 + alias web .../rand/{i}/editeaza aplica patch
  canonic ULTIMUL in _resolve_row_for_preview si commit_import (mutatie pura,
  status rederivat, fara drift). Scoping JOIN -> 404, guard committed -> 409,
  semantica empty=clear, decrypt fail -> no-op.
- US-002: buton "Editeaza" pe rand; swap pe <tr> + OOB contoare (nu pe sectiune);
  form propriu (confirm dezactivat la editare); refoloseste grila responsiva +
  error-map din _trimitere_detaliu.html; mutual-exclusion intre randuri.
- US-005/006: "De rezolvat", "Operatii salvate" si "Formate de coloane" ca
  tabele (.tablewrap); H4: comutatorul reflecta auto_send STOCAT.
- US-007: bifa "auto-send" devine comutator etichetat pe COADA ("Pune automat
  in coada" / "Tine pentru verificare"), scoped pe operatie; name="auto_send"
  pastrat (semantica de prezenta -> bool corect cu ambele parsere, zero backend).

Fix-uri gasite la verificarea E2E in browser (htmx 1.9.12, JS — invizibile la
TestClient): useTemplateFragments=true (raspuns <tr>+OOB era parsat in context
de tabel -> swapError + contoare pierdute); re-activarea confirm-btn dupa salvare
deferita pe tick (evita editing=true tranzitoriu); n-hint actualizat de updateN.

Teste: 523 passed. E2E browser: Acasa unificata, upload slim, editare rand
(needs_data -> ok, swap pe rand, contoare OOB), Mapari tabelar + comutator.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Claude Agent
2026-06-19 10:52:17 +00:00
parent ead63245da
commit 6f6b163867
25 changed files with 2094 additions and 278 deletions

View File

@@ -1,6 +1,6 @@
<div id="acasa-section">
{# === Centru de greutate: caseta de upload (importul e operatia principala) === #}
{# === Centru de greutate: bara de upload (importul e operatia principala) === #}
{% include '_upload.html' %}
{# === Subordonat: primii pasi pe un singur rand compact === #}
@@ -44,13 +44,21 @@
</div>
{% endif %}
{# === Subordonat: ajutor rapid pe un rand discret === #}
{# === Subordonat: ajutor rapid pe un rand discret ===
US-003 (3.6): linkul redundant "Trimiteri" a fost scos (Trimiterile sunt mai jos
pe aceeasi pagina). Wayfinding "Mapari"/"Coduri RAR" pastrat pentru operatori. #}
<div style="margin-top:10px; font-size:13px; color:var(--muted);
display:flex; gap:16px; flex-wrap:wrap; align-items:center;">
<span>Ajutor:</span>
<a href="/?tab=coada">Trimiteri</a>
<a href="/?tab=mapari">Mapari</a>
<a href="/?tab=nomenclator">Coduri RAR</a>
</div>
{# === Sectiunea Trimiteri ("Trimiterile tale"), permanenta sub upload (US-003).
Suprimata la first-run (zero trimiteri): bara de upload acopera deja CTA-ul,
iar empty-state-ul tabelului ar fi redundant (US-004 / D-5.1). === #}
{% if are_trimiteri %}
{% include '_coada.html' %}
{% endif %}
</div>

View File

@@ -1,7 +1,20 @@
<div id="coada-section">
{#
_coada.html — repurposat in 3.6 (US-003).
Nu mai e un tab/panou separat: e sectiunea "Trimiterile tale" inclusa pe Acasa,
sub zona de upload. Pastreaza filtrele (US-009), tabelul (_submissions.html) si
panoul de detaliu (#trimitere-detaliu). Poll aliniat la 15s (anti dublu-poll, M5).
#}
<section id="trimiteri-section" aria-labelledby="trimiteri-heading"
style="margin-top:22px; padding-top:18px; border-top:2px solid var(--line);">
<div class="card">
<div style="display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 12px;">
<h2 style="font-size:15px; margin:0;">Trimiteri catre RAR</h2>
<h2 id="trimiteri-heading" style="font-size:15px; margin:0;">
Trimiterile tale
{% if blocate_total %}
<span class="tab-badge" title="{{ blocate_total }} necesita atentie"
style="display:inline-flex; align-items:center; justify-content:center; min-width:18px; height:18px; margin-left:6px; padding:0 5px; border-radius:99px; background:var(--err); color:#fff; font-size:11px; font-weight:700;">{{ blocate_total }}</span>
{% endif %}
</h2>
<span style="margin-left:auto; display:flex; gap:8px; flex-wrap:wrap;">
<a class="cardlink" href="/v1/audit/export?status=sent" download>export CSV: trimise</a>
<a class="cardlink" href="/v1/audit/export?status=all" download>toate</a>
@@ -42,14 +55,15 @@
<button type="submit">Filtreaza</button>
</form>
<!-- Poll aliniat la 15s ca status-ul (M5: nu doua timere perpetue pe pagina mereu deschisa) -->
<div id="submissions-wrap"
hx-get="/_fragments/submissions" hx-trigger="load, every 10s"
hx-get="/_fragments/submissions" hx-trigger="load, every 15s"
hx-include="#filtre-trimiteri" hx-swap="innerHTML">
<div class="empty">se incarca…</div>
</div>
</div>
<!-- Panou dedicat pentru detaliul trimiterii (NU inline in tabel: poll-ul de 10s
din tabel ar sterge un expand inline). Gol pana la click pe un rand. -->
<!-- Panou dedicat pentru detaliul trimiterii (NU inline in tabel: poll-ul din tabel
ar sterge un expand inline). Gol pana la click pe un rand. -->
<div id="trimitere-detaliu"></div>
</div>
</section>

View File

@@ -0,0 +1,26 @@
{# Macro-uri partajate intre template-urile de import si mapari. #}
{# US-007: comutator pe COADA in loc de bifa "auto-send".
Framing pe punerea in coada, NU pe trimitere (poarta autoplan UC-A): etichetele
poarta singure sensul de send-safety. `name="auto_send" value="true"` pastrat cu
semantica de prezenta (bifat -> True, nebifat -> absent -> False) ca sa produca
bool corect cu AMBELE parsere backend (Form(bool) la /mapari, bool(form.get())
la /_import/.../mapare-operatie). Zero atingere backend.
- form_id: leaga input-ul de un <form> extern (necesar in celulele de tabel).
- checked: starea initiala (H4 - reflecta valoarea STOCATA per mapare). #}
{% macro autosend_toggle(form_id='', checked=True) -%}
<div class="autosend-toggle" style="display:flex; flex-direction:column; gap:4px;">
<span class="muted" style="font-size:12px;">La fisierele viitoare cu aceasta operatie:</span>
<label class="chk" style="display:inline-flex; align-items:center; gap:8px; min-height:44px;">
<input type="checkbox" name="auto_send" value="true"
{%- if form_id %} form="{{ form_id }}"{% endif %}
{%- if checked %} checked{% endif %}
aria-label="Pune automat in coada la fisierele viitoare cu aceasta operatie">
<span><strong>Pune automat in coada</strong></span>
</label>
<span class="muted" style="font-size:11px;">
Nebifat = "Tine pentru verificare". Doar pentru aceasta operatie;
nimic nu pleaca la RAR pana confirmi.
</span>
</div>
{%- endmacro %}

View File

@@ -1,3 +1,4 @@
{% import '_macros.html' as ui %}
<div id="mapari-section">
{% if message %}
@@ -21,47 +22,58 @@
Alege codul RAR (sugestia fuzzy e preselectata) si salveaza — submission-urile se deblocheaza automat.
</p>
{% for e in pending %}
{% set top = e.suggestions[0] if e.suggestions else None %}
{% set preselect = top.cod_prestatie if (top and top.score >= 60) else '' %}
<form class="maprow" hx-post="/mapari" hx-target="#mapari-section" hx-swap="outerHTML">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="cod_op_service" value="{{ e.cod_op_service }}">
<div class="mapcol grow">
<div><strong>{{ e.cod_op_service }}</strong>
<span class="pill" title="submission-uri blocate">{{ e.blocked }} blocate</span></div>
<div class="muted">{{ e.denumire or '(fara denumire)' }}</div>
{% if e.suggestions %}
<div class="muted" style="font-size:12px; margin-top:4px;">
sugestii:
{% for s in e.suggestions[:3] %}
<span class="sugg">{{ s.cod_prestatie }} ({{ s.score|round|int }}%)</span>{% if not loop.last %}, {% endif %}
{% endfor %}
</div>
{% endif %}
</div>
<div class="mapcol">
<select name="cod_prestatie" required>
<option value="">— alege cod RAR —</option>
{% for n in nomenclator %}
<option value="{{ n.cod_prestatie }}" {% if n.cod_prestatie == preselect %}selected{% endif %}>
{{ n.cod_prestatie }} {{ n.nume_prestatie }}
</option>
{% endfor %}
</select>
</div>
<div class="mapcol">
<label class="chk"><input type="checkbox" name="auto_send" value="true" checked> auto-send</label>
</div>
<div class="mapcol">
<button type="submit">Salveaza</button>
</div>
</form>
{% endfor %}
<div class="tablewrap">
<table>
<thead><tr>
<th>Operatie</th>
<th>Sugestii</th>
<th>Cod RAR</th>
<th>Punere in coada</th>
<th></th>
</tr></thead>
<tbody>
{% for e in pending %}
{% set top = e.suggestions[0] if e.suggestions else None %}
{% set preselect = top.cod_prestatie if (top and top.score >= 60) else '' %}
<tr>
<td>
<form id="map-rez-{{ loop.index }}" hx-post="/mapari" hx-target="#mapari-section" hx-swap="outerHTML">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="cod_op_service" value="{{ e.cod_op_service }}">
</form>
<div><strong>{{ e.cod_op_service }}</strong>
<span class="pill" title="submission-uri blocate">{{ e.blocked }} blocate</span></div>
<div class="muted">{{ e.denumire or '(fara denumire)' }}</div>
</td>
<td class="muted" style="font-size:12px;">
{% if e.suggestions %}
{% for s in e.suggestions[:3] %}
<span class="sugg">{{ s.cod_prestatie }} ({{ s.score|round|int }}%)</span>{% if not loop.last %}, {% endif %}
{% endfor %}
{% else %}—{% endif %}
</td>
<td>
<select name="cod_prestatie" form="map-rez-{{ loop.index }}" required
aria-label="Cod RAR pentru {{ e.cod_op_service }}">
<option value=""> alege cod RAR —</option>
{% for n in nomenclator %}
<option value="{{ n.cod_prestatie }}" {% if n.cod_prestatie == preselect %}selected{% endif %}>
{{ n.cod_prestatie }} — {{ n.nume_prestatie }}
</option>
{% endfor %}
</select>
</td>
<td>
{{ ui.autosend_toggle(form_id="map-rez-" ~ loop.index, checked=True) }}
</td>
<td>
<button type="submit" form="map-rez-{{ loop.index }}">Salveaza</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
</div>
@@ -77,50 +89,61 @@
</div>
{% else %}
<p class="muted" style="margin:0 0 12px; font-size:13px;">
Maparile operatie -> cod RAR retinute pentru contul tau. Schimba codul sau auto-send si salveaza;
Maparile operatie -> cod RAR retinute pentru contul tau. Schimba codul sau punerea in coada si salveaza;
la schimbarea unui cod, submission-urile blocate pe acea operatie se re-rezolva automat.
</p>
{% for m in saved_mappings %}
<form class="maprow" hx-post="/mapari/salvate" hx-target="#mapari-section" hx-swap="outerHTML">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="cod_op_service" value="{{ m.cod_op_service }}">
<div class="mapcol grow">
<div><strong>{{ m.cod_op_service }}</strong></div>
<div class="muted" style="font-size:12px;">
acum: {{ m.cod_prestatie }}{% if m.nume_prestatie %} — {{ m.nume_prestatie }}{% endif %}
</div>
</div>
<div class="mapcol">
<select name="cod_prestatie" required aria-label="Cod RAR pentru {{ m.cod_op_service }}">
{% for n in nomenclator %}
<option value="{{ n.cod_prestatie }}" {% if n.cod_prestatie == m.cod_prestatie %}selected{% endif %}>
{{ n.cod_prestatie }} — {{ n.nume_prestatie }}
</option>
{% endfor %}
</select>
</div>
<div class="mapcol">
<label class="chk"><input type="checkbox" name="auto_send" value="true"
{% if m.auto_send %}checked{% endif %}> auto-send</label>
</div>
<div class="mapcol" style="display:flex; gap:6px;">
<button type="submit">Salveaza</button>
</div>
<div class="mapcol">
<button type="submit"
hx-post="/mapari/salvate/sterge" hx-target="#mapari-section" hx-swap="outerHTML"
hx-confirm="Stergi maparea pentru {{ m.cod_op_service }}?"
style="background:var(--card); color:var(--err); border-color:var(--err);">
Sterge
</button>
</div>
</form>
{% endfor %}
<div class="tablewrap">
<table>
<thead><tr>
<th>Operatie</th>
<th>Cod RAR</th>
<th>Punere in coada</th>
<th>Actiuni</th>
</tr></thead>
<tbody>
{% for m in saved_mappings %}
<tr>
<td>
<form id="map-salv-{{ loop.index }}" hx-post="/mapari/salvate" hx-target="#mapari-section" hx-swap="outerHTML">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="cod_op_service" value="{{ m.cod_op_service }}">
</form>
<form id="map-del-{{ loop.index }}" hx-post="/mapari/salvate/sterge" hx-target="#mapari-section" hx-swap="outerHTML"
hx-confirm="Stergi maparea pentru {{ m.cod_op_service }}?">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="cod_op_service" value="{{ m.cod_op_service }}">
</form>
<div><strong>{{ m.cod_op_service }}</strong></div>
<div class="muted" style="font-size:12px;">
acum: {{ m.cod_prestatie }}{% if m.nume_prestatie %} — {{ m.nume_prestatie }}{% endif %}
</div>
</td>
<td>
<select name="cod_prestatie" form="map-salv-{{ loop.index }}" required
aria-label="Cod RAR pentru {{ m.cod_op_service }}">
{% for n in nomenclator %}
<option value="{{ n.cod_prestatie }}" {% if n.cod_prestatie == m.cod_prestatie %}selected{% endif %}>
{{ n.cod_prestatie }} — {{ n.nume_prestatie }}
</option>
{% endfor %}
</select>
</td>
<td>
{{ ui.autosend_toggle(form_id="map-salv-" ~ loop.index, checked=m.auto_send) }}
</td>
<td style="white-space:nowrap;">
<button type="submit" form="map-salv-{{ loop.index }}">Salveaza</button>
<button type="submit" form="map-del-{{ loop.index }}"
style="background:var(--card); color:var(--err); border-color:var(--err);">
Sterge
</button>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endif %}
</div>
@@ -140,42 +163,51 @@
Antetele de fisier recunoscute. Un fisier cu alte coloane = format nou separat (nu suprascrie).
</p>
{% for f in column_formats %}
<div class="maprow" style="align-items:flex-start;">
<div class="mapcol grow">
<div style="font-size:13px; margin-bottom:4px;">
<strong>{{ f.columns | length }} coloane recunoscute</strong>
{% if f.format_data %}
<span class="pill" title="format data">data: {{ f.format_data }}</span>
{% endif %}
</div>
<div class="muted" style="font-size:12px;">
{% for col, camp in f.mappings.items() %}
<span class="sugg">{{ col }}</span> &rarr; {{ camp }}{% if not loop.last %}; {% endif %}
{% endfor %}
</div>
</div>
<form class="mapcol" style="display:flex; gap:6px; align-items:center;"
hx-post="/formate-coloane/editeaza" hx-target="#mapari-section" hx-swap="outerHTML">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="format_id" value="{{ f.id }}">
<input type="text" name="format_data" value="{{ f.format_data or '' }}"
placeholder="ex. DD.MM.YYYY" aria-label="Format data" style="max-width:130px;">
<button type="submit">Salveaza data</button>
</form>
<form class="mapcol"
hx-post="/formate-coloane/sterge" hx-target="#mapari-section" hx-swap="outerHTML"
hx-confirm="Stergi acest format de coloane?">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="format_id" value="{{ f.id }}">
<button type="submit" style="background:var(--card); color:var(--err); border-color:var(--err);">
Sterge
</button>
</form>
<div class="tablewrap">
<table>
<thead><tr>
<th>Coloane</th>
<th>Mapari (coloana &rarr; camp)</th>
<th>Format data</th>
<th></th>
</tr></thead>
<tbody>
{% for f in column_formats %}
<tr>
<td style="white-space:nowrap;">
<strong>{{ f.columns | length }} coloane</strong>
</td>
<td class="muted" style="font-size:12px; white-space:normal; max-width:340px;">
{% for col, camp in f.mappings.items() %}
<span class="sugg">{{ col }}</span> &rarr; {{ camp }}{% if not loop.last %}; {% endif %}
{% endfor %}
</td>
<td>
<form id="fmt-edit-{{ loop.index }}" hx-post="/formate-coloane/editeaza"
hx-target="#mapari-section" hx-swap="outerHTML"
style="display:flex; gap:6px; align-items:center;">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="format_id" value="{{ f.id }}">
<input type="text" name="format_data" value="{{ f.format_data or '' }}"
placeholder="ex. DD.MM.YYYY" aria-label="Format data" style="max-width:130px;">
<button type="submit">Salveaza data</button>
</form>
</td>
<td>
<form hx-post="/formate-coloane/sterge" hx-target="#mapari-section" hx-swap="outerHTML"
hx-confirm="Stergi acest format de coloane?">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<input type="hidden" name="format_id" value="{{ f.id }}">
<button type="submit" style="background:var(--card); color:var(--err); border-color:var(--err);">
Sterge
</button>
</form>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% endfor %}
{% endif %}
</div>

View File

@@ -1,3 +1,4 @@
{% import '_macros.html' as ui %}
<div id="import-section">
{% set pas = 3 %}{% include '_stepper.html' %}
<div class="card">
@@ -16,16 +17,16 @@
</div>
{% endif %}
<!-- Rezumat stari -->
<div style="display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px;">
{% set status_labels = [
('ok', 'gata de trimis'),
('needs_review', 'verifica valori'),
('needs_mapping', 'fara cod RAR'),
('needs_data', 'date lipsa'),
('already_sent', 'deja trimis'),
('duplicate_in_file','dublicat in fisier'),
] %}
<!-- Rezumat stari (id stabil pentru OOB swap dupa editarea unui rand — US-002) -->
{% set status_labels = [
('ok', 'gata de trimis'),
('needs_review', 'verifica valori'),
('needs_mapping', 'fara cod RAR'),
('needs_data', 'date lipsa'),
('already_sent', 'deja trimis'),
('duplicate_in_file','dublicat in fisier'),
] %}
<div id="preview-rezumat" style="display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px;">
{% for status_key, label in status_labels %}
{%- set cnt = summary.get(status_key, 0) -%}
{% if cnt > 0 %}
@@ -96,7 +97,7 @@
</select>
</div>
<div class="mapcol">
<label class="chk"><input type="checkbox" name="auto_send" value="true" checked> auto-send</label>
{{ ui.autosend_toggle(checked=True) }}
</div>
<div class="mapcol">
<button type="submit" style="min-height:44px;">Salveaza</button>
@@ -106,85 +107,39 @@
</div>
{% endif %}
<!-- Tabel preview + bara confirmare (un singur form) -->
<!-- Tabel preview. Randurile au FORM PROPRIU pentru editare (NU sunt in #confirm-form,
altfel Enter intr-un camp ar declansa trimiterea ireversibila — D-3.3). Bifele
needs_review se asociaza la #confirm-form prin atributul form=. -->
<div class="tablewrap">
<table>
<thead>
<tr>
<th>#</th>
<th>VIN</th>
<th>Nr. Inm.</th>
<th>Data</th>
<th>KM final</th>
<th>Operatie</th>
<th>Stare</th>
<th>Note</th>
<th>Verificat?</th>
<th>Actiuni</th>
</tr>
</thead>
<tbody>
{% for row in rows %}
{% include '_preview_rand.html' %}
{% endfor %}
</tbody>
</table>
</div>
<!-- Bara confirmare (sticky jos) — singurul formular care trimite la RAR -->
<form id="confirm-form"
hx-post="/_import/{{ import_id }}/confirma"
hx-target="#import-section"
hx-swap="outerHTML">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<div class="tablewrap">
<table>
<thead>
<tr>
<th>#</th>
<th>VIN</th>
<th>Nr. Inm.</th>
<th>Data</th>
<th>KM final</th>
<th>Operatie</th>
<th>Stare</th>
<th>Note</th>
<th>Verificat?</th>
</tr>
</thead>
<tbody>
{% for row in rows %}
{%- set res = row.resolved -%}
{%- set status = row.resolved_status -%}
{%- set prestatii = res.get('prestatii') or [] -%}
{%- set op = (prestatii[0].get('cod_prestatie') or prestatii[0].get('cod_op_service', '')) if prestatii else '' -%}
<tr data-status="{{ status }}"
style="{% if status == 'needs_review' %}background:rgba(230,179,74,.04);{% elif status in ('already_sent', 'duplicate_in_file') %}opacity:.65;{% endif %}">
<td class="muted">{{ row.row_index + 1 }}</td>
<td>{{ res.get('vin') or '<span class="muted"></span>' | safe }}</td>
<td>{{ res.get('nr_inmatriculare') or '' }}</td>
<td>{{ res.get('data_prestatie') or '' }}</td>
<td>{{ res.get('odometru_final') or '' }}</td>
<td>{{ op or '<span class="muted"></span>' | safe }}</td>
<td>
<span class="pill s-{{ status }}">{{ status }}</span>
</td>
<td class="muted" style="font-size:12px; white-space:normal; max-width:220px;">
{% if status == 'already_sent' and row.get('already_sent_info') %}
{% set ai = row.already_sent_info %}
deja trimis {{ (ai.get('created_at') or '')[:10] }}
{% if ai.get('id_prezentare') %}(#{{ ai.id_prezentare }}){% endif %}
{% elif status == 'duplicate_in_file' and row.get('duplicate_with') %}
dubla cu randul
{% for idx in row.duplicate_with %}{{ idx + 1 }}{% if not loop.last %}, {% endif %}{% endfor %}
{% elif row.flags %}
{{ row.flags[0] }}
{% elif row.errors %}
{# US-008: arata MOTIVUL (mesajul de validare), nu numele campului #}
{%- for e in row.errors -%}
{%- if e is mapping -%}
{{ e.get('message') or e.get('msg') or (e.values() | list | first) }}
{%- else -%}
{{ e }}
{%- endif -%}
{%- if not loop.last %}; {% endif -%}
{%- endfor -%}
{% endif %}
</td>
<td style="text-align:center;">
{% if status == 'needs_review' %}
<label class="chk" style="min-height:44px; justify-content:center; cursor:pointer;"
title="Bifat inseamna ca ai verificat valorile si le incluzi in trimitere">
<input type="checkbox" name="reviewed_rows" value="{{ row.row_index }}"
onchange="updateN()"
aria-label="Verificat — randul {{ row.row_index + 1 }} (VIN: {{ res.get('vin', '') }})">
verif.
</label>
{% endif %}
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<!-- Bara confirmare (sticky jos) -->
<div class="sticky-bar">
<div style="flex:1; min-width:280px;">
<!-- Banner declarant (D12) — direct deasupra input-ului N -->
@@ -207,7 +162,7 @@
style="max-width:80px;"
aria-describedby="n-hint">
<span id="n-hint" class="muted" style="font-size:12px; margin-left:6px;">
({{ summary.get('ok', 0) }} ok
(<span id="n-hint-ok">{{ summary.get('ok', 0) }}</span> ok
{% if summary.get('needs_review', 0) %}
+ pana la {{ summary.get('needs_review', 0) }} verificate manual
{% endif %})
@@ -241,9 +196,12 @@
{% endif %}
</div>
</div>
</form>
<!-- Contor "gata de trimis" citit din DOM (data-ok), ca OOB swap-ul de la editare
sa actualizeze N fara a re-randa sectiunea (US-002). -->
<span id="preview-ok-count" data-ok="{{ summary.get('ok', 0) }}" hidden></span>
<div style="padding:8px 0 4px;">
<a href="#" class="muted" style="font-size:13px;"
hx-get="/_import/reset" hx-target="#import-section" hx-swap="outerHTML">Incarca alt fisier</a>
@@ -254,18 +212,32 @@
<script>
(function() {
var nOk = {{ summary.get('ok', 0) | int }};
/* D-1.2: un singur sticky bar pe ecran — cat preview-ul de import e activ,
ascunde sectiunea Trimiteri de pe Acasa (se reveleaza la reset/commit din _upload.html). */
var trim = document.getElementById('trimiteri-section');
if (trim) trim.style.display = 'none';
/* Actualizeaza N si bannerul cand se bifeaza needs_review */
/* nOk se citeste din DOM (#preview-ok-count[data-ok]) ca OOB swap-ul de la editare
sa-l poata actualiza fara re-randarea sectiunii (D-3.1/D-3.4). */
function getOk() {
var el = document.getElementById('preview-ok-count');
return el ? parseInt(el.dataset.ok || '0', 10) : 0;
}
/* Actualizeaza N si bannerul cand se bifeaza needs_review SAU cand se editeaza un rand. */
function updateN() {
var checked = document.querySelectorAll('input[name="reviewed_rows"]:checked').length;
var total = nOk + checked;
var total = getOk() + checked;
var inp = document.getElementById('n-confirmat');
var disp = document.getElementById('n-display');
var btn = document.getElementById('confirm-btn');
/* Nu re-activa confirm cat un rand e in editare (mutual-exclusion D-3.2). */
var editing = document.querySelector('tr[data-editing="1"]') !== null;
if (inp) inp.value = total;
if (disp) disp.textContent = total;
if (btn) btn.disabled = (total === 0);
var hintOk = document.getElementById('n-hint-ok');
if (hintOk) hintOk.textContent = getOk();
if (btn) btn.disabled = (total === 0) || editing;
}
/* Filtrare randuri dupa stare */
@@ -281,15 +253,12 @@
});
}
/* Expune functiile global pentru onclick inline */
/* Expune functiile global pentru onclick/hx-on inline si OOB swap */
window.updateN = updateN;
window.filterRows = filterRows;
/* Filtru implicit "Toate" activ la incarcare */
filterRows('all');
/* Focus pe campul N la deschidere (a11y — D12) */
var ni = document.getElementById('n-confirmat');
if (ni) { ni.focus(); ni.select(); }
updateN();
})();
</script>

View File

@@ -0,0 +1,168 @@
{#
_preview_rand.html — un singur rand de preview import (US-002, 3.6).
Doua moduri:
- display (editing falsy): <tr> normal + buton "Editeaza" pe coloana de actiuni.
- edit (editing truthy): <tr> cu un singur <td colspan> ce contine un FORM PROPRIU
(NU #confirm-form) cu grila responsiva refolosita din _trimitere_detaliu.html.
Swap pe RAND (hx-target pe #preview-row-N, outerHTML), NU pe #import-section (D-3.1).
La save, optional OOB pe rezumat + contor "gata de trimis" (include_oob).
#}
{%- set res = row.resolved -%}
{%- set status = row.resolved_status -%}
{%- set prestatii = res.get('prestatii') or [] -%}
{%- set op = (prestatii[0].get('cod_prestatie') or prestatii[0].get('cod_op_service', '')) if prestatii else '' -%}
{% if editing %}
{%- set err_map = {} -%}
{%- for e in row.errors -%}{%- if e is mapping and e.get('field') -%}{%- set _ = err_map.update({e.field: (e.get('message') or e.get('msg'))}) -%}{%- endif -%}{%- endfor -%}
<tr id="preview-row-{{ row.row_index }}" data-status="{{ status }}" data-editing="1">
<td colspan="10" style="background:rgba(91,141,239,.06);">
<form class="rand-editare"
hx-post="/_import/{{ import_id }}/rand/{{ row.row_index }}/editeaza"
hx-target="#preview-row-{{ row.row_index }}"
hx-swap="outerHTML"
hx-indicator="#rand-spinner-{{ row.row_index }}"
hx-disabled-elt="find button"
hx-on::response-error="this.querySelector('.rand-eroare-banner').style.display='block';">
<input type="hidden" name="csrf_token" value="{{ csrf_token or '' }}">
<div style="display:flex; align-items:center; gap:8px; margin-bottom:8px;">
<strong style="font-size:13px;">Editare rand {{ row.row_index + 1 }}</strong>
<span class="pill s-{{ status }}" style="font-size:11px;">{{ status }}</span>
</div>
{% if message %}
<div class="flash" style="border-color:var(--err); background:#241a1a; margin-bottom:10px;"
role="alert">{{ message }}</div>
{% endif %}
<div class="rand-eroare-banner" role="alert"
style="display:none; margin-bottom:10px; padding:8px 12px; border:1px solid var(--err);
background:#241a1a; border-radius:6px; font-size:13px;">
Salvarea nu a reusit (retea / sesiune). Valorile introduse sunt pastrate — reincearca.
</div>
{% macro camp(nume, eticheta, valoare, tip='text') %}
<div>
<label for="e-{{ row.row_index }}-{{ nume }}" class="muted" style="font-size:12px; display:block;">{{ eticheta }}</label>
<input id="e-{{ row.row_index }}-{{ nume }}" type="{{ tip }}" name="{{ nume }}" value="{{ valoare or '' }}"
style="width:100%; {% if err_map.get(nume) %}border-color:var(--err);{% endif %}"
aria-label="{{ eticheta }} — randul {{ row.row_index + 1 }} (VIN: {{ res.get('vin') or '' }})"
{% if err_map.get(nume) %}aria-invalid="true"{% endif %}>
{% if err_map.get(nume) %}
<div class="s-error" style="font-size:12px; margin-top:2px;">{{ err_map.get(nume) }}</div>
{% endif %}
</div>
{% endmacro %}
<div style="display:grid; grid-template-columns:repeat(auto-fit, minmax(200px, 1fr)); gap:10px 16px;">
{{ camp('nr_inmatriculare', 'Numar inmatriculare', res.get('nr_inmatriculare')) }}
{{ camp('vin', 'VIN (serie sasiu)', res.get('vin')) }}
{{ camp('data_prestatie', 'Data prestatie (YYYY-MM-DD)', res.get('data_prestatie')) }}
{{ camp('odometru_final', 'Odometru final', res.get('odometru_final')) }}
{{ camp('odometru_initial', 'Odometru initial (daca e cerut)', res.get('odometru_initial')) }}
</div>
<div style="margin-top:10px; display:flex; gap:8px; align-items:center; flex-wrap:wrap;">
<button type="submit" style="min-height:44px; padding:8px 18px;">Salveaza</button>
<button type="button" style="min-height:44px; padding:8px 18px;
background:var(--card); color:var(--muted); border-color:var(--line);"
hx-get="/_import/{{ import_id }}/rand/{{ row.row_index }}"
hx-target="#preview-row-{{ row.row_index }}" hx-swap="outerHTML">Anuleaza</button>
<span id="rand-spinner-{{ row.row_index }}" class="htmx-indicator muted" style="font-size:13px;">
se salveaza…
</span>
</div>
</form>
</td>
</tr>
<script>
(function() {
/* Mutual-exclusion (D-3.2/3.6): cat un rand e in editare, dezactiveaza confirm + alte Editeaza. */
var btn = document.getElementById('confirm-btn');
if (btn) { btn.disabled = true; btn.title = 'Termina editarea randului inainte de a trimite.'; }
document.querySelectorAll('.btn-editeaza').forEach(function(b) { b.disabled = true; });
})();
</script>
{% else %}
<tr id="preview-row-{{ row.row_index }}" data-status="{{ status }}"
style="{% if status == 'needs_review' %}background:rgba(230,179,74,.04);{% elif status in ('already_sent', 'duplicate_in_file') %}opacity:.65;{% endif %}">
<td class="muted">{{ row.row_index + 1 }}</td>
<td>{{ res.get('vin') or '<span class="muted"></span>' | safe }}</td>
<td>{{ res.get('nr_inmatriculare') or '' }}</td>
<td>{{ res.get('data_prestatie') or '' }}</td>
<td>{{ res.get('odometru_final') or '' }}</td>
<td>{{ op or '<span class="muted"></span>' | safe }}</td>
<td><span class="pill s-{{ status }}">{{ status }}</span></td>
<td class="muted" style="font-size:12px; white-space:normal; max-width:220px;">
{% if status == 'already_sent' and row.get('already_sent_info') %}
{% set ai = row.already_sent_info %}
deja trimis {{ (ai.get('created_at') or '')[:10] }}
{% if ai.get('id_prezentare') %}(#{{ ai.id_prezentare }}){% endif %}
{% elif status == 'duplicate_in_file' and row.get('duplicate_with') %}
dubla cu randul
{% for idx in row.duplicate_with %}{{ idx + 1 }}{% if not loop.last %}, {% endif %}{% endfor %}
{% elif row.flags %}
{{ row.flags[0] }}
{% elif row.errors %}
{%- for e in row.errors -%}
{%- if e is mapping -%}
{{ e.get('message') or e.get('msg') or (e.values() | list | first) }}
{%- else -%}
{{ e }}
{%- endif -%}
{%- if not loop.last %}; {% endif -%}
{%- endfor -%}
{% endif %}
</td>
<td style="text-align:center;">
{% if status == 'needs_review' %}
<label class="chk" style="min-height:44px; justify-content:center; cursor:pointer;"
title="Bifat inseamna ca ai verificat valorile si le incluzi in trimitere">
<input type="checkbox" form="confirm-form" name="reviewed_rows" value="{{ row.row_index }}"
onchange="window.updateN && window.updateN()"
aria-label="Verificat — randul {{ row.row_index + 1 }} (VIN: {{ res.get('vin', '') }})">
verif.
</label>
{% endif %}
</td>
<td style="text-align:center;">
{% if status not in ('already_sent', 'duplicate_in_file') %}
<button type="button" class="btn-editeaza"
style="min-height:44px; padding:6px 14px; font-size:13px;
background:transparent; border-color:var(--line); color:var(--ink);"
hx-get="/_import/{{ import_id }}/rand/{{ row.row_index }}/editare"
hx-target="#preview-row-{{ row.row_index }}" hx-swap="outerHTML"
aria-label="Editeaza randul {{ row.row_index + 1 }} (VIN: {{ res.get('vin', '') }})">
Editeaza
</button>
{% endif %}
</td>
</tr>
{% if include_oob %}
{# OOB: actualizeaza rezumatul si contorul "gata de trimis" dupa save, fara a re-randa sectiunea (D-3.1). #}
{% set status_labels = [
('ok','gata de trimis'), ('needs_review','verifica valori'), ('needs_mapping','fara cod RAR'),
('needs_data','date lipsa'), ('already_sent','deja trimis'), ('duplicate_in_file','dublicat in fisier')] %}
<div id="preview-rezumat" hx-swap-oob="true"
style="display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px;">
{% for status_key, label in status_labels %}
{%- set cnt = summary.get(status_key, 0) -%}
{% if cnt > 0 %}<span class="pill s-{{ status_key }}">{{ cnt }} {{ label }}</span>{% endif %}
{% endfor %}
</div>
<span id="preview-ok-count" hx-swap-oob="true" data-ok="{{ summary.get('ok', 0) }}" hidden></span>
<script>
(function() {
/* Editare incheiata: re-activeaza confirm + butoanele Editeaza, recalculeaza N.
Defer pe tick-ul urmator: la momentul rularii scriptului, swap-ul randului poate
sa nu se fi asezat inca, deci tr[data-editing] ar fi inca prezent si updateN ar
lasa confirm dezactivat (editing=true). Dupa setTimeout(0) randul e in mod display. */
setTimeout(function() {
document.querySelectorAll('.btn-editeaza').forEach(function(b) { b.disabled = false; });
var btn = document.getElementById('confirm-btn');
if (btn) btn.title = '';
if (window.updateN) window.updateN();
}, 0);
})();
</script>
{% endif %}
{% endif %}

View File

@@ -1,7 +1,8 @@
<div id="import-section">
{% set pas = 1 %}{% include '_stepper.html' %}
<div class="card">
<h2 style="font-size:15px; margin:0 0 12px;">Import fisier (xlsx / csv)</h2>
{# US-004 (3.6): bara de upload accentuata (border de accent) ca sa ramana punctul
de intrare evident chiar cu tabelul Trimiteri lung dedesubt (D-1.1/D-5.2). #}
<div class="card" style="border-color:var(--accent);">
{% if message %}
<div class="flash" style="margin-bottom:12px;">{{ message }}</div>
@@ -40,6 +41,26 @@
</div>
{% endif %}
{% if are_trimiteri and not sheets %}
{# === Bara slim (returning user): eticheta + buton + zona de trage, pe un rand === #}
<div class="drop-zone" id="drop-zone"
role="region" aria-label="Zona de incarcare fisier"
style="display:flex; align-items:center; gap:14px; flex-wrap:wrap;
padding:12px 16px; text-align:left;">
<strong style="font-size:14px;">Importa:</strong>
<input id="file-input" type="file" name="file" accept=".xlsx,.xls,.csv"
style="display:none;" aria-label="Selecteaza fisier xlsx sau csv">
<button type="button" id="upload-btn"
style="min-height:44px; padding:10px 20px; font-size:14px;">
Alege fisier (xlsx/csv)
</button>
<span class="muted" style="font-size:13px;">sau trage aici</span>
<span class="muted" style="font-size:12px; margin-left:auto;">
NU se trimite nimic la RAR pana confirmi.
</span>
</div>
{% else %}
{# === Hero first-run (sau re-upload multi-foaie): pastreaza copy-ul de bun venit === #}
<div class="drop-zone" id="drop-zone"
role="region" aria-label="Zona de incarcare fisier">
{% if not sheets %}
@@ -55,13 +76,14 @@
style="display:none;" aria-label="Selecteaza fisier xlsx sau csv">
<button type="button" id="upload-btn"
style="min-height:44px; padding:10px 24px; font-size:14px;">
Alege fisier
Alege fisier (xlsx/csv)
</button>
</div>
<p class="muted" style="margin:8px 0 0; font-size:12px;">
NU se trimite nimic la RAR pana confirmi explicit.
</p>
{% endif %}
<span id="upload-spinner" class="htmx-indicator muted"
style="font-size:13px; margin-top:6px; display:inline;">
@@ -77,6 +99,17 @@
var fi = document.getElementById('file-input');
var dz = document.getElementById('drop-zone');
var frm = document.getElementById('upload-form');
/* US-003 (3.6): un singur sticky bar pe ecran — cand re-apare zona de upload
(reset sau dupa commit), sectiunea Trimiteri redevine vizibila. */
var trim = document.getElementById('trimiteri-section');
if (trim) trim.style.display = '';
/* Dupa un commit reusit (mesaj de succes), du utilizatorul la Trimiteri. */
{% if message and not error %}
if (trim) trim.scrollIntoView({behavior: 'smooth', block: 'start'});
{% endif %}
if (!btn || !fi || !frm) return;
btn.addEventListener('click', function() { fi.click(); });

View File

@@ -5,6 +5,14 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{% block title %}Gateway RAR AUTOPASS{% endblock %}</title>
<script src="/static/htmx.min.js"></script>
<script>
// US-002 (3.6): raspunsurile de editare-rand contin un <tr> (swap pe rand) PLUS
// elemente OOB non-rand (#preview-rezumat, #preview-ok-count). Fara fragmente-template,
// htmx parseaza raspunsul care incepe cu <tr> in context de tabel (<table><tbody>) si
// "foster-parent"-eaza div/span-urile OOB afara din fragment -> swapError + contoare pierdute.
// useTemplateFragments parseaza tot intr-un <template>, pastrand rand + OOB impreuna.
htmx.config.useTemplateFragments = true;
</script>
<style>
:root { --bg:#0f1115; --card:#181b22; --ink:#e6e9ef; --muted:#8b93a7; --line:#262b36;
--ok:#3ecf8e; --warn:#e6b34a; --err:#e5605e; --accent:#5b8def; }

View File

@@ -20,9 +20,10 @@
<!-- Tab-bar: navigare intre sectiuni -->
<div role="tablist" class="tab-bar" aria-label="Sectiuni dashboard">
{# US-003 (3.6): tab-ul "Trimiteri" (coada) a fost eliminat — Trimiterile traiesc
ca sectiune permanenta pe Acasa. Raman: Acasa·Mapari·Cont·Nomenclator. #}
{% set tabs = [
("acasa", "Acasa", "tab-acasa"),
("coada", "Trimiteri", "tab-coada"),
("mapari", "Mapari", "tab-mapari"),
("cont", "Cont", "tab-cont"),
("nomenclator", "Nomenclator", "tab-nomenclator")