Open the entrée/versement drill-down in a modal instead of in place

Replacing the main table's rows with the filtered group made the browser
clamp scrollTop to 0 the moment the drill-down shrank the visible content,
so closing it never returned to where the user had been scrolled. A modal
overlay leaves the main table (and its scroll position) untouched entirely.
This commit is contained in:
2026-09-05 13:16:44 +02:00
parent 0f33d57ec0
commit 9ec0aa4699
3 changed files with 151 additions and 33 deletions
@@ -409,11 +409,6 @@
return [...entrees, ...sorties];
},
filteredRows() {
// Drill-down mode: the connected entrée/sortie group, ignoring
// the other filters -- clicking the badge again clears it.
if (this.filterEntreeId) {
return this.filterEntreeGroup;
}
return this.rows.filter((r) => {
if (this.filterCompte && r.parCompte[this.filterCompte] === undefined) return false;
if (this.filterClient && r.client !== this.filterClient) return false;
@@ -423,22 +418,21 @@
return true;
});
},
// Footer totals while drilled down into one entrée + its linked
// sorties (see filteredRows' drill-down branch above): the whole
// point of this view is "does this entrée balance against what was
// paid out", so the footer should answer exactly that instead of
// the current year's totals -- and it can be computed locally
// (unlike the per-year figures, this handful of rows is already
// fully loaded), no server round-trip needed. Same shape as
// /lignes/api/totaux so the template can render either the same
// way.
// Totals for the entrée + linked sorties drill-down modal (see
// filterEntreeGroup above): the whole point of that view is "does
// this entrée balance against what was paid out", so its own footer
// answers exactly that instead of the current year's totals -- and
// it can be computed locally (unlike the per-year figures, this
// handful of rows is already fully loaded), no server round-trip
// needed. Same shape as /lignes/api/totaux so the template can
// render either the same way.
drilldownTotals() {
if (!this.filterEntreeId) return null;
let montantHt = 0;
let montantTtc = 0;
let ecart = 0;
const parCompte = {};
for (const r of this.filteredRows) {
for (const r of this.filterEntreeGroup) {
montantHt += r.montant_ht || 0;
montantTtc += r.montant_ttc || 0;
ecart += r.ecart || 0;
@@ -454,13 +448,6 @@
par_compte: Object.fromEntries(Object.entries(parCompte).map(([c, v]) => [c, round(v)])),
};
},
// What the footer actually renders -- the drill-down's own totals
// while active, otherwise the current year's (see
// detectCurrentYear()/loadCurrentYearTotals()). Switches back
// automatically the moment filterEntreeId clears.
footerTotals() {
return this.filterEntreeId ? this.drilldownTotals : this.currentYearTotals;
},
groupedRows() {
const list = this.filteredRows;
if (this.groupBy === 'none') return list;
@@ -621,9 +608,16 @@
progress: { type: 'throbber' },
}).execute();
},
// Opens/closes the entrée + linked sorties drill-down modal -- a
// separate overlay (see the template), not a filter applied to the
// main table, so opening/closing it never touches the main table's
// scroll position.
toggleEntreeFilter(id) {
this.filterEntreeId = this.filterEntreeId === id ? null : id;
},
closeDrilldown() {
this.filterEntreeId = null;
},
startEditType(item) {
this.typeUpdateError = null;
this.editingTypeId = item.id;