# Prompt — Générer l'application web « Radar PME »

> Copie-colle ce prompt à un assistant IA capable d'écrire du code (ou à un développeur) pour régénérer l'application complète. Il décrit l'objectif, l'architecture, les règles métier et chaque fichier à produire.

---

## CONTEXTE & OBJECTIF

Je m'appelle Sandy, je dirige **jecreemonsite.eu** : je crée des sites web, j'intègre de l'IA et j'automatise des process pour les TPE/PME. Je veux un **outil interne de prospection** qui tourne **en local sur mon PC Windows** (pas hébergé en ligne).

Le but de l'app : **détecter chaque jour des PME francophones (10–250 salariés) qui ont des process manuels chronophages et qui ne connaissent PAS encore l'IA/l'automatisation** — donc des clients potentiels « terrain vierge » pour mes services. 

**Philosophie de ciblage capitale (à ne pas inverser) :** je ne cherche PAS des gens qui parlent déjà d'IA/automatisation (ce sont des concurrents ou des early adopters déjà équipés). Je cherche l'inverse : des PME qui montrent des **signaux de douleur opérationnelle** (forte activité gérée à la main, surcharge, pas de site web, plaintes de lenteur dans les avis). La présence de signaux « IA/automatisation » est un signal **négatif** dans le scoring.

## SOURCES DE DONNÉES (important)

- **Pas de LinkedIn** : l'API est verrouillée et le scraping viole les CGU. À proscrire.
- **Source principale : Google Places API (New)** — `https://places.googleapis.com/v1/places:searchText` (POST). Données réelles, légales : nom, téléphone, adresse, site, note, nombre d'avis, avis. C'est elle qui alimente le scan.
- Sources futures possibles (à prévoir comme connecteurs séparés, non requis pour la v1) : offres d'emploi (signal de douleur), annuaires légaux Pappers/BCE (confirmer effectif + dirigeant).

## ARCHITECTURE

Trois fichiers, à placer dans un même dossier :

1. **`radar-pme-api.py`** — API Flask locale (port 5000) qui reçoit la config, interroge Google Places, score, et renvoie les prospects en JSON.
2. **`radar-pme-interface.html`** — interface web autonome (panneau de contrôle) qui envoie un POST à l'API et affiche les résultats.
3. **`radar-pme-lancer.bat`** — lanceur Windows qui démarre les deux serveurs et ouvre le navigateur.

---

## FICHIER 1 — `radar-pme-api.py` (Flask)

Exigences :

- Dépendances : `flask`, `flask-cors`, `requests`. Active **CORS** sur les routes `/radar-pme/*` (sinon le navigateur bloque l'appel local).
- Clé Google lue depuis `os.environ.get("GOOGLE_API_KEY", "COLLE_TA_CLE_ICI")` pour qu'elle puisse être en variable d'environnement OU collée dans le fichier.
- **Route `POST /radar-pme/scan`** : reçoit un JSON `{zones[], secteurs[], signal_douleur, signal_libelle, taille_min, taille_max, nb_prospects}`. Valide (au moins 1 zone et 1 secteur, sinon 400). Renvoie `{statut, nb_combinaisons, prospects[]}`. En cas d'erreur Google, renvoyer un message clair avec code 502.
- **Route `GET /radar-pme/health`** : renvoie `{"statut": "en ligne"}` (pour tester).
- Lancer sur `host="0.0.0.0", port=5000, debug=True`.

**Appel Google Places (New)** :
- Headers : `Content-Type: application/json`, `X-Goog-Api-Key: <clé>`, `X-Goog-FieldMask: <champs>`.
- Field mask économe (pour rester dans le palier le moins cher) incluant : `places.id, places.displayName, places.formattedAddress, places.nationalPhoneNumber, places.internationalPhoneNumber, places.websiteUri, places.rating, places.userRatingCount, places.primaryTypeDisplayName, places.reviews`.
- Body : `{textQuery: "<secteur> <zone>", maxResultCount: 20, languageCode: "fr"}`.

**Logique de scan** (`lancer_scan`) : pour chaque combinaison zone × secteur, requêter Google, dédupliquer par `id`, écarter les concurrents, scorer la douleur, trier par score décroissant, garder les N meilleurs.

**Filtre anti-concurrent** (volontairement restrictif — ne JAMAIS exclure une vraie PME par erreur) :
- Exclure par type Google : `marketing_agency, advertising_agency, software_company, web_designer`.
- Exclure par nom UNIQUEMENT sur des expressions explicites : `agence web, web agency, digital agency, agence digitale, agence marketing, seo agency, automatisation ia, no-code, growth hack, intelligence artificielle`. Ne PAS exclure sur des mots isolés ambigus comme « web » ou « digital » seuls.

**Scoring de la douleur** (renvoie `(signal_texte, score)`) :
- `userRatingCount >= 200` → +3 (« fort volume d'activité ») ; `>= 50` → +2 ; `>= 10` → +1.
- Avis contenant des mots de surcharge (`délai, attente, lent, débordé, réactivité, administratif, paperasse, manuel, relance, joindre`, + équivalents EN `wait, slow, delay, unresponsive, backlog, overwhelmed`) → +2 (« signaux de surcharge dans les avis »).
- Pas de `websiteUri` → +1 (« process probablement manuel »).
- Niveau : score ≥ 5 = `fort`, ≥ 3 = `moyen`, sinon `faible`.

**Format de chaque prospect renvoyé** :
```json
{
  "entreprise": "", "secteur": "", "zone": "",
  "taille_estimee": "10–250 salariés (à confirmer via Pappers/BCE)",
  "contact": {"decideur":"à vérifier","telephone":"","email":"à vérifier","site":"","adresse":""},
  "signal_douleur": "", "pourquoi_qualifie": "",
  "type_approche": "Appel direct + audit gratuit | Email ciblé douleur",
  "niveau_potentiel": "fort|moyen|faible",
  "source": "Google Places API (New)"
}
```
Note honnête à laisser en commentaire : Google Places ne donne PAS l'effectif ; la fourchette de taille oriente seulement, l'effectif réel se confirme via Pappers/BCE. Marquer les infos non confirmées « à vérifier », ne jamais inventer un contact.

---

## FICHIER 2 — `radar-pme-interface.html` (panneau de contrôle)

Page HTML autonome (avec `<!DOCTYPE>`), responsive mobile, sobre et pro.

**Design** : palette bleu profond `#0F1F3D` + dégradé `#1E3A6E`, accent `#2563EB`, fond crème `#FAFAF8`. Typo `Inter` (corps) + `JetBrains Mono` (pour le JSON, effet « console »). Hero avec titre « Radar PME — panneau de contrôle ». Respecter `prefers-reduced-motion`, focus clavier visible.

**Sections de configuration :**
1. **Zones** — chips multi-sélection groupées par pays francophone, avec bouton « tout » par pays :
   - 🇧🇪 Belgique : Bruxelles, Brabant wallon, Hainaut, Liège, Namur, Luxembourg (BE)
   - 🇫🇷 France : Île-de-France, Hauts-de-France, Grand Est, Auvergne-Rhône-Alpes, Occitanie, PACA, Nouvelle-Aquitaine, Bretagne
   - 🇨🇭 Suisse romande : Genève, Vaud, Valais, Fribourg, Neuchâtel
   - 🇱🇺 Luxembourg : Luxembourg-Ville, Esch-sur-Alzette
2. **Secteurs** — cases multi-sélection (avec icône) : Cabinet comptable, Agence immobilière, E-commerce/retail, Logistique/transport, Artisanat/BTP, Cabinet d'avocats, Agence de voyage, Cabinet médical/dentaire, Garage/automobile, Restauration/hôtellerie, Assurance/courtage, Salle de sport/coaching.
3. **Signal de douleur** — choix unique : Recrutement répétitif / Admin chronophage / Croissance qui sature / Tous signaux.
4. **Taille** — double curseur min/max (défaut 10–250).

**Bloc radar (sortie)** : 4 compteurs live (zones, secteurs, scans = zones×secteurs, ~10 prospects visés) + un aperçu du **payload JSON** qui sera envoyé, mis à jour en temps réel.

**Champ URL endpoint** : input texte, valeur par défaut vide, placeholder `https://...`, **mémorisé via localStorage** (avec try/catch car localStorage peut être indisponible).

**3 boutons** :
- **Lancer le scan** : POST `fetch` JSON vers l'URL. Gérer 3 états — chargement (spinner + « Scan en cours »), succès (✓ + nombre de prospects, puis afficher les résultats), erreur (✗ message explicite : endpoint hors ligne / mauvaise URL / CORS / code HTTP). Valider l'URL avant (doit commencer par http).
- **Copier le JSON** : copie le payload dans le presse-papier.
- **Réinitialiser**.

**Affichage des résultats** : après un scan réussi, dérouler une section « Prospects détectés », une carte par PME avec : nom, badge de potentiel coloré (fort=vert, moyen=ambre, faible=gris), secteur·zone·taille, encadré « ⚠ Signal », puis téléphone cliquable (`tel:`), lien site, adresse, et l'approche recommandée. Si 0 résultat, afficher un message invitant à élargir secteurs/zones. **Échapper le HTML** des données (sécurité). Scroll doux vers les résultats.

**Contraintes techniques** : pas de `<form>` HTML, interactions via `onClick`/`onChange`. Pas de framework requis (vanilla JS suffit).

---

## FICHIER 3 — `radar-pme-lancer.bat` (Windows)

Script `.bat` qui :
1. Se place dans son propre dossier (`cd /d "%~dp0"`).
2. Détecte `python` ou `py` (sinon message d'erreur clair + lien python.org).
3. Vérifie la présence des deux autres fichiers.
4. Installe les dépendances : `pip install flask flask-cors requests`.
5. Lance l'API Flask dans une nouvelle fenêtre (`start "..." cmd /k "python radar-pme-api.py"`).
6. Lance le serveur HTML dans une autre fenêtre (`start "..." cmd /k "python -m http.server 8000"`).
7. Attend ~3 s puis ouvre `http://localhost:8000/radar-pme-interface.html` dans le navigateur.
8. Affiche un récap (URLs, rappel de l'endpoint `http://127.0.0.1:5000/radar-pme/scan`, comment tout arrêter).

> Pourquoi un serveur HTML local (port 8000) plutôt qu'ouvrir le fichier en `file://` : sinon l'origine est `null` et le navigateur bloque l'appel CORS vers l'API.

---

## INSTRUCTIONS D'UTILISATION À FOURNIR EN SORTIE

Rappeler à l'utilisateur :
1. Obtenir une clé sur console.cloud.google.com → activer **Places API (New)** → créer une clé → la **restreindre à Places API (New)**.
2. La facturation Google doit être activée (carte requise) mais l'usage de prospection tient dans le **crédit gratuit mensuel** (Text Search ~5 000 req/mois gratuites). Conseiller une **alerte de budget** et/ou une **limite de quota** par sécurité.
3. Coller la clé en ligne `GOOGLE_API_KEY` du fichier Python, OU en variable d'environnement (`set GOOGLE_API_KEY=...`).
4. **Ne jamais partager** la clé ni le fichier qui la contient (pas de site, pas de GitHub).
5. Lancer via le `.bat`, tester `/radar-pme/health`, puis lancer un scan.
6. Pour obtenir ~10 prospects : combiner plusieurs zones et/ou secteurs (une requête zone×secteur unique renvoie souvent peu de résultats — limite de la source, pas du code).

## QUALITÉ ATTENDUE

Code propre, production-ready, commenté en français. Messages d'erreur explicites et orientés action. Aucune donnée inventée. Sécurité : échappement HTML côté front, clé jamais exposée côté client (elle vit uniquement dans l'API). Tester la syntaxe avant livraison.