Mise en place de la feature de gestion des Frais
This commit is contained in:
ocroguennec committed
1 parent
9ea078302d
commit
0334a63139
27 files changed
+2401
-117
No files matched your search
@@ -462,7 +462,33 @@ export default function DrillCellPanel({
|
||||
if (c.key === 'interets') v = netMode ? r.interets_nets : r.interets_bruts;
|
||||
else if (c.key === 'capital') v = r.capital ?? 0;
|
||||
else v = r.cashback ?? 0;
|
||||
return <td key={c.key} style={{ ...tdStyle, ...numStyle }}>{fmtEUR(v)}</td>;
|
||||
// Icône uniquement si le frais réduit réellement ce montant (mode
|
||||
// 'remboursement', par défaut) — cf. RembFormModal.jsx, Étape 5 bis (01/09/26).
|
||||
const showFraisIcon = c.key === 'interets' && !netMode && !!r.frais_ttc && (!r.frais_mode_reglement || r.frais_mode_reglement === 'remboursement');
|
||||
return (
|
||||
<td key={c.key} style={{ ...tdStyle, ...numStyle }}>
|
||||
{fmtEUR(v)}
|
||||
{showFraisIcon && (
|
||||
<span
|
||||
className="cell-tooltip"
|
||||
data-tooltip={
|
||||
`Intérêts bruts avant frais : ${fmtEUR(r.interets_bruts)}\n` +
|
||||
`Frais de distribution : -${fmtEUR(r.frais_ttc)}\n` +
|
||||
`Base après frais (avant prélèvements) : ${fmtEUR(round2(r.interets_bruts - r.frais_ttc))}\n` +
|
||||
`Prélèv. sociaux : ${fmtEUR(r.prelev_sociaux)}\n` +
|
||||
`Impôt sur le revenu : ${fmtEUR(r.prelev_forfaitaire)}\n` +
|
||||
`Montant net reçu : ${fmtEUR(r.net_recu)}`
|
||||
}
|
||||
style={{ marginLeft: 5, color: 'var(--warning, #b45309)', verticalAlign: 'middle' }}>
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
||||
<circle cx="12" cy="12" r="10" />
|
||||
<line x1="12" y1="16" x2="12" y2="12" />
|
||||
<line x1="12" y1="8" x2="12.01" y2="8" />
|
||||
</svg>
|
||||
</span>
|
||||
)}
|
||||
</td>
|
||||
);
|
||||
})}
|
||||
<td style={{ ...tdStyle, ...numStyle, fontWeight: 600 }}>{fmtEUR(recuRowValue(r))}</td>
|
||||
</tr>
|
||||
|
||||
@@ -0,0 +1,254 @@
|
||||
import { useMemo, useState, useRef, useCallback } from 'react';
|
||||
import { FRAIS_CATEGORIE_LABELS } from './MouvementsShared.jsx';
|
||||
|
||||
/* ── Palette ────────────────────────────────────────────────── */
|
||||
const PALETTE = [
|
||||
'#e8547a', '#9333ea', '#0d9488', '#f59e0b',
|
||||
'#3b82f6', '#10b981', '#f97316', '#06b6d4',
|
||||
'#a855f7', '#84cc16', '#ec4899', '#14b8a6',
|
||||
];
|
||||
|
||||
/* ── Algorithme treemap (binary split équilibré) ─────────────── */
|
||||
function buildTreemap(items, x, y, w, h) {
|
||||
if (!items.length) return [];
|
||||
if (items.length === 1) return [{ ...items[0], x, y, w, h }];
|
||||
|
||||
const total = items.reduce((s, i) => s + i.value, 0);
|
||||
let best = 1, bestDiff = Infinity, acc = 0;
|
||||
for (let i = 0; i < items.length - 1; i++) {
|
||||
acc += items[i].value;
|
||||
const diff = Math.abs(acc - (total - acc));
|
||||
if (diff < bestDiff) { bestDiff = diff; best = i + 1; }
|
||||
}
|
||||
|
||||
const g1 = items.slice(0, best);
|
||||
const g2 = items.slice(best);
|
||||
const r1 = g1.reduce((s, i) => s + i.value, 0) / total;
|
||||
|
||||
if (w >= h) {
|
||||
const w1 = w * r1;
|
||||
return [...buildTreemap(g1, x, y, w1, h), ...buildTreemap(g2, x + w1, y, w - w1, h)];
|
||||
} else {
|
||||
const h1 = h * r1;
|
||||
return [...buildTreemap(g1, x, y, w, h1), ...buildTreemap(g2, x, y + h1, w, h - h1)];
|
||||
}
|
||||
}
|
||||
|
||||
function fmtAmount(v) {
|
||||
return Math.round(v).toLocaleString('fr-FR') + ' €';
|
||||
}
|
||||
|
||||
function wrapText(text, maxWidth, fontSize) {
|
||||
const charW = fontSize * 0.58;
|
||||
const maxChars = Math.max(1, Math.floor(maxWidth / charW));
|
||||
const words = text.split(' ');
|
||||
const lines = [];
|
||||
let current = '';
|
||||
for (const word of words) {
|
||||
const candidate = current ? current + ' ' + word : word;
|
||||
if (candidate.length <= maxChars) {
|
||||
current = candidate;
|
||||
} else {
|
||||
if (current) lines.push(current);
|
||||
current = word.length > maxChars ? word.slice(0, maxChars - 1) + '…' : word;
|
||||
}
|
||||
}
|
||||
if (current) lines.push(current);
|
||||
return lines.slice(0, 3);
|
||||
}
|
||||
|
||||
/* ── Composant ──────────────────────────────────────────────── */
|
||||
export default function FraisDistributionChart({ rows }) {
|
||||
const [hoveredIdx, setHoveredIdx] = useState(null);
|
||||
const [tooltip, setTooltip] = useState(null);
|
||||
const svgRef = useRef(null);
|
||||
const wrapRef = useRef(null);
|
||||
|
||||
/* Frais cumulés par catégorie */
|
||||
const data = useMemo(() => {
|
||||
if (!rows?.length) return [];
|
||||
const byCat = {};
|
||||
for (const r of rows) {
|
||||
const key = FRAIS_CATEGORIE_LABELS[r.categorie] || r.categorie || 'Autre';
|
||||
const val = r.montant || 0;
|
||||
byCat[key] = (byCat[key] || 0) + val;
|
||||
}
|
||||
return Object.entries(byCat)
|
||||
.filter(([, v]) => v > 0)
|
||||
.sort(([, a], [, b]) => b - a)
|
||||
.map(([name, value], i) => ({ name, value, color: PALETTE[i % PALETTE.length] }));
|
||||
}, [rows]);
|
||||
|
||||
const total = data.reduce((s, i) => s + i.value, 0);
|
||||
const W = 440, H = 290, GAP = 3;
|
||||
const cells = useMemo(() => buildTreemap(data, 0, 0, W, H), [data]);
|
||||
|
||||
const handleMouseMove = useCallback((e, cell, idx) => {
|
||||
if (!wrapRef.current) return;
|
||||
const wrapRect = wrapRef.current.getBoundingClientRect();
|
||||
setHoveredIdx(idx);
|
||||
setTooltip({ x: e.clientX - wrapRect.left, y: e.clientY - wrapRect.top, cell });
|
||||
}, []);
|
||||
|
||||
const handleMouseLeave = useCallback(() => {
|
||||
setHoveredIdx(null);
|
||||
setTooltip(null);
|
||||
}, []);
|
||||
|
||||
if (!cells.length) return null;
|
||||
|
||||
const TIP_W = 160, TIP_H = 66;
|
||||
const tipStyle = tooltip ? (() => {
|
||||
const ww = wrapRef.current?.offsetWidth || 440;
|
||||
const wh = wrapRef.current?.offsetHeight || 360;
|
||||
let tx = tooltip.x + 14;
|
||||
let ty = tooltip.y - TIP_H / 2;
|
||||
if (tx + TIP_W > ww - 4) tx = tooltip.x - TIP_W - 14;
|
||||
if (ty < 4) ty = 4;
|
||||
if (ty + TIP_H > wh - 4) ty = wh - TIP_H - 4;
|
||||
return { left: tx, top: ty };
|
||||
})() : null;
|
||||
|
||||
return (
|
||||
<div className="dist-chart-wrap" ref={wrapRef}>
|
||||
|
||||
{/* ── En-tête ── */}
|
||||
<div className="dist-chart-header">
|
||||
<span className="dist-chart-title">Frais</span>
|
||||
<div className="dist-dropdown">
|
||||
par Catégorie
|
||||
<svg width="10" height="10" viewBox="0 0 24 24" fill="none"
|
||||
stroke="currentColor" strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round">
|
||||
<path d="M6 9l6 6 6-6"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ── Treemap SVG ── */}
|
||||
<div style={{ position: 'relative' }}>
|
||||
<svg
|
||||
ref={svgRef}
|
||||
viewBox={`0 0 ${W} ${H}`}
|
||||
style={{ width: '100%', height: 'auto', display: 'block' }}
|
||||
onMouseLeave={handleMouseLeave}
|
||||
>
|
||||
<defs>
|
||||
<linearGradient id="fdt-shadow" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stopColor="#000" stopOpacity="0" />
|
||||
<stop offset="100%" stopColor="#000" stopOpacity="0.4" />
|
||||
</linearGradient>
|
||||
<filter id="fdt-txt-shadow" x="-20%" y="-20%" width="140%" height="140%">
|
||||
<feDropShadow dx="0" dy="1" stdDeviation="1.5" floodColor="#000" floodOpacity="0.55"/>
|
||||
</filter>
|
||||
{cells.map((cell, i) => {
|
||||
const PAD = 4;
|
||||
const gx = cell.x + GAP / 2 + PAD;
|
||||
const gy = cell.y + GAP / 2 + PAD;
|
||||
const gw = Math.max(cell.w - GAP - PAD * 2, 0);
|
||||
const gh = Math.max(cell.h - GAP - PAD * 2, 0);
|
||||
return (
|
||||
<clipPath key={i} id={`fdt-clip-${i}`}>
|
||||
<rect x={gx} y={gy} width={gw} height={gh} />
|
||||
</clipPath>
|
||||
);
|
||||
})}
|
||||
</defs>
|
||||
|
||||
{cells.map((cell, i) => {
|
||||
const gx = cell.x + GAP / 2;
|
||||
const gy = cell.y + GAP / 2;
|
||||
const gw = Math.max(cell.w - GAP, 0);
|
||||
const gh = Math.max(cell.h - GAP, 0);
|
||||
const cx = gx + gw / 2;
|
||||
const cy = gy + gh / 2;
|
||||
const pct = ((cell.value / total) * 100).toFixed(0);
|
||||
const amt = fmtAmount(cell.value);
|
||||
const isHovered = hoveredIdx === i;
|
||||
|
||||
const fsAmt = Math.min(15, Math.max(10, gw / 7.5));
|
||||
const fsName = Math.min(12, Math.max(8, gw / 9.5));
|
||||
const fsPct = Math.min(11, Math.max(7, gw / 11));
|
||||
const lineH = 15;
|
||||
|
||||
const canShowAmt = gw > 36 && gh > 20;
|
||||
const isLandscape = gw > gh;
|
||||
const combinedText = `${cell.name} — ${pct} %`;
|
||||
const combinedCharW = fsName * 0.58;
|
||||
const combinedFits = isLandscape && (combinedText.length * combinedCharW) <= (gw - 10);
|
||||
const nameLines = (gw > 40 && gh > 30) ? wrapText(cell.name, gw - 10, fsName) : [];
|
||||
const canShowName = nameLines.length > 0;
|
||||
const CLIP_PAD = 4;
|
||||
const textHeightSoFar = (canShowAmt ? lineH : 0) + (canShowName ? nameLines.length * lineH : 0);
|
||||
const canShowPct = !combinedFits && gw > 44 && (gh - CLIP_PAD * 2) >= textHeightSoFar + lineH;
|
||||
|
||||
const textItems = [];
|
||||
{
|
||||
const slots = [];
|
||||
if (canShowAmt) slots.push({ type: 'amt', h: lineH + 2 });
|
||||
if (combinedFits) {
|
||||
slots.push({ type: 'combined', text: combinedText, h: lineH });
|
||||
} else {
|
||||
if (canShowName) nameLines.forEach((l, li) => slots.push({ type: 'name', li, text: l, h: lineH }));
|
||||
if (canShowPct) slots.push({ type: 'pct', h: lineH });
|
||||
}
|
||||
const totalH = slots.reduce((s, sl) => s + sl.h, 0);
|
||||
let y = cy - totalH / 2 + lineH / 2;
|
||||
for (const sl of slots) {
|
||||
if (sl.type === 'amt') textItems.push({ key: 'amt', text: amt, fs: fsAmt, fw: '700', op: 1, y });
|
||||
if (sl.type === 'combined') textItems.push({ key: 'combined', text: sl.text, fs: fsName, fw: '500', op: 0.92, y });
|
||||
if (sl.type === 'name') textItems.push({ key: `n${sl.li}`, text: sl.text, fs: fsName, fw: '500', op: 0.92, y });
|
||||
if (sl.type === 'pct') textItems.push({ key: 'pct', text: pct + ' %', fs: fsPct, fw: '400', op: 0.75, y });
|
||||
y += sl.h;
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<g key={i} style={{ cursor: 'pointer' }}
|
||||
onMouseMove={e => handleMouseMove(e, { ...cell, pct, amt }, i)}
|
||||
>
|
||||
<rect x={gx} y={gy} width={gw} height={gh}
|
||||
rx="5" fill={cell.color}
|
||||
opacity={hoveredIdx !== null && !isHovered ? 0.45 : 0.9}
|
||||
style={{ transition: 'opacity .15s' }}
|
||||
/>
|
||||
<rect x={gx} y={gy} width={gw} height={gh}
|
||||
rx="5" fill="url(#fdt-shadow)" opacity="0.35" />
|
||||
{isHovered && (
|
||||
<rect x={gx} y={gy} width={gw} height={gh}
|
||||
rx="5" fill="none"
|
||||
stroke="rgba(255,255,255,0.55)" strokeWidth="1.5" />
|
||||
)}
|
||||
<g clipPath={`url(#fdt-clip-${i})`}>
|
||||
{textItems.map(l => (
|
||||
<text key={l.key} x={cx} y={l.y}
|
||||
textAnchor="middle" dominantBaseline="middle"
|
||||
fill="white"
|
||||
fillOpacity={hoveredIdx !== null && !isHovered ? 0.3 : l.op}
|
||||
fontSize={l.fs} fontWeight={l.fw}
|
||||
fontFamily="system-ui,-apple-system,sans-serif"
|
||||
filter="url(#fdt-txt-shadow)"
|
||||
style={{ transition: 'fill-opacity .15s' }}>
|
||||
{l.text}
|
||||
</text>
|
||||
))}
|
||||
</g>
|
||||
</g>
|
||||
);
|
||||
})}
|
||||
</svg>
|
||||
|
||||
{/* ── Tooltip ── */}
|
||||
{tooltip && tipStyle && (
|
||||
<div className="dist-tooltip" style={{ left: tipStyle.left, top: tipStyle.top }}>
|
||||
<div className="dist-tooltip-dot" style={{ background: tooltip.cell.color }} />
|
||||
<div>
|
||||
<div className="dist-tooltip-amt">{tooltip.cell.amt}</div>
|
||||
<div className="dist-tooltip-name">{tooltip.cell.name}</div>
|
||||
<div className="dist-tooltip-pct">{tooltip.cell.pct} %</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -87,19 +87,41 @@ export default function InvestissementFormModal({
|
||||
if (open) setStep(1);
|
||||
}, [open]);
|
||||
|
||||
const stepTitles = [
|
||||
"Informations générales de l'investissement",
|
||||
'Données financières et échéancier',
|
||||
'Catégories, secteurs, autres',
|
||||
];
|
||||
const platMethode = plats.find(p => String(p.id) === String(form.plateforme_id))?.methode_remboursement;
|
||||
const platFrais = plats.find(p => String(p.id) === String(form.plateforme_id))?.frais_plateforme;
|
||||
// Étape "Frais" : uniquement à la création (une fois la souscription actée, le frais initial
|
||||
// éventuel a déjà été journalisé ; toute correction ou tout frais complémentaire ultérieur se
|
||||
// gère désormais depuis le bloc "Frais d'opération" de la fiche investissement — cf.
|
||||
// project_frais_operation.md, revu le 31/08/26), et seulement si la plateforme facture des
|
||||
// frais (référentiel frais_plateforme ≠ 'aucun').
|
||||
// Visible en création ET en modification (31/08/26, demande Olivier) : en modification,
|
||||
// cette étape lit/écrit toujours LA MÊME entrée frais_operations de catégorie 'souscription'
|
||||
// pour cet investissement — pré-remplie par le parent (openEdit) si elle existe déjà, gérée
|
||||
// en upsert par le parent au submit (POST si absente, PUT si déjà chargée via form.frais_id,
|
||||
// DELETE si le montant est vidé). Le montant investi n'est PAS réajusté automatiquement en
|
||||
// modification, contrairement à la création — cf. project_frais_operation.md.
|
||||
const showFraisStep = !!platFrais && platFrais !== 'aucun';
|
||||
const totalSteps = showFraisStep ? 4 : 3;
|
||||
|
||||
const stepTitles = showFraisStep
|
||||
? [
|
||||
"Informations générales de l'investissement",
|
||||
'Données financières et échéancier',
|
||||
'Frais liés à la plateforme',
|
||||
'Catégories, secteurs, autres',
|
||||
]
|
||||
: [
|
||||
"Informations générales de l'investissement",
|
||||
'Données financières et échéancier',
|
||||
'Catégories, secteurs, autres',
|
||||
];
|
||||
|
||||
const goNext = () => {
|
||||
if (formRef.current && !formRef.current.reportValidity()) return;
|
||||
setStep(s => Math.min(3, s + 1));
|
||||
setStep(s => Math.min(totalSteps, s + 1));
|
||||
};
|
||||
const goPrev = () => setStep(s => Math.max(1, s - 1));
|
||||
|
||||
const platMethode = plats.find(p => String(p.id) === String(form.plateforme_id))?.methode_remboursement;
|
||||
const showFinDeMois = (form.type_remb === 'in_fine' || form.type_remb === 'differe')
|
||||
&& dayOfMonth(form.date_premiere_echeance) > 27;
|
||||
|
||||
@@ -155,6 +177,10 @@ export default function InvestissementFormModal({
|
||||
onFormPatch({ compte_id: compteId, nom_compte_courant: c?.nom || '' });
|
||||
};
|
||||
|
||||
const handleFraisReglementChange = (mode) => {
|
||||
onFormPatch({ frais_mode_reglement: mode, frais_compte_id: mode === 'compte_courant' ? form.frais_compte_id : '' });
|
||||
};
|
||||
|
||||
const handleTypeRembChange = (t) => {
|
||||
const next = {
|
||||
...form, type_remb: t,
|
||||
@@ -280,8 +306,8 @@ export default function InvestissementFormModal({
|
||||
</div>
|
||||
{step === 1 && <button onClick={onClose}>Annuler</button>}
|
||||
{step > 1 && <button onClick={goPrev}>Précédent</button>}
|
||||
{step < 3 && <button className="primary" onClick={goNext}>Suivant</button>}
|
||||
{step === 3 && <button className="primary" onClick={onSubmit}>{editingId ? 'Enregistrer' : 'Créer'}</button>}
|
||||
{step < totalSteps && <button className="primary" onClick={goNext}>Suivant</button>}
|
||||
{step === totalSteps && <button className="primary" onClick={onSubmit}>{editingId ? 'Enregistrer' : 'Créer'}</button>}
|
||||
</div>
|
||||
}
|
||||
>
|
||||
@@ -291,7 +317,7 @@ export default function InvestissementFormModal({
|
||||
Étape {step} : {stepTitles[step - 1]}
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: 6 }}>
|
||||
{[1, 2, 3].map(n => (
|
||||
{Array.from({ length: totalSteps }, (_, i) => i + 1).map(n => (
|
||||
<div key={n} style={{
|
||||
flex: 1, height: 5, borderRadius: 4,
|
||||
background: n <= step ? 'var(--primary)' : 'var(--border)',
|
||||
@@ -502,8 +528,68 @@ export default function InvestissementFormModal({
|
||||
{restructurationBlock}
|
||||
</>)}
|
||||
|
||||
{/* ══ Étape 3 : Catégories, secteurs, autres ══ */}
|
||||
{step === 3 && (<>
|
||||
{/* ══ Étape 3 (si frais) : Frais liés à la plateforme ══ */}
|
||||
{step === 3 && showFraisStep && (<>
|
||||
<div style={{ gridColumn: 'span 3' }}>
|
||||
<p className="text-muted" style={{ fontSize: 'var(--fs-sm)', margin: '0 0 4px' }}>
|
||||
{editingId
|
||||
? "Cette plateforme facture des frais (entrée, gestion…). Le frais de souscription déjà documenté pour cet investissement, s'il existe, est pré-rempli ci-dessous — modifiez-le ou videz le montant pour le supprimer."
|
||||
: "Cette plateforme facture des frais (entrée, gestion…). Indiquez le montant TTC constaté pour cette souscription, ou laissez vide si aucun frais ne s'applique cette fois-ci."}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<label>Mode de saisie</label>
|
||||
<select value={form.frais_mode_saisie} onChange={e => onFieldChange('frais_mode_saisie', e.target.value)}>
|
||||
<option value="montant">Montant (€)</option>
|
||||
<option value="pourcentage">Pourcentage (%)</option>
|
||||
</select>
|
||||
</div>
|
||||
<div>
|
||||
<label>{form.frais_mode_saisie === 'pourcentage' ? 'Frais (% du montant investi)' : 'Montant des frais TTC (€)'}</label>
|
||||
<input type="number" step="0.01" min="0" value={form.frais_valeur}
|
||||
onChange={e => onFieldChange('frais_valeur', e.target.value)}
|
||||
placeholder="0" />
|
||||
</div>
|
||||
<div style={{ gridColumn: 'span 3' }}>
|
||||
<label>Prélèvement</label>
|
||||
<select value={form.frais_mode_reglement} onChange={e => handleFraisReglementChange(e.target.value)}>
|
||||
<option value="source">À la source (réduit le capital net investi, sans mouvement complémentaire)</option>
|
||||
<option value="portefeuille">Versement complémentaire — Porte-monnaie de la plateforme</option>
|
||||
<option value="compte_courant">Versement complémentaire — Compte courant du détenteur</option>
|
||||
</select>
|
||||
</div>
|
||||
{form.frais_mode_reglement === 'compte_courant' && (
|
||||
<div>
|
||||
<label>Compte de règlement *</label>
|
||||
{comptesInvestisseur.length > 0 ? (
|
||||
<select required value={form.frais_compte_id} onChange={e => onFieldChange('frais_compte_id', e.target.value)}>
|
||||
<option value="">— Choisir un compte —</option>
|
||||
{comptesInvestisseur.map(c => (
|
||||
<option key={c.id} value={c.id}>{c.nom}{c.banque ? ` — ${c.banque}` : ''}</option>
|
||||
))}
|
||||
</select>
|
||||
) : (
|
||||
<p className="text-muted" style={{ fontSize: 'var(--fs-sm)', margin: '4px 0' }}>
|
||||
Aucun compte défini pour ce détenteur. <a href="/settings?section=comptes" target="_blank" rel="noreferrer">Créer un compte →</a>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
{form.frais_mode_reglement === 'source' && form.frais_valeur !== '' && Number(form.frais_valeur) > 0 && (
|
||||
<div style={{ gridColumn: 'span 3' }}>
|
||||
<p className="text-muted" style={{ fontSize: 'var(--fs-sm)', margin: 0 }}>
|
||||
{editingId
|
||||
? "Ce frais est journalisé indépendamment du montant investi — ajustez ce dernier vous-même à l'étape précédente si besoin."
|
||||
: `Capital net qui sera enregistré : ${fmtEUR(Math.max(0, Math.round((Number(form.montant_investi || 0) - (form.frais_mode_saisie === 'pourcentage'
|
||||
? Number(form.montant_investi || 0) * Number(form.frais_valeur) / 100
|
||||
: Number(form.frais_valeur))) * 100) / 100))}`}
|
||||
</p>
|
||||
</div>
|
||||
)}
|
||||
</>)}
|
||||
|
||||
{/* ══ Étape suivante : Catégories, secteurs, autres ══ */}
|
||||
{step === (showFraisStep ? 4 : 3) && (<>
|
||||
<div style={{ gridColumn: 'span 2' }}>
|
||||
<label>Notes</label>
|
||||
<textarea rows={3} value={form.notes}
|
||||
|
||||
@@ -28,6 +28,19 @@ export const DEBIT_TYPES = new Set(['retrait', 'souscription', 'prelevement_ir',
|
||||
// depot/remboursement/bonus → crédit (+) ; retrait/souscription/prélèvements → débit (−) ;
|
||||
// correction → déjà signé en base (montant peut être positif ou négatif).
|
||||
export function signedMontant(r) {
|
||||
// Frais d'opération : impact réel sur le solde uniquement si réglé 'source' (débit du
|
||||
// montant brut, cf. cas Fundora confirmé par Olivier le 31/08/26 — [[project_frais_operation]])
|
||||
// ou 'portefeuille' (versement complémentaire) ; 'compte_courant' n'a jamais d'effet sur le
|
||||
// porte-monnaie (sortie d'argent ailleurs) — on l'affiche quand même dans la liste, à titre
|
||||
// de traçabilité, avec un badge "hors porte-monnaie", mais sans effet sur le solde indicatif.
|
||||
// 'remboursement' (Étape 4, 31/08/26) : frais de distribution synchronisé depuis le champ
|
||||
// "Frais" d'un remboursement — DOIT être un débit réel ici (comme un prélèvement), pas 0 :
|
||||
// la ligne "remboursement" du tableau crédite le coupon BRUT (interets_bruts, cf.
|
||||
// normalizedRembMouvements), et les prélèvements sont déjà des lignes de débit séparées pour
|
||||
// retomber sur interets_nets — le frais doit suivre exactement la même convention, sinon la
|
||||
// chaîne ne retombe jamais à 0 après un retrait AUTO (confirmé par Olivier le 01/09/26 : le
|
||||
// reliquat observé était exactement égal au montant du frais).
|
||||
if (r.type === 'frais') return r.mode_reglement === 'compte_courant' ? 0 : -Math.abs(r.montant);
|
||||
if (DEBIT_TYPES.has(r.type)) return -Math.abs(r.montant);
|
||||
if (r.type === 'correction') return r.montant;
|
||||
return Math.abs(r.montant);
|
||||
@@ -39,8 +52,19 @@ export const MOUV_TYPE_LABELS = {
|
||||
prelevement_ir: 'Prélèvement IR', prelevement_csg: 'Prélèvement CSG',
|
||||
prelevement_local: "Prélèvement impôts à l'étranger",
|
||||
interets_plateforme: 'Intérêts plateforme',
|
||||
frais: "Frais d'opération",
|
||||
};
|
||||
|
||||
// Labels de mode de règlement / origine d'un frais d'opération — dupliqués depuis
|
||||
// InvestissementDetail.jsx (bloc "Frais d'opération") pour l'affichage dans les
|
||||
// Mouvements ; garder synchronisés en cas d'évolution des libellés.
|
||||
export const FRAIS_MODE_LABELS = { source: 'Déduit du versement lors de la souscription', portefeuille: 'Porte-monnaie', compte_courant: 'Débité du compte courant', remboursement: 'Déduit du remboursement' };
|
||||
export const FRAIS_ORIGINE_LABELS = { souscription: 'Souscription', remboursement: 'Remboursement', manuel: 'Manuel' };
|
||||
// Catégorie de frais (31/08/26, demande Olivier) — classement visible côté utilisateur,
|
||||
// distinct de FRAIS_ORIGINE_LABELS (détail technique de création). Dupliqué depuis
|
||||
// InvestissementDetail.jsx, à garder synchronisé.
|
||||
export const FRAIS_CATEGORIE_LABELS = { souscription: 'Souscription', gestion: 'Gestion', distribution: 'Distribution', autre: 'Autre' };
|
||||
|
||||
/* ── Tri des mouvements pour une même date ───────────────────────────
|
||||
1) Toutes les lignes d'une même plateforme, pour une même date, sont regroupées
|
||||
ensemble (ordre alphabétique des plateformes entre elles — décidé avec Olivier
|
||||
@@ -96,7 +120,7 @@ const MOUV_FAMILY_RANK = {
|
||||
remboursement: 1, interets_plateforme: 1, bonus: 1, cashback: 1,
|
||||
prelevement_local: 1, prelevement_ir: 1, prelevement_csg: 1,
|
||||
depot: 2,
|
||||
souscription: 3,
|
||||
souscription: 3, frais: 3,
|
||||
retrait: 4,
|
||||
correction: 5,
|
||||
};
|
||||
@@ -104,7 +128,12 @@ const MOUV_FAMILY_RANK = {
|
||||
// Position au sein d'une chaîne "remboursement" (lignes partageant le même _rembId)
|
||||
const MOUV_REMB_CHAIN_POS = {
|
||||
remboursement: 0, interets_plateforme: 0, bonus: 0,
|
||||
cashback: 1, prelevement_local: 2, prelevement_ir: 3, prelevement_csg: 4,
|
||||
// frais (Étape 4, 31/08/26) : déduit du coupon brut AVANT calcul des prélèvements (base
|
||||
// imposable = interets_bruts - frais_ttc, cf. computeChamps) — doit donc apparaître entre le
|
||||
// remboursement et les prélèvements dans la chaîne, pas au-dessus de tout (demande Olivier,
|
||||
// 01/09/26, avec l'avis d'opéré Kyoseil-AM/Fundora à l'appui).
|
||||
frais: 1,
|
||||
cashback: 2, prelevement_local: 3, prelevement_ir: 4, prelevement_csg: 5,
|
||||
};
|
||||
|
||||
export function sortMouvements(list) {
|
||||
@@ -124,7 +153,7 @@ export function sortMouvements(list) {
|
||||
const enriched = list.map(row => {
|
||||
// Retrait AUTO (sweep compte_courant) : reste collé juste après le remboursement qui le déclenche.
|
||||
if (row.type === 'retrait' && row.source === 'auto_remboursement' && row.remboursement_id != null) {
|
||||
return { row, family: MOUV_FAMILY_RANK.remboursement, anchor: row.remboursement_id, pos: 5 };
|
||||
return { row, family: MOUV_FAMILY_RANK.remboursement, anchor: row.remboursement_id, pos: 6 };
|
||||
}
|
||||
// Cashback "prime à la souscription" : pas de ligne crédit propre + souscription du même
|
||||
// jour sur le même investissement → rattaché à cette souscription plutôt qu'isolé.
|
||||
@@ -132,6 +161,15 @@ export function sortMouvements(list) {
|
||||
const sub = subByInvAndDate.get(`${row._invId}|${row.date_operation}`);
|
||||
if (sub) return { row, family: MOUV_FAMILY_RANK.souscription, anchor: sub._invId, pos: 1 };
|
||||
}
|
||||
// Frais lié à un remboursement (mode_reglement='remboursement', Étape 4, 31/08/26) :
|
||||
// rejoint la chaîne du remboursement lui-même (même family que prélèvements/retrait AUTO),
|
||||
// positionné juste après le remboursement et avant les prélèvements — cf.
|
||||
// MOUV_REMB_CHAIN_POS.frais ci-dessus. Doit être vérifié avant le bloc générique
|
||||
// `row._rembId != null` plus bas, qui sinon l'attraperait avec la family 'frais' (3),
|
||||
// qui n'a rien à voir avec la chaîne du remboursement.
|
||||
if (row.type === 'frais' && row._rembId != null) {
|
||||
return { row, family: MOUV_FAMILY_RANK.remboursement, anchor: row._rembId, pos: MOUV_REMB_CHAIN_POS.frais };
|
||||
}
|
||||
// Lignes d'un remboursement (parent + cashback resté attaché + prélèvements)
|
||||
if (row._rembId != null) {
|
||||
return {
|
||||
@@ -141,6 +179,14 @@ export function sortMouvements(list) {
|
||||
pos: MOUV_REMB_CHAIN_POS[row.type] ?? 0,
|
||||
};
|
||||
}
|
||||
// Frais d'opération : rattaché à l'investissement concerné (même anchor que sa
|
||||
// souscription éventuelle) — pos élevé pour apparaître au-dessus d'elle le même jour,
|
||||
// cohérent avec le principe "plus récent d'abord" (le frais est perçu comme consécutif
|
||||
// à la souscription). Ne rejoint jamais la chaîne d'un remboursement (_rembId) même si
|
||||
// origine='remboursement' : pas encore de lien fin construit ici (cf. [[project_frais_operation]]).
|
||||
if (row.type === 'frais') {
|
||||
return { row, family: MOUV_FAMILY_RANK.frais, anchor: row._invId, pos: 2 };
|
||||
}
|
||||
// Souscription / réinvestissement (parent de sa propre chaîne)
|
||||
if (row.type === 'souscription') {
|
||||
return { row, family: MOUV_FAMILY_RANK.souscription, anchor: row._invId, pos: 0 };
|
||||
@@ -413,6 +459,9 @@ export function DetailPanel({ row, onEdit, onDeleteCorrection, onViewRemb, onVie
|
||||
const isRemb = row.type === 'remboursement' || isBonus || isCashback || isInteretsPlateforme;
|
||||
const isSouscription = row.type === 'souscription';
|
||||
const isPrelevement = row.type === 'prelevement_ir' || row.type === 'prelevement_csg' || row.type === 'prelevement_local';
|
||||
const isFrais = row.type === 'frais';
|
||||
const isFraisHorsPM = isFrais && row.mode_reglement === 'compte_courant';
|
||||
const isFraisRembLinked = isFrais && row.mode_reglement === 'remboursement';
|
||||
const isAuto = row.source === 'auto_remboursement';
|
||||
|
||||
const typeLabel = isCorrection ? 'Correction de solde'
|
||||
@@ -424,6 +473,7 @@ export function DetailPanel({ row, onEdit, onDeleteCorrection, onViewRemb, onVie
|
||||
: row.type === 'prelevement_csg' ? 'Prélèvement CSG'
|
||||
: row.type === 'prelevement_local' ? "Prélèvement impôts à l'étranger"
|
||||
: isSouscription ? (row._isReinvest ? 'Réinvestissement' : 'Souscription à un investissement')
|
||||
: isFrais ? "Frais d'opération" + (isFraisHorsPM ? ' (hors porte-monnaie)' : isFraisRembLinked ? ' (déduit du remboursement)' : '')
|
||||
: row.type === 'depot' ? 'Dépôt' : 'Retrait';
|
||||
|
||||
const editLabel = isCorrection ? 'Modifier la correction de solde'
|
||||
@@ -431,7 +481,7 @@ export function DetailPanel({ row, onEdit, onDeleteCorrection, onViewRemb, onVie
|
||||
|
||||
// Débit (−) pour retrait/souscription/prélèvements, crédit (+) pour dépôt/remboursement/bonus/cashback ;
|
||||
// la correction est déjà signée en base.
|
||||
const isDebitType = row.type === 'retrait' || isSouscription || isPrelevement;
|
||||
const isDebitType = row.type === 'retrait' || isSouscription || isPrelevement || isFrais;
|
||||
const isPos = isCorrection ? row.montant >= 0 : !isDebitType;
|
||||
const sign = isPos ? '+' : '−';
|
||||
const montantFmt = `${sign} ${fmtEUR(Math.abs(row.montant))}`;
|
||||
@@ -456,7 +506,12 @@ export function DetailPanel({ row, onEdit, onDeleteCorrection, onViewRemb, onVie
|
||||
: 'Étranger — indicatif, aucun prélèvement à la source ici' },
|
||||
isPrelevement && row.libelle && { label: 'Projet', value: row.libelle },
|
||||
isSouscription && row.libelle && { label: 'Projet', value: row.libelle },
|
||||
!isCorrection && !isRemb && !isSouscription && !isPrelevement && row.libelle && { label: 'Libellé', value: row.libelle },
|
||||
isFrais && row.libelle && { label: 'Projet', value: row.libelle },
|
||||
isFrais && { label: 'Mode de règlement', value: FRAIS_MODE_LABELS[row.mode_reglement] || row.mode_reglement },
|
||||
isFrais && row.mode_reglement === 'compte_courant' && row.compte_nom && { label: 'Compte', value: row.compte_nom },
|
||||
isFrais && row.categorie && { label: 'Catégorie', value: FRAIS_CATEGORIE_LABELS[row.categorie] || row.categorie },
|
||||
isFrais && row.origine && { label: 'Origine', value: FRAIS_ORIGINE_LABELS[row.origine] || row.origine },
|
||||
!isCorrection && !isRemb && !isSouscription && !isPrelevement && !isFrais && row.libelle && { label: 'Libellé', value: row.libelle },
|
||||
!isCorrection && !isRemb && row.reference && { label: 'Référence', value: row.reference },
|
||||
row.notes && { label: 'Notes', value: row.notes },
|
||||
].filter(Boolean);
|
||||
@@ -562,6 +617,34 @@ export function DetailPanel({ row, onEdit, onDeleteCorrection, onViewRemb, onVie
|
||||
</div>
|
||||
)}
|
||||
|
||||
{isFrais && (
|
||||
<div style={{
|
||||
display: 'flex', alignItems: 'flex-start', gap: 8,
|
||||
margin: '5px 5px 12px',
|
||||
padding: '9px 12px', borderRadius: 6,
|
||||
background: `color-mix(in srgb, ${isFraisHorsPM ? 'var(--text-muted)' : '#f59e0b'} 10%, transparent)`,
|
||||
border: `1px solid color-mix(in srgb, ${isFraisHorsPM ? 'var(--text-muted)' : '#f59e0b'} 25%, transparent)`,
|
||||
fontSize: 'var(--fs-sm)', color: 'var(--text-muted)',
|
||||
lineHeight: 1.4,
|
||||
}}>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor"
|
||||
strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"
|
||||
style={{ marginTop: 1, flexShrink: 0, color: isFraisHorsPM ? 'var(--text-muted)' : '#f59e0b' }}>
|
||||
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
|
||||
</svg>
|
||||
<span>
|
||||
{isFraisHorsPM
|
||||
? "Frais réglé via un compte courant du détenteur — n'a jamais d'effet sur le solde du porte-monnaie de la plateforme, affiché ici à titre de traçabilité uniquement."
|
||||
: isFraisRembLinked
|
||||
? "Frais de distribution déduit du coupon brut de ce remboursement, avant calcul des prélèvements — réduit d'autant le montant net reçu (cf. avis d'opéré de la plateforme)."
|
||||
: row.mode_reglement === 'source'
|
||||
? "Frais prélevé à la source par la plateforme sur le montant transféré — sort du porte-monnaie en plus du capital net déjà déduit de la souscription."
|
||||
: "Versement complémentaire réglé depuis le porte-monnaie de la plateforme — sort du porte-monnaie indépendamment du capital investi."}
|
||||
{' '}{isFraisRembLinked ? "Modifiable depuis le remboursement." : "Modifiable depuis la fiche de l'investissement."}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="dr-detail-fields">
|
||||
{fields.map(f => (
|
||||
<div className="dr-detail-field" key={f.label}>
|
||||
@@ -576,7 +659,11 @@ export function DetailPanel({ row, onEdit, onDeleteCorrection, onViewRemb, onVie
|
||||
<button className="dr-detail-edit-btn" onClick={() => onViewRemb(row)}>
|
||||
Voir / modifier le remboursement
|
||||
</button>
|
||||
) : isSouscription ? (
|
||||
) : isFraisRembLinked ? (
|
||||
<button className="dr-detail-edit-btn" onClick={() => onViewRemb(row)}>
|
||||
Voir / modifier le remboursement
|
||||
</button>
|
||||
) : isSouscription || isFrais ? (
|
||||
<button className="dr-detail-edit-btn" onClick={() => onViewInvestissement(row)}>
|
||||
Voir l'investissement
|
||||
</button>
|
||||
|
||||
@@ -16,7 +16,7 @@ function getIcons() {
|
||||
return _promise;
|
||||
}
|
||||
|
||||
export default function PageIcon({ name, size = 40 }) {
|
||||
export default function PageIcon({ name, size = 40, style }) {
|
||||
const [filename, setFilename] = useState(() => _cache?.[name] ?? null);
|
||||
|
||||
useEffect(() => {
|
||||
@@ -38,6 +38,7 @@ export default function PageIcon({ name, size = 40 }) {
|
||||
marginRight: 10,
|
||||
objectFit: 'contain',
|
||||
opacity: 0.85,
|
||||
...style,
|
||||
}}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -6,8 +6,13 @@ import { fmtEUR } from '../utils/format.js';
|
||||
const round2 = (n) => Math.round(n * 100) / 100;
|
||||
const fmtRate = (n) => n != null ? n.toFixed(1).replace('.', ',') + ' %' : '…';
|
||||
|
||||
// Le frais ne réduit interets_nets que lorsqu'il est retenu SUR ce remboursement (mode
|
||||
// 'remboursement', par défaut) — un frais réglé à part ('portefeuille'/'compte_courant',
|
||||
// Étape 5 bis, 01/09/26 — cas Baltis) n'a aucun impact ici, cf. computeChamps() côté backend.
|
||||
const fraisReduitBase = (f) => !f.frais_mode_reglement || f.frais_mode_reglement === 'remboursement';
|
||||
|
||||
const computeInteretsNets = (f) =>
|
||||
round2(Number(f.interets_bruts || 0) - Number(f.prelev_sociaux || 0) - Number(f.prelev_forfaitaire || 0));
|
||||
round2(Number(f.interets_bruts || 0) - (fraisReduitBase(f) ? Number(f.frais_ttc || 0) : 0) - Number(f.prelev_sociaux || 0) - Number(f.prelev_forfaitaire || 0));
|
||||
|
||||
const computeNet = (f) =>
|
||||
round2(Number(f.capital || 0) + Number(f.cashback || 0) + computeInteretsNets(f));
|
||||
@@ -86,10 +91,20 @@ export default function RembFormModal({
|
||||
const hasLocalTax = !isBonus && currentPlat?.fiscalite === 'avec_fiscalite_locale' && currentPlat?.taux_fiscalite_locale;
|
||||
const isExonere = !isBonus && currentInv?.fiscalite_override === 'exonere';
|
||||
const isIndicatif = Boolean(isExonere || (!isBonus && currentPlat && currentPlat.fiscalite !== 'flat_tax'));
|
||||
// Cas indicatif (plateforme étrangère ou exonérée) : le montant versé est net de frais mais
|
||||
// pas des prélèvements (indicatifs) — même formule que net_recu côté backend (computeChamps,
|
||||
// branche isTaxIndicatif) — cf. Étape 4, 31/08/26.
|
||||
const montantVerse = isIndicatif
|
||||
? round2(Number(form.capital || 0) + Number(form.cashback || 0) + Number(form.interets_bruts || 0))
|
||||
? round2(Number(form.capital || 0) + Number(form.cashback || 0) + Number(form.interets_bruts || 0) - (fraisReduitBase(form) ? Number(form.frais_ttc || 0) : 0))
|
||||
: computeNet(form);
|
||||
|
||||
// Section "Frais" (frais de distribution, Étape 4) : visible si la plateforme facture des
|
||||
// frais (référentiel frais_plateforme ≠ 'aucun'), ou si un montant est déjà saisi (garde
|
||||
// l'accès même si la config de la plateforme change ensuite) — même logique que le bloc
|
||||
// "Frais d'opération" de la fiche investissement, cf. project_frais_operation.md.
|
||||
const showFraisSection = !isBonus
|
||||
&& ((currentPlat?.frais_plateforme && currentPlat.frais_plateforme !== 'aucun') || Number(form.frais_ttc) > 0);
|
||||
|
||||
const modalTitle = title ?? (editingId ? 'Modifier le remboursement' : (locked ? 'Saisir le remboursement' : 'Nouveau remboursement'));
|
||||
|
||||
const handleMethodeChange = (m) => {
|
||||
@@ -97,6 +112,16 @@ export default function RembFormModal({
|
||||
onFormPatch({ methode_remboursement: m, compte_id: def ? String(def.id) : '' });
|
||||
};
|
||||
|
||||
// Prélèvement du frais (Étape 5 bis, 01/09/26) : passe par onFieldChange pour déclencher le
|
||||
// recalcul des prélèvements (comme un changement de frais_ttc, cf. setField/setRembField dans
|
||||
// les 3 pages appelantes), puis pré-sélectionne un compte par défaut si on bascule sur
|
||||
// 'compte_courant' — même pattern que handleFraisReglementChange côté investissement.
|
||||
const handleFraisModeChange = (mode) => {
|
||||
onFieldChange('frais_mode_reglement', mode);
|
||||
const def = mode === 'compte_courant' ? (comptesInvestisseur?.find(c => c.type === 'compte_courant') ?? comptesInvestisseur?.[0]) : null;
|
||||
onFormPatch({ frais_compte_id: def ? String(def.id) : '' });
|
||||
};
|
||||
|
||||
return (
|
||||
<Modal
|
||||
open={open}
|
||||
@@ -202,6 +227,53 @@ export default function RembFormModal({
|
||||
onChange={e => onFieldChange('cashback', e.target.value)} />
|
||||
</div>
|
||||
)}
|
||||
{showFraisSection && (<>
|
||||
<div style={{ gridColumn: 'span 3', borderTop: '1px solid var(--border)', paddingTop: 4, marginTop: 4 }}>
|
||||
<span style={{ fontSize: 11, fontWeight: 600, textTransform: 'uppercase', letterSpacing: '0.06em', color: 'var(--text-muted)' }}>Frais</span>
|
||||
</div>
|
||||
<div>
|
||||
<label>Montant des frais (€ TTC)</label>
|
||||
<input type="number" step="0.01" min="0" value={form.frais_ttc ?? 0}
|
||||
onChange={e => onFieldChange('frais_ttc', e.target.value)} />
|
||||
</div>
|
||||
{!isInteretsPlateforme ? (<>
|
||||
<div style={{ gridColumn: 'span 2' }}>
|
||||
<label>Prélèvement</label>
|
||||
<select value={form.frais_mode_reglement || 'remboursement'} onChange={e => handleFraisModeChange(e.target.value)}>
|
||||
<option value="remboursement">Retenu sur ce remboursement (réduit la base imposable et le montant versé)</option>
|
||||
<option value="portefeuille">Versement complémentaire — Porte-monnaie de la plateforme</option>
|
||||
<option value="compte_courant">Versement complémentaire — Compte courant du détenteur</option>
|
||||
</select>
|
||||
</div>
|
||||
{form.frais_mode_reglement === 'compte_courant' && (
|
||||
<div style={{ gridColumn: 'span 3' }}>
|
||||
<label>Compte de règlement des frais *</label>
|
||||
{comptesInvestisseur?.length > 0 ? (
|
||||
<select required value={form.frais_compte_id || ''} onChange={e => onFieldChange('frais_compte_id', e.target.value)}>
|
||||
<option value="">— Choisir un compte —</option>
|
||||
{comptesInvestisseur.map(c => (
|
||||
<option key={c.id} value={c.id}>{c.nom}{c.banque ? ` — ${c.banque}` : ''}</option>
|
||||
))}
|
||||
</select>
|
||||
) : (
|
||||
<p className="text-muted" style={{ fontSize: 'var(--fs-sm)', margin: '4px 0' }}>
|
||||
Aucun compte défini. <a href="/settings?section=comptes" target="_blank" rel="noreferrer">Créer un compte →</a>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div style={{ gridColumn: 'span 3', display: 'flex', alignItems: 'flex-end', fontSize: 12, color: 'var(--text-muted)', paddingBottom: 6 }}>
|
||||
{form.frais_mode_reglement === 'compte_courant' || form.frais_mode_reglement === 'portefeuille'
|
||||
? "Frais réglé à part (comme pour la souscription) — aucun impact sur l'imposition ni le montant versé de ce remboursement ; compté séparément dans le Frais payés et le XIRR net."
|
||||
: "Frais d'entrée/de gestion prélevés par la plateforme sur cette distribution (ex. avis d'opéré) — vient réduire la base imposable des intérêts bruts avant calcul des prélèvements."}
|
||||
</div>
|
||||
</>) : (
|
||||
<div style={{ gridColumn: 'span 2', display: 'flex', alignItems: 'flex-end', fontSize: 12, color: 'var(--text-muted)', paddingBottom: 6 }}>
|
||||
Frais d'entrée/de gestion prélevés par la plateforme sur cette distribution (ex. avis d'opéré) —
|
||||
vient réduire la base imposable des intérêts bruts avant calcul des prélèvements.
|
||||
</div>
|
||||
)}
|
||||
</>)}
|
||||
<div style={{ gridColumn: 'span 3', borderTop: '1px solid var(--border)', paddingTop: 4, marginTop: 4 }}>
|
||||
<span style={{ fontSize: 11, fontWeight: 600, textTransform: 'uppercase', letterSpacing: '0.06em', color: 'var(--text-muted)' }}>Imposition{isIndicatif ? ' — indicatif' : ''}</span>
|
||||
</div>
|
||||
|
||||
@@ -264,6 +264,7 @@ export default function Aide() {
|
||||
+ Remboursements crédités au porte-monnaie<br />
|
||||
+ Bonus (parrainage / plateforme)<br />
|
||||
− Capital investi (en cours ou remboursé)<br />
|
||||
− Frais (déduits à la souscription ou réglés via le porte-monnaie)<br />
|
||||
+ Corrections de solde
|
||||
</div>
|
||||
|
||||
@@ -297,10 +298,61 @@ export default function Aide() {
|
||||
(y compris les réinvestissements complémentaires) est soustrait du porte-monnaie, car ces fonds ne sont
|
||||
plus disponibles. Ils reviennent progressivement via les remboursements.</p>
|
||||
|
||||
<p><strong style={{ color: 'var(--text)' }}>Frais</strong> — les frais liés aux investissements (voir la question dédiée
|
||||
ci-dessous) réduisent le solde lorsqu'ils sont réglés « à la source » (déduits du versement lors de la
|
||||
souscription) ou via le porte-monnaie. Les frais réglés depuis un compte courant du détenteur, ou retenus
|
||||
directement sur un remboursement, n'ont aucun impact ici — ils ne transitent jamais par le porte-monnaie de
|
||||
la plateforme.</p>
|
||||
|
||||
<p style={{ marginBottom: 0 }}><strong style={{ color: 'var(--text)' }}>Corrections de solde</strong> — ajustements manuels
|
||||
permettant de réconcilier de micro-écarts de calcul (par exemple un arrondi de centimes sur la fiscalité).</p>
|
||||
</FaqItem>
|
||||
|
||||
<FaqItem question="Comment fonctionne le suivi des frais liés aux investissements ?" openQuestion={openQuestion} setOpenQuestion={setOpenQuestion}>
|
||||
<p style={{ marginTop: 0 }}>
|
||||
Certaines plateformes facturent des frais en dehors des intérêts et prélèvements fiscaux habituels : frais
|
||||
d'entrée à la souscription, frais de gestion, frais sur une distribution (retenus ou non sur un
|
||||
remboursement), ou autre. Le bloc <em>Frais d'opération</em> de la fiche d'un investissement les recense tous.
|
||||
</p>
|
||||
|
||||
<h4 style={{ margin: '16px 0 8px', color: 'var(--text)' }}>Où saisir un frais ?</h4>
|
||||
<ul style={{ margin: '0 0 12px 16px', paddingLeft: 0, lineHeight: 1.8 }}>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Frais de souscription</strong> — depuis l'étape « Frais » du
|
||||
formulaire de création ou modification de l'investissement. Un seul frais de cette catégorie par
|
||||
investissement.</li>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Frais de gestion ou autre</strong> — depuis le bouton
|
||||
<strong style={{ color: 'var(--text)' }}> + Ajouter</strong> du bloc <em>Frais d'opération</em> sur la fiche.</li>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Frais sur distribution</strong> — depuis le champ
|
||||
<strong style={{ color: 'var(--text)' }}> Frais</strong> du formulaire d'un remboursement. La ligne est créée et
|
||||
synchronisée automatiquement dans le bloc <em>Frais d'opération</em> ; elle ne peut être modifiée ou
|
||||
supprimée que depuis ce remboursement, pour éviter toute désynchronisation.</li>
|
||||
</ul>
|
||||
|
||||
<h4 style={{ margin: '16px 0 8px', color: 'var(--text)' }}>Mode de règlement et impact</h4>
|
||||
<p>Chaque frais est réglé de l'une des quatre façons suivantes, avec un impact différent :</p>
|
||||
<ul style={{ margin: '8px 0 12px 16px', paddingLeft: 0, lineHeight: 1.8 }}>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Déduit du versement lors de la souscription</strong> — aucune
|
||||
ligne de mouvement séparée : le montant est simplement documenté à titre de traçabilité, mais il réduit
|
||||
le solde du porte-monnaie (voir la question ci-dessus).</li>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Porte-monnaie</strong> — débité du solde disponible sur la
|
||||
plateforme, comme un retrait.</li>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Débité du compte courant</strong> — réglé depuis un compte
|
||||
courant du détenteur (choisi à la saisie), sans aucun impact sur le porte-monnaie de la plateforme.</li>
|
||||
<li><strong style={{ color: 'var(--text)' }}>Déduit du remboursement</strong> — retenu directement sur le
|
||||
remboursement lié : le montant réduit alors la base imposable et les <em>intérêts nets</em>/<em>net reçu</em>
|
||||
de ce remboursement (comportement historique). C'est le seul mode où le frais n'est pas une sortie d'argent
|
||||
séparée à suivre par ailleurs.</li>
|
||||
</ul>
|
||||
|
||||
<p style={{ marginBottom: 0 }}>
|
||||
Les frais réglés en <strong style={{ color: 'var(--text)' }}>porte-monnaie</strong> ou
|
||||
<strong style={{ color: 'var(--text)' }}> compte courant</strong> représentent une vraie sortie d'argent,
|
||||
distincte des remboursements : ils sont donc déduits du KPI <strong style={{ color: 'var(--text)' }}>Gain net
|
||||
depuis le début</strong> du tableau de bord (et pris en compte dans le TRI net des investissements
|
||||
concernés), en plus de leur effet sur le solde du porte-monnaie détaillé ci-dessus.
|
||||
</p>
|
||||
</FaqItem>
|
||||
|
||||
<FaqItem question="Comment mettre en place un réinvestissement automatique des intérêts ?" openQuestion={openQuestion} setOpenQuestion={setOpenQuestion}>
|
||||
<p style={{ marginTop: 0 }}>
|
||||
Le réinvestissement automatique permet de capitaliser les intérêts perçus après chaque remboursement,
|
||||
@@ -621,7 +673,7 @@ export default function Aide() {
|
||||
<td style={{ padding: '8px 10px 8px 0', verticalAlign: 'top', whiteSpace: 'nowrap' }}>
|
||||
<code style={{ background: 'var(--surface-2)', padding: '1px 5px', borderRadius: 4 }}>crowdlending_get_dashboard</code>
|
||||
</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>KPIs du portefeuille : capital investi, capital en risque, montant remboursé, intérêts bruts/nets, dépôts/retraits — filtrable par année.</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>KPIs du portefeuille : capital investi, capital en risque, montant remboursé, intérêts bruts/nets, dépôts/retraits, gain net depuis le début (frais hors remboursement déduits) — filtrable par année.</td>
|
||||
</tr>
|
||||
<tr style={{ borderBottom: '1px solid var(--border)' }}>
|
||||
<td style={{ padding: '8px 10px 8px 0', verticalAlign: 'top', whiteSpace: 'nowrap' }}>
|
||||
@@ -633,13 +685,19 @@ export default function Aide() {
|
||||
<td style={{ padding: '8px 10px 8px 0', verticalAlign: 'top', whiteSpace: 'nowrap' }}>
|
||||
<code style={{ background: 'var(--surface-2)', padding: '1px 5px', borderRadius: 4 }}>crowdlending_get_investissement</code>
|
||||
</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>Détail complet d'un investissement (par id), y compris la liste de ses remboursements réels perçus.</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>Détail complet d'un investissement (par id), y compris ses remboursements réels perçus et les frais qui lui sont liés (souscription, gestion, distribution).</td>
|
||||
</tr>
|
||||
<tr style={{ borderBottom: '1px solid var(--border)' }}>
|
||||
<td style={{ padding: '8px 10px 8px 0', verticalAlign: 'top', whiteSpace: 'nowrap' }}>
|
||||
<code style={{ background: 'var(--surface-2)', padding: '1px 5px', borderRadius: 4 }}>crowdlending_list_remboursements</code>
|
||||
</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>Historique des remboursements perçus (toutes plateformes), filtrable par période.</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>Historique des remboursements perçus (toutes plateformes), avec le frais éventuellement retenu sur chacun, filtrable par période.</td>
|
||||
</tr>
|
||||
<tr style={{ borderBottom: '1px solid var(--border)' }}>
|
||||
<td style={{ padding: '8px 10px 8px 0', verticalAlign: 'top', whiteSpace: 'nowrap' }}>
|
||||
<code style={{ background: 'var(--surface-2)', padding: '1px 5px', borderRadius: 4 }}>crowdlending_list_frais_operations</code>
|
||||
</td>
|
||||
<td style={{ padding: '8px 0', verticalAlign: 'top' }}>Frais liés aux investissements — souscription, gestion, distribution — toutes plateformes, filtrable par période.</td>
|
||||
</tr>
|
||||
<tr style={{ borderBottom: '1px solid var(--border)' }}>
|
||||
<td style={{ padding: '8px 10px 8px 0', verticalAlign: 'top', whiteSpace: 'nowrap' }}>
|
||||
@@ -684,6 +742,7 @@ export default function Aide() {
|
||||
<li>« Donne-moi le détail de l'investissement 42, avec ses remboursements. »</li>
|
||||
<li>« Quels remboursements ai-je reçus entre le 1er et le 30 juin 2026 ? »</li>
|
||||
<li>« Quels ont été mes derniers dépôts et retraits ? »</li>
|
||||
<li>« Combien ai-je payé de frais cette année, et sur quels investissements ? »</li>
|
||||
<li>« Regarde cette annonce de projet et propose-moi les infos pour créer l'investissement : [URL] »
|
||||
(développement local, avec <code style={{ background: 'var(--surface-2)', padding: '1px 5px', borderRadius: 4 }}>crowdlending_fetch_url</code> activé)</li>
|
||||
<li>« Ai-je atteint mon objectif de versement pour {new Date().getFullYear()} ? »</li>
|
||||
@@ -691,7 +750,7 @@ export default function Aide() {
|
||||
</ul>
|
||||
<p style={{ marginBottom: 0 }}>
|
||||
Ces exemples fonctionnent aussi bien en dev qu'en prod dès lors que le serveur correspondant est connecté
|
||||
(voir les FAQ de configuration ci-dessus) — les huit premiers outils sont identiques dans les deux environnements.
|
||||
(voir les FAQ de configuration ci-dessus) — les neuf premiers outils sont identiques dans les deux environnements.
|
||||
</p>
|
||||
</FaqItem>
|
||||
|
||||
|
||||
@@ -183,7 +183,7 @@ function KpiCard({ title, value, badge, refValue, note, onClick, hint }) {
|
||||
}
|
||||
|
||||
/* ── KPI filtrés par année ── */
|
||||
function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activeId, activeView, soldePortefeuilleLive, correctionsTotal, investissements, allRembs, allReinvests, allSimulRembs }) {
|
||||
function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activeId, activeView, soldePortefeuilleLive, correctionsTotal, investissements, allRembs, allReinvests, allSimulRembs, allFraisOps }) {
|
||||
// Montant total déjà déclaré en perte définitive (tous statuts confondus,
|
||||
// seuls les dossiers passés en perte_definitive ont un capital_perdu > 0) —
|
||||
// affiché en complément du KPI "Capital en risque", qui les exclut déjà
|
||||
@@ -360,8 +360,19 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
interets_nets: acc.interets_nets + (r.interets_nets || 0),
|
||||
cashback: acc.cashback + (r.cashback || 0),
|
||||
}), { interets_nets: 0, cashback: 0 });
|
||||
return totals.interets_nets + totals.cashback + (correctionsTotal || 0);
|
||||
}, [rawDataGlobal, correctionsTotal]);
|
||||
// Frais réglés en dehors des montants déjà nettés (frais 'source' à la souscription,
|
||||
// et frais liés à un remboursement déjà déduits de interets_nets/net_recu) : mode
|
||||
// 'portefeuille' ou 'compte_courant' — vraie sortie d'argent pour l'investisseur,
|
||||
// jusque-là absente de ce total (même trou que celui corrigé sur le XIRR net à
|
||||
// l'Étape 5, cf. xirrGlobal plus bas — signalé par Olivier le 01/09/26).
|
||||
const idsGainNet = new Set((investissements || []).map(r => r.id));
|
||||
const fraisHorsRembTotal = (allFraisOps || []).reduce((sum, fo) => {
|
||||
if (!idsGainNet.has(fo.investissement_id)) return sum;
|
||||
if (fo.mode_reglement !== 'portefeuille' && fo.mode_reglement !== 'compte_courant') return sum;
|
||||
return sum + (fo.montant || 0);
|
||||
}, 0);
|
||||
return totals.interets_nets + totals.cashback + (correctionsTotal || 0) - fraisHorsRembTotal;
|
||||
}, [rawDataGlobal, correctionsTotal, investissements, allFraisOps]);
|
||||
|
||||
// Valeur "Gain net" telle qu'elle aurait été affichée fin du mois précédent —
|
||||
// on retire du cumul total la part perçue ce mois-ci (intérêts nets + cashback,
|
||||
@@ -369,9 +380,22 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
// n'ont pas de granularité mensuelle côté backend ; elles restent donc dans le
|
||||
// cumul "avant ce mois", ce qui est sans incidence pratique (montants marginaux).
|
||||
const gainNetPrevMonthEnd = useMemo(() => {
|
||||
const deltaCeMois = (thisMonthRow?.interets_nets || 0) + (thisMonthRow?.cashback || 0);
|
||||
// Même granularité mensuelle que interets_nets/cashback pour les frais hors
|
||||
// remboursement (portefeuille/compte_courant) : contrairement aux corrections de
|
||||
// solde (jamais datées finement), frais_operations porte une vraie date_operation —
|
||||
// on peut donc isoler la part du mois en cours plutôt que de la laisser polluer tout
|
||||
// le delta M vs M-1 (cf. gainNetTotal ci-dessus).
|
||||
const thisMonthStr = `${currentYear}-${String(currentMonth).padStart(2, '0')}`;
|
||||
const idsGainNet = new Set((investissements || []).map(r => r.id));
|
||||
const fraisCeMois = (allFraisOps || []).reduce((sum, fo) => {
|
||||
if (!idsGainNet.has(fo.investissement_id)) return sum;
|
||||
if (fo.mode_reglement !== 'portefeuille' && fo.mode_reglement !== 'compte_courant') return sum;
|
||||
if (!fo.date_operation?.startsWith(thisMonthStr)) return sum;
|
||||
return sum + (fo.montant || 0);
|
||||
}, 0);
|
||||
const deltaCeMois = (thisMonthRow?.interets_nets || 0) + (thisMonthRow?.cashback || 0) - fraisCeMois;
|
||||
return gainNetTotal - deltaCeMois;
|
||||
}, [gainNetTotal, thisMonthRow]);
|
||||
}, [gainNetTotal, thisMonthRow, currentYear, currentMonth, investissements, allFraisOps]);
|
||||
|
||||
// ── XIRR Global (réel + attendu) — depuis le début, indépendant du sélecteur
|
||||
// d'année (même logique que "Gain net depuis le début" ci-dessus). Reprend
|
||||
@@ -430,6 +454,16 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
flowsBrut.push({ amount: (rb.capital || 0) + (rb.cashback || 0) + (rb.interets_bruts || 0), date: d });
|
||||
flowsNet.push({ amount: rb.net_recu || 0, date: d });
|
||||
}
|
||||
// Frais réglés en dehors des montants déjà nettés (source à la souscription,
|
||||
// et frais liés à un remboursement déjà déduits de net_recu) : mode 'portefeuille'
|
||||
// ou 'compte_courant' — vraie sortie d'argent, comptée uniquement dans le XIRR NET.
|
||||
for (const fo of (allFraisOps || [])) {
|
||||
if (!ids.has(fo.investissement_id)) continue;
|
||||
if (fo.mode_reglement !== 'portefeuille' && fo.mode_reglement !== 'compte_courant') continue;
|
||||
const d = fo.date_operation?.slice(0, 10);
|
||||
if (!d || d > cutoff) continue;
|
||||
flowsNet.push({ amount: -(fo.montant || 0), date: d });
|
||||
}
|
||||
let estime = false;
|
||||
for (const r of invs) {
|
||||
const capInv = r.montant_investi + (reinvestCumulParInvGlobal[r.id] || 0);
|
||||
@@ -445,7 +479,7 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
flowsBrut.sort(byDate);
|
||||
flowsNet.sort(byDate);
|
||||
return { brut: xirr(flowsBrut), net: xirr(flowsNet), estime, cutoff };
|
||||
}, [investissements, allRembs, allReinvests, reinvestCumulParInvGlobal, capRembParInvGlobal]);
|
||||
}, [investissements, allRembs, allReinvests, allFraisOps, reinvestCumulParInvGlobal, capRembParInvGlobal]);
|
||||
|
||||
const xirrGlobalAttendu = useMemo(() => {
|
||||
const cutoff = today();
|
||||
@@ -472,6 +506,16 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
flowsBrut.push({ amount: (rb.capital || 0) + (rb.cashback || 0) + (rb.interets_bruts || 0), date: d });
|
||||
flowsNet.push({ amount: rb.net_recu || 0, date: d });
|
||||
}
|
||||
// Frais réglés en dehors des montants déjà nettés (source à la souscription,
|
||||
// et frais liés à un remboursement déjà déduits de net_recu) : mode 'portefeuille'
|
||||
// ou 'compte_courant' — vraie sortie d'argent, comptée uniquement dans le XIRR NET.
|
||||
for (const fo of (allFraisOps || [])) {
|
||||
if (!ids.has(fo.investissement_id)) continue;
|
||||
if (fo.mode_reglement !== 'portefeuille' && fo.mode_reglement !== 'compte_courant') continue;
|
||||
const d = fo.date_operation?.slice(0, 10);
|
||||
if (!d || d > cutoff) continue;
|
||||
flowsNet.push({ amount: -(fo.montant || 0), date: d });
|
||||
}
|
||||
const futureSimulParInv = {};
|
||||
for (const sr of (allSimulRembs || [])) {
|
||||
if (!ids.has(sr.investissement_id)) continue;
|
||||
@@ -504,7 +548,7 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
flowsNet.sort(byDate);
|
||||
return { brut: xirr(flowsBrut), net: xirr(flowsNet) };
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [investissements, allRembs, allReinvests, allSimulRembs, reinvestCumulParInvGlobal, capRembParInvGlobal, pfuRates]);
|
||||
}, [investissements, allRembs, allReinvests, allFraisOps, allSimulRembs, reinvestCumulParInvGlobal, capRembParInvGlobal, pfuRates]);
|
||||
|
||||
// ── Valeur affichée ──
|
||||
const getValue = (field) => {
|
||||
@@ -640,7 +684,7 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
/>
|
||||
<KpiCard
|
||||
title="Gain net depuis le début"
|
||||
hint="Intérêts nets + cashback + bonus parrainage/plateforme + corrections de solde, cumulés depuis le début — indépendant du capital encore investi ou du solde actuel sur les plateformes (reste juste même en cas de retrait complet)."
|
||||
hint="Intérêts nets + cashback + bonus parrainage/plateforme + corrections de solde, moins les frais réglés hors remboursement (porte-monnaie ou compte courant du détenteur), cumulés depuis le début — indépendant du capital encore investi ou du solde actuel sur les plateformes (reste juste même en cas de retrait complet)."
|
||||
value={fmtEUR(gainNetTotal)}
|
||||
badge={<TrendBadge current={gainNetTotal} prev={gainNetPrevMonthEnd} />}
|
||||
refValue={fmtEUR(gainNetPrevMonthEnd) + ' en ' + prevMonthLabel}
|
||||
@@ -648,10 +692,11 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
{(() => {
|
||||
const rendement = netMode ? xirrGlobal.net : xirrGlobal.brut;
|
||||
const rendementAttendu = netMode ? xirrGlobalAttendu.net : xirrGlobalAttendu.brut;
|
||||
const fraisExplication = ` Les frais réglés hors remboursement (via le porte-monnaie ou un compte courant) sont eux aussi comptés comme une sortie d'argent dans ce calcul net — en plus des frais déjà déduits à la source ou d'un remboursement, toujours pris en compte.`;
|
||||
const xirrExplication =
|
||||
`XIRR (taux de rendement interne actualisé) : taux annualisé calculé à partir de l'ensemble des flux réels datés ` +
|
||||
`des prêts du portefeuille (versements initiaux, réinvestissements, remboursements ${netMode ? 'nets, après fiscalité' : 'bruts, avant fiscalité'}), ` +
|
||||
`depuis le début. Chaque flux est pondéré par sa date exacte.\n\n` +
|
||||
`depuis le début. Chaque flux est pondéré par sa date exacte.` + (netMode ? fraisExplication : '') + `\n\n` +
|
||||
(xirrGlobal.estime
|
||||
? `Certains prêts ne sont pas encore soldés : leur capital restant dû est ajouté en flux final, valorisé à aujourd'hui — c'est donc une estimation, pas un taux définitif.`
|
||||
: 'Tous les prêts du portefeuille sont soldés : taux définitif.');
|
||||
@@ -660,7 +705,7 @@ function DashboardKpis({ portfolio, netMode, pfuRates, capitalMensuelData, activ
|
||||
`(ex. "Mon taux de rendement interne" chez Bienprêter, le %/an affiché chez La Première Brique), ce calcul suppose ` +
|
||||
`que toutes les échéances prévues (capital + intérêts) des prêts encore en cours seront honorées exactement à la ` +
|
||||
`date prévue par l'échéancier — contrairement au XIRR ci-dessus, qui valorise prudemment le capital restant dû ` +
|
||||
`"comme racheté aujourd'hui", sans compter les intérêts futurs.\n\n` +
|
||||
`"comme racheté aujourd'hui", sans compter les intérêts futurs.` + (netMode ? fraisExplication : '') + `\n\n` +
|
||||
`C'est donc une projection optimiste : elle ne tient pas compte d'un éventuel retard ou défaut de paiement ` +
|
||||
`(voir le KPI "Capital en risque" pour ce risque). Si un prêt n'a pas d'échéancier prévisionnel en base, il est ` +
|
||||
`valorisé de la même façon que dans le XIRR réel.`;
|
||||
@@ -736,6 +781,7 @@ export default function Dashboard() {
|
||||
const [allRembs, setAllRembs] = useState([]);
|
||||
const [allReinvests, setAllReinvests] = useState([]);
|
||||
const [allSimulRembs, setAllSimulRembs] = useState([]);
|
||||
const [allFraisOps, setAllFraisOps] = useState([]);
|
||||
const [drillRefreshKey, setDrillRefreshKey] = useState(0);
|
||||
|
||||
/* ── drillCell : cellule sélectionnée dans le TIP — par défaut mois courant toutes plateformes ── */
|
||||
@@ -792,6 +838,10 @@ export default function Dashboard() {
|
||||
api.get('/remboursements', scopeParams).then(setAllRembs).catch(() => setAllRembs([])),
|
||||
api.get('/reinvestissements', { scope: 'all' }).then(setAllReinvests).catch(() => setAllReinvests([])),
|
||||
api.get('/simul/all', scopeParams).then(setAllSimulRembs).catch(() => setAllSimulRembs([])),
|
||||
// Nécessaire au XIRR net (frais réglés par portefeuille/compte courant, cf. Étape 5) —
|
||||
// sans investissement_id, ne connaît que l'utilisateur (tous investisseurs), filtré
|
||||
// ensuite via `ids` au moment du calcul, même pattern que allFraisOps dans Plateformes.jsx.
|
||||
api.get('/frais-operations').then(setAllFraisOps).catch(() => setAllFraisOps([])),
|
||||
]);
|
||||
};
|
||||
|
||||
@@ -849,7 +899,7 @@ export default function Dashboard() {
|
||||
portfolio={portfolio} netMode={netMode} pfuRates={pfuRates} capitalMensuelData={capitalMensuelData}
|
||||
activeId={activeId} activeView={activeView} soldePortefeuilleLive={data?.solde_portefeuille_total ?? null}
|
||||
correctionsTotal={data?.corrections_total ?? 0} investissements={investissements}
|
||||
allRembs={allRembs} allReinvests={allReinvests} allSimulRembs={allSimulRembs}
|
||||
allRembs={allRembs} allReinvests={allReinvests} allSimulRembs={allSimulRembs} allFraisOps={allFraisOps}
|
||||
/>
|
||||
<YearSelectorKpi />
|
||||
</div>
|
||||
|
||||
@@ -124,6 +124,7 @@ export default function DepotsRetraits() {
|
||||
const [allRemb, setAllRemb] = useState([]);
|
||||
const [allInv, setAllInv] = useState([]);
|
||||
const [allReinvests, setAllReinvests] = useState([]);
|
||||
const [allFraisOps, setAllFraisOps] = useState([]); // frais_operations, tous investisseurs (filtré via invById, cf. reinvestissements)
|
||||
|
||||
const [allCorrections, setAllCorrections] = useState([]);
|
||||
const [deleteConfirm, setDeleteConfirm] = useState(null);
|
||||
@@ -176,7 +177,7 @@ export default function DepotsRetraits() {
|
||||
setDashData(null);
|
||||
const scopeParams = activeView === 'all' ? { scope: 'all' } : undefined;
|
||||
try {
|
||||
const [r, p, d, remb, inv, corr, reinvests] = await Promise.all([
|
||||
const [r, p, d, remb, inv, corr, reinvests, fraisOps] = await Promise.all([
|
||||
api.get('/depots-retraits', scopeParams),
|
||||
api.get('/plateformes'),
|
||||
api.get('/dashboard', scopeParams),
|
||||
@@ -186,9 +187,13 @@ export default function DepotsRetraits() {
|
||||
// Toujours scope 'all' — filtré côté client via allInv (déjà scopé) pour respecter
|
||||
// le même pattern que Plateformes.jsx (route /reinvestissements ne connaît que l'utilisateur).
|
||||
api.get('/reinvestissements', { scope: 'all' }),
|
||||
// /frais-operations sans investissement_id ne connaît lui aussi que l'utilisateur —
|
||||
// même pattern, filtré côté client via invById.
|
||||
api.get('/frais-operations').catch(() => []),
|
||||
]);
|
||||
setAllRows(r); setPlats(p); setDashData(d); setAllRemb(remb); setAllInv(inv); setAllCorrections(corr);
|
||||
setAllReinvests(Array.isArray(reinvests) ? reinvests : []);
|
||||
setAllFraisOps(Array.isArray(fraisOps) ? fraisOps : []);
|
||||
} catch (e) {
|
||||
console.error('DepotsRetraits load error:', e);
|
||||
} finally { setLoading(false); }
|
||||
@@ -453,6 +458,48 @@ export default function DepotsRetraits() {
|
||||
return true;
|
||||
}), [normalizedSouscriptionMouvements, filter.plateforme_ids, filter.year, filter.month]);
|
||||
|
||||
// Frais d'opération (Étape 3, 31/08/26) : une ligne débit par frais_operations, rattachée à
|
||||
// l'investissement concerné via investissement_id → invById (même pattern que les
|
||||
// réinvestissements : la route ne connaît que l'utilisateur, filtrage client via allInv déjà
|
||||
// scopé par investisseur actif). 'compte_courant' est affiché quand même (traçabilité) mais
|
||||
// n'a aucun effet sur le solde (cf. signedMontant dans MouvementsShared.jsx).
|
||||
const normalizedFraisMouvements = useMemo(() => {
|
||||
const out = [];
|
||||
for (const fr of allFraisOps) {
|
||||
const inv = invById.get(fr.investissement_id);
|
||||
if (!inv) continue; // hors scope investisseur actif
|
||||
out.push({
|
||||
id: `frais_${fr.id}`,
|
||||
_fraisId: fr.id,
|
||||
_invId: inv.id,
|
||||
_rembId: fr.remboursement_id || null,
|
||||
plateforme_id: inv.plateforme_id,
|
||||
plateforme_nom: inv.plateforme_nom,
|
||||
plateforme_detenteur_nom: inv.plateforme_detenteur_nom,
|
||||
date_operation: fr.date_operation,
|
||||
type: 'frais',
|
||||
montant: fr.montant,
|
||||
mode_reglement: fr.mode_reglement,
|
||||
compte_nom: fr.compte_nom || null,
|
||||
origine: fr.origine,
|
||||
categorie: fr.categorie,
|
||||
libelle: inv.nom_projet || '',
|
||||
source: 'frais_operation',
|
||||
investisseur_id: inv.investisseur_id ?? null,
|
||||
notes: fr.notes || '',
|
||||
});
|
||||
}
|
||||
return out;
|
||||
}, [allFraisOps, invById]);
|
||||
|
||||
const filteredFraisMouvements = useMemo(() => normalizedFraisMouvements.filter(r => {
|
||||
if (filter.plateforme_ids.length > 0 && !filter.plateforme_ids.includes(String(r.plateforme_id))) return false;
|
||||
const [y, m] = r.date_operation.split('-');
|
||||
if (filter.year && y !== filter.year) return false;
|
||||
if (filter.month && m !== filter.month.padStart(2,'0')) return false;
|
||||
return true;
|
||||
}), [normalizedFraisMouvements, filter.plateforme_ids, filter.year, filter.month]);
|
||||
|
||||
// Solde indicatif du porte-monnaie après chaque mouvement — calculé sur l'historique
|
||||
// COMPLET et NON FILTRÉ (allRows/normalizedCorrections/normalizedRembMouvements/
|
||||
// normalizedSouscriptionMouvements, pas rows/filteredCorrections/...), sinon le cumul
|
||||
@@ -461,7 +508,8 @@ export default function DepotsRetraits() {
|
||||
// Voir [[project_mouvements_solde_indicatif]].
|
||||
const soldeIndicatifByRowId = useMemo(() => computeSoldeIndicatifMap([
|
||||
...allRows, ...normalizedCorrections, ...normalizedRembMouvements, ...normalizedSouscriptionMouvements,
|
||||
]), [allRows, normalizedCorrections, normalizedRembMouvements, normalizedSouscriptionMouvements]);
|
||||
...normalizedFraisMouvements,
|
||||
]), [allRows, normalizedCorrections, normalizedRembMouvements, normalizedSouscriptionMouvements, normalizedFraisMouvements]);
|
||||
|
||||
// tableRows : dépôts/retraits + corrections + remboursements/bonus + souscriptions, triés par date desc.
|
||||
// _projet : nom du projet quand cela a du sens (remboursement, souscription/réinvestissement,
|
||||
@@ -480,9 +528,12 @@ export default function DepotsRetraits() {
|
||||
const subPart = filteredSouscriptionMouvements
|
||||
.filter(r => !filter.type || r.type === filter.type)
|
||||
.map(r => ({ ...r, _projet: r.libelle || '' }));
|
||||
return sortMouvements([...drPart, ...corrPart, ...rembPart, ...subPart])
|
||||
const fraisPart = filteredFraisMouvements
|
||||
.filter(r => !filter.type || r.type === filter.type)
|
||||
.map(r => ({ ...r, _projet: r.libelle || '' }));
|
||||
return sortMouvements([...drPart, ...corrPart, ...rembPart, ...subPart, ...fraisPart])
|
||||
.map(r => ({ ...r, _soldeIndicatif: soldeIndicatifByRowId.get(r.id) }));
|
||||
}, [rows, filteredCorrections, filteredRembMouvements, filteredSouscriptionMouvements, filter.type, rembProjetById, soldeIndicatifByRowId]);
|
||||
}, [rows, filteredCorrections, filteredRembMouvements, filteredSouscriptionMouvements, filteredFraisMouvements, filter.type, rembProjetById, soldeIndicatifByRowId]);
|
||||
|
||||
/* ── Pagination mouvements ── */
|
||||
const {
|
||||
@@ -1296,6 +1347,7 @@ export default function DepotsRetraits() {
|
||||
<option value="cashback">Cashback</option>
|
||||
<option value="interets_plateforme">Intérêts plateforme</option>
|
||||
<option value="souscription">Souscriptions</option>
|
||||
<option value="frais">Frais d'opération</option>
|
||||
<option value="prelevement_ir">Prélèvements IR</option>
|
||||
<option value="prelevement_csg">Prélèvements CSG</option>
|
||||
<option value="prelevement_local">Prélèvements étranger</option>
|
||||
@@ -1508,6 +1560,55 @@ export default function DepotsRetraits() {
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
if (r.type === 'frais') {
|
||||
const horsPM = r.mode_reglement === 'compte_courant';
|
||||
const rembLinked = r.mode_reglement === 'remboursement';
|
||||
return (
|
||||
<tr key={r.id}
|
||||
className={`dr-row${selectedRow?.id === r.id ? ' dr-row-selected' : ''}`}
|
||||
onClick={() => setSelectedRow(selectedRow?.id === r.id ? null : r)}
|
||||
style={{ cursor: 'pointer', opacity: horsPM ? 0.75 : 1 }}>
|
||||
<td>{fmtDate(r.date_operation)}</td>
|
||||
<td>{r.plateforme_nom}</td>
|
||||
{multiDetenteur && <td className="text-muted" style={{ fontSize: 'var(--fs-sm)' }}>{r.plateforme_detenteur_nom || '—'}</td>}
|
||||
<td>
|
||||
<span style={{
|
||||
display: 'inline-block',
|
||||
fontSize: 11, fontWeight: 600, letterSpacing: '0.03em',
|
||||
padding: '2px 7px', borderRadius: 4,
|
||||
background: 'color-mix(in srgb, #f59e0b 15%, transparent)',
|
||||
color: '#f59e0b',
|
||||
}}>frais</span>
|
||||
{horsPM && (
|
||||
<span style={{
|
||||
marginLeft: 6,
|
||||
fontSize: 10, fontWeight: 600, letterSpacing: '0.03em',
|
||||
padding: '1px 5px', borderRadius: 3,
|
||||
background: 'var(--surface-2)',
|
||||
color: 'var(--text-muted)',
|
||||
verticalAlign: 'middle',
|
||||
}} title="Réglé via un compte courant — aucun effet sur le solde du porte-monnaie">HORS PM</span>
|
||||
)}
|
||||
{rembLinked && (
|
||||
<span style={{
|
||||
marginLeft: 6,
|
||||
fontSize: 10, fontWeight: 600, letterSpacing: '0.03em',
|
||||
padding: '1px 5px', borderRadius: 3,
|
||||
background: 'var(--surface-2)',
|
||||
color: 'var(--text-muted)',
|
||||
verticalAlign: 'middle',
|
||||
}} title="Déjà déduit du montant net du remboursement — aucun effet supplémentaire sur le solde du porte-monnaie">DÉDUIT REMB.</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="text-muted">{r._projet || '—'}</td>
|
||||
<td className={horsPM ? 'num text-muted' : 'num danger'}>
|
||||
− {fmtEUR(r.montant)}
|
||||
</td>
|
||||
<td className="num text-muted" style={{ fontStyle: 'italic' }}>{r._soldeIndicatif != null ? fmtEUR(r._soldeIndicatif) : '—'}</td>
|
||||
<td style={{ width: 36, textAlign: 'center' }} />
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
const isAuto = r.source === 'auto_remboursement';
|
||||
return (
|
||||
<tr key={r.id}
|
||||
|
||||
@@ -7,6 +7,7 @@ import Modal from '../components/Modal.jsx';
|
||||
import ConfirmModal from '../components/ConfirmModal.jsx';
|
||||
import RembFormModal from '../components/RembFormModal.jsx';
|
||||
import { COUNTRIES, FlagIcon } from '../components/CountrySelect.jsx';
|
||||
import PageIcon from '../components/PageIcon.jsx';
|
||||
import InvestissementFormModal from '../components/InvestissementFormModal.jsx';
|
||||
import { dayOfMonth } from '../utils/dateEcheances.js';
|
||||
import { fmtEUR, fmtPct, fmtDate, today, fmtOctets } from '../utils/format.js';
|
||||
@@ -21,6 +22,44 @@ const emptyForm = {
|
||||
echeance_fin_de_mois: false,
|
||||
methode_remboursement: '', nom_compte_courant: '', compte_id: '',
|
||||
categories_inv_ids: [], secteurs_inv_ids: [],
|
||||
// Frais liés à la plateforme (étape conditionnelle du formulaire, visible aussi en
|
||||
// modification depuis le 31/08/26 — cf. project_frais_operation.md). frais_id : id de
|
||||
// l'entrée frais_operations de catégorie 'souscription' déjà existante, pré-remplie par
|
||||
// openEdit ; pilote l'upsert au submit, jamais affiché tel quel dans le formulaire.
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '', frais_id: null,
|
||||
};
|
||||
|
||||
/** Formulaire du bloc "Frais d'opération" (cf. project_frais_operation.md) — indépendant du
|
||||
* formulaire principal de l'investissement, sa propre modale légère. Réservé aux catégories
|
||||
* gestion/distribution/autre : la catégorie "souscription" est unique par investissement et
|
||||
* se saisit/modifie uniquement depuis l'étape "Frais" du formulaire "Modifier l'investissement"
|
||||
* (décision Olivier, 31/08/26) — ce bloc ne l'affiche qu'en lecture seule. Saisie libre : la
|
||||
* date par défaut est celle du jour (pas la date de souscription — revu le 31/08/26 après un
|
||||
* premier essai qui la calait sur la souscription, jugé incohérent maintenant que ce bloc ne
|
||||
* gère plus cette catégorie). */
|
||||
function emptyFraisForm() {
|
||||
return { montant: '', mode_reglement: 'source', compte_id: '', date_operation: today(), notes: '', origine: 'manuel', categorie: 'autre' };
|
||||
}
|
||||
|
||||
const FRAIS_MODE_LABELS = {
|
||||
source: 'Déduit du versement lors de la souscription',
|
||||
portefeuille: 'Porte-monnaie',
|
||||
compte_courant: 'Débité du compte courant',
|
||||
remboursement: 'Déduit du remboursement',
|
||||
};
|
||||
const FRAIS_ORIGINE_LABELS = {
|
||||
souscription: 'Souscription',
|
||||
remboursement: 'Remboursement',
|
||||
manuel: 'Manuel',
|
||||
};
|
||||
// Catégorie de frais (31/08/26, demande Olivier) — cf. FRAIS_MODE_LABELS ci-dessus pour le
|
||||
// pattern. "Souscription" n'apparaît jamais dans le sélecteur de ce bloc (cf. doc ci-dessus),
|
||||
// seulement dans ce libellé pour l'affichage en lecture seule des entrées existantes.
|
||||
const FRAIS_CATEGORIE_LABELS = {
|
||||
souscription: 'Souscription',
|
||||
gestion: 'Gestion',
|
||||
distribution: 'Distribution',
|
||||
autre: 'Autre',
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -160,20 +199,37 @@ export default function InvestissementDetail() {
|
||||
const [docsMenu, setDocsMenu] = useState(null);
|
||||
const [docsErr, setDocsErr] = useState(null);
|
||||
const [uploadingDoc, setUploadingDoc] = useState(false);
|
||||
// Bloc "Frais d'opération" (traçabilité des frais liés à la plateforme, cf. project_frais_operation.md)
|
||||
const [fraisOperations, setFraisOperations] = useState([]);
|
||||
const [fraisMenu, setFraisMenu] = useState(null);
|
||||
const [fraisModalOpen, setFraisModalOpen] = useState(false);
|
||||
const [editingFraisId, setEditingFraisId] = useState(null);
|
||||
const [fraisForm, setFraisForm] = useState(emptyFraisForm());
|
||||
const [fraisErr, setFraisErr] = useState(null);
|
||||
const [comptesFraisInvestisseur, setComptesFraisInvestisseur] = useState([]);
|
||||
const [renamingDocId, setRenamingDocId] = useState(null);
|
||||
const [renameValue, setRenameValue] = useState('');
|
||||
const docFileInputRef = useRef(null);
|
||||
|
||||
// Charge les comptes du détenteur pour le formulaire "Frais d'opération"
|
||||
useEffect(() => {
|
||||
if (!fraisModalOpen || !inv?.investisseur_id) { setComptesFraisInvestisseur([]); return; }
|
||||
api.get(`/investissements/comptes-par-investisseur/${inv.investisseur_id}`)
|
||||
.then(comptes => setComptesFraisInvestisseur(comptes))
|
||||
.catch(() => setComptesFraisInvestisseur([]));
|
||||
}, [fraisModalOpen]); /* eslint-disable-next-line */
|
||||
|
||||
const load = async () => {
|
||||
setLoading(true);
|
||||
try {
|
||||
const [data, p, comptes, catInv, sectInv, docs] = await Promise.all([
|
||||
const [data, p, comptes, catInv, sectInv, docs, fraisOps] = await Promise.all([
|
||||
api.get(`/investissements/${id}`),
|
||||
api.get('/plateformes'),
|
||||
api.get('/investissements/comptes-courants'),
|
||||
api.get('/categories-inv'),
|
||||
api.get('/secteurs-inv'),
|
||||
api.get('/documents', { entity_type: 'investissement', entity_id: id }),
|
||||
api.get('/frais-operations', { investissement_id: id }).catch(() => []),
|
||||
]);
|
||||
setInv(data);
|
||||
setPlats(p);
|
||||
@@ -181,9 +237,18 @@ export default function InvestissementDetail() {
|
||||
setCategoriesInv(catInv);
|
||||
setSecteursInv(sectInv);
|
||||
setDocuments(docs);
|
||||
setFraisOperations(fraisOps);
|
||||
} finally { setLoading(false); }
|
||||
};
|
||||
|
||||
/** Recharge uniquement la liste des frais d'opération (après ajout/édition/suppression). */
|
||||
const refreshFraisOperations = async () => {
|
||||
try {
|
||||
const fraisOps = await api.get('/frais-operations', { investissement_id: id });
|
||||
setFraisOperations(fraisOps);
|
||||
} catch { /* la fiche reste utilisable même si le rafraîchissement échoue */ }
|
||||
};
|
||||
|
||||
/** Recharge uniquement la liste des documents (après upload/renommage/suppression) —
|
||||
* plus léger qu'un load() complet qui recharge aussi l'investissement, les plateformes,
|
||||
* les comptes courants et les catégories/secteurs. */
|
||||
@@ -258,6 +323,71 @@ export default function InvestissementDetail() {
|
||||
});
|
||||
};
|
||||
|
||||
/* ── Bloc "Frais d'opération" ──────────────────────────────────
|
||||
* Traçabilité des frais liés à la plateforme (entrée, gestion…), décorrélée de la modale
|
||||
* d'investissement — cf. project_frais_operation.md. Toute entrée créée ou modifiée ici est
|
||||
* indépendante de montant_investi : c'est à l'utilisateur d'ajuster ce dernier lui-même
|
||||
* (via "Modifier l'investissement") si un frais doit réduire le capital net.
|
||||
*/
|
||||
const openFraisModal = () => {
|
||||
setEditingFraisId(null);
|
||||
setFraisForm(emptyFraisForm());
|
||||
setFraisErr(null);
|
||||
setFraisModalOpen(true);
|
||||
};
|
||||
|
||||
// N'ouvre jamais cette modale pour une entrée de catégorie 'souscription' — le bouton
|
||||
// Modifier de la liste est masqué pour ces lignes (cf. rendu de la liste plus bas), donc
|
||||
// cette fonction n'est en pratique jamais appelée avec une telle entrée.
|
||||
const openEditFraisModal = (f) => {
|
||||
setEditingFraisId(f.id);
|
||||
setFraisForm({
|
||||
montant: f.montant,
|
||||
mode_reglement: f.mode_reglement,
|
||||
compte_id: f.compte_id || '',
|
||||
date_operation: f.date_operation,
|
||||
notes: f.notes || '',
|
||||
origine: f.origine || 'manuel',
|
||||
categorie: f.categorie || 'autre',
|
||||
});
|
||||
setFraisErr(null);
|
||||
setFraisModalOpen(true);
|
||||
};
|
||||
|
||||
const closeFraisModal = () => { setFraisModalOpen(false); setFraisErr(null); };
|
||||
|
||||
const submitFrais = async (e) => {
|
||||
e?.preventDefault?.();
|
||||
setFraisErr(null);
|
||||
try {
|
||||
const payload = {
|
||||
investissement_id: Number(id),
|
||||
montant: Number(fraisForm.montant),
|
||||
mode_reglement: fraisForm.mode_reglement,
|
||||
compte_id: fraisForm.mode_reglement === 'compte_courant' && fraisForm.compte_id ? Number(fraisForm.compte_id) : null,
|
||||
date_operation: fraisForm.date_operation,
|
||||
origine: fraisForm.origine || 'manuel',
|
||||
categorie: fraisForm.categorie || 'autre',
|
||||
notes: fraisForm.notes || undefined,
|
||||
};
|
||||
if (editingFraisId) await api.put(`/frais-operations/${editingFraisId}`, payload);
|
||||
else await api.post('/frais-operations', payload);
|
||||
closeFraisModal();
|
||||
await refreshFraisOperations();
|
||||
} catch (e) { setFraisErr(e.message); }
|
||||
};
|
||||
|
||||
const handleFraisDelete = (f) => {
|
||||
setRowDeleteConfirm({
|
||||
message: `Supprimer ce frais de ${fmtEUR(f.montant)} (${fmtDate(f.date_operation)}) ?`,
|
||||
onConfirm: async () => {
|
||||
await api.del(`/frais-operations/${f.id}`);
|
||||
setRowDeleteConfirm(null);
|
||||
await refreshFraisOperations();
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const handleDocDeleteAll = () => {
|
||||
setDocsMenu(null);
|
||||
setRowDeleteConfirm({
|
||||
@@ -353,8 +483,10 @@ export default function InvestissementDetail() {
|
||||
const year = parseInt(dateStr.slice(0, 4), 10);
|
||||
return pfuRates.find(r => r.annee === year) ?? getLastKnownRates();
|
||||
};
|
||||
const computeInteretsNets = (f) =>
|
||||
round2((Number(f.interets_bruts) || 0) - (Number(f.prelev_sociaux) || 0) - (Number(f.prelev_forfaitaire) || 0));
|
||||
const computeInteretsNets = (f) => {
|
||||
const fraisReduit = (!f.frais_mode_reglement || f.frais_mode_reglement === 'remboursement') ? (Number(f.frais_ttc) || 0) : 0;
|
||||
return round2((Number(f.interets_bruts) || 0) - fraisReduit - (Number(f.prelev_sociaux) || 0) - (Number(f.prelev_forfaitaire) || 0));
|
||||
};
|
||||
const computeNet = (f) =>
|
||||
round2((Number(f.capital) || 0) + (Number(f.cashback) || 0) + computeInteretsNets(f));
|
||||
|
||||
@@ -375,9 +507,15 @@ export default function InvestissementDetail() {
|
||||
next.interets_bruts = round2(Number(next.interets_bruts_avant_local) - Number(v));
|
||||
}
|
||||
|
||||
if (k === 'date_remb' || k === 'interets_bruts' || k === 'interets_bruts_avant_local' || k === 'taxe_locale') {
|
||||
if (k === 'date_remb' || k === 'interets_bruts' || k === 'interets_bruts_avant_local' || k === 'taxe_locale' || k === 'frais_ttc' || k === 'frais_mode_reglement') {
|
||||
const dateStr = k === 'date_remb' ? v : next.date_remb;
|
||||
const bruts = Number(next.interets_bruts) || 0;
|
||||
// Base imposable nette de frais (Étape 4, 31/08/26) — même formule que computeChamps()
|
||||
// côté backend et que POST /reprocess : les prélèvements doivent porter sur
|
||||
// (interets_bruts - frais_ttc), pas sur le brut seul, sous peine de sur-taxer le coupon
|
||||
// (confirmé par Olivier sur l'avis d'opéré Kyoseil-AM/Fundora du 02/07/2026). Depuis
|
||||
// l'Étape 5 bis (01/09/26), uniquement si le frais est retenu SUR ce remboursement.
|
||||
const fraisReduit = (!next.frais_mode_reglement || next.frais_mode_reglement === 'remboursement') ? (Number(next.frais_ttc) || 0) : 0;
|
||||
const bruts = round2((Number(next.interets_bruts) || 0) - fraisReduit);
|
||||
const rates = getRatesForYear(dateStr);
|
||||
if (rates) {
|
||||
next.prelev_sociaux = round2(bruts * rates.prelev_sociaux / 100);
|
||||
@@ -407,6 +545,8 @@ export default function InvestissementDetail() {
|
||||
interets_bruts_avant_local: hasLocalTax ? bruts : 0,
|
||||
taxe_locale,
|
||||
interets_bruts: brutsApresLocal,
|
||||
frais_mode_reglement: 'remboursement',
|
||||
frais_compte_id: '',
|
||||
prelev_sociaux: rates ? round2(baseRates * rates.prelev_sociaux / 100) : 0,
|
||||
prelev_forfaitaire: rates ? round2(baseRates * rates.impot_revenu / 100) : 0,
|
||||
statut: 'paye',
|
||||
@@ -420,6 +560,10 @@ export default function InvestissementDetail() {
|
||||
|
||||
const openEditRemb = (r) => {
|
||||
setEditingRembId(r.id);
|
||||
// Étape 5 bis (01/09/26) : le mode de règlement du frais n'est pas stocké sur le
|
||||
// remboursement lui-même mais sur la ligne frais_operations liée — recherchée dans
|
||||
// fraisOperations (déjà chargé pour le bloc 2b), par remboursement_id.
|
||||
const linkedFrais = fraisOperations.find(f => f.remboursement_id === r.id);
|
||||
setRembForm({
|
||||
date_remb: r.date_remb,
|
||||
capital: r.capital ?? 0,
|
||||
@@ -427,6 +571,9 @@ export default function InvestissementDetail() {
|
||||
interets_bruts_avant_local: r.interets_bruts_avant_local ?? 0,
|
||||
taxe_locale: r.taxe_locale ?? 0,
|
||||
interets_bruts: r.interets_bruts ?? 0,
|
||||
frais_ttc: r.frais_ttc ?? 0,
|
||||
frais_mode_reglement: linkedFrais?.mode_reglement || 'remboursement',
|
||||
frais_compte_id: String(linkedFrais?.compte_id || ''),
|
||||
prelev_sociaux: r.prelev_sociaux ?? 0,
|
||||
prelev_forfaitaire: r.prelev_forfaitaire ?? 0,
|
||||
statut: r.statut,
|
||||
@@ -451,6 +598,9 @@ export default function InvestissementDetail() {
|
||||
interets_bruts_avant_local: 0,
|
||||
taxe_locale: 0,
|
||||
interets_bruts: 0,
|
||||
frais_ttc: 0,
|
||||
frais_mode_reglement: 'remboursement',
|
||||
frais_compte_id: '',
|
||||
prelev_sociaux: 0,
|
||||
prelev_forfaitaire: 0,
|
||||
statut: 'paye',
|
||||
@@ -599,6 +749,9 @@ export default function InvestissementDetail() {
|
||||
interets_bruts_avant_local: Number(rembForm.interets_bruts_avant_local || 0),
|
||||
taxe_locale: Number(rembForm.taxe_locale || 0),
|
||||
interets_bruts: Number(rembForm.interets_bruts || 0),
|
||||
frais_ttc: Number(rembForm.frais_ttc || 0),
|
||||
frais_mode_reglement: rembForm.frais_mode_reglement || 'remboursement',
|
||||
frais_compte_id: rembForm.frais_mode_reglement === 'compte_courant' && rembForm.frais_compte_id ? Number(rembForm.frais_compte_id) : null,
|
||||
prelev_sociaux: Number(rembForm.prelev_sociaux || 0),
|
||||
prelev_forfaitaire: Number(rembForm.prelev_forfaitaire || 0),
|
||||
statut: rembForm.statut,
|
||||
@@ -624,7 +777,7 @@ export default function InvestissementDetail() {
|
||||
} catch (e) { setConfirmingRembDelete(false); setRembErr(e.message); }
|
||||
};
|
||||
|
||||
const openEdit = () => {
|
||||
const openEdit = async () => {
|
||||
const plat = plats.find(p => p.id === inv.plateforme_id);
|
||||
const platMethode = plat?.methode_remboursement;
|
||||
const resolvedMethode = platMethode && platMethode !== 'choix_investisseur'
|
||||
@@ -654,10 +807,31 @@ export default function InvestissementDetail() {
|
||||
pays_exposition: inv.pays_exposition || 'FR',
|
||||
categories_inv_ids: (inv.categories_inv || []).map(c => c.id),
|
||||
secteurs_inv_ids: (inv.secteurs_inv || []).map(s => s.id),
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '', frais_id: null,
|
||||
});
|
||||
lastValidSouscriptionRef.current = inv.date_souscription || '';
|
||||
setErr(null);
|
||||
setModalOpen(true);
|
||||
|
||||
// Pré-remplissage de l'étape "Frais" avec le frais de souscription déjà documenté pour cet
|
||||
// investissement, s'il existe — même logique que Investissements.jsx (cf.
|
||||
// project_frais_operation.md, catégorie 'souscription' unique par investissement).
|
||||
try {
|
||||
const fraisOps = await api.get('/frais-operations', { investissement_id: inv.id });
|
||||
const souscriptionFrais = (fraisOps || []).find(f => f.categorie === 'souscription');
|
||||
if (souscriptionFrais) {
|
||||
setForm(f => ({
|
||||
...f,
|
||||
frais_mode_saisie: 'montant',
|
||||
frais_valeur: souscriptionFrais.montant,
|
||||
frais_mode_reglement: souscriptionFrais.mode_reglement,
|
||||
frais_compte_id: souscriptionFrais.compte_id || '',
|
||||
frais_id: souscriptionFrais.id,
|
||||
}));
|
||||
}
|
||||
} catch {
|
||||
// Pré-remplissage best-effort — une erreur réseau ne doit pas empêcher l'édition.
|
||||
}
|
||||
};
|
||||
|
||||
/** Changement de plateforme dans le formulaire : résout la méthode de remboursement héritée
|
||||
@@ -678,10 +852,15 @@ export default function InvestissementDetail() {
|
||||
methode_remboursement: newMethode, compte_id: '',
|
||||
categories_inv_ids: platCats.map(c => c.id),
|
||||
secteurs_inv_ids: platSects.map(s => s.id),
|
||||
// Réinitialise la saisie de l'étape "Frais" (le référentiel de frais dépend de la
|
||||
// plateforme) — frais_id (l'entrée existante éventuelle) n'est PAS réinitialisé : il
|
||||
// reste lié à cet investissement, pas à la plateforme sélectionnée dans le formulaire.
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '',
|
||||
}));
|
||||
});
|
||||
} else {
|
||||
setForm(f => ({ ...f, plateforme_id: platId, methode_remboursement: newMethode, compte_id: '' }));
|
||||
setForm(f => ({ ...f, plateforme_id: platId, methode_remboursement: newMethode, compte_id: '',
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '' }));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -703,6 +882,20 @@ export default function InvestissementDetail() {
|
||||
return;
|
||||
}
|
||||
|
||||
// Frais liés à la plateforme (étape conditionnelle du formulaire, cf.
|
||||
// project_frais_operation.md) : montant_investi n'est JAMAIS réajusté automatiquement
|
||||
// ici (édition uniquement sur cette page — seule la création, dans Investissements.jsx,
|
||||
// ajuste le capital net) ; le frais est journalisé à part, en upsert (POST/PUT/DELETE
|
||||
// selon form.frais_id) après l'enregistrement principal.
|
||||
const platFraisType = plats.find(p => String(p.id) === String(form.plateforme_id))?.frais_plateforme;
|
||||
const hasFrais = platFraisType && platFraisType !== 'aucun'
|
||||
&& form.frais_valeur !== '' && Number(form.frais_valeur) > 0;
|
||||
const fraisTTC = hasFrais
|
||||
? Math.round((form.frais_mode_saisie === 'pourcentage'
|
||||
? Number(form.montant_investi) * Number(form.frais_valeur) / 100
|
||||
: Number(form.frais_valeur)) * 100) / 100
|
||||
: 0;
|
||||
|
||||
const payload = {
|
||||
investisseur_id: Number(form.investisseur_id) || undefined,
|
||||
plateforme_id: Number(form.plateforme_id),
|
||||
@@ -731,8 +924,32 @@ export default function InvestissementDetail() {
|
||||
api.put(`/investissements/${id}/categories-inv`, { ids: form.categories_inv_ids || [] }),
|
||||
api.put(`/investissements/${id}/secteurs-inv`, { ids: form.secteurs_inv_ids || [] }),
|
||||
]);
|
||||
|
||||
// Upsert du frais de souscription (catégorie unique par investissement) — même logique
|
||||
// que Investissements.jsx (cf. project_frais_operation.md).
|
||||
try {
|
||||
if (hasFrais) {
|
||||
const fraisPayload = {
|
||||
investissement_id: Number(id),
|
||||
montant: fraisTTC,
|
||||
mode_reglement: form.frais_mode_reglement,
|
||||
compte_id: form.frais_mode_reglement === 'compte_courant' && form.frais_compte_id ? Number(form.frais_compte_id) : null,
|
||||
date_operation: form.date_souscription,
|
||||
origine: 'souscription',
|
||||
categorie: 'souscription',
|
||||
};
|
||||
if (form.frais_id) await api.put(`/frais-operations/${form.frais_id}`, fraisPayload);
|
||||
else await api.post('/frais-operations', fraisPayload);
|
||||
} else if (form.frais_id) {
|
||||
await api.del(`/frais-operations/${form.frais_id}`);
|
||||
}
|
||||
} catch {
|
||||
// Non bloquant — rattrapable a posteriori depuis le bloc "Frais d'opération".
|
||||
}
|
||||
|
||||
close();
|
||||
await load();
|
||||
await refreshFraisOperations();
|
||||
} catch (e) { setErr(e.message); }
|
||||
};
|
||||
|
||||
@@ -886,6 +1103,12 @@ export default function InvestissementDetail() {
|
||||
const autoReinvActive = !!inv?.auto_reinvest;
|
||||
const hasReinvests = reinvs.length > 0 || autoReinvActive;
|
||||
const multiDetenteur = new Set(plats.map(p => p.investisseur_id)).size > 1;
|
||||
// Bloc "Frais d'opération" : visible si la plateforme facture des frais (référentiel
|
||||
// frais_plateforme ≠ 'aucun'), ou s'il existe déjà des frais journalisés (garde l'accès même
|
||||
// si la config de la plateforme change ensuite) — cf. project_frais_operation.md.
|
||||
const platFraisType = plats.find(p => p.id === inv?.plateforme_id)?.frais_plateforme;
|
||||
const showFraisCard = (platFraisType && platFraisType !== 'aucun') || fraisOperations.length > 0;
|
||||
const totalFrais = fraisOperations.reduce((sum, f) => sum + (f.montant || 0), 0);
|
||||
// Calculés depuis les remboursements chargés (la route /:id ne retourne pas ces agrégats)
|
||||
const capitalRembourse = remb.reduce((s, r) => s + (r.capital || 0), 0);
|
||||
// Capital déclaré en perte définitive (0 si non déclaré) — déduit du capital restant dû
|
||||
@@ -1036,6 +1259,13 @@ export default function InvestissementDetail() {
|
||||
const reinvOutflows = reinvs.map(r => ({ amount: -r.montant, date: r.date_reinvestissement }));
|
||||
// Valorisation à date du capital pas encore remboursé (uniquement pour l'estimation en cours)
|
||||
const valorisationAuj = rendementEstime && capRestant > 0 ? [{ amount: capRestant, date: todayStr }] : [];
|
||||
// Frais réglés en dehors des montants déjà nettés (source à la souscription,
|
||||
// et frais liés à un remboursement déjà déduits de net_recu) : mode 'portefeuille'
|
||||
// ou 'compte_courant' — vraie sortie d'argent, à compter comme un flux négatif
|
||||
// dans le XIRR NET uniquement (le brut reste "avant tout frais").
|
||||
const fraisOutflows = fraisOperations
|
||||
.filter(f => f.mode_reglement === 'portefeuille' || f.mode_reglement === 'compte_courant')
|
||||
.map(f => ({ amount: -(f.montant || 0), date: f.date_operation }));
|
||||
// Brut : capital + cashback + intérêts bruts (avant fiscalité)
|
||||
const cashflowsBrut = [
|
||||
{ amount: -inv.montant_investi, date: inv.date_souscription },
|
||||
@@ -1050,6 +1280,7 @@ export default function InvestissementDetail() {
|
||||
{ amount: -inv.montant_investi, date: inv.date_souscription },
|
||||
...reinvOutflows,
|
||||
...remb.map(r => ({ amount: r.net_recu, date: r.date_remb })),
|
||||
...fraisOutflows,
|
||||
...valorisationAuj,
|
||||
];
|
||||
rendementReel = xirr(cashflows);
|
||||
@@ -1068,6 +1299,7 @@ export default function InvestissementDetail() {
|
||||
{ amount: -inv.montant_investi, date: inv.date_souscription },
|
||||
...reinvOutflows,
|
||||
...remb.map(r => ({ amount: r.net_recu, date: r.date_remb })),
|
||||
...fraisOutflows,
|
||||
];
|
||||
for (const s of futureEcheances) {
|
||||
const rates = getRatesForYear(s.date_prevue);
|
||||
@@ -1159,10 +1391,11 @@ export default function InvestissementDetail() {
|
||||
{(() => {
|
||||
const rendement = netMode ? rendementReel : rendementReelBrut;
|
||||
const rendementAttenduAffiche = netMode ? rendementAttendu : rendementAttenduBrut;
|
||||
const fraisExplication = ` Les frais réglés hors remboursement (via le porte-monnaie ou un compte courant) sont eux aussi comptés comme une sortie d'argent dans ce calcul net — en plus des frais déjà déduits à la source ou d'un remboursement, toujours pris en compte.`;
|
||||
const xirrExplication =
|
||||
`XIRR (taux de rendement interne actualisé) : taux annualisé calculé à partir des flux réels datés ` +
|
||||
`(versement initial, réinvestissements, remboursements ${netMode ? 'nets, après fiscalité' : 'bruts, avant fiscalité'}). ` +
|
||||
`Chaque flux est pondéré par sa date exacte — deux prêts au même total mais versés à des rythmes différents auront un XIRR différent.\n\n` +
|
||||
`Chaque flux est pondéré par sa date exacte — deux prêts au même total mais versés à des rythmes différents auront un XIRR différent.` + (netMode ? fraisExplication : '') + `\n\n` +
|
||||
(rendementEstime
|
||||
? "Prêt pas encore soldé : le capital restant dû est ajouté en flux final, valorisé à la date du jour — c'est donc une estimation, pas un taux définitif."
|
||||
: 'Prêt intégralement remboursé : taux définitif.');
|
||||
@@ -1171,7 +1404,7 @@ export default function InvestissementDetail() {
|
||||
`(ex. "Mon taux de rendement interne" chez Bienprêter, le %/an affiché chez La Première Brique), ce calcul suppose ` +
|
||||
`que toutes les échéances prévues (capital + intérêts) encore à venir seront honorées exactement à la date prévue ` +
|
||||
`par l'échéancier — contrairement au XIRR ci-dessus, qui valorise prudemment le capital restant dû "comme racheté ` +
|
||||
`aujourd'hui", sans compter les intérêts futurs.\n\n` +
|
||||
`aujourd'hui", sans compter les intérêts futurs.` + (netMode ? fraisExplication : '') + `\n\n` +
|
||||
`C'est donc une projection optimiste : elle ne tient pas compte d'un éventuel retard ou défaut de paiement. Si ce ` +
|
||||
`prêt n'a pas d'échéancier prévisionnel en base, il est valorisé de la même façon que dans le XIRR réel.`;
|
||||
return (
|
||||
@@ -1552,6 +1785,102 @@ export default function InvestissementDetail() {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ── Frais d'opération ──────────────────────────────────────── */}
|
||||
{showFraisCard && (
|
||||
<div className="card" style={{ marginBottom: 16 }}>
|
||||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 16 }}>
|
||||
<h3 style={{ margin: 0 }}>
|
||||
Frais d'opération
|
||||
{fraisOperations.length > 0 && (
|
||||
<span className="text-muted" style={{ fontWeight: 400, fontSize: 13, marginLeft: 8 }}>
|
||||
Total : {fmtEUR(totalFrais)}
|
||||
</span>
|
||||
)}
|
||||
</h3>
|
||||
<button
|
||||
onClick={e => { e.stopPropagation(); const r = e.currentTarget.getBoundingClientRect(); setFraisMenu({ x: r.right, y: r.bottom }); }}
|
||||
style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: 30, height: 30, padding: 0, background: 'none', border: '1px solid var(--border)', borderRadius: 6, cursor: 'pointer', color: 'var(--text-muted)', flexShrink: 0 }}
|
||||
title="Actions"
|
||||
>
|
||||
<svg width="15" height="15" viewBox="0 0 24 24" fill="currentColor" stroke="none" aria-hidden="true">
|
||||
<circle cx="12" cy="5" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="12" cy="19" r="1.5"/>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{fraisOperations.length === 0 ? (
|
||||
<div style={{ color: 'var(--text-muted)', fontSize: 'var(--fs-sm)' }}>
|
||||
Aucun frais journalisé pour l'instant. Utilisez le menu <strong>⋮</strong> ci-dessus pour en ajouter un.
|
||||
</div>
|
||||
) : (
|
||||
<div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
|
||||
{fraisOperations.map(f => {
|
||||
// Catégorie 'souscription' : unique par investissement, modifiable uniquement
|
||||
// depuis l'étape "Frais" de "Modifier l'investissement" (décision Olivier,
|
||||
// 31/08/26) — le clic et l'icône Modifier redirigent vers ce formulaire plutôt
|
||||
// que d'ouvrir la modale légère de ce bloc.
|
||||
const isSouscription = f.categorie === 'souscription';
|
||||
// mode_reglement 'remboursement' (Étape 4, 31/08/26) : ligne générée/synchronisée
|
||||
// automatiquement depuis le champ "Frais" d'un remboursement (frais_ttc) — montant
|
||||
// déjà pris en compte dans le calcul fiscal du remboursement, donc jamais éditable
|
||||
// ni supprimable directement ici (désynchroniserait les deux). Redirige vers le
|
||||
// remboursement source, comme pour la catégorie 'souscription' vers le formulaire.
|
||||
// Étape 5 bis (01/09/26) : "lié à un remboursement" ne veut plus dire
|
||||
// mode_reglement === 'remboursement' — le frais peut être réglé à part
|
||||
// (portefeuille/compte courant) tout en restant géré depuis le remboursement.
|
||||
const isRembLinked = f.remboursement_id != null;
|
||||
const linkedRemb = isRembLinked ? remb.find(r => r.id === f.remboursement_id) : null;
|
||||
const goToLinkedRemb = () => { if (linkedRemb) openEditRemb(linkedRemb); };
|
||||
const isManaged = isSouscription || isRembLinked;
|
||||
const manageAction = isSouscription ? openEdit : goToLinkedRemb;
|
||||
const manageTitle = isSouscription
|
||||
? "Modifiable depuis « Modifier l'investissement »"
|
||||
: isRembLinked
|
||||
? 'Modifiable depuis le remboursement lié'
|
||||
: 'Cliquer pour modifier';
|
||||
return (
|
||||
<div key={f.id} style={{ display: 'flex', alignItems: 'center', gap: 10, padding: '8px 10px', borderRadius: 8, border: '1px solid var(--border)' }}>
|
||||
<PageIcon name="frais" size={45} style={{ marginRight: 0, flexShrink: 0 }} />
|
||||
<div style={{ flex: 1, minWidth: 0, cursor: 'pointer' }}
|
||||
onClick={() => isManaged ? manageAction() : openEditFraisModal(f)}
|
||||
title={isManaged ? manageTitle : 'Cliquer pour modifier'}>
|
||||
<div style={{ fontWeight: 500, fontSize: 'var(--fs-sm)' }}>
|
||||
{fmtEUR(f.montant)}
|
||||
<span className="text-muted" style={{ fontWeight: 400, marginLeft: 8 }}>
|
||||
{FRAIS_MODE_LABELS[f.mode_reglement] || f.mode_reglement}
|
||||
{f.mode_reglement === 'compte_courant' && f.compte_nom ? ` (${f.compte_nom})` : ''}
|
||||
</span>
|
||||
</div>
|
||||
<div style={{ fontSize: 12, color: 'var(--text-muted)' }}>
|
||||
{fmtDate(f.date_operation)} · {FRAIS_CATEGORIE_LABELS[f.categorie] || f.categorie}
|
||||
{f.notes ? ` · ${f.notes}` : ''}
|
||||
</div>
|
||||
</div>
|
||||
<button type="button"
|
||||
title={isManaged ? manageTitle : 'Modifier'}
|
||||
onClick={() => isManaged ? manageAction() : openEditFraisModal(f)}
|
||||
style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: 26, height: 26, padding: 0, background: 'none', border: 'none', borderRadius: 6, cursor: 'pointer', color: 'var(--text-muted)', flexShrink: 0 }}>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"/><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"/></svg>
|
||||
</button>
|
||||
{isRembLinked ? (
|
||||
<span title="Géré depuis le remboursement — modifiez ou videz le champ « Frais » du remboursement pour le retirer"
|
||||
style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: 26, height: 26, flexShrink: 0, color: 'var(--text-muted)' }}>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4"/><path d="M12 8h.01"/></svg>
|
||||
</span>
|
||||
) : (
|
||||
<button type="button" title="Supprimer" onClick={() => handleFraisDelete(f)}
|
||||
style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', width: 26, height: 26, padding: 0, background: 'none', border: 'none', borderRadius: 6, cursor: 'pointer', color: 'var(--danger)', flexShrink: 0 }}>
|
||||
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2L5 6"/><path d="M10 11v6"/><path d="M14 11v6"/><path d="M9 6V4a1 1 0 0 1 1-1h4a1 1 0 0 1 1 1v2"/></svg>
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ── Remboursements enregistrés ────────────────────────────── */}
|
||||
<div className="card" style={{ marginBottom: 16 }}>
|
||||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 12 }}>
|
||||
@@ -1621,17 +1950,46 @@ export default function InvestissementDetail() {
|
||||
{plats.find(p => p.id === inv?.plateforme_id)?.fiscalite === 'avec_fiscalite_locale' && plats.find(p => p.id === inv?.plateforme_id)?.taux_fiscalite_locale && (
|
||||
<td className="num">{r.taxe_locale ? fmtEUR(r.taxe_locale) : '—'}</td>
|
||||
)}
|
||||
<td
|
||||
className={tauxImpliciteApplicable ? 'num cell-tooltip' : 'num'}
|
||||
data-tooltip={(() => {
|
||||
if (!tauxImpliciteApplicable) return undefined;
|
||||
{(() => {
|
||||
// Icône uniquement si le frais réduit réellement ce montant (mode
|
||||
// 'remboursement', par défaut) — cf. RembFormModal.jsx, Étape 5 bis.
|
||||
const showFraisIcon = !netMode && !!r.frais_ttc && (!r.frais_mode_reglement || r.frais_mode_reglement === 'remboursement');
|
||||
const tooltipParts = [];
|
||||
if (tauxImpliciteApplicable) {
|
||||
const ti = tauxImpliciteByRembId.get(r.id);
|
||||
if (!ti || !(ti.base > 0)) return 'Taux implicite non calculable (capital restant nul ou inconnu)';
|
||||
return `Taux annuel implicite (calculé sur ce versement)\nBrut : ${fmtPct(ti.tauxBrut)}\nNet : ${fmtPct(ti.tauxNet)}\nBase (capital restant dû) : ${fmtEUR(ti.base)}`;
|
||||
})()}
|
||||
>
|
||||
{fmtEUR(netMode ? r.interets_nets : r.interets_bruts)}
|
||||
</td>
|
||||
tooltipParts.push(!ti || !(ti.base > 0)
|
||||
? 'Taux implicite non calculable (capital restant nul ou inconnu)'
|
||||
: `Taux annuel implicite (calculé sur ce versement)\nBrut : ${fmtPct(ti.tauxBrut)}\nNet : ${fmtPct(ti.tauxNet)}\nBase (capital restant dû) : ${fmtEUR(ti.base)}`);
|
||||
}
|
||||
if (showFraisIcon) {
|
||||
tooltipParts.push(
|
||||
`Intérêts bruts avant frais : ${fmtEUR(r.interets_bruts)}\n` +
|
||||
`Frais de distribution : -${fmtEUR(r.frais_ttc)}\n` +
|
||||
`Base après frais (avant prélèvements) : ${fmtEUR(round2(r.interets_bruts - r.frais_ttc))}\n` +
|
||||
`Prélèv. sociaux : ${fmtEUR(r.prelev_sociaux)}\n` +
|
||||
`Impôt sur le revenu : ${fmtEUR(r.prelev_forfaitaire)}\n` +
|
||||
`Montant net reçu : ${fmtEUR(r.net_recu)}`
|
||||
);
|
||||
}
|
||||
const tooltip = tooltipParts.length ? tooltipParts.join('\n\n') : undefined;
|
||||
return (
|
||||
<td
|
||||
className={tooltip ? 'num cell-tooltip' : 'num'}
|
||||
data-tooltip={tooltip}
|
||||
>
|
||||
{fmtEUR(netMode ? r.interets_nets : r.interets_bruts)}
|
||||
{showFraisIcon && (
|
||||
<span style={{ marginLeft: 5, color: 'var(--warning, #b45309)', verticalAlign: 'middle' }}>
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
||||
<circle cx="12" cy="12" r="10" />
|
||||
<line x1="12" y1="16" x2="12" y2="12" />
|
||||
<line x1="12" y1="8" x2="12.01" y2="8" />
|
||||
</svg>
|
||||
</span>
|
||||
)}
|
||||
</td>
|
||||
);
|
||||
})()}
|
||||
<td className="num">{fmtEUR(r.cashback)}</td>
|
||||
{showImpositionDetail && <td className="num">{fmtEUR(r.prelev_forfaitaire)}</td>}
|
||||
{showImpositionDetail && <td className="num">{fmtEUR(r.prelev_sociaux)}</td>}
|
||||
@@ -2879,6 +3237,98 @@ export default function InvestissementDetail() {
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* ── Menu ⋮ bloc "Frais d'opération" ── */}
|
||||
{fraisMenu && (
|
||||
<>
|
||||
<div style={{ position: 'fixed', inset: 0, zIndex: 299 }} onClick={() => setFraisMenu(null)} />
|
||||
<div style={{
|
||||
position: 'fixed', left: fraisMenu.x, top: fraisMenu.y,
|
||||
transform: 'translateX(-100%) translateY(4px)',
|
||||
zIndex: 300,
|
||||
background: 'var(--surface)', border: '1px solid var(--border)',
|
||||
borderRadius: 8, boxShadow: '0 4px 20px rgba(0,0,0,0.15)',
|
||||
padding: '4px 0', minWidth: 200,
|
||||
}}>
|
||||
<button
|
||||
style={{ display: 'flex', alignItems: 'center', gap: 8, width: '100%', padding: '8px 14px', background: 'none', border: 'none', cursor: 'pointer', fontSize: 'var(--fs-sm)', color: 'var(--text)', textAlign: 'left' }}
|
||||
onMouseEnter={e => e.currentTarget.style.background = 'var(--surface-2)'}
|
||||
onMouseLeave={e => e.currentTarget.style.background = 'none'}
|
||||
onClick={() => { setFraisMenu(null); openFraisModal(); }}>
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round"><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></svg>
|
||||
Ajouter un frais
|
||||
</button>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* ── Modale "Frais d'opération" (ajout / édition) ─────────────── */}
|
||||
<Modal
|
||||
open={fraisModalOpen}
|
||||
title={editingFraisId ? 'Modifier le frais' : 'Ajouter un frais'}
|
||||
onClose={closeFraisModal}
|
||||
width={480}
|
||||
footer={
|
||||
<>
|
||||
<button className="ghost" onClick={closeFraisModal}>Annuler</button>
|
||||
<button className="primary" onClick={submitFrais}>{editingFraisId ? 'Enregistrer' : 'Ajouter'}</button>
|
||||
</>
|
||||
}
|
||||
>
|
||||
<form onSubmit={submitFrais}>
|
||||
{fraisErr && <div className="error">{fraisErr}</div>}
|
||||
<div className="form-grid">
|
||||
<div>
|
||||
<label>Montant TTC (€) *</label>
|
||||
<input type="number" step="0.01" min="0" required value={fraisForm.montant}
|
||||
onChange={e => setFraisForm(f => ({ ...f, montant: e.target.value }))} />
|
||||
</div>
|
||||
<div>
|
||||
<label>Date de l'opération *</label>
|
||||
<input type="date" required value={fraisForm.date_operation}
|
||||
onChange={e => setFraisForm(f => ({ ...f, date_operation: e.target.value }))} />
|
||||
</div>
|
||||
<div style={{ gridColumn: 'span 2' }}>
|
||||
<label>Catégorie</label>
|
||||
<select value={fraisForm.categorie} onChange={e => setFraisForm(f => ({ ...f, categorie: e.target.value }))}>
|
||||
<option value="gestion">Gestion</option>
|
||||
<option value="distribution">Distribution</option>
|
||||
<option value="autre">Autre</option>
|
||||
</select>
|
||||
</div>
|
||||
<div style={{ gridColumn: 'span 2' }}>
|
||||
<label>Prélèvement</label>
|
||||
<select value={fraisForm.mode_reglement}
|
||||
onChange={e => setFraisForm(f => ({ ...f, mode_reglement: e.target.value, compte_id: e.target.value === 'compte_courant' ? f.compte_id : '' }))}>
|
||||
<option value="source">À la source (sans mouvement complémentaire)</option>
|
||||
<option value="portefeuille">Versement complémentaire — Porte-monnaie de la plateforme</option>
|
||||
<option value="compte_courant">Versement complémentaire — Compte courant du détenteur</option>
|
||||
</select>
|
||||
</div>
|
||||
{fraisForm.mode_reglement === 'compte_courant' && (
|
||||
<div style={{ gridColumn: 'span 2' }}>
|
||||
<label>Compte de règlement *</label>
|
||||
{comptesFraisInvestisseur.length > 0 ? (
|
||||
<select required value={fraisForm.compte_id} onChange={e => setFraisForm(f => ({ ...f, compte_id: e.target.value }))}>
|
||||
<option value="">— Choisir un compte —</option>
|
||||
{comptesFraisInvestisseur.map(c => (
|
||||
<option key={c.id} value={c.id}>{c.nom}{c.banque ? ` — ${c.banque}` : ''}</option>
|
||||
))}
|
||||
</select>
|
||||
) : (
|
||||
<p className="text-muted" style={{ fontSize: 'var(--fs-sm)', margin: '4px 0' }}>
|
||||
Aucun compte défini pour ce détenteur. <a href="/settings?section=comptes" target="_blank" rel="noreferrer">Créer un compte →</a>
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
<div style={{ gridColumn: 'span 2' }}>
|
||||
<label>Notes</label>
|
||||
<input value={fraisForm.notes} onChange={e => setFraisForm(f => ({ ...f, notes: e.target.value }))} placeholder="Précisions optionnelles…" />
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</Modal>
|
||||
|
||||
<ConfirmModal
|
||||
open={!!rowDeleteConfirm}
|
||||
message={rowDeleteConfirm?.message}
|
||||
|
||||
@@ -239,6 +239,11 @@ const empty = {
|
||||
statut: 'en_cours', reference: '', notes: '',
|
||||
echeance_fin_de_mois: false, methode_remboursement: '', nom_compte_courant: '', compte_id: '', pays_exposition: 'FR',
|
||||
categories_inv_ids: [], secteurs_inv_ids: [],
|
||||
// Frais liés à la plateforme (étape conditionnelle, visible création ET modification —
|
||||
// cf. project_frais_operation.md). frais_id : id de l'entrée frais_operations de catégorie
|
||||
// 'souscription' déjà existante pour cet investissement (pré-remplie par openEdit), null si
|
||||
// aucune — pilote l'upsert (POST/PUT/DELETE) au submit, jamais affiché dans le formulaire.
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '', frais_id: null,
|
||||
};
|
||||
|
||||
/* ── Composant principal ─────────────────────────────────────── */
|
||||
@@ -702,9 +707,31 @@ export default function Investissements() {
|
||||
pays_exposition: row.pays_exposition || 'FR',
|
||||
categories_inv_ids: (row.categories_inv || []).map(c => c.id),
|
||||
secteurs_inv_ids: (row.secteurs_inv || []).map(s => s.id),
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '', frais_id: null,
|
||||
});
|
||||
setErr(null);
|
||||
setModalOpen(true);
|
||||
|
||||
// Pré-remplissage de l'étape "Frais" avec le frais de souscription déjà documenté pour cet
|
||||
// investissement, s'il existe (catégorie 'souscription', unique par investissement — cf.
|
||||
// project_frais_operation.md). Chargé après l'ouverture de la modale pour ne pas bloquer
|
||||
// l'affichage ; mise à jour du form dès la réponse.
|
||||
try {
|
||||
const fraisOps = await api.get('/frais-operations', { investissement_id: row.id });
|
||||
const souscriptionFrais = (fraisOps || []).find(f => f.categorie === 'souscription');
|
||||
if (souscriptionFrais) {
|
||||
setForm(f => ({
|
||||
...f,
|
||||
frais_mode_saisie: 'montant',
|
||||
frais_valeur: souscriptionFrais.montant,
|
||||
frais_mode_reglement: souscriptionFrais.mode_reglement,
|
||||
frais_compte_id: souscriptionFrais.compte_id || '',
|
||||
frais_id: souscriptionFrais.id,
|
||||
}));
|
||||
}
|
||||
} catch {
|
||||
// Pré-remplissage best-effort — une erreur réseau ne doit pas empêcher l'édition.
|
||||
}
|
||||
};
|
||||
|
||||
/** Changement de plateforme dans le formulaire : résout la méthode de remboursement,
|
||||
@@ -724,10 +751,12 @@ export default function Investissements() {
|
||||
methode_remboursement: newMethode, compte_id: '',
|
||||
categories_inv_ids: platCats.map(c => c.id),
|
||||
secteurs_inv_ids: platSects.map(s => s.id),
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '',
|
||||
}));
|
||||
});
|
||||
} else {
|
||||
setForm(f => ({ ...f, plateforme_id: platId, investisseur_id: investisseurForPlat(platId), methode_remboursement: newMethode, compte_id: '', categories_inv_ids: [], secteurs_inv_ids: [] }));
|
||||
setForm(f => ({ ...f, plateforme_id: platId, investisseur_id: investisseurForPlat(platId), methode_remboursement: newMethode, compte_id: '', categories_inv_ids: [], secteurs_inv_ids: [],
|
||||
frais_mode_saisie: 'montant', frais_valeur: '', frais_mode_reglement: 'source', frais_compte_id: '' }));
|
||||
}
|
||||
};
|
||||
|
||||
@@ -751,6 +780,26 @@ export default function Investissements() {
|
||||
return;
|
||||
}
|
||||
|
||||
// Frais liés à la plateforme (étape conditionnelle, création ET modification — le bloc
|
||||
// "Frais d'opération" de la fiche investissement reste le lieu pour les frais de
|
||||
// catégorie gestion/distribution/autre, cf. project_frais_operation.md) : à la création,
|
||||
// si prélevés "à la source", le capital net (montant investi diminué des frais) est ce
|
||||
// qui est enregistré comme montant_investi ; en modification, montant_investi n'est
|
||||
// JAMAIS réajusté automatiquement (demande explicite d'Olivier, 31/08/26) — c'est à
|
||||
// l'utilisateur de l'ajuster lui-même à l'étape 1 si besoin. Dans les deux cas, le frais
|
||||
// est journalisé (POST/PUT/DELETE selon form.frais_id) après l'enregistrement principal.
|
||||
const platFraisType = plats.find(p => String(p.id) === String(form.plateforme_id))?.frais_plateforme;
|
||||
const hasFrais = platFraisType && platFraisType !== 'aucun'
|
||||
&& form.frais_valeur !== '' && Number(form.frais_valeur) > 0;
|
||||
const fraisTTC = hasFrais
|
||||
? Math.round((form.frais_mode_saisie === 'pourcentage'
|
||||
? Number(form.montant_investi) * Number(form.frais_valeur) / 100
|
||||
: Number(form.frais_valeur)) * 100) / 100
|
||||
: 0;
|
||||
const montantInvestiFinal = !editingId && hasFrais && form.frais_mode_reglement === 'source'
|
||||
? Math.max(0, Math.round((Number(form.montant_investi) - fraisTTC) * 100) / 100)
|
||||
: Number(form.montant_investi);
|
||||
|
||||
const payload = {
|
||||
investisseur_id: Number(form.investisseur_id) || undefined,
|
||||
plateforme_id: Number(form.plateforme_id),
|
||||
@@ -759,7 +808,7 @@ export default function Investissements() {
|
||||
date_souscription: form.date_souscription,
|
||||
date_premiere_echeance: form.date_premiere_echeance || '',
|
||||
date_cible: form.date_cible || '',
|
||||
montant_investi: Number(form.montant_investi),
|
||||
montant_investi: montantInvestiFinal,
|
||||
taux_interet: form.taux_interet === '' ? undefined : Number(form.taux_interet),
|
||||
duree_mois: form.duree_mois === '' ? undefined : Number(form.duree_mois),
|
||||
type_remb: form.type_remb || '',
|
||||
@@ -779,6 +828,31 @@ export default function Investissements() {
|
||||
api.put(`/investissements/${editingId}/categories-inv`, { ids: form.categories_inv_ids || [] }),
|
||||
api.put(`/investissements/${editingId}/secteurs-inv`, { ids: form.secteurs_inv_ids || [] }),
|
||||
]);
|
||||
|
||||
// Upsert du frais de souscription (catégorie unique par investissement) : PUT si déjà
|
||||
// chargé via form.frais_id (pré-rempli par openEdit), POST sinon ; DELETE si le montant
|
||||
// a été vidé alors qu'une entrée existait — best-effort, n'empêche jamais l'édition
|
||||
// principale de l'investissement.
|
||||
try {
|
||||
if (hasFrais) {
|
||||
const fraisPayload = {
|
||||
investissement_id: editingId,
|
||||
montant: fraisTTC,
|
||||
mode_reglement: form.frais_mode_reglement,
|
||||
compte_id: form.frais_mode_reglement === 'compte_courant' && form.frais_compte_id ? Number(form.frais_compte_id) : null,
|
||||
date_operation: form.date_souscription,
|
||||
origine: 'souscription',
|
||||
categorie: 'souscription',
|
||||
};
|
||||
if (form.frais_id) await api.put(`/frais-operations/${form.frais_id}`, fraisPayload);
|
||||
else await api.post('/frais-operations', fraisPayload);
|
||||
} else if (form.frais_id) {
|
||||
await api.del(`/frais-operations/${form.frais_id}`);
|
||||
}
|
||||
} catch {
|
||||
// Non bloquant — rattrapable a posteriori depuis le bloc "Frais d'opération".
|
||||
}
|
||||
|
||||
close(); await load();
|
||||
} else {
|
||||
const created = await api.post('/investissements', payload);
|
||||
@@ -787,6 +861,23 @@ export default function Investissements() {
|
||||
api.put(`/investissements/${created.id}/secteurs-inv`, { ids: form.secteurs_inv_ids || [] }),
|
||||
]);
|
||||
|
||||
if (hasFrais) {
|
||||
try {
|
||||
await api.post('/frais-operations', {
|
||||
investissement_id: created.id,
|
||||
montant: fraisTTC,
|
||||
mode_reglement: form.frais_mode_reglement,
|
||||
compte_id: form.frais_mode_reglement === 'compte_courant' && form.frais_compte_id ? Number(form.frais_compte_id) : null,
|
||||
date_operation: form.date_souscription,
|
||||
origine: 'souscription',
|
||||
categorie: 'souscription',
|
||||
});
|
||||
} catch {
|
||||
// Frais non journalisés (erreur réseau…) — n'empêche pas la création de l'investissement,
|
||||
// qui a déjà pris en compte le capital net le cas échéant. Rattrapable a posteriori.
|
||||
}
|
||||
}
|
||||
|
||||
// Contrôle du porte-monnaie — création uniquement (jamais en édition). Le solde
|
||||
// recalculé APRÈS création tient déjà compte du capital de ce nouvel investissement
|
||||
// (formule officielle, cf. mémoire project_solde_portefeuille) : s'il ressort négatif,
|
||||
|
||||
@@ -298,6 +298,7 @@ export default function Plateformes() {
|
||||
const [plats, setPlats] = useState([]);
|
||||
const [allDepots, setAllDepots] = useState([]);
|
||||
const [allCorrections, setAllCorrections] = useState([]);
|
||||
const [allFraisOps, setAllFraisOps] = useState([]); // frais_operations, tous investisseurs (filtré via mvInvById)
|
||||
const [loading, setLoading] = useState(false);
|
||||
// Snapshots backend du solde porte-monnaie par plateforme, clé 'live' ou 'YYYY-12-31'
|
||||
// (GET /dashboard[?asOf=]) — remplace le recalcul client historique de
|
||||
@@ -369,7 +370,7 @@ export default function Plateformes() {
|
||||
setLoading(true);
|
||||
try {
|
||||
const scopeParams = activeView === 'all' ? { scope: 'all' } : {};
|
||||
const [rows, p, rembs, reinvests, depots, corrections, simulRembs, pfu] = await Promise.all([
|
||||
const [rows, p, rembs, reinvests, depots, corrections, simulRembs, pfu, fraisOps] = await Promise.all([
|
||||
api.get('/investissements', scopeParams),
|
||||
api.get('/plateformes'),
|
||||
api.get('/remboursements', scopeParams),
|
||||
@@ -378,6 +379,9 @@ export default function Plateformes() {
|
||||
api.get('/corrections', scopeParams),
|
||||
api.get('/simul/all', scopeParams),
|
||||
api.get('/pfu'),
|
||||
// /frais-operations sans investissement_id ne connaît lui aussi que l'utilisateur —
|
||||
// même pattern que /reinvestissements, filtré côté client via mvInvById.
|
||||
api.get('/frais-operations').catch(() => []),
|
||||
]);
|
||||
setAllRows(rows);
|
||||
setPlats(p);
|
||||
@@ -387,6 +391,7 @@ export default function Plateformes() {
|
||||
setAllCorrections(corrections);
|
||||
setAllSimulRembs(Array.isArray(simulRembs) ? simulRembs : []);
|
||||
setPfuRates(Array.isArray(pfu) ? pfu : []);
|
||||
setAllFraisOps(Array.isArray(fraisOps) ? fraisOps : []);
|
||||
} finally { setLoading(false); setDrillRefreshKey(k => k + 1); }
|
||||
};
|
||||
|
||||
@@ -457,9 +462,15 @@ export default function Plateformes() {
|
||||
if (k === 'taxe_locale') {
|
||||
next.interets_bruts = round2(Number(next.interets_bruts_avant_local) - Number(v));
|
||||
}
|
||||
if (k === 'date_remb' || k === 'interets_bruts' || k === 'interets_bruts_avant_local' || k === 'taxe_locale') {
|
||||
if (k === 'date_remb' || k === 'interets_bruts' || k === 'interets_bruts_avant_local' || k === 'taxe_locale' || k === 'frais_ttc' || k === 'frais_mode_reglement') {
|
||||
const dateStr = k === 'date_remb' ? v : next.date_remb;
|
||||
const bruts = Number(next.interets_bruts) || 0;
|
||||
// Base imposable nette de frais (Étape 4, 31/08/26) — même formule que computeChamps()
|
||||
// côté backend et que POST /reprocess : les prélèvements doivent porter sur
|
||||
// (interets_bruts - frais_ttc), pas sur le brut seul, sous peine de sur-taxer le coupon
|
||||
// (confirmé par Olivier sur l'avis d'opéré Kyoseil-AM/Fundora du 02/07/2026). Depuis
|
||||
// l'Étape 5 bis (01/09/26), uniquement si le frais est retenu SUR ce remboursement.
|
||||
const fraisReduit = (!next.frais_mode_reglement || next.frais_mode_reglement === 'remboursement') ? (Number(next.frais_ttc) || 0) : 0;
|
||||
const bruts = round2((Number(next.interets_bruts) || 0) - fraisReduit);
|
||||
const rates = getRatesForYear(dateStr);
|
||||
if (rates) {
|
||||
next.prelev_sociaux = round2(bruts * rates.prelev_sociaux / 100);
|
||||
@@ -474,6 +485,10 @@ export default function Plateformes() {
|
||||
const inv = allRows.find(i => i.id === r.investissement_id);
|
||||
setRembInv(inv || null);
|
||||
setRembEditingId(r.id);
|
||||
// Étape 5 bis (01/09/26) : le mode de règlement du frais n'est pas stocké sur le
|
||||
// remboursement lui-même mais sur la ligne frais_operations liée — recherchée dans
|
||||
// allFraisOps déjà chargé, par remboursement_id.
|
||||
const linkedFrais = allFraisOps.find(f => f.remboursement_id === r.id);
|
||||
setRembForm({
|
||||
date_remb: r.date_remb,
|
||||
capital: r.capital ?? 0,
|
||||
@@ -481,6 +496,9 @@ export default function Plateformes() {
|
||||
interets_bruts_avant_local: r.interets_bruts_avant_local ?? 0,
|
||||
taxe_locale: r.taxe_locale ?? 0,
|
||||
interets_bruts: r.interets_bruts ?? 0,
|
||||
frais_ttc: r.frais_ttc ?? 0,
|
||||
frais_mode_reglement: linkedFrais?.mode_reglement || 'remboursement',
|
||||
frais_compte_id: String(linkedFrais?.compte_id || ''),
|
||||
prelev_sociaux: r.prelev_sociaux ?? 0,
|
||||
prelev_forfaitaire: r.prelev_forfaitaire ?? 0,
|
||||
statut: r.statut,
|
||||
@@ -514,6 +532,9 @@ export default function Plateformes() {
|
||||
interets_bruts_avant_local: hasLocalTax ? bruts : 0,
|
||||
taxe_locale,
|
||||
interets_bruts: brutsApresLocal,
|
||||
frais_ttc: 0,
|
||||
frais_mode_reglement: 'remboursement',
|
||||
frais_compte_id: '',
|
||||
prelev_sociaux: rates ? round2(brutsApresLocal * rates.prelev_sociaux / 100) : 0,
|
||||
prelev_forfaitaire: rates ? round2(brutsApresLocal * rates.impot_revenu / 100) : 0,
|
||||
statut: 'paye',
|
||||
@@ -549,6 +570,9 @@ export default function Plateformes() {
|
||||
interets_bruts_avant_local: Number(rembForm.interets_bruts_avant_local || 0),
|
||||
taxe_locale: Number(rembForm.taxe_locale || 0),
|
||||
interets_bruts: Number(rembForm.interets_bruts || 0),
|
||||
frais_ttc: Number(rembForm.frais_ttc || 0),
|
||||
frais_mode_reglement: rembForm.frais_mode_reglement || 'remboursement',
|
||||
frais_compte_id: rembForm.frais_mode_reglement === 'compte_courant' && rembForm.frais_compte_id ? Number(rembForm.frais_compte_id) : null,
|
||||
prelev_sociaux: Number(rembForm.prelev_sociaux || 0),
|
||||
prelev_forfaitaire: Number(rembForm.prelev_forfaitaire || 0),
|
||||
statut: rembForm.statut,
|
||||
@@ -892,6 +916,16 @@ export default function Plateformes() {
|
||||
flowsBrut.push({ amount: (rb.capital || 0) + (rb.cashback || 0) + (rb.interets_bruts || 0), date: d });
|
||||
flowsNet.push({ amount: rb.net_recu || 0, date: d });
|
||||
}
|
||||
// Frais réglés en dehors des montants déjà nettés (source à la souscription,
|
||||
// et frais liés à un remboursement déjà déduits de net_recu) : mode 'portefeuille'
|
||||
// ou 'compte_courant' — vraie sortie d'argent, comptée uniquement dans le XIRR NET.
|
||||
for (const fo of allFraisOps) {
|
||||
if (!ids.has(fo.investissement_id)) continue;
|
||||
if (fo.mode_reglement !== 'portefeuille' && fo.mode_reglement !== 'compte_courant') continue;
|
||||
const d = fo.date_operation?.slice(0, 10);
|
||||
if (!d || d > cutoff) continue;
|
||||
flowsNet.push({ amount: -(fo.montant || 0), date: d });
|
||||
}
|
||||
let estime = false;
|
||||
for (const r of chartRows) {
|
||||
const capInv = r.montant_investi + (reinvestCumulParInv[r.id] || 0);
|
||||
@@ -907,7 +941,7 @@ export default function Plateformes() {
|
||||
flowsBrut.sort(byDate);
|
||||
flowsNet.sort(byDate);
|
||||
return { brut: xirr(flowsBrut), net: xirr(flowsNet), estime, cutoff };
|
||||
}, [chartRows, allRembs, allReinvests, selectedYear, reinvestCumulParInv, capRembParInv]);
|
||||
}, [chartRows, allRembs, allReinvests, allFraisOps, selectedYear, reinvestCumulParInv, capRembParInv]);
|
||||
|
||||
/* ── XIRR "attendu" (théorique) — mêmes flux réels que ci-dessus, mais les prêts
|
||||
non soldés sont valorisés via leur échéancier prévisionnel (simul_remboursements)
|
||||
@@ -944,6 +978,16 @@ export default function Plateformes() {
|
||||
flowsBrut.push({ amount: (rb.capital || 0) + (rb.cashback || 0) + (rb.interets_bruts || 0), date: d });
|
||||
flowsNet.push({ amount: rb.net_recu || 0, date: d });
|
||||
}
|
||||
// Frais réglés en dehors des montants déjà nettés (source à la souscription,
|
||||
// et frais liés à un remboursement déjà déduits de net_recu) : mode 'portefeuille'
|
||||
// ou 'compte_courant' — vraie sortie d'argent, comptée uniquement dans le XIRR NET.
|
||||
for (const fo of allFraisOps) {
|
||||
if (!ids.has(fo.investissement_id)) continue;
|
||||
if (fo.mode_reglement !== 'portefeuille' && fo.mode_reglement !== 'compte_courant') continue;
|
||||
const d = fo.date_operation?.slice(0, 10);
|
||||
if (!d || d > cutoff) continue;
|
||||
flowsNet.push({ amount: -(fo.montant || 0), date: d });
|
||||
}
|
||||
// Échéances futures prévues, groupées par investissement
|
||||
const futureSimulParInv = {};
|
||||
for (const sr of allSimulRembs) {
|
||||
@@ -977,7 +1021,7 @@ export default function Plateformes() {
|
||||
flowsBrut.sort(byDate);
|
||||
flowsNet.sort(byDate);
|
||||
return { brut: xirr(flowsBrut), net: xirr(flowsNet) };
|
||||
}, [chartRows, allRembs, allReinvests, allSimulRembs, selectedYear, reinvestCumulParInv, capRembParInv, pfuRates]);
|
||||
}, [chartRows, allRembs, allReinvests, allFraisOps, allSimulRembs, selectedYear, reinvestCumulParInv, capRembParInv, pfuRates]);
|
||||
|
||||
const netMode = displayMode === 'net';
|
||||
const prevYearLabel = selectedYear ? Number(selectedYear) - 1 : new Date().getFullYear() - 1;
|
||||
@@ -1235,6 +1279,45 @@ export default function Plateformes() {
|
||||
return true;
|
||||
}), [mvNormalizedSouscriptionMouvements, mvFilter.plateforme_ids, mvFilter.year, mvFilter.month]);
|
||||
|
||||
// Frais d'opération (Étape 3, 31/08/26) — réplique de normalizedFraisMouvements dans
|
||||
// DepotsRetraits.jsx, cf. commentaire d'en-tête de ce bloc ONGLET "MOUVEMENTS PORTE-MONNAIE".
|
||||
const mvNormalizedFraisMouvements = useMemo(() => {
|
||||
const out = [];
|
||||
for (const fr of allFraisOps) {
|
||||
const inv = mvInvById.get(fr.investissement_id);
|
||||
if (!inv) continue;
|
||||
out.push({
|
||||
id: `frais_${fr.id}`,
|
||||
_fraisId: fr.id,
|
||||
_invId: inv.id,
|
||||
_rembId: fr.remboursement_id || null,
|
||||
plateforme_id: inv.plateforme_id,
|
||||
plateforme_nom: inv.plateforme_nom,
|
||||
plateforme_detenteur_nom: inv.plateforme_detenteur_nom,
|
||||
date_operation: fr.date_operation,
|
||||
type: 'frais',
|
||||
montant: fr.montant,
|
||||
mode_reglement: fr.mode_reglement,
|
||||
compte_nom: fr.compte_nom || null,
|
||||
origine: fr.origine,
|
||||
categorie: fr.categorie,
|
||||
libelle: inv.nom_projet || '',
|
||||
source: 'frais_operation',
|
||||
investisseur_id: inv.investisseur_id ?? null,
|
||||
notes: fr.notes || '',
|
||||
});
|
||||
}
|
||||
return out;
|
||||
}, [allFraisOps, mvInvById]);
|
||||
|
||||
const mvFilteredFraisMouvements = useMemo(() => mvNormalizedFraisMouvements.filter(r => {
|
||||
if (mvFilter.plateforme_ids.length > 0 && !mvFilter.plateforme_ids.includes(String(r.plateforme_id))) return false;
|
||||
const [y, m] = r.date_operation.split('-');
|
||||
if (mvFilter.year && y !== mvFilter.year) return false;
|
||||
if (mvFilter.month && m !== mvFilter.month.padStart(2,'0')) return false;
|
||||
return true;
|
||||
}), [mvNormalizedFraisMouvements, mvFilter.plateforme_ids, mvFilter.year, mvFilter.month]);
|
||||
|
||||
// Projets disponibles pour le filtre "Projet" — dépend de la plateforme (verrouillée) mais
|
||||
// pas des autres filtres (type/année/mois), pour ne pas faire disparaître d'options en cours
|
||||
// d'affinage. Inclut les remboursements/souscriptions/réinvestissements ainsi que les
|
||||
@@ -1245,13 +1328,14 @@ export default function Plateformes() {
|
||||
const set = new Set();
|
||||
for (const r of mvNormalizedRembMouvements) if (inScope(r.plateforme_id) && r.libelle) set.add(r.libelle);
|
||||
for (const r of mvNormalizedSouscriptionMouvements) if (inScope(r.plateforme_id) && r.libelle) set.add(r.libelle);
|
||||
for (const r of mvNormalizedFraisMouvements) if (inScope(r.plateforme_id) && r.libelle) set.add(r.libelle);
|
||||
for (const d of allDepots) {
|
||||
if (!inScope(d.plateforme_id) || !d.remboursement_id) continue;
|
||||
const p = mvRembProjetById.get(d.remboursement_id);
|
||||
if (p) set.add(p);
|
||||
}
|
||||
return [...set].sort((a, b) => a.localeCompare(b, 'fr'));
|
||||
}, [mvNormalizedRembMouvements, mvNormalizedSouscriptionMouvements, allDepots, mvRembProjetById, mvFilter.plateforme_ids]);
|
||||
}, [mvNormalizedRembMouvements, mvNormalizedSouscriptionMouvements, mvNormalizedFraisMouvements, allDepots, mvRembProjetById, mvFilter.plateforme_ids]);
|
||||
|
||||
// Solde indicatif du porte-monnaie après chaque mouvement — calculé sur l'historique
|
||||
// COMPLET et NON FILTRÉ (allDepots/mvNormalizedCorrections/mvNormalizedRembMouvements/
|
||||
@@ -1261,7 +1345,8 @@ export default function Plateformes() {
|
||||
// Voir [[project_mouvements_solde_indicatif]].
|
||||
const mvSoldeIndicatifByRowId = useMemo(() => computeSoldeIndicatifMap([
|
||||
...allDepots, ...mvNormalizedCorrections, ...mvNormalizedRembMouvements, ...mvNormalizedSouscriptionMouvements,
|
||||
]), [allDepots, mvNormalizedCorrections, mvNormalizedRembMouvements, mvNormalizedSouscriptionMouvements]);
|
||||
...mvNormalizedFraisMouvements,
|
||||
]), [allDepots, mvNormalizedCorrections, mvNormalizedRembMouvements, mvNormalizedSouscriptionMouvements, mvNormalizedFraisMouvements]);
|
||||
|
||||
const mvTableRows = useMemo(() => {
|
||||
const showDR = !mvFilter.type || mvFilter.type === 'depot' || mvFilter.type === 'retrait';
|
||||
@@ -1276,11 +1361,14 @@ export default function Plateformes() {
|
||||
const subPart = mvFilteredSouscriptionMouvements
|
||||
.filter(r => !mvFilter.type || r.type === mvFilter.type)
|
||||
.map(r => ({ ...r, _projet: r.libelle || '' }));
|
||||
const fraisPart = mvFilteredFraisMouvements
|
||||
.filter(r => !mvFilter.type || r.type === mvFilter.type)
|
||||
.map(r => ({ ...r, _projet: r.libelle || '' }));
|
||||
return sortMouvements(
|
||||
[...drPart, ...corrPart, ...rembPart, ...subPart]
|
||||
[...drPart, ...corrPart, ...rembPart, ...subPart, ...fraisPart]
|
||||
.filter(r => !mvFilter.projet || r._projet === mvFilter.projet)
|
||||
).map(r => ({ ...r, _soldeIndicatif: mvSoldeIndicatifByRowId.get(r.id) }));
|
||||
}, [mvRows, mvFilteredCorrections, mvFilteredRembMouvements, mvFilteredSouscriptionMouvements, mvFilter.type, mvFilter.projet, mvRembProjetById, mvSoldeIndicatifByRowId]);
|
||||
}, [mvRows, mvFilteredCorrections, mvFilteredRembMouvements, mvFilteredSouscriptionMouvements, mvFilteredFraisMouvements, mvFilter.type, mvFilter.projet, mvRembProjetById, mvSoldeIndicatifByRowId]);
|
||||
|
||||
const {
|
||||
pagedItems: mvPagedTableRows, page: mvPage, setPage: setMvPage,
|
||||
@@ -1641,10 +1729,11 @@ export default function Plateformes() {
|
||||
const rendementAttendu = netMode ? plateformeXirrAttendu.net : plateformeXirrAttendu.brut;
|
||||
const cutoffLabel = selectedYear ? `31/12/${selectedYear}` : "aujourd'hui";
|
||||
const periodLabel = selectedYear ? `Sur l'année ${selectedYear}` : "Depuis le début";
|
||||
const fraisExplication = ` Les frais réglés hors remboursement (via le porte-monnaie ou un compte courant) sont eux aussi comptés comme une sortie d'argent dans ce calcul net — en plus des frais déjà déduits à la source ou d'un remboursement, toujours pris en compte.`;
|
||||
const xirrExplication =
|
||||
`XIRR (taux de rendement interne actualisé) : taux annualisé calculé à partir de l'ensemble des flux réels datés ` +
|
||||
`des prêts de cette sélection (versements initiaux, réinvestissements, remboursements ${netMode ? 'nets, après fiscalité' : 'bruts, avant fiscalité'}). ` +
|
||||
`Chaque flux est pondéré par sa date exacte.\n\n` +
|
||||
`Chaque flux est pondéré par sa date exacte.` + (netMode ? fraisExplication : '') + `\n\n` +
|
||||
(plateformeXirr.estime
|
||||
? `Certains prêts ne sont pas encore soldés : leur capital restant dû est ajouté en flux final, valorisé au ${cutoffLabel} — c'est donc une estimation, pas un taux définitif.`
|
||||
: 'Tous les prêts de cette sélection sont soldés : taux définitif.');
|
||||
@@ -1653,7 +1742,7 @@ export default function Plateformes() {
|
||||
`(ex. "Mon taux de rendement interne" chez Bienprêter, le %/an affiché chez La Première Brique), ce calcul suppose ` +
|
||||
`que toutes les échéances prévues (capital + intérêts) des prêts encore en cours seront honorées exactement à la ` +
|
||||
`date prévue par l'échéancier — contrairement au XIRR ci-dessus, qui valorise prudemment le capital restant dû ` +
|
||||
`"comme racheté au ${cutoffLabel}", sans compter les intérêts futurs.\n\n` +
|
||||
`"comme racheté au ${cutoffLabel}", sans compter les intérêts futurs.` + (netMode ? fraisExplication : '') + `\n\n` +
|
||||
`C'est donc une projection optimiste : elle ne tient pas compte d'un éventuel retard ou défaut de paiement ` +
|
||||
`(voir le KPI "Capital en risque" pour ce risque). Si un prêt n'a pas d'échéancier prévisionnel en base, il est ` +
|
||||
`valorisé de la même façon que dans le XIRR réel.`;
|
||||
@@ -2655,6 +2744,7 @@ export default function Plateformes() {
|
||||
<option value="cashback">Cashback</option>
|
||||
<option value="interets_plateforme">Intérêts plateforme</option>
|
||||
<option value="souscription">Souscriptions</option>
|
||||
<option value="frais">Frais d'opération</option>
|
||||
<option value="prelevement_ir">Prélèvements IR</option>
|
||||
<option value="prelevement_csg">Prélèvements CSG</option>
|
||||
<option value="prelevement_local">Prélèvements étranger</option>
|
||||
@@ -2843,6 +2933,55 @@ export default function Plateformes() {
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
if (r.type === 'frais') {
|
||||
const horsPM = r.mode_reglement === 'compte_courant';
|
||||
const rembLinked = r.mode_reglement === 'remboursement';
|
||||
return (
|
||||
<tr key={r.id}
|
||||
className={`dr-row${mvSelectedRow?.id === r.id ? ' dr-row-selected' : ''}`}
|
||||
onClick={() => setMvSelectedRow(mvSelectedRow?.id === r.id ? null : r)}
|
||||
style={{ cursor: 'pointer', opacity: horsPM ? 0.75 : 1 }}>
|
||||
<td>{fmtDate(r.date_operation)}</td>
|
||||
<td>{r.plateforme_nom}</td>
|
||||
{multiDetenteur && <td className="text-muted" style={{ fontSize: 'var(--fs-sm)' }}>{r.plateforme_detenteur_nom || '—'}</td>}
|
||||
<td>
|
||||
<span style={{
|
||||
display: 'inline-block',
|
||||
fontSize: 11, fontWeight: 600, letterSpacing: '0.03em',
|
||||
padding: '2px 7px', borderRadius: 4,
|
||||
background: 'color-mix(in srgb, #f59e0b 15%, transparent)',
|
||||
color: '#f59e0b',
|
||||
}}>frais</span>
|
||||
{horsPM && (
|
||||
<span style={{
|
||||
marginLeft: 6,
|
||||
fontSize: 10, fontWeight: 600, letterSpacing: '0.03em',
|
||||
padding: '1px 5px', borderRadius: 3,
|
||||
background: 'var(--surface-2)',
|
||||
color: 'var(--text-muted)',
|
||||
verticalAlign: 'middle',
|
||||
}} title="Réglé via un compte courant — aucun effet sur le solde du porte-monnaie">HORS PM</span>
|
||||
)}
|
||||
{rembLinked && (
|
||||
<span style={{
|
||||
marginLeft: 6,
|
||||
fontSize: 10, fontWeight: 600, letterSpacing: '0.03em',
|
||||
padding: '1px 5px', borderRadius: 3,
|
||||
background: 'var(--surface-2)',
|
||||
color: 'var(--text-muted)',
|
||||
verticalAlign: 'middle',
|
||||
}} title="Déjà déduit du montant net du remboursement — aucun effet supplémentaire sur le solde du porte-monnaie">DÉDUIT REMB.</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="text-muted">{r._projet || '—'}</td>
|
||||
<td className={horsPM ? 'num text-muted' : 'num danger'}>
|
||||
− {fmtEUR(r.montant)}
|
||||
</td>
|
||||
<td className="num text-muted" style={{ fontStyle: 'italic' }}>{r._soldeIndicatif != null ? fmtEUR(r._soldeIndicatif) : '—'}</td>
|
||||
<td style={{ width: 36, textAlign: 'center' }} />
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
const isAuto = r.source === 'auto_remboursement';
|
||||
return (
|
||||
<tr key={r.id}
|
||||
|
||||
@@ -10,6 +10,8 @@ import { useUi } from '../context/UiContext.jsx';
|
||||
import ConfirmModal from '../components/ConfirmModal.jsx';
|
||||
import InteretsChart from '../components/InteretsChart.jsx';
|
||||
import InteretsDistributionChart from '../components/InteretsDistributionChart.jsx';
|
||||
import FraisDistributionChart from '../components/FraisDistributionChart.jsx';
|
||||
import { FRAIS_CATEGORIE_LABELS } from '../components/MouvementsShared.jsx';
|
||||
import TableauInteretsPlateforme from '../components/TableauInteretsPlateforme.jsx';
|
||||
import DrillCellPanel from '../components/DrillCellPanel.jsx';
|
||||
import RembFormModal from '../components/RembFormModal.jsx';
|
||||
@@ -57,7 +59,8 @@ const empty = {
|
||||
capital: 0, cashback: 0,
|
||||
interets_bruts_avant_local: 0,
|
||||
taxe_locale: 0,
|
||||
interets_bruts: 0, prelev_sociaux: 0,
|
||||
interets_bruts: 0, frais_ttc: 0, frais_mode_reglement: 'remboursement', frais_compte_id: '',
|
||||
prelev_sociaux: 0,
|
||||
prelev_forfaitaire: 0,
|
||||
statut: 'paye', notes: '',
|
||||
methode_remboursement: 'portefeuille',
|
||||
@@ -181,6 +184,7 @@ export default function Remboursements() {
|
||||
const [corrections, setCorrections] = useState([]);
|
||||
const [investissements, setInvestissements] = useState([]);
|
||||
const [plateformes, setPlateformes] = useState([]);
|
||||
const [allFraisOps, setAllFraisOps] = useState([]); // frais_operations, tous investisseurs
|
||||
const [platLoaded, setPlatLoaded] = useState(false);
|
||||
const [pfuRates, setPfuRates] = useState([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
@@ -266,12 +270,16 @@ export default function Remboursements() {
|
||||
setSelectedSimul(''); // reset sélection projection
|
||||
try {
|
||||
const scopeParams = activeView === 'all' ? { scope: 'all' } : {};
|
||||
const [r, inv, corr] = await Promise.all([
|
||||
const [r, inv, corr, fraisOps] = await Promise.all([
|
||||
api.get('/remboursements', scopeParams),
|
||||
api.get('/investissements', scopeParams),
|
||||
api.get('/corrections', scopeParams).catch(() => []),
|
||||
// /frais-operations sans investissement_id ne connaît que l'utilisateur (tous
|
||||
// investisseurs), filtré ensuite via filterPlatId/rembPlatYear comme allRows —
|
||||
// même pattern que allFraisOps dans Plateformes.jsx (Étape 5).
|
||||
api.get('/frais-operations').catch(() => []),
|
||||
]);
|
||||
setAllRows(r); setInvestissements(inv); setCorrections(corr);
|
||||
setAllRows(r); setInvestissements(inv); setCorrections(corr); setAllFraisOps(fraisOps);
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setDrillRefreshKey(k => k + 1);
|
||||
@@ -412,6 +420,39 @@ export default function Remboursements() {
|
||||
[byPlatform]
|
||||
);
|
||||
|
||||
/* ── Étape 5 : reporting "Frais payés" — filtré comme le reste de la page par
|
||||
filterPlatId (plateforme) et rembPlatYear (année), sur date_operation cette fois. ── */
|
||||
const fraisFiltered = useMemo(() =>
|
||||
allFraisOps.filter(f => {
|
||||
if (filterPlatId && String(f.plateforme_id) !== filterPlatId) return false;
|
||||
if (rembPlatYear && (f.date_operation || '').slice(0, 4) !== rembPlatYear) return false;
|
||||
return true;
|
||||
}),
|
||||
[allFraisOps, filterPlatId, rembPlatYear]
|
||||
);
|
||||
|
||||
const fraisPrevFiltered = useMemo(() =>
|
||||
allFraisOps.filter(f => {
|
||||
if (filterPlatId && String(f.plateforme_id) !== filterPlatId) return false;
|
||||
return (f.date_operation || '').slice(0, 4) === rembPrevYear;
|
||||
}),
|
||||
[allFraisOps, filterPlatId, rembPrevYear]
|
||||
);
|
||||
|
||||
const fraisTotal = useMemo(() => fraisFiltered.reduce((s, f) => s + (f.montant || 0), 0), [fraisFiltered]);
|
||||
const fraisPrevTotal = useMemo(() => fraisPrevFiltered.reduce((s, f) => s + (f.montant || 0), 0), [fraisPrevFiltered]);
|
||||
|
||||
const byCategorie = useMemo(() => {
|
||||
const map = {};
|
||||
for (const f of fraisFiltered) {
|
||||
const key = f.categorie || 'autre';
|
||||
if (!map[key]) map[key] = { categorie: key, montant: 0, count: 0 };
|
||||
map[key].montant += f.montant || 0;
|
||||
map[key].count += 1;
|
||||
}
|
||||
return Object.values(map).sort((a, b) => b.montant - a.montant);
|
||||
}, [fraisFiltered]);
|
||||
|
||||
/* ── Tableau remboursements : filtrage client-side ── */
|
||||
const tableRows = useMemo(() => {
|
||||
// Remboursements filtrés
|
||||
@@ -547,7 +588,12 @@ export default function Remboursements() {
|
||||
capital: r.capital, cashback: r.cashback || 0,
|
||||
interets_bruts_avant_local: r.interets_bruts_avant_local || 0,
|
||||
taxe_locale: r.taxe_locale || 0,
|
||||
interets_bruts: r.interets_bruts,
|
||||
interets_bruts: r.interets_bruts, frais_ttc: r.frais_ttc || 0,
|
||||
// Étape 5 bis (01/09/26) : le mode de règlement du frais n'est pas stocké sur le
|
||||
// remboursement lui-même mais sur la ligne frais_operations liée — recherchée dans
|
||||
// allFraisOps déjà chargé, par remboursement_id (cf. RembFormModal.jsx).
|
||||
frais_mode_reglement: (allFraisOps.find(f => f.remboursement_id === r.id)?.mode_reglement) || 'remboursement',
|
||||
frais_compte_id: String(allFraisOps.find(f => f.remboursement_id === r.id)?.compte_id || ''),
|
||||
prelev_sociaux: r.prelev_sociaux, prelev_forfaitaire: r.prelev_forfaitaire,
|
||||
statut: r.statut, notes: r.notes || '',
|
||||
methode_remboursement: r.methode_remboursement || 'portefeuille',
|
||||
@@ -648,8 +694,10 @@ export default function Remboursements() {
|
||||
|
||||
const round2 = (n) => Math.round(n * 100) / 100;
|
||||
|
||||
const computeInteretsNets = (f) =>
|
||||
round2(Number(f.interets_bruts || 0) - Number(f.prelev_sociaux || 0) - Number(f.prelev_forfaitaire || 0));
|
||||
const computeInteretsNets = (f) => {
|
||||
const fraisReduit = (!f.frais_mode_reglement || f.frais_mode_reglement === 'remboursement') ? Number(f.frais_ttc || 0) : 0;
|
||||
return round2(Number(f.interets_bruts || 0) - fraisReduit - Number(f.prelev_sociaux || 0) - Number(f.prelev_forfaitaire || 0));
|
||||
};
|
||||
|
||||
const computeNet = (f) =>
|
||||
round2(Number(f.capital || 0) + Number(f.cashback || 0) + computeInteretsNets(f));
|
||||
@@ -674,9 +722,17 @@ export default function Remboursements() {
|
||||
next.interets_bruts = round2(Number(next.interets_bruts_avant_local) - Number(v));
|
||||
}
|
||||
|
||||
if (k === 'date_remb' || k === 'interets_bruts' || k === 'interets_bruts_avant_local' || k === 'taxe_locale') {
|
||||
if (k === 'date_remb' || k === 'interets_bruts' || k === 'interets_bruts_avant_local' || k === 'taxe_locale' || k === 'frais_ttc' || k === 'frais_mode_reglement') {
|
||||
const dateStr = k === 'date_remb' ? v : next.date_remb;
|
||||
const bruts = Number(next.interets_bruts) || 0;
|
||||
// Base imposable nette de frais (Étape 4, 31/08/26) — même formule que computeChamps()
|
||||
// côté backend et que POST /reprocess : les prélèvements doivent porter sur
|
||||
// (interets_bruts - frais_ttc), pas sur le brut seul, sous peine de sur-taxer le coupon
|
||||
// (confirmé par Olivier sur l'avis d'opéré Kyoseil-AM/Fundora du 02/07/2026). Depuis
|
||||
// l'Étape 5 bis (01/09/26), cette réduction ne s'applique QUE si le frais est retenu SUR ce
|
||||
// remboursement (frais_mode_reglement === 'remboursement', par défaut) — un frais réglé à
|
||||
// part (portefeuille/compte courant) n'affecte pas cette base.
|
||||
const fraisReduit = (!next.frais_mode_reglement || next.frais_mode_reglement === 'remboursement') ? (Number(next.frais_ttc) || 0) : 0;
|
||||
const bruts = round2((Number(next.interets_bruts) || 0) - fraisReduit);
|
||||
const rates = getRatesForYear(dateStr);
|
||||
if (rates) {
|
||||
next.prelev_sociaux = round2(bruts * rates.prelev_sociaux / 100);
|
||||
@@ -743,6 +799,7 @@ export default function Remboursements() {
|
||||
interets_bruts_avant_local: Number(form.interets_bruts_avant_local || 0),
|
||||
taxe_locale: Number(form.taxe_locale || 0),
|
||||
interets_bruts: Number(form.interets_bruts || 0),
|
||||
frais_ttc: Number(form.frais_ttc || 0),
|
||||
prelev_sociaux: Number(form.prelev_sociaux || 0),
|
||||
prelev_forfaitaire: Number(form.prelev_forfaitaire || 0),
|
||||
statut: form.statut,
|
||||
@@ -758,6 +815,9 @@ export default function Remboursements() {
|
||||
interets_bruts_avant_local: Number(form.interets_bruts_avant_local || 0),
|
||||
taxe_locale: Number(form.taxe_locale || 0),
|
||||
interets_bruts: Number(form.interets_bruts || 0),
|
||||
frais_ttc: Number(form.frais_ttc || 0),
|
||||
frais_mode_reglement: form.frais_mode_reglement || 'remboursement',
|
||||
frais_compte_id: form.frais_mode_reglement === 'compte_courant' && form.frais_compte_id ? Number(form.frais_compte_id) : null,
|
||||
prelev_sociaux: Number(form.prelev_sociaux || 0),
|
||||
prelev_forfaitaire: Number(form.prelev_forfaitaire || 0),
|
||||
statut: form.statut,
|
||||
@@ -881,6 +941,8 @@ export default function Remboursements() {
|
||||
onClick={() => setActiveTab('remboursements')}>Remboursements</button>
|
||||
<button className={`dr-tab${activeTab === 'projections' ? ' active' : ''}`}
|
||||
onClick={() => setActiveTab('projections')}>Projections Échéances</button>
|
||||
<button className={`dr-tab${activeTab === 'frais' ? ' active' : ''}`}
|
||||
onClick={() => setActiveTab('frais')}>Frais</button>
|
||||
</div>}
|
||||
|
||||
{/* ══ ONGLET PLATEFORMES ══ */}
|
||||
@@ -1265,7 +1327,35 @@ export default function Remboursements() {
|
||||
{(isBonusLike || isCorrection) ? '—' : fmtEUR(Math.max(0, r.capital_restant_du ?? 0))}
|
||||
</td>
|
||||
<td className="num">{r.cashback ? fmtEUR(r.cashback) : '—'}</td>
|
||||
<td className="num">{(isBonus || isCorrection) ? '—' : fmtEUR(r.interets_bruts)}</td>
|
||||
<td className="num">
|
||||
{(isBonus || isCorrection) ? '—' : (
|
||||
<>
|
||||
{fmtEUR(r.interets_bruts)}
|
||||
{/* Icône uniquement si le frais réduit réellement ce montant (mode
|
||||
'remboursement', par défaut) — un frais réglé à part (Étape 5 bis,
|
||||
01/09/26) n'a aucun impact sur les intérêts bruts affichés ici. */}
|
||||
{!!r.frais_ttc && (!r.frais_mode_reglement || r.frais_mode_reglement === 'remboursement') && (
|
||||
<span
|
||||
className="cell-tooltip"
|
||||
data-tooltip={
|
||||
`Intérêts bruts avant frais : ${fmtEUR(r.interets_bruts)}\n` +
|
||||
`Frais de distribution : -${fmtEUR(r.frais_ttc)}\n` +
|
||||
`Base après frais (avant prélèvements) : ${fmtEUR(round2(r.interets_bruts - r.frais_ttc))}\n` +
|
||||
`Prélèv. sociaux : ${fmtEUR(r.prelev_sociaux)}\n` +
|
||||
`Impôt sur le revenu : ${fmtEUR(r.prelev_forfaitaire)}\n` +
|
||||
`Montant net reçu : ${fmtEUR(r.net_recu)}`
|
||||
}
|
||||
style={{ marginLeft: 5, color: 'var(--warning, #b45309)', verticalAlign: 'middle' }}>
|
||||
<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
|
||||
<circle cx="12" cy="12" r="10" />
|
||||
<line x1="12" y1="16" x2="12" y2="12" />
|
||||
<line x1="12" y1="8" x2="12.01" y2="8" />
|
||||
</svg>
|
||||
</span>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</td>
|
||||
<td className="num">{(isBonus || isCorrection) ? '—' : fmtEUR(r.prelev_sociaux)}</td>
|
||||
<td className="num">{(isBonus || isCorrection) ? '—' : fmtEUR(r.prelev_forfaitaire)}</td>
|
||||
<td className="num">
|
||||
@@ -1471,6 +1561,97 @@ export default function Remboursements() {
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ══ ONGLET FRAIS (Étape 5 — reporting consolidé) ══ */}
|
||||
{activeTab === 'frais' && (
|
||||
<div style={{ padding: '0 24px' }}>
|
||||
{/* ── KPI ── */}
|
||||
<div className="dr-kpi-row" style={{ marginBottom: 16 }}>
|
||||
<div className="kpi">
|
||||
<div className="label">
|
||||
Frais payés{rembPlatYear && ` en ${rembPlatYear}`}
|
||||
</div>
|
||||
<div style={{ display: 'flex', alignItems: 'center', gap: 8, margin: '4px 0 0' }}>
|
||||
<span style={{ fontSize: '1.35rem', fontWeight: 700 }}>{fmtEUR(fraisTotal)}</span>
|
||||
{rembPlatYear && <TrendBadge current={fraisTotal} prev={fraisPrevTotal} invert />}
|
||||
</div>
|
||||
{rembPlatYear && (
|
||||
<div style={{ fontSize: '0.8em', color: 'var(--text-muted)', marginTop: 5 }}>
|
||||
{fmtEUR(fraisPrevTotal)} en {rembPrevYear}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ── Graphique ── */}
|
||||
<div className="charts-row" style={{ marginBottom: 16 }}>
|
||||
<FraisDistributionChart rows={fraisFiltered} />
|
||||
</div>
|
||||
|
||||
{/* ── Tableau par catégorie ── */}
|
||||
<div className="card" style={{ marginBottom: 16 }}>
|
||||
<div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', marginBottom: 14 }}>
|
||||
<h3 style={{ margin: 0 }}>
|
||||
Répartition par catégorie
|
||||
{rembPlatYear && <span style={{ marginLeft: 8 }}>pour l'année {rembPlatYear}</span>}
|
||||
</h3>
|
||||
{filterPlatId && (
|
||||
<span style={{ fontSize: 12, color: 'var(--text-muted)', fontStyle: 'italic' }}>
|
||||
Filtré sur cette plateforme
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Catégorie</th>
|
||||
<th className="num">Montant</th>
|
||||
<th className="num">Nombre</th>
|
||||
<th className="num" style={{ minWidth: 120 }}>Poids</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{byCategorie.length === 0 && (
|
||||
<tr><td colSpan={4} className="text-muted" style={{ textAlign: 'center', padding: 24 }}>
|
||||
{loading ? 'Chargement…' : 'Aucun frais enregistré pour ces critères'}
|
||||
</td></tr>
|
||||
)}
|
||||
{byCategorie.map(c => {
|
||||
const poids = fraisTotal !== 0 ? (c.montant / fraisTotal) * 100 : 0;
|
||||
return (
|
||||
<tr key={c.categorie}>
|
||||
<td>{FRAIS_CATEGORIE_LABELS[c.categorie] || c.categorie}</td>
|
||||
<td className="num">{fmtEUR(c.montant)}</td>
|
||||
<td className="num" style={{ color: 'var(--text-muted)', fontSize: 'var(--fs-sm)' }}>{c.count}</td>
|
||||
<td className="num">
|
||||
<div style={{ display: 'flex', alignItems: 'center', gap: 6, justifyContent: 'flex-end' }}>
|
||||
<div style={{ width: 48, height: 5, borderRadius: 3, background: 'var(--surface-2)', overflow: 'hidden' }}>
|
||||
<div style={{ width: `${Math.max(0, poids)}%`, height: '100%', background: 'var(--primary)', borderRadius: 3 }} />
|
||||
</div>
|
||||
<span style={{ minWidth: 36, textAlign: 'right', fontSize: 'var(--fs-sm)' }}>
|
||||
{poids.toFixed(1)} %
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
})}
|
||||
</tbody>
|
||||
{byCategorie.length > 1 && (
|
||||
<tfoot>
|
||||
<tr style={{ borderTop: '2px solid var(--border)', fontWeight: 700, background: 'var(--surface-2)' }}>
|
||||
<td>Total — {byCategorie.length} catégories</td>
|
||||
<td className="num">{fmtEUR(fraisTotal)}</td>
|
||||
<td className="num" style={{ color: 'var(--text-muted)', fontSize: 'var(--fs-sm)' }}>{fraisFiltered.length}</td>
|
||||
<td className="num"><span style={{ fontSize: 'var(--fs-sm)', color: 'var(--text-muted)' }}>100 %</span></td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
)}
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* ══ MODAL ══ */}
|
||||
{(() => {
|
||||
// Liste d'investissements disponibles dans le select
|
||||
|
||||
Reference in new issue
Block a user