Surface signalement (flag) tags on the per-compte dashboard

Fetches field_flag alongside the existing entrée/versement data (same
JSON:API include list, same buildRows() shape as home.js's flags/
hasFlag). Two changes:

- Rows already shown in the reste-à-verser/sur-versé/non-liés tables
  get the same amber left-edge accent + tag badges as /lignes when
  they're also flagged.
- New "Lignes signalées" section lists every flagged entrée/versement
  for the selected compte, including ones that don't appear in any of
  the other tables -- a fully-settled line can still carry a flag for
  an unrelated reason (e.g. "client injoignable"), which none of the
  reconciliation-based tables would otherwise surface.

Verified live against an isolated test node plus two real flagged lines
already present in production data (client had already started using
the /lignes signalement feature) -- both the section and the inline
badges render correctly.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
2026-09-06 16:43:44 +02:00
co-authored by Claude Sonnet 5
parent 3f8767b4ef
commit 9ce5d87ace
3 changed files with 62 additions and 7 deletions
@@ -52,10 +52,10 @@
<tr><th>Date</th><th>Client</th><th>Libellé</th><th>Attribué</th><th>Déjà versé</th><th>Reste à verser</th></tr>
</thead>
<tbody>
<tr v-for="r in resteAVerserPositif" :key="r.entree.id">
<tr v-for="r in resteAVerserPositif" :key="r.entree.id" :class="{'figli-flag-row': r.entree.hasFlag}">
<td>{{ formatDate(r.entree.date) }}</td>
<td><a :href="ligneHref(r.entree.client)">{{ r.entree.client || '—' }}</a></td>
<td>{{ r.entree.libelle || '—' }}</td>
<td>{{ r.entree.libelle || '—' }}<span v-for="f in r.entree.flags" :key="f" class="figli-flag-badge">{{ f }}</span></td>
<td>{{ formatEur(r.montantAttribue) }}</td>
<td>{{ formatEur(r.dejaVerse) }}</td>
<td class="is-negative">{{ formatEur(r.residual) }}</td>
@@ -76,10 +76,10 @@
<tr><th>Date</th><th>Client</th><th>Libellé</th><th>Attribué</th><th>Versé</th><th>Sur-versé</th></tr>
</thead>
<tbody>
<tr v-for="r in surVerseRows" :key="r.entree.id">
<tr v-for="r in surVerseRows" :key="r.entree.id" :class="{'figli-flag-row': r.entree.hasFlag}">
<td>{{ formatDate(r.entree.date) }}</td>
<td><a :href="ligneHref(r.entree.client)">{{ r.entree.client || '—' }}</a></td>
<td>{{ r.entree.libelle || '—' }}</td>
<td>{{ r.entree.libelle || '—' }}<span v-for="f in r.entree.flags" :key="f" class="figli-flag-badge">{{ f }}</span></td>
<td>{{ formatEur(r.montantAttribue) }}</td>
<td>{{ formatEur(r.dejaVerse) }}</td>
<td class="is-negative">{{ formatEur(-r.residual) }}</td>
@@ -96,16 +96,36 @@
<tr><th>Date</th><th>Client</th><th>Libellé</th><th>Montant</th></tr>
</thead>
<tbody>
<tr v-for="r in versementsNonLies" :key="r.id">
<tr v-for="r in versementsNonLies" :key="r.id" :class="{'figli-flag-row': r.hasFlag}">
<td>{{ formatDate(r.date) }}</td>
<td><a :href="ligneHref(r.client)">{{ r.client || '—' }}</a></td>
<td>{{ r.libelle || '—' }}</td>
<td>{{ r.libelle || '—' }}<span v-for="f in r.flags" :key="f" class="figli-flag-badge">{{ f }}</span></td>
<td class="is-negative">{{ formatEur(r.parCompte[selectedCompte]) }}</td>
</tr>
</tbody>
</table>
</section>
<section class="figli-chart-section" v-if="lignesSignalees.length">
<h2>Lignes signalées</h2>
<p class="figli-note">Entrées et versements de {{ selectedCompte }} portant un signalement (voir la colonne "Signalement" dans le grand livre) -- indépendant du solde, une ligne déjà réglée peut quand même être signalée pour une autre raison.</p>
<table class="figli-recon-table">
<thead>
<tr><th>Date</th><th>Type</th><th>Client</th><th>Libellé</th><th>Signalement</th><th>Montant</th></tr>
</thead>
<tbody>
<tr v-for="r in lignesSignalees" :key="r.id" class="figli-flag-row">
<td>{{ formatDate(r.date) }}</td>
<td>{{ r.type === 'entree' ? 'Entrée' : 'Versement' }}</td>
<td><a :href="ligneHref(r.client)">{{ r.client || '—' }}</a></td>
<td>{{ r.libelle || '—' }}</td>
<td><span v-for="f in r.flags" :key="f" class="figli-flag-badge">{{ f }}</span></td>
<td :class="r.parCompte[selectedCompte] < 0 ? 'is-negative' : ''">{{ formatEur(r.parCompte[selectedCompte]) }}</td>
</tr>
</tbody>
</table>
</section>
<section class="figli-chart-section">
<h2>Entrées vs versements par année</h2>
<p class="figli-note">Part de {{ selectedCompte }} dans les entrées client (vert) et ses versements (rouge), année par année.</p>