Pipelines GHL · {P.label}
{cur ? `${cur.total} opp · ${C ? C.fmtCAD0(cur.totalValue) : cur.totalValue}` : "CRM live"}
{GHL_PIPES.map(x => (
))}
{err ? (
{err}
) : !data ? (
Chargement des pipelines…
) : cur.stages.length === 0 ? (
Aucune étape
) : cur.stages.map((s, i) => (
{s.name}
{s.count}
{C ? C.fmtCAD0(s.value) : s.value}
))}
);
}
// ============================================================================
// MAIN DASHBOARD COMPONENT — V5
// ============================================================================
function Dashboard2026({ onOpen, onNew, profile }) {
const [period, setPeriod] = useState("month");
const [submissions, setSubmissions] = useState([]);
const [loading, setLoading] = useState(true);
const C = window.RAYCAST_CALC_2026;
useEffect(() => {
let mounted = true;
(async () => {
setLoading(true);
try {
if (window.RaycastDB) {
const data = await window.RaycastDB.listSubmissions({});
if (mounted) setSubmissions(data || []);
}
} catch (e) {
console.error("[dashboard-2026]", e);
} finally {
if (mounted) setLoading(false);
}
})();
return () => { mounted = false; };
}, []);
const stats = useMemo(() => computeStats(submissions, period), [submissions, period]);
const signedValue = useMemo(
() => stats.filtered.filter(s => s.status === "accepte").reduce((a, s) => a + (s.price_total || 0), 0),
[stats]
);
const periodLabel = { week: "7 derniers jours", month: "30 derniers jours", quarter: "3 derniers mois", year: "12 derniers mois" }[period];
const greeting = (() => {
const h = new Date().getHours();
return h < 12 ? "Bonjour" : h < 18 ? "Bon après-midi" : "Bonsoir";
})();
const sellerName = (profile?.name || "").split(" ")[0] || "vendeur";
// Funnel : 4 stages décroissants
const sent = stats.envoye + stats.accept + stats.refuse; // tout ce qui a quitté brouillon
const decided = stats.accept + stats.refuse;
const funnelStages = [
{ name: "Créées", count: stats.total, cls: "", conv: 100 },
{ name: "Envoyées", count: sent, cls: "stage-2", conv: stats.total > 0 ? Math.round(sent / stats.total * 100) : 0 },
{ name: "Décidées", count: decided, cls: "stage-3", conv: sent > 0 ? Math.round(decided / sent * 100) : 0 },
{ name: "Acceptées", count: stats.accept, cls: "stage-4", conv: decided > 0 ? Math.round(stats.accept / decided * 100) : 0 }
];
const funnelMax = Math.max(1, stats.total);
// Soumissions récentes
const recent = [...stats.filtered]
.sort((a, b) => new Date(b.updated_at || b.created_at) - new Date(a.updated_at || a.created_at))
.slice(0, 7);
const statusMap = {
brouillon: { cls: "draft", label: "Brouillon" },
envoye: { cls: "sent", label: "Envoyée" },
accepte: { cls: "accepted", label: "Acceptée" },
refuse: { cls: "refused", label: "Refusée" },
archive: { cls: "draft", label: "Archivée" }
};
const typeLabel = { solaire: "Solaire", solaire_batterie: "Solaire+Batt", batterie: "Tout-en-un", borne: "Borne VÉ" };
return (