Spécifications Dashboard Partenaire

1.1Description

Le dashboard partenaire (rewapp-partner) est l'interface web permettant aux commerçants partenaires de REWAPP de gérer leur programme de fidélité : profil, programme de cashback, marketing, statistiques et paramètres.

C'est une application Angular + Ionic avec authentification JWT, permissions par rôle (système d'équipe), et routing protégé par AuthGuard + TeamPermissionsGuard.

1.2Fonctionnalités

• Dashboard : vue d'ensemble (/dashboard)
• Profil : informations du commerce (/profile)
• Programme : configuration du cashback (/programme)
• Marketing : événements et promotions (/marketing)
• Statistiques : reporting (/statistics)
• Informations : infos commerce (/informations)
• Paramètres : paramètres équipe et compte (/settings)
• KYB :Know Your Business (/kyb) — pour partenaires en attente de validation

2.1Pages Publiques (sans auth)

2.2Flux d'Inscription

3.1Structure du Projet

rewapp-partner/src/app/
├── app.component.ts
├── app.config.ts
├── app.routes.ts              # Routes + AuthGuard + TeamPermissionsGuard
├── core/
│   └── guards/
│       ├── auth.guard.ts       # Protection authentification
│       └── team-permissions.guard.ts  # Filtrage par permission
├── pages/
│   ├── login/                 # LoginPage
│   ├── inscription/            # InscriptionPage
│   ├── verify-email/          # VerifyEmailPage
│   ├── accept-invite/         # AcceptInvitePage
│   ├── kyb/                   # KybPage (pending_approval)
│   ├── dashboard/              # DashboardPage
│   ├── profile/               # ProfilePage
│   ├── programme/             # ProgrammePage
│   ├── marketing/             # MarketingPage
│   ├── statistics/            # StatisticsPage
│   ├── informations/          # InformationsPage
│   └── settings/              # SettingsPage
├── services/
└── shared/
    ├── components/
    │   ├── app-shell/         # AppShellComponent
    │   ├── sidebar/           # SidebarComponent
    │   └── user-card/         # UserCardComponent
    └── services/
        └── toast/             # ToastService

3.2Routes

3.3Sidebar Navigation

L'AppShellComponent wrap les pages protégées et affiche la sidebar. La navigation est filtrée dynamiquement selon les permissions du membre connecté.

4.1Dashboard

Route : /dashboard | Composant : DashboardPage

Page d'accueil après connexion. KPIs principaux, dernières transactions, alertes.

4.2Profil

Route : /profile | Composant : ProfilePage

Gestion des informations du commerce : nom, adresse, horaires, logo, coordonnées.

4.3Programme

Route : /programme | Composant : ProgrammePage

Configuration du programme de cashback : taux de fidélisation, paliers, bonus, programme d'établissement.

4.4Marketing

Route : /marketing | Composant : MarketingPage

Gestion des événements et promotions. Créer, modifier, activer/désactiver des événements.

4.5Statistiques

Route : /statistics | Composant : StatisticsPage

Reporting détaillé : transactions, points émis, évolution du programme, performances par période.

4.6Autres Pages

5.1Système de Permissions

Chaque membre d'équipe possède des permissions spécifiques. Le TeamPermissionsGuard vérifie la permission requise avant d'afficher une page.

5.2Gestion d'Équipe

• Invitation par email de nouveaux membres (/accept-invite)
• Affectation de permissions par rôle
• Révoquer l'accès à un membre
• Filtrage dynamique de la sidebar selon permissions live

6.1Technologies

6.2Architecture

• Routing avec lazy-loading (chaque page = chunk séparé)
• AppShellComponent = layout wrapper avec sidebar
• Icons SVG dans src/assets/icons/
• Services Angular dans src/app/services/
• Modèles TypeScript dans src/app/models/
• Sidebar collapsible (mobile)
• Permissions filtrées live depuis le backend (pas juste JWT)