bachir/drupal-figli-compta
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Simplify /lignes row indicators: drop redundant link button and écart outline

Browse Source 
- Remove the left-side link button (actions-col) -- the link status
  badge already does the same thing (view linked entrées, or open the
  link form when unlinked), so the button was pure duplication.
- Remove the red row outline on écart lines -- the Écart column itself
  (bold red text) already flags it, no need for a second row-level cue.
- Hide the link status badge specifically on "Hébergement" lines (both
  the main table and the drill-down modal) -- reconciliation math is
  untouched (hébergement sorties still count toward other rows' totals),
  this only suppresses the badge on hébergement's own row.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
bachir
2026-09-06 15:00:29 +02:00
co-authored by Claude Sonnet 5
parent 34b1082991
commit eda79e75a3
2 changed files with 13 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/modules/custom/figli_compta_ledger/css/home.css
+5 -26
View File
@@ -267,29 +267,14 @@ html.gin--dark-mode #figli-home-app {
font-weight: 700;
}
/* Error rows: a thin red outline around the row, not a background fill --
easier to read, doesn't fight with dark mode. */
#figli-home-app tr.figli-error-row td {
border-top: 1px solid var(--figli-error);
border-bottom: 1px solid var(--figli-error);
}
#figli-home-app tr.figli-error-row td:first-child {
border-left: 1px solid var(--figli-error);
}
#figli-home-app tr.figli-error-row td:last-child {
border-right: 1px solid var(--figli-error);
}
/* Écart is called out by the Écart column itself (bold red, see
.figli-ecart below) -- no separate row-level treatment needed. */
#figli-home-app td.figli-ecart {
color: var(--figli-error);
font-weight: 700;
}
/* Signalé rows: a thick amber accent bar on the left edge, deliberately
a different technique from the error row's thin all-around border
above (box-shadow, not border) -- so a row that's both in écart *and*
signalée shows both indicators at once instead of one overwriting the
other's border-left. */
/* Signalé rows: a thick amber accent bar on the left edge. */
#figli-home-app tr.figli-flag-row td:first-child {
box-shadow: inset 4px 0 0 var(--figli-warning);
}
@@ -403,8 +388,7 @@ html.gin--dark-mode #figli-home-app {
table cell breaks the table's own column-width calculation (observed:
a ~55px gap opening up between this column and the next, and the
buttons rendering outside their cell's actual boundary). */
#figli-home-app .figli-edit-btn,
#figli-home-app .figli-link-btn {
#figli-home-app .figli-edit-btn {
display: inline-flex;
align-items: center;
justify-content: center;
@@ -419,17 +403,12 @@ html.gin--dark-mode #figli-home-app {
vertical-align: middle;
}
#figli-home-app .figli-edit-btn:hover,
#figli-home-app .figli-link-btn:hover {
#figli-home-app .figli-edit-btn:hover {
background: var(--figli-bg-alt);
border-color: var(--figli-border);
color: var(--figli-text);
}
#figli-home-app .figli-link-btn.is-linked {
color: #3b6fe0;
}
/* Reconciliation badge on entrée rows: répartition (money owed) vs the
combined répartition of every linked sortie (money actually paid out). */
#figli-home-app .figli-recon-badge {
web/modules/custom/figli_compta_ledger/templates/figli-compta-home.html.twig
+8 -24
View File
@@ -106,7 +106,6 @@
<table ref="tableEl" @mouseover="onCellHover" @mouseleave="clearColHover">
<thead>
<tr>
<th class="actions-col"></th>
<th class="actions-col"></th>
<th>Date</th>
<th>Client</th>
@@ -122,30 +121,15 @@
</thead>
<tbody>
<tr ref="topSentinel" class="figli-sentinel-row">
<td :colspan="8 + allComptes.length + 3">
<td :colspan="7 + allComptes.length + 3">
<span v-if="loadingOlder">Chargement des mois précédents…</span>
</td>
</tr>
<template v-for="item in groupedRows" :key="item.key">
<tr v-if="item.isGroup" class="figli-group-row" :data-year="item.year">
<td :colspan="8 + allComptes.length + 3">{{ item.label }} <span class="figli-note">({{ item.count }} lignes)</span></td>
<td :colspan="7 + allComptes.length + 3">{{ item.label }} <span class="figli-note">({{ item.count }} lignes)</span></td>
</tr>
<tr v-else :class="{'figli-error-row': item.hasError, 'figli-flag-row': item.hasFlag}" :data-year="item.date ? item.date.slice(0, 4) : null">
<td class="actions-col">
<button
v-if="item.linkable"
type="button"
class="figli-link-btn"
:class="{'is-linked': item.entreeLieeIds.length}"
:title="item.entreeLieeIds.length ? 'Lié à : ' + item.entreeLieeLabels.join(', ') : 'Lier à une entrée client'"
@click="openLinkForm(item.nid)"
>
<svg viewBox="0 0 20 20" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
<path d="M8 12a3 3 0 0 0 4.24 0l2-2a3 3 0 0 0-4.24-4.24l-1 1" />
<path d="M12 8a3 3 0 0 0-4.24 0l-2 2a3 3 0 0 0 4.24 4.24l1-1" />
</svg>
</button>
</td>
<tr v-else :class="{'figli-flag-row': item.hasFlag}" :data-year="item.date ? item.date.slice(0, 4) : null">
<td class="actions-col">
<button type="button" class="figli-edit-btn" title="Modifier" @click="openEditForm(item.nid)">
<svg viewBox="0 0 20 20" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
@@ -226,7 +210,7 @@
:title="'Écart avec la clôture calculée de ' + (item.date.slice(0, 4) - 1) + ' : ' + ouvertureEcart(item).detail"
>⚠ écart clôture {{ item.date.slice(0, 4) - 1 }} ({{ ouvertureEcart(item).comptes }} compte{{ ouvertureEcart(item).comptes > 1 ? 's' : '' }})</span>
<span
v-if="linkStatus(item)"
v-if="linkStatus(item) && item.type !== 'hebergement'"
class="figli-recon-badge is-clickable"
:class="linkStatusClasses(linkStatus(item).kind)"
:title="item.entreeLieeIds.length ? linkStatus(item).detail + ' -- cliquer pour voir la ou les entrées liées' : linkStatus(item).detail + ' -- cliquer pour lier une entrée client'"
@@ -258,7 +242,7 @@
</tr>
</template>
<tr ref="bottomSentinel" class="figli-sentinel-row">
<td :colspan="8 + allComptes.length + 3">
<td :colspan="7 + allComptes.length + 3">
<span v-if="loadingNewer">Chargement des mois suivants…</span>
</td>
</tr>
@@ -267,7 +251,7 @@
<tr class="figli-totals-row">
<td class="actions-col"></td>
<td class="actions-col"></td>
<td colspan="6">
<td colspan="5">
Solde {{ currentYear || '…' }} (créditeur / débiteur)
<span v-if="currentYearLoading" class="figli-note">chargement…</span>
</td>
@@ -303,7 +287,7 @@
</tr>
</thead>
<tbody>
<tr v-for="item in filterEntreeGroup" :key="item.id" :class="{'figli-error-row': item.hasError}">
<tr v-for="item in filterEntreeGroup" :key="item.id">
<td class="actions-col">
<button type="button" class="figli-edit-btn" title="Modifier" @click="openEditForm(item.nid)">
<svg viewBox="0 0 20 20" width="14" height="14" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
@@ -323,7 +307,7 @@
:class="{'is-anomalie': reconciliationByEntree.get(item.id).surVerse > 0, 'is-reste': reconciliationByEntree.get(item.id).resteAVerser > 0}"
>{{ reconciliationByEntree.get(item.id).count }} sortie{{ reconciliationByEntree.get(item.id).count > 1 ? 's' : '' }} liée{{ reconciliationByEntree.get(item.id).count > 1 ? 's' : '' }}<template v-if="reconciliationByEntree.get(item.id).resteAVerser > 0"> · reste {{ formatEur(reconciliationByEntree.get(item.id).resteAVerser) }}</template><template v-if="reconciliationByEntree.get(item.id).surVerse > 0"> · sur-versé {{ formatEur(reconciliationByEntree.get(item.id).surVerse) }}</template></span>
<span
v-if="linkStatus(item)"
v-if="linkStatus(item) && item.type !== 'hebergement'"
class="figli-recon-badge"
:class="linkStatusClasses(linkStatus(item).kind)"
>{{ linkStatus(item).kind === 'ok' ? '' : '⚠ ' }}{{ linkStatusLabel(linkStatus(item)) }}</span>