Phase 2 · Complète 🔗 Ouvrir l'app live →

Espace IMF

L'interface métier quotidienne des employés d'une IMF. 25 pages couvrant le cycle complet d'octroi de crédit : de l'onboarding emprunteur jusqu'au pilotage portefeuille.

25
Pages métier
7
Rôles utilisateur
3
Langues FR/AR/EN
10+
Modules fonctionnels

Hiérarchie des rôles

Chaque rôle ne voit que les données de son périmètre — un Agent ne voit que ses propres emprunteurs, un Directeur d'Agence voit toute son agence, un DG voit tout au niveau national.

RôlePérimètre visiblePeut créer
ADMIN_IMFTout — admin technique du tenant + ParamètresTous les rôles
DG (Directeur Général)Vue nationale, toutes données du tenantTous les rôles
Directeur RégionalSa région et toutes ses agencesDA, SC, Agent, Caissier (sa région)
Directeur AgenceSon agence uniquementSC, Agent, Caissier (son agence)
Superviseur CréditDossiers de son agence
AgentSes propres emprunteurs et dossiers
CaissierCaisse de son agence (paiements)

🔐 Connexion

Authentification multi-tenant : slug du tenant + email + mot de passe. Le slug identifie l'IMF, l'email + mot de passe identifient l'utilisateur dans ce tenant.

Page de connexion IMF
🧪 Pour tester la connexion
  1. 1
    Ouvrir /login
  2. 2
    Slug : al-amal-mf
  3. 3
    Email : karim.bouazizi@al-amal.tn (DG) — ou un autre compte du tableau ci-dessous
  4. 4
    Mot de passe : Qredon2026!
  5. 5
    Cliquer "Se connecter" → redirection vers le Dashboard

📊 Dashboard

Vue d'accueil adaptée au rôle. Le DG voit les KPIs nationaux, le Directeur Régional voit sa région, etc. Cards : portefeuille total, PAR30/60/90, prêts actifs, dossiers en attente, derniers paiements.

Dashboard IMF

👥 Emprunteurs

Gestion complète des emprunteurs : liste paginée filtrable, fiches détaillées 360°, KYC, transfert entre agents. Page dédiée "Pending validation" pour les emprunteurs auto-inscrits via le portail (statut KYC à valider par un agent).

Liste des emprunteurs

Liste emprunteurs

Emprunteurs en attente de validation KYC

Emprunteurs pending validation

💰 Dossiers de prêt

Cycle de vie complet d'un dossier : brouillon → soumission → KYC → scoring → revue → décision → décaissement → remboursements. Workflow trackable, chaque action loggée.

Liste des dossiers

Liste prêts

Nouveau dossier (saisie agent)

Création dossier

📦 Produits de prêt

Catalogue configurable de produits : microcrédit commerce, agriculture, équipement, finance islamique. Chaque produit définit ses bornes (montant, durée), son taux, son workflow d'approbation et ses critères d'éligibilité.

Liste produits
Nouveau produit

📈 Portefeuille

Vue analytique du portefeuille : encours, PAR (Portfolio At Risk) 30/60/90 jours, ranking agences, performance par agent, snapshots historiques pour tendances.

Portefeuille

💳 Remboursements

Suivi des échéances et enregistrement des paiements. Le Caissier saisit les paiements (cash / mobile money / virement / chèque), génère le reçu PDF, met à jour le statut du prêt.

Remboursements

🏢 Agences

Hiérarchie organisationnelle : Régions > Agences > Équipes. Chaque agence a un directeur, des coordonnées GPS, un statut actif/inactif.

Agences

🗺️ Régions

Niveau supérieur de la hiérarchie. Le seed crée 2 régions : Grand Tunis (REG-GT) et Cap Bon. Un Directeur Régional est assigné à une région.

Régions

👤 Utilisateurs IMF

Gestion des comptes IMF (DG, DR, DA, SC, Agents, Caissiers). Les règles de création respectent la hiérarchie : un DA ne peut créer que SC/Agent/Caissier dans son agence.

Utilisateurs IMF

🔔 Notifications

Centre de notifications IMF (in-app). Les événements métier (prêt soumis, KYC validé, paiement reçu, etc.) génèrent des notifications avec priorité (faible / moyenne / haute / urgente).

Notifications

⚙️ Paramètres tenant

Accessibles uniquement à ADMIN_IMF. 4 sous-sections : Audit (logs du tenant), Quotas (utilisation vs plan), Modules (activation des fonctionnalités), Onboarding (config parcours emprunteur).

Settings
Settings Onboarding
Settings Quotas
Settings Modules

🌐 Multilingue FR / AR / EN avec switcher

Bouton de bascule de langue dans la TopBar (en haut à droite). Le choix est mémorisé. L'arabe déclenche un layout RTL complet (sidebar à droite, textes alignés à droite, dates inversées).

🔑 Comptes de test (9 rôles)

Tous les comptes IMF démo ont le mot de passe Qredon2026!. Tenant slug : al-amal-mf.

EmailRôleAgence / RégionNote
karim.bouazizi@al-amal.tnDGVue nationale
moez.gharbi@al-amal.tnADMIN_IMFAccès Settings
sonia.mekki@al-amal.tnDir. RégionalRégion Grand TunisVoit 3 agences
nabil.jebali@al-amal.tnDir. AgenceTunis Centre
rania.benamor@al-amal.tnDir. AgenceLa Marsa
youssef.trabelsi@al-amal.tnSup. CréditTunis Centre
fatma.chaabane@al-amal.tnAgentTunis CentrePlusieurs emprunteurs
ahmed.dridi@al-amal.tnAgentLa Marsa
salma.hamdi@al-amal.tnCaissierTunis CentreEnregistre paiements

🧪 Tous les scénarios de test

Catalogue exhaustif des scénarios — du happy path aux edge cases. Organisés par domaine fonctionnel.

A. Authentification & rôles (10 scénarios)
  1. 1
    Login DG (vue nationale) — Karim Bouazizi voit les KPIs nationaux, toutes les agences, tous les emprunteurs du tenant.
  2. 2
    Login Directeur Régional — Sonia Mekki ne voit que les agences de la région Grand Tunis (Tunis Centre + La Marsa), pas Nabeul ni Hammamet.
  3. 3
    Login Directeur Agence — Nabil Jebali ne voit que les emprunteurs et dossiers de Tunis Centre.
  4. 4
    Login Agent — Fatma Chaabane ne voit que SES propres emprunteurs (ceux dont elle est assignedAgent), pas ceux d'Ahmed Dridi.
  5. 5
    Login Caissier — Salma Hamdi accède à la caisse de son agence Tunis Centre, peut enregistrer des paiements mais pas créer de dossier de prêt.
  6. 6
    Login ADMIN_IMF — Moez Gharbi est le seul à voir l'onglet "Paramètres" dans la sidebar.
  7. 7
    Login Superviseur Crédit — Youssef Trabelsi supervise les dossiers de Tunis Centre et peut approuver/rejeter en deuxième niveau.
  8. 8
    Tentative mauvais slug — Saisir slug-inconnu → erreur "Tenant introuvable".
  9. 9
    Tentative mauvais mot de passe — Saisir un password incorrect → erreur "Identifiants invalides".
  10. 10
    Déconnexion — Bouton logout dans TopBar → retour à la page de connexion + tokens invalidés (impossible de revenir avec back button).
B. Gestion des emprunteurs (12 scénarios)
  1. 1
    Créer un emprunteur manuellement — Connecté Agent, /borrowers → "+ Nouvel emprunteur" → CIN, nom, phone (+216...), agence Tunis Centre. Sauvegarder → statut KYC PENDING_REVIEW.
  2. 2
    Modifier un emprunteur en attente — Ouvrir Ines Bouzid (+216 55 104 004) → corriger l'adresse → sauvegarder → modification visible.
  3. 3
    Valider un KYC (APPROVE) — Aller /borrowers/pending-validation → choisir un emprunteur PENDING_REVIEW → Approuver → statut passe à VERIFIED + notif portail envoyée.
  4. 4
    Rejeter un KYC — Choisir un emprunteur → Rejeter avec raison (ex: "documents flous") → statut REJECTED + notif portail.
  5. 5
    Demander info complémentaire — Choisir un emprunteur → "Compléments requis" + message → statut ADDITIONAL_INFO → l'emprunteur reçoit la demande dans son portail.
  6. 6
    Transférer un emprunteur — Vue détail Mohamed Ben Salah → "Transférer" → choisir nouvel agent (Ahmed Dridi) → confirmer → l'emprunteur disparaît de la liste de Fatma, apparaît chez Ahmed.
  7. 7
    Vue 360° d'un emprunteur — Cliquer sur un VERIFIED → onglets Profil · KYC · Dossiers de prêt · Historique paiements · Activité.
  8. 8
    Recherche par CIN — Barre de recherche → saisir 07891234 → Mohamed Ben Salah apparaît.
  9. 9
    Filtre par statut KYC — Filtres : REJECTED → uniquement Fathi Derbali apparaît. PENDING_PROFILE → Sarra Mansouri + Hatem Khelifi.
  10. 10
    Filtre par agence — Choisir AGC-LM (La Marsa) → seuls Amira Zarrouki, Walid Chahed, Leila Haddad apparaissent.
  11. 11
    Auto-inscription portail → IMF — Un nouvel utilisateur s'inscrit sur le portail emprunteur (port 3002) → il apparaît automatiquement dans /borrowers/pending-validation côté IMF avec source "OTP phone".
  12. 12
    Pagination — Liste avec 50+ emprunteurs → pagination par 20 → navigation page suivante/précédente.
C. Cycle de vie des dossiers de prêt (15 scénarios)
  1. 1
    Workflow complet 4 rôles — Agent Fatma crée → SC Youssef approuve → DA Nabil décaisse → Caissier Salma enregistre 1er paiement. Vérifier que chaque étape génère une notification portail emprunteur.
  2. 2
    Brouillon DRAFT sauvegardé — Agent commence un dossier, ferme l'app, revient → le brouillon est conservé avec son contenu.
  3. 3
    Soumission SUBMITTED — Compléter et soumettre un brouillon → statut SUBMITTED → apparaît dans la file de revue du Sup. Crédit.
  4. 4
    Tentative dossier avec emprunteur non VERIFIED — Sélectionner Ines Bouzid (PENDING_REVIEW) → message d'erreur "L'emprunteur doit être vérifié KYC".
  5. 5
    Upload pièces du dossier — Étape Documents → uploader scan CIN, attestation revenus (PDF/JPG) → tailles et formats vérifiés.
  6. 6
    Approbation avec montant ajusté — Dossier de 5000 demandé → SC approuve à 4000 → statut APPROVED avec approvedAmount=4000.
  7. 7
    Rejet d'un dossier — SC rejette avec raison (CAPACITY = capacité insuffisante) → statut REJECTED + notif portail au borrower.
  8. 8
    Demande de complément — SC demande une pièce manquante → statut UNDER_REVIEW + notif portail "complément requis" → l'emprunteur uploade depuis son portail.
  9. 9
    Décaissement DISBURSED — Dossier APPROVED → DA "Décaisser" → choisir mode (cash / virement) → statut DISBURSED + génération automatique de l'échéancier (12 mensualités si durée 12 mois).
  10. 10
    Annulation dossier — Avant approbation, l'emprunteur peut annuler depuis son portail → statut CANCELLED visible côté IMF.
  11. 11
    Filtre dossiers par statut — Filtre "DISBURSED" → uniquement les prêts actifs visibles.
  12. 12
    Filtre dossiers par agent — DG filtre par agent Fatma → seuls les dossiers de Fatma apparaissent.
  13. 13
    Recherche par référence — Saisir la référence unique d'un dossier → résultat direct.
  14. 14
    Vue détaillée dossier — Onglets : Infos · Documents · Workflow (timeline) · Échéancier · Historique paiements.
  15. 15
    Workflow multi-niveaux (gros montant) — Produit configuré avec 3 niveaux d'approbation : SC → DA → DR. Tester l'escalade complète.
D. Produits de prêt (8 scénarios)
  1. 1
    Voir le catalogue produits — /products → liste des produits actifs (Microcrédit Commerce, Agriculture, etc.).
  2. 2
    Créer un nouveau produit (ADMIN_IMF) — Moez Gharbi → /products/new → Nom "Crédit Étudiant", min 1000 / max 8000, durée 6-24 mois, taux 8%, frais 1.5%.
  3. 3
    Configurer workflow d'approbation — Wizard nouveau produit → choisir 2 niveaux d'approbation : Agent → SC.
  4. 4
    Produit conforme finance islamique — Activer le toggle "Conforme Sharia" → impacte les calculs (pas d'intérêts, marge).
  5. 5
    Désactiver un produit — Toggle isActive → off → le produit n'apparaît plus dans la liste de sélection à la création de dossier.
  6. 6
    Réactiver un produit — Toggle on → réapparaît dans la sélection.
  7. 7
    Modifier les bornes d'un produit — Augmenter le montant max → les nouveaux dossiers peuvent demander plus, les anciens restent inchangés.
  8. 8
    Critères d'éligibilité — Définir : âge min 18, revenus min 1000 → tester avec un emprunteur sous le seuil → blocage.
E. Remboursements (10 scénarios)
  1. 1
    Vue échéances du jour — Caissier Salma → /repayments → vue des échéances UPCOMING dues aujourd'hui.
  2. 2
    Paiement complet à l'heure — Échéance UPCOMING → "Enregistrer un paiement" → montant exact → mode CASH → statut PAID + reçu PDF + notif portail.
  3. 3
    Paiement partiel — Échéance 500 TND → payer 300 → statut PARTIAL + reste dû.
  4. 4
    Paiement en retard — Échéance dépassée → statut LATE + jours de retard affichés.
  5. 5
    Mode mobile money — Saisir un paiement avec mode MOBILE_MONEY → numéro de transaction obligatoire.
  6. 6
    Mode virement bancaire — BANK_TRANSFER → référence virement requise.
  7. 7
    Mode chèque — CHECK → numéro de chèque + banque + date encaissement.
  8. 8
    Génération reçu PDF — Tout paiement enregistré → bouton "Imprimer le reçu" → PDF avec QR code de vérification.
  9. 9
    Détection automatique défaut — Une échéance en retard de >90 jours → marquage automatique en DEFAULTED.
  10. 10
    Export comptable — Filtre période + export CSV → fichier téléchargé avec colonnes adaptées à la compta.
F. Portefeuille & KPIs (9 scénarios)
  1. 1
    KPIs DG (vue nationale) — Total encours, Nb prêts actifs, Nb emprunteurs, PAR30/60/90, Taux approbation, Taux recouvrement.
  2. 2
    KPIs DR (vue régionale) — Mêmes KPIs mais limités à la région Grand Tunis.
  3. 3
    KPIs DA (vue agence) — Idem mais limités à Tunis Centre.
  4. 4
    Filtres période — Mois courant / Trimestre / Année / Custom → recalcul auto.
  5. 5
    Ranking agences — Onglet "Performance agences" → classement par volume octroyé, taux PAR, taux recouvrement.
  6. 6
    Performance par agent — Filtrer par agent Fatma → ses métriques personnelles.
  7. 7
    Snapshots historiques — Voir l'évolution du portefeuille sur 6 mois (courbes Recharts).
  8. 8
    Comparaison période — Comparer T1 vs T1 année précédente → calcul automatique des variations.
  9. 9
    Export portefeuille — Export CSV/Excel du portefeuille avec toutes les colonnes pour analyses externes.
G. Agences & Régions (8 scénarios)
  1. 1
    Voir les 4 agences seedées — Tunis Centre, La Marsa, Nabeul, Hammamet.
  2. 2
    Créer une nouvelle agence — DG → /agencies → "Nouvelle" → nom, code, région, GPS (lat/long), directeur → sauvegarder.
  3. 3
    Assigner un directeur — Agence sans directeur → "Assigner DA" → choisir un DA libre → confirmer.
  4. 4
    Désactiver une agence — Toggle isActive → off → l'agence n'apparaît plus dans les sélections (création emprunteur, dossier).
  5. 5
    Vue stats par agence — Détail agence → nb emprunteurs, nb prêts actifs, PAR de cette agence.
  6. 6
    Créer une nouvelle région — Code REG-SF (Sfax), nom Sfax → sauvegarder.
  7. 7
    Assigner un DR à une région — Région sans DR → "Assigner directeur" → choisir.
  8. 8
    Voir les agences d'une région — Détail région Grand Tunis → voir Tunis Centre + La Marsa.
H. Gestion des utilisateurs IMF (8 scénarios)
  1. 1
    DG crée tous les rôles — Karim peut créer DR, DA, SC, Agent, Caissier dans n'importe quelle agence.
  2. 2
    DR limité à sa région — Sonia ne peut créer que des DA/SC/Agents dans Tunis Centre ou La Marsa, pas Nabeul.
  3. 3
    DA limité à son agence — Nabil ne peut créer que SC/Agent/Caissier dans Tunis Centre.
  4. 4
    Agent ne peut pas créer — Fatma essaie de créer un user → option non visible / message d'erreur.
  5. 5
    Modifier un utilisateur — Changer phone, email → sauvegarder.
  6. 6
    Désactiver un user — Toggle isActive → off → l'utilisateur ne peut plus se connecter.
  7. 7
    Reset password — DG ou ADMIN_IMF → bouton "Reset password" → email envoyé à l'user avec lien temporaire.
  8. 8
    Voir lastLoginAt — Liste users → colonne "Dernière connexion" remplie.
I. Notifications (7 scénarios)
  1. 1
    Recevoir notification LOAN_SUBMITTED — Agent soumet un dossier → SC reçoit une notif "Nouveau dossier à réviser".
  2. 2
    Recevoir notification PAYMENT_LATE — Échéance en retard → Agent + DA reçoivent une alerte.
  3. 3
    Compteur non-lus (bell) — Badge rouge dans la TopBar avec le nombre de notifs non lues.
  4. 4
    Marquer comme lue — Cliquer sur une notif → badge décrémente.
  5. 5
    Mark all as read — Bouton "Tout marquer lu" → badge passe à 0.
  6. 6
    Filtre par priorité — URGENT / HIGH / MEDIUM / LOW → liste filtrée.
  7. 7
    Filtre par type — LOAN_* / PAYMENT_* / KYC_* / SYSTEM_* → liste filtrée.
J. Paramètres tenant — réservés ADMIN_IMF (6 scénarios)
  1. 1
    Accès Settings limité — Tentative DG/DR/DA/Agent → option Paramètres non visible. Seul Moez (ADMIN_IMF) y accède.
  2. 2
    Voir les logs d'audit du tenant — /settings/audit → liste de toutes les mutations avec acteur + date + payload.
  3. 3
    Exporter audit CSV — Bouton "Exporter" → fichier CSV téléchargé.
  4. 4
    Voir les quotas vs plan — /settings/quotas → utilisation actuelle vs limites du plan (ex: 8/20 agences, 12/50 users, 134/2000 prêts ce mois).
  5. 5
    Activer/désactiver un module — /settings/modules → toggle BORROWER_PORTAL off → l'app portail devient inaccessible pour ce tenant.
  6. 6
    Configurer l'onboarding — /settings/onboarding → champs obligatoires/optionnels du parcours emprunteur (ex: CIN obligatoire, justificatif revenus optionnel).
K. Multilingue & RTL Arabe (6 scénarios)
  1. 1
    Bascule FR → AR — Cliquer sur l'icône globe dans TopBar → choisir العربية → toute l'UI bascule en arabe + layout RTL (sidebar à droite).
  2. 2
    Bascule FR → EN — Choisir English → labels traduits en anglais, LTR.
  3. 3
    Persistance après refresh — Rafraîchir la page → la langue choisie est conservée.
  4. 4
    Persistance après logout/login — Se déconnecter, se reconnecter → langue conservée.
  5. 5
    Vérification RTL Arabe — Sidebar à droite, textes alignés à droite, dates et chiffres lus de droite à gauche, icônes flèches inversées.
  6. 6
    Vérification absence de clés brutes — Naviguer toutes les pages en AR et EN → aucune chaîne comme "auth.login" affichée (= toutes les clés sont traduites).
L. Edge cases & cas limites (10 scénarios)
  1. 1
    Tenant suspendu — Le Super Admin Qredon suspend le tenant al-amal-mf → tous les utilisateurs IMF sont déconnectés et reçoivent un message "Service temporairement suspendu".
  2. 2
    Session expirée (30 min d'inactivité) — Laisser l'app inactive 31 min → la prochaine action déclenche un refresh automatique du token, transparent pour l'utilisateur.
  3. 3
    Refresh token expiré (7 jours) — Inactivité >7 jours → retour à la page de connexion.
  4. 4
    Connexion simultanée multi-onglets — Ouvrir l'app dans 2 onglets → les deux fonctionnent en parallèle.
  5. 5
    Réseau coupé — Désactiver le wifi → l'app affiche un message "Connexion perdue" plutôt que de planter.
  6. 6
    Tenant nouvellement créé (données vides) — Se connecter sur un tenant sans emprunteurs → empty states clairs avec CTA "Créer le premier emprunteur".
  7. 7
    Pagination 100+ résultats — Filtrer un grand volume → navigation par pages fluide.
  8. 8
    Numéro phone invalide — Tenter de saisir +216 1234 (format incomplet) → message d'erreur "Format MENA invalide".
  9. 9
    CIN dupliqué — Tenter de créer un emprunteur avec un CIN déjà existant → erreur "CIN déjà utilisé".
  10. 10
    Quota plan atteint — IMF avec plan Starter (5 agences max) tente d'en créer une 6e → erreur "Quota atteint, upgrade requis".
M. Workflows complets bout-à-bout (5 scénarios cross-plateforme)
  1. 1
    Onboarding complet d'un nouvel emprunteur
    1. Nouvel utilisateur s'inscrit sur le portail (port 3002) avec phone+email
    2. Validation double OTP (SMS + email — codes via MailHog port 8025)
    3. Complète son profil sur le portail (nom, CIN, activité, revenus)
    4. Apparaît côté IMF dans /borrowers/pending-validation
    5. Agent Fatma valide le KYC → statut VERIFIED
    6. L'emprunteur reçoit une notification push portail
    7. L'emprunteur peut désormais faire une demande de prêt
  2. 2
    Demande de prêt complète
    1. Emprunteur ouvre /apply sur le portail
    2. Sélectionne Microcrédit Commerce, montant 5000, durée 12 mois
    3. Wizard 4 étapes (Identité, Économique, Projet, Documents)
    4. Signature OTP de consentement à la soumission
    5. Dossier apparaît côté IMF avec statut SUBMITTED
    6. SC Youssef approuve à 4500 TND (montant ajusté)
    7. DA Nabil décaisse → DISBURSED + échéancier 12 mois généré
    8. Emprunteur reçoit notif "Prêt décaissé"
  3. 3
    Cycle de remboursement
    1. 1re échéance arrive (J+30 du décaissement)
    2. Emprunteur reçoit une notif "Échéance dans 3 jours"
    3. L'emprunteur se rend à l'agence ou paie via mobile money
    4. Caissier Salma enregistre le paiement (mode CASH ou MOBILE_MONEY)
    5. Reçu PDF généré avec QR code
    6. Emprunteur reçoit notif "Paiement confirmé" + reçu téléchargeable
    7. Statut échéance : UPCOMING → PAID
  4. 4
    KYC pending avec demande de complément
    1. Emprunteur Sarra Mansouri (PENDING_PROFILE) complète son profil partiellement
    2. Statut passe à PENDING_REVIEW
    3. Agent ouvre le dossier KYC, identifie une pièce manquante
    4. Agent clique "Demander info complémentaire" + message "Veuillez fournir un justificatif de domicile"
    5. Statut passe à ADDITIONAL_INFO_REQUIRED
    6. Emprunteur reçoit notif portail + voit l'alerte sur sa fiche
    7. Il uploade le justificatif depuis son portail
    8. Agent re-révise → APPROVE → statut VERIFIED
  5. 5
    Génération d'attestation + vérification publique par QR
    1. Emprunteur avec prêt clôturé demande une attestation LOAN_CLOSURE depuis son portail
    2. PDF généré côté backend avec QR code unique
    3. L'emprunteur télécharge l'attestation et la partage
    4. Un tiers (banque, employeur) scanne le QR → ouvre /verify/{qrCode}
    5. Page publique affichée sans login, montre uniquement les métadonnées de validité (type, date, signature) sans le fichier