820 lines
56 KiB
HTML
820 lines
56 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<link rel="icon" href="/favicon.ico" type="image/x-icon">
|
||
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>BlueprintAI — Process Consulting & Business Documentation</title>
|
||
<meta name="description" content="BlueprintAI — Process Consulting & Business Documentation - Solutions IA souveraines pour entreprises">
|
||
<link href="https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&family=Outfit:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
||
<style>
|
||
:root{--bg:#05080f;--surface:#0c1222;--surface2:#111a2e;--border:rgba(78,168,222,0.1);--teal:#00c9a7;--blue:#4ea8de;--blue15:rgba(78,168,222,0.15);--purple:#7c5cfc;--gold:#f0c674;--coral:#ff6b6b;--silver:#7a8ba5;--white:#edf2f7;--dark:#1a2340}
|
||
*{margin:0;padding:0;box-sizing:border-box}
|
||
body{font-family:'Outfit',sans-serif;background:var(--bg);color:var(--white);min-height:100vh}
|
||
body::before{content:'';position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");pointer-events:none;z-index:1000}
|
||
|
||
nav{position:fixed;top:0;width:100%;padding:0.8rem 3%;display:flex;justify-content:space-between;align-items:center;z-index:100;backdrop-filter:blur(20px);background:rgba(5,8,15,0.85);border-bottom:1px solid var(--border)}
|
||
.logo{font-weight:800;font-size:1.3rem;letter-spacing:-0.03em}
|
||
.logo span{color:var(--blue)}
|
||
.logo sub{font-size:0.55rem;color:var(--purple);font-weight:700;vertical-align:super}
|
||
|
||
.app{display:grid;grid-template-columns:400px 1fr;min-height:100vh;padding-top:52px}
|
||
|
||
/* SIDEBAR */
|
||
.sidebar{background:var(--surface);border-right:1px solid var(--border);padding:1.5rem;overflow-y:auto;max-height:calc(100vh - 52px);position:sticky;top:52px}
|
||
.sidebar h2{font-size:1.1rem;font-weight:700;margin-bottom:0.3rem}
|
||
.sidebar .sub{font-size:0.75rem;color:var(--silver);margin-bottom:1.5rem;line-height:1.5}
|
||
|
||
.form-group{margin-bottom:1.1rem}
|
||
.form-group label{display:block;font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.1em;color:var(--silver);margin-bottom:0.35rem}
|
||
.form-group input,.form-group textarea,.form-group select{width:100%;background:rgba(0,0,0,0.3);border:1px solid rgba(255,255,255,0.08);border-radius:8px;padding:0.65rem 0.85rem;font-size:0.85rem;color:var(--white);font-family:'Outfit',sans-serif;outline:none;transition:border 0.3s;resize:vertical}
|
||
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--blue)}
|
||
.form-group input::placeholder,.form-group textarea::placeholder{color:rgba(255,255,255,0.2)}
|
||
.form-group select{cursor:pointer;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%237a8ba5' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}
|
||
select option{background:var(--surface);color:var(--white)}
|
||
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0.7rem}
|
||
|
||
.divider{border:none;border-top:1px solid rgba(255,255,255,0.04);margin:1.3rem 0}
|
||
.stitle{font-size:0.65rem;font-weight:700;text-transform:uppercase;letter-spacing:0.15em;color:var(--blue);margin-bottom:0.8rem;display:flex;align-items:center;gap:0.5rem}
|
||
.stitle::after{content:'';flex:1;height:1px;background:rgba(78,168,222,0.15)}
|
||
|
||
/* DOCUMENT TYPE CARDS */
|
||
.doc-types{display:grid;grid-template-columns:1fr 1fr;gap:0.5rem;margin-bottom:1rem}
|
||
.doc-type{background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.06);border-radius:10px;padding:0.7rem;cursor:pointer;transition:all 0.2s;text-align:center}
|
||
.doc-type:hover{border-color:var(--blue)}
|
||
.doc-type.active{border-color:var(--blue);background:var(--blue15)}
|
||
.doc-type-icon{font-size:1.4rem;margin-bottom:0.3rem}
|
||
.doc-type-name{font-size:0.72rem;font-weight:600}
|
||
.doc-type-desc{font-size:0.6rem;color:var(--silver);margin-top:0.1rem}
|
||
|
||
/* DOMAIN CHIPS */
|
||
.chips{display:flex;flex-wrap:wrap;gap:0.35rem}
|
||
.chip{font-size:0.68rem;font-weight:600;padding:0.25rem 0.6rem;border-radius:100px;background:rgba(78,168,222,0.08);color:var(--silver);border:1px solid rgba(255,255,255,0.06);cursor:pointer;transition:all 0.2s;user-select:none}
|
||
.chip:hover{border-color:var(--blue);color:var(--blue)}
|
||
.chip.active{background:var(--blue15);color:var(--blue);border-color:rgba(78,168,222,0.3)}
|
||
|
||
.btn-gen{width:100%;padding:0.85rem;background:var(--blue);color:var(--bg);border:none;border-radius:10px;font-family:'Outfit',sans-serif;font-size:0.95rem;font-weight:700;cursor:pointer;transition:all 0.3s;margin-top:0.5rem}
|
||
.btn-gen:hover{background:#6bbef0;transform:translateY(-1px);box-shadow:0 8px 30px rgba(78,168,222,0.25)}
|
||
.btn-gen:disabled{opacity:0.5;cursor:not-allowed;transform:none}
|
||
.spinner-sm{display:inline-block;width:14px;height:14px;border:2px solid rgba(5,8,15,0.3);border-top-color:var(--bg);border-radius:50%;animation:spin 0.7s linear infinite;margin-right:0.4rem;vertical-align:middle}
|
||
@keyframes spin{to{transform:rotate(360deg)}}
|
||
|
||
/* MAIN */
|
||
.main{padding:2rem 3rem;overflow-y:auto;max-height:calc(100vh - 52px)}
|
||
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:60vh;text-align:center}
|
||
.empty-icon{font-size:3.5rem;margin-bottom:1.2rem;opacity:0.3}
|
||
.empty-title{font-size:1.2rem;font-weight:700;color:var(--silver);margin-bottom:0.4rem}
|
||
.empty-desc{font-size:0.82rem;color:rgba(255,255,255,0.2);max-width:380px;line-height:1.5}
|
||
|
||
/* OUTPUT */
|
||
.output{display:none}
|
||
.output.visible{display:block;animation:fadeIn 0.5s}
|
||
.output-header{margin-bottom:1.5rem;padding-bottom:1.2rem;border-bottom:2px solid var(--blue)}
|
||
.output-header .tag{font-size:0.7rem;font-weight:600;text-transform:uppercase;letter-spacing:0.15em;color:var(--blue);margin-bottom:0.4rem}
|
||
.output-header h1{font-size:1.8rem;font-weight:800;letter-spacing:-0.03em;line-height:1.15;margin-bottom:0.4rem}
|
||
.output-header .meta{font-size:0.75rem;color:var(--silver)}
|
||
|
||
.output-content{font-size:0.9rem;line-height:1.75;color:rgba(255,255,255,0.85)}
|
||
.output-content h2{font-size:1.2rem;font-weight:700;color:var(--white);margin:1.8rem 0 0.7rem;padding-bottom:0.35rem;border-bottom:1px solid rgba(78,168,222,0.1)}
|
||
.output-content h3{font-size:1rem;font-weight:600;color:var(--blue);margin:1.3rem 0 0.4rem}
|
||
.output-content p{margin-bottom:0.8rem}
|
||
.output-content ul{margin:0.4rem 0 0.8rem 1.3rem}
|
||
.output-content ul li{margin-bottom:0.4rem}
|
||
.output-content table{width:100%;border-collapse:collapse;margin:0.8rem 0;font-size:0.82rem}
|
||
.output-content table th{background:var(--dark);padding:0.6rem;text-align:left;font-weight:600;font-size:0.7rem;text-transform:uppercase;letter-spacing:0.05em;color:var(--blue);border-bottom:2px solid rgba(78,168,222,0.2)}
|
||
.output-content table td{padding:0.5rem 0.6rem;border-bottom:1px solid rgba(255,255,255,0.04)}
|
||
.output-content table tr:hover td{background:rgba(78,168,222,0.03)}
|
||
.output-content blockquote{border-left:3px solid var(--purple);padding:0.7rem 1rem;margin:0.8rem 0;background:rgba(124,92,252,0.05);border-radius:0 8px 8px 0;font-style:italic;color:var(--silver)}
|
||
.output-content strong{color:var(--white)}
|
||
.output-content code{background:rgba(78,168,222,0.1);padding:0.12rem 0.35rem;border-radius:4px;font-family:'Space Mono',monospace;font-size:0.8rem;color:var(--blue)}
|
||
/* BPMN diagram styling */
|
||
.output-content pre{background:var(--dark);border:1px solid var(--border);border-radius:10px;padding:1.2rem;overflow-x:auto;font-family:'Space Mono',monospace;font-size:0.78rem;line-height:1.6;color:var(--blue);margin:1rem 0}
|
||
|
||
.actions{display:flex;gap:0.6rem;margin-top:1.5rem;padding-top:1.2rem;border-top:1px solid rgba(255,255,255,0.04);flex-wrap:wrap}
|
||
.btn-act{padding:0.55rem 1rem;border-radius:8px;font-family:'Outfit',sans-serif;font-size:0.78rem;font-weight:600;cursor:pointer;transition:all 0.2s;border:1px solid rgba(255,255,255,0.1);background:transparent;color:var(--white)}
|
||
.btn-act:hover{border-color:var(--blue);color:var(--blue)}
|
||
.btn-act.primary{background:var(--blue);color:var(--bg);border-color:var(--blue)}
|
||
.btn-act.primary:hover{background:#6bbef0}
|
||
|
||
.toast{position:fixed;bottom:2rem;right:2rem;background:var(--blue);color:var(--bg);padding:0.6rem 1rem;border-radius:8px;font-weight:600;font-size:0.82rem;z-index:2000;display:none}
|
||
|
||
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
|
||
@media(max-width:900px){.app{grid-template-columns:1fr}.sidebar{max-height:none;position:static}.main{max-height:none}}
|
||
input,select,textarea{background:#0b0d14!important;color:#e2e8f0!important;border:1px solid #1e293b!important;border-radius:8px!important}input::placeholder{color:#475569!important}</style><style>/* Hide nav in iframe */
|
||
@media all{.in-iframe nav{display:none!important}.in-iframe .hero{padding-top:3rem!important;min-height:auto!important}.in-iframe footer{display:none!important}.in-iframe .cta{display:none!important}.in-iframe .wv-links{display:none!important}.wv-links{display:none!important}}</style>
|
||
<script>if(window!==window.top)document.documentElement.classList.add('in-iframe');</script>
|
||
<link rel="canonical" href="https://weval-consulting.com/products/blueprintai.html">
|
||
<meta property="og:title" content="BlueprintAI — Process Consulting & Business Documentation">
|
||
<meta property="og:description" content="BlueprintAI — Process Consulting & Business Documentation - Solutions IA souveraines pour entreprises">
|
||
<meta property="og:url" content="https://weval-consulting.com/products/blueprintai.html">
|
||
<meta property="og:type" content="website">
|
||
<meta property="og:site_name" content="WEVAL Consulting">
|
||
<meta property="og:image" content="https://weval-consulting.com/assets/logo-weval-png-DChrMGao.png">
|
||
<meta name="twitter:card" content="summary">
|
||
<meta name="twitter:title" content="BlueprintAI — Process Consulting & Business Documentation">
|
||
<meta name="twitter:description" content="BlueprintAI — Process Consulting & Business Documentation - Solutions IA souveraines pour entreprises">
|
||
<link rel="alternate" hreflang="fr" href="https://weval-consulting.com/products/blueprintai.html">
|
||
<link rel="alternate" hreflang="x-default" href="https://weval-consulting.com/products/blueprintai.html">
|
||
<link rel="stylesheet" href="/assets/dark-iframe.css"></head>
|
||
<body>
|
||
|
||
<nav>
|
||
<div class="logo" style="display:flex;align-items:center;gap:8px"><img src="/assets/logo-blueprintai.svg" alt="" style="width:32px;height:32px">Blueprint<span>AI</span><sub>by WEVAL</sub></div>
|
||
<span style="font-size:0.72rem;color:var(--silver)">Process Consulting & Business Documentation</span></nav>
|
||
|
||
<div class="app">
|
||
<div class="sidebar">
|
||
<h2>Nouveau document</h2>
|
||
<div class="sub">Sélectionnez le type de livrable, le domaine métier et le contexte. L'IA génère un document consulting de qualité Big4.</div>
|
||
|
||
<div class="stitle">Type de livrable</div>
|
||
<div class="doc-types" id="docTypes">
|
||
<div class="doc-type active" data-v="bpmn" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<div class="doc-type-name">Logigramme BPMN</div>
|
||
<div class="doc-type-desc">Flux processus</div></div>
|
||
<div class="doc-type" data-v="blueprint" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<div class="doc-type-name">Blueprint Process</div>
|
||
<div class="doc-type-desc">L1 / L2 / L3</div></div>
|
||
<div class="doc-type" data-v="cdc" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<div class="doc-type-name">Cahier des Charges</div>
|
||
<div class="doc-type-desc">Spécifications</div></div>
|
||
<div class="doc-type" data-v="impact" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<div class="doc-type-name">Étude d'Impact</div>
|
||
<div class="doc-type-desc">Gap & risk analysis</div></div>
|
||
<div class="doc-type" data-v="problem" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<div class="doc-type-name">Problem Solving</div>
|
||
<div class="doc-type-desc">Root cause / 8D / A3</div></div>
|
||
<div class="doc-type" data-v="sop" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"></div>
|
||
<div class="doc-type-name">SOP / Procédure</div>
|
||
<div class="doc-type-desc">Standard Operating</div></div>
|
||
<div class="doc-type" data-v="matrix" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><line x1="16" y1="13" x2="8" y2="13"/><line x1="16" y1="17" x2="8" y2="17"/></svg></div>
|
||
<div class="doc-type-name">Matrice RACI</div>
|
||
<div class="doc-type-desc">Rôles & responsabilités</div></div>
|
||
<div class="doc-type" data-v="kpi" onclick="selectDoc(this)">
|
||
<div class="doc-type-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/><circle cx="6" cy="6" r="1" fill="currentColor"/><circle cx="6" cy="18" r="1" fill="currentColor"/></svg></div>
|
||
<div class="doc-type-name">KPI Dashboard Spec</div>
|
||
<div class="doc-type-desc">Metrics & reporting</div></div></div>
|
||
|
||
<hr class="divider">
|
||
<div class="stitle">Domaine métier</div>
|
||
<div class="chips" id="domainChips">
|
||
<span class="chip" data-v="Supply Chain">Supply Chain</span>
|
||
<span class="chip" data-v="Achats / Procurement">Achats</span>
|
||
<span class="chip" data-v="Finance / Comptabilité">Finance</span>
|
||
<span class="chip" data-v="Manufacturing / Production">Manufacturing</span>
|
||
<span class="chip" data-v="Transport / Logistique">Transport</span>
|
||
<span class="chip" data-v="Qualité">Qualité</span>
|
||
<span class="chip" data-v="RH / Paie">RH</span>
|
||
<span class="chip" data-v="Commercial / Ventes">Ventes</span>
|
||
<span class="chip" data-v="IT / Systèmes">IT</span>
|
||
<span class="chip" data-v="Maintenance">Maintenance</span>
|
||
<span class="chip" data-v="R&D">R&D</span>
|
||
<span class="chip" data-v="Conformité / Réglementaire">Conformité</span>
|
||
<span class="chip" data-v="Customer Service">Service Client</span>
|
||
<span class="chip" data-v="Warehouse / Entreposage">Warehouse</span></div>
|
||
|
||
<hr class="divider">
|
||
<div class="stitle">Contexte</div>
|
||
|
||
<div class="form-group">
|
||
<label>Entreprise / Client</label>
|
||
<input type="text" id="company" placeholder="ex: Groupe OCP, Marjane, LafargeHolcim..."></div>
|
||
<div class="form-row">
|
||
<div class="form-group">
|
||
<label>Secteur</label>
|
||
<select id="sector">
|
||
<option value="">—</option>
|
||
<option>Pharmaceutique</option>
|
||
<option>Industrie</option>
|
||
<option>Retail</option>
|
||
<option>Agroalimentaire</option>
|
||
<option>Énergie & Mines</option>
|
||
<option>Automobile</option>
|
||
<option>BTP</option>
|
||
<option>Banque & Finance</option>
|
||
<option>Télécoms</option>
|
||
<option>Santé</option>
|
||
<option>Logistique</option>
|
||
<option>Autre</option></select></div>
|
||
<div class="form-group">
|
||
<label>ERP en place</label>
|
||
<select id="erp">
|
||
<option value="">—</option>
|
||
<option>SAP S/4HANA</option>
|
||
<option>SAP ECC</option>
|
||
<option>Oracle EBS</option>
|
||
<option>Oracle Fusion</option>
|
||
<option>Odoo</option>
|
||
<option>Sage</option>
|
||
<option>Microsoft Dynamics</option>
|
||
<option>JD Edwards</option>
|
||
<option>Custom / Interne</option>
|
||
<option>Aucun</option></select></div></div>
|
||
|
||
<div class="form-group">
|
||
<label>Description du processus / problème</label>
|
||
<textarea id="processDesc" rows="4" placeholder="Décrivez le processus à documenter, le problème à résoudre, ou le périmètre du cahier des charges..."></textarea></div>
|
||
|
||
<div class="form-group">
|
||
<label>Niveau de détail</label>
|
||
<div class="chips" id="levelChips">
|
||
<span class="chip" data-v="L1 - Macro (vue d'ensemble)">L1 Macro</span>
|
||
<span class="chip active" data-v="L2 - Détaillé (activités)">L2 Détaillé</span>
|
||
<span class="chip" data-v="L3 - Opérationnel (tâches)">L3 Opérationnel</span></div></div>
|
||
|
||
<div class="form-group">
|
||
<label>Méthodologie préférée</label>
|
||
<select id="methodology">
|
||
<option value="">Auto (IA choisit)</option>
|
||
<option>BPMN 2.0</option>
|
||
<option>Lean Six Sigma</option>
|
||
<option>DMAIC</option>
|
||
<option>8D Problem Solving</option>
|
||
<option>A3 Thinking</option>
|
||
<option>Ishikawa / 5 Pourquoi</option>
|
||
<option>Value Stream Mapping</option>
|
||
<option>SIPOC</option>
|
||
<option>ITIL</option>
|
||
<option>SCOR Model</option>
|
||
<option>APQP</option></select></div>
|
||
|
||
<div class="form-group">
|
||
<label>Langue</label>
|
||
<select id="lang">
|
||
<option value="français">Français</option>
|
||
<option value="anglais">Anglais</option></select></div>
|
||
|
||
<button class="btn-gen" id="genBtn" onclick="generate()">Générer le document →</button></div>
|
||
|
||
<div class="main">
|
||
<div class="empty" id="emptyState">
|
||
<div class="empty-icon"><svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 2a7 7 0 017 7c0 3-2 5-4 6v1H9v-1c-2-1-4-3-4-6a7 7 0 017-7z"/><line x1="9" y1="18" x2="15" y2="18"/></svg></div>
|
||
<div class="empty-title">Votre document apparaîtra ici</div>
|
||
<div class="empty-desc">Sélectionnez un type de livrable, un domaine métier, et décrivez le contexte. L'IA génère un document consulting structuré.</div></div>
|
||
<div class="output" id="output">
|
||
<div class="output-header">
|
||
<div class="tag" id="outTag"></div>
|
||
<h1 id="outTitle"></h1>
|
||
<div class="meta" id="outMeta"></div></div>
|
||
<div class="output-content" id="outContent"></div>
|
||
<div class="actions">
|
||
<button class="btn-act primary" onclick="copyDoc()"> Copier</button>
|
||
<button class="btn-act" onclick="downloadDoc()"> Télécharger .md</button>
|
||
<button class="btn-act" onclick="generate()"> Régénérer</button>
|
||
<button class="btn-act" onclick="exportMermaid()"> Export Mermaid</button></div></div></div></div>
|
||
|
||
<div class="toast" id="toast"></div>
|
||
|
||
<script>
|
||
let selectedDocType = 'bpmn';
|
||
let lastMd = '';
|
||
|
||
function selectDoc(el) {
|
||
document.querySelectorAll('.doc-type').forEach(d => d.classList.remove('active'));
|
||
el.classList.add('active');
|
||
selectedDocType = el.dataset.v;
|
||
}
|
||
|
||
document.querySelectorAll('.chips').forEach(c => {
|
||
const multi = c.id === 'domainChips';
|
||
c.querySelectorAll('.chip').forEach(chip => {
|
||
chip.addEventListener('click', () => {
|
||
if (multi) chip.classList.toggle('active');
|
||
else { c.querySelectorAll('.chip').forEach(x => x.classList.remove('active')); chip.classList.add('active'); }
|
||
});
|
||
});
|
||
});
|
||
|
||
function getChips(id) { return [...document.querySelectorAll(`#${id} .chip.active`)].map(c => c.dataset.v); }
|
||
function toast(m) { const t=document.getElementById('toast'); t.textContent=m; t.style.display='block'; setTimeout(()=>t.style.display='none',2500); }
|
||
|
||
const docTypeLabels = {
|
||
bpmn:'Logigramme BPMN', blueprint:'Blueprint Process L1/L2/L3', cdc:'Cahier des Charges',
|
||
impact:"Étude d'Impact", problem:'Problem Solving', sop:'SOP / Procédure',
|
||
matrix:'Matrice RACI', kpi:'KPI Dashboard Spec'
|
||
};
|
||
|
||
const systemPrompts = {
|
||
bpmn: `Tu es un consultant BPM senior. Génère un logigramme de processus en notation BPMN 2.0.
|
||
UTILISE du pseudo-BPMN en texte avec des blocs ASCII art clairs :
|
||
- [START] → (Activité) → <Décision?> → [END]
|
||
- Pools et Lanes pour les acteurs
|
||
- Inclus les events, gateways, tasks
|
||
Après le diagramme, fournis la description textuelle détaillée de chaque étape avec inputs/outputs/rôles.`,
|
||
|
||
blueprint: `Tu es un consultant process senior expert en amélioration continue. Génère un Blueprint de processus structuré.
|
||
Structure :
|
||
1. Vue d'ensemble (L1)
|
||
2. Processus détaillés (L2) avec sous-processus
|
||
3. Activités opérationnelles (L3) avec tâches, rôles, systèmes
|
||
Inclus pour chaque niveau : Description, Acteurs, Systèmes impliqués, Inputs/Outputs, KPIs, Risques.
|
||
Utilise des tableaux markdown pour structurer.`,
|
||
|
||
cdc: `Tu es un consultant senior qui rédige des cahiers des charges de qualité Big4.
|
||
Structure OBLIGATOIRE :
|
||
1. Contexte et objectifs
|
||
2. Périmètre fonctionnel
|
||
3. Exigences fonctionnelles (détaillées, numérotées EF-001, EF-002...)
|
||
4. Exigences non-fonctionnelles (ENF-001...)
|
||
5. Architecture cible
|
||
6. Contraintes techniques
|
||
7. Planning et jalons
|
||
8. Critères d'acceptation
|
||
9. Matrice de traçabilité
|
||
10. Annexes`,
|
||
|
||
impact: `Tu es un consultant risk & change management. Génère une étude d'impact complète.
|
||
Structure :
|
||
1. Résumé exécutif
|
||
2. Périmètre de l'impact (processus, systèmes, personnes)
|
||
3. Analyse AS-IS vs TO-BE
|
||
4. Gap Analysis (tableau détaillé)
|
||
5. Impacts par domaine (organisationnel, technique, financier, humain)
|
||
6. Matrice de risques (Probabilité × Impact)
|
||
7. Plan de mitigation
|
||
8. Conduite du changement
|
||
9. Quick Wins identifiés`,
|
||
|
||
problem: `Tu es un expert Lean Six Sigma Black Belt. Génère une analyse Problem Solving structurée.
|
||
Utilise la méthodologie demandée (8D, A3, DMAIC, Ishikawa, 5 Pourquoi) ou choisis la plus adaptée.
|
||
Inclus : Définition du problème, Analyse des causes racines, Diagramme Ishikawa en texte, 5 Pourquoi,
|
||
Actions correctives, Actions préventives, Vérification, Leçons apprises.`,
|
||
|
||
sop: `Tu es un expert qualité/process. Génère une SOP (Standard Operating Procedure) complète.
|
||
Structure : Objet, Domaine d'application, Références, Définitions, Responsabilités,
|
||
Description détaillée (étape par étape numérotée), Critères d'acceptation,
|
||
Enregistrements, Annexes, Historique des révisions.
|
||
Format professionnel type ISO.`,
|
||
|
||
matrix: `Tu es un consultant organisation. Génère une matrice RACI complète.
|
||
R=Responsible, A=Accountable, C=Consulted, I=Informed.
|
||
Inclus : Tableau RACI détaillé, Description des rôles, Règles de gouvernance,
|
||
Escalation paths, Points d'attention.
|
||
Utilise des tableaux markdown clairs.`,
|
||
|
||
kpi: `Tu es un consultant BI/Analytics. Génère une spécification de dashboard KPI.
|
||
Inclus : KPIs stratégiques et opérationnels (avec formules de calcul),
|
||
Sources de données, Fréquence de rafraîchissement, Seuils d'alerte,
|
||
Maquette textuelle du dashboard, Drill-down paths, Destinataires.`
|
||
};
|
||
|
||
async function generate() {
|
||
const company = document.getElementById('company').value.trim();
|
||
const sector = document.getElementById('sector').value;
|
||
const erp = document.getElementById('erp').value;
|
||
const desc = document.getElementById('processDesc').value.trim();
|
||
const domains = getChips('domainChips');
|
||
const level = getChips('levelChips')[0] || 'L2 - Détaillé';
|
||
const methodology = document.getElementById('methodology').value;
|
||
const lang = document.getElementById('lang').value;
|
||
|
||
if (!desc) { toast(' Décrivez le processus ou le problème'); return; }
|
||
|
||
const btn = document.getElementById('genBtn');
|
||
btn.disabled = true;
|
||
btn.innerHTML = '<span class="spinner-sm"></span>Génération...';
|
||
|
||
const sysPrompt = (systemPrompts[selectedDocType] || systemPrompts.blueprint) +
|
||
`\n\nLangue: ${lang}. Sois concret, chiffré quand possible, et professionnel.
|
||
CONTEXTE WEVAL: Cabinet conseil digital transformation Paris. Expertise ERP (SAP/Odoo/Oracle), IA, pharma (Labo A, Labo B, Groupe C).`;
|
||
|
||
const userPrompt = `Génère un ${docTypeLabels[selectedDocType]} pour :
|
||
ENTREPRISE : ${company || 'Client'}
|
||
SECTUSD : ${sector || 'Non précisé'}
|
||
ERP : ${erp || 'Non précisé'}
|
||
DOMAINES : ${domains.join(', ') || 'Général'}
|
||
NIVEAU : ${level}
|
||
MÉTHODOLOGIE : ${methodology || 'La plus adaptée'}
|
||
DESCRIPTION : ${desc}
|
||
|
||
Document COMPLET en markdown avec tableaux.`;
|
||
|
||
try {
|
||
const res = await fetch('/api/weval-ia-fast.php', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({
|
||
message: userPrompt,
|
||
system_prompt: sysPrompt,
|
||
mode: 'deep',
|
||
max_tokens: 4000
|
||
})
|
||
});
|
||
const data = await res.json();
|
||
lastMd = data.response || data.content || (data.choices && data.choices[0]?.message?.content) || '';
|
||
if (!lastMd) throw new Error('empty');
|
||
} catch (e) {
|
||
lastMd = generateFallback(company, sector, erp, desc, domains, level, methodology);
|
||
}
|
||
|
||
renderOutput(company, sector, lastMd);
|
||
btn.disabled = false;
|
||
btn.textContent = 'Générer le document →';
|
||
}
|
||
|
||
function renderOutput(company, sector, md) {
|
||
document.getElementById('emptyState').style.display = 'none';
|
||
const out = document.getElementById('output');
|
||
out.classList.add('visible');
|
||
document.getElementById('outTag').textContent = `WEVAL Consulting → ${company || 'Client'}`;
|
||
document.getElementById('outTitle').textContent = docTypeLabels[selectedDocType];
|
||
document.getElementById('outMeta').textContent = `${sector ? sector+' · ':''}${new Date().toLocaleDateString('fr-FR',{day:'numeric',month:'long',year:'numeric'})} · Confidentiel`;
|
||
|
||
let html = md
|
||
.replace(/^### (.*$)/gm,'<h3>$1</h3>')
|
||
.replace(/^## (.*$)/gm,'<h2>$1</h2>')
|
||
.replace(/^# (.*$)/gm,'<h2>$1</h2>')
|
||
.replace(/\*\*(.*?)\*\*/g,'<strong>$1</strong>')
|
||
.replace(/\*(.*?)\*/g,'<em>$1</em>')
|
||
.replace(/`(.*?)`/g,'<code>$1</code>')
|
||
.replace(/^> (.*$)/gm,'<blockquote>$1</blockquote>')
|
||
.replace(/^- (.*$)/gm,'<li>$1</li>');
|
||
|
||
// Code blocks / BPMN diagrams
|
||
html = html.replace(/```[\w]*\n([\s\S]*?)```/g, '<pre>$1</pre>');
|
||
|
||
// Tables
|
||
html = html.replace(/\|(.+)\|\n\|[-| :]+\|\n((?:\|.+\|\n?)*)/g, (m, header, body) => {
|
||
const ths = header.split('|').filter(s=>s.trim()).map(h=>`<th>${h.trim()}</th>`).join('');
|
||
const rows = body.trim().split('\n').map(r => {
|
||
const tds = r.split('|').filter(s=>s.trim()).map(d=>`<td>${d.trim()}</td>`).join('');
|
||
return `<tr>${tds}</tr>`;
|
||
}).join('');
|
||
return `<table><thead><tr>${ths}</tr></thead><tbody>${rows}</tbody></table>`;
|
||
});
|
||
|
||
html = html.split('\n\n').map(b => b.startsWith('<') ? b : `<p>${b.replace(/\n/g,'<br>')}</p>`).join('');
|
||
document.getElementById('outContent').innerHTML = html;
|
||
out.scrollIntoView({behavior:'smooth'});
|
||
}
|
||
|
||
function generateFallback(company, sector, erp, desc, domains, level, meth) {
|
||
const c = company || 'Client';
|
||
const d = domains.join(', ') || 'Supply Chain';
|
||
if (selectedDocType === 'bpmn') {
|
||
return `# Logigramme BPMN — ${d}
|
||
## ${c} · ${sector || 'Industrie'}
|
||
|
||
### Diagramme de flux
|
||
|
||
\`\`\`
|
||
┌─────────────────────────────────────────────────────────────────┐
|
||
│ POOL: ${c} — Processus ${d} │
|
||
├─────────────┬───────────────┬───────────────┬───────────────────┤
|
||
│ Demandeur │ Approbateur │ Exécutant │ Système (${erp||'ERP'})│
|
||
├─────────────┼───────────────┼───────────────┼───────────────────┤
|
||
│ │ │ │ │
|
||
│ ●──→[Créer │ │ │ │
|
||
│ demande]──┼──→<Montant │ │ │
|
||
│ │ > seuil?>───┼───Non────→[Traiter]──→[Enregistrer│
|
||
│ │ │Oui │ │ dans ${erp||'ERP'}]│
|
||
│ │ ▼ │ │ │ │
|
||
│ │ [Valider]─────┼──→[Exécuter]──┼──→[Confirmer] │
|
||
│ │ │ │ │ │ │ │
|
||
│ │ │Rejet │ │ │ ▼ │
|
||
│ │ ▼ │ ▼ │ ◉ FIN │
|
||
│ [Notifier │ │ [Contrôle │ │
|
||
│ rejet]─→◉ │ │ qualité] │ │
|
||
└─────────────┴───────────────┴───────────────┴───────────────────┘
|
||
\`\`\`
|
||
|
||
### Description des activités
|
||
|
||
| # | Activité | Acteur | Input | Output | Système | SLA |
|
||
|---|----------|--------|-------|--------|---------|-----|
|
||
| 1 | Créer demande | Demandeur | Besoin identifié | Demande créée | ${erp||'ERP'} | J+0 |
|
||
| 2 | Vérifier seuil | Système | Montant demande | Routage | Automatique | Immédiat |
|
||
| 3 | Valider | Approbateur | Demande + justificatifs | Validation/Rejet | Workflow | J+2 |
|
||
| 4 | Exécuter | Exécutant | Demande validée | Action réalisée | ${erp||'ERP'} | J+5 |
|
||
| 5 | Contrôle qualité | Exécutant | Résultat | Conformité vérifiée | Manuel | J+1 |
|
||
| 6 | Confirmer & clôturer | Système | Tous contrôles OK | Processus clôturé | ${erp||'ERP'} | Automatique |
|
||
|
||
### KPIs du processus
|
||
|
||
| KPI | Formule | Cible | Fréquence |
|
||
|-----|---------|-------|-----------|
|
||
| Délai moyen traitement | Σ(date fin - date début) / n | < 5 jours | Hebdo |
|
||
| Taux de rejet | Demandes rejetées / Total | < 10% | Mensuel |
|
||
| Taux de conformité | Contrôles OK / Total | > 95% | Mensuel |
|
||
| Coût moyen par transaction | Coût total / nb transactions | À définir | Trimestriel |
|
||
|
||
---
|
||
*WEVAL Consulting — Blueprint Process — ${new Date().toLocaleDateString('fr-FR')}*`;
|
||
}
|
||
return `# ${docTypeLabels[selectedDocType]} — ${d}\n## ${c} · ${sector||''}\n\n### Description\n${desc}\n\n### Niveau : ${level}\n\n> Document généré par BlueprintAI — WEVAL Consulting\n> Mode démo. Connectez l'API pour une génération complète.`;
|
||
}
|
||
|
||
function copyDoc() { navigator.clipboard.writeText(lastMd).then(()=>toast(' Copié')); }
|
||
function downloadDoc() {
|
||
const b = new Blob([lastMd],{type:'text/markdown'});
|
||
const a = document.createElement('a');
|
||
a.href = URL.createObjectURL(b);
|
||
a.download = `${selectedDocType}-${document.getElementById('company').value.replace(/\s+/g,'-').toLowerCase()||'doc'}-${new Date().toISOString().split('T')[0]}.md`;
|
||
a.click();
|
||
toast(' Téléchargé');
|
||
}
|
||
function exportMermaid() {
|
||
toast(' Export Mermaid — live');
|
||
}
|
||
</script><!-- WEVAL Product Assistant Chatbot Widget -->
|
||
<div id="weval-bot-widget" style="position:fixed;bottom:20px;right:20px;z-index:9999;font-family:'Inter',system-ui,sans-serif">
|
||
<style>
|
||
#weval-bot-btn{width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;cursor:pointer;box-shadow:0 4px 24px rgba(99,102,241,.4);display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s}
|
||
#weval-bot-btn:hover{transform:scale(1.08);box-shadow:0 6px 32px rgba(99,102,241,.5)}
|
||
#weval-bot-btn svg{width:28px;height:28px;fill:#fff}
|
||
#weval-bot-badge{position:absolute;top:-2px;right:-2px;width:14px;height:14px;background:#22c55e;border-radius:50%;border:2px solid #fff;animation:pulse-badge 2s infinite}
|
||
@keyframes pulse-badge{0%,100%{opacity:1}50%{opacity:.5}}
|
||
#weval-bot-panel{display:none;position:fixed;bottom:90px;right:20px;width:380px;max-height:520px;background:#0f1629;border:1px solid rgba(99,102,241,.2);border-radius:16px;box-shadow:0 12px 48px rgba(0,0,0,.5);overflow:hidden;flex-direction:column}
|
||
#weval-bot-panel.open{display:flex}
|
||
#weval-bot-head{background:linear-gradient(135deg,#6366f1,#8b5cf6);padding:14px 18px;display:flex;align-items:center;gap:10px}
|
||
#weval-bot-head .avatar{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:18px}
|
||
#weval-bot-head .info{flex:1;color:#fff}
|
||
#weval-bot-head .info .name{font-weight:600;font-size:14px}
|
||
#weval-bot-head .info .status{font-size:11px;opacity:.8}
|
||
#weval-bot-close{background:none;border:none;color:rgba(255,255,255,.7);cursor:pointer;font-size:20px;padding:4px}
|
||
#weval-bot-msgs{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;min-height:280px;max-height:360px}
|
||
.bot-msg{max-width:85%;padding:10px 14px;border-radius:12px;font-size:13px;line-height:1.5;word-wrap:break-word}
|
||
.bot-msg.bot{background:rgba(99,102,241,.12);color:#e2e8f0;border-bottom-left-radius:4px;align-self:flex-start}
|
||
.bot-msg.user{background:#6366f1;color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
|
||
.bot-msg a{color:#818cf8;text-decoration:underline}
|
||
.bot-typing{display:flex;gap:4px;padding:10px 14px;align-self:flex-start}
|
||
.bot-typing span{width:6px;height:6px;background:#6366f1;border-radius:50%;animation:bounce .6s infinite alternate}
|
||
.bot-typing span:nth-child(2){animation-delay:.2s}
|
||
.bot-typing span:nth-child(3){animation-delay:.4s}
|
||
@keyframes bounce{to{opacity:.3;transform:translateY(-4px)}}
|
||
#weval-bot-input-area{padding:10px 14px;border-top:1px solid rgba(255,255,255,.06);display:flex;gap:8px}
|
||
#weval-bot-input{flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:8px 12px;color:#e2e8f0;font-size:13px;outline:none}
|
||
#weval-bot-input::placeholder{color:rgba(255,255,255,.3)}
|
||
#weval-bot-send{background:#6366f1;border:none;border-radius:8px;padding:8px 12px;color:#fff;cursor:pointer;font-size:13px;font-weight:600}
|
||
#weval-bot-send:hover{background:#5558e6}
|
||
.quick-btns{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
|
||
.quick-btn{background:rgba(99,102,241,.15);border:1px solid rgba(99,102,241,.25);color:#a5b4fc;padding:5px 10px;border-radius:6px;font-size:11px;cursor:pointer;transition:all .15s}
|
||
.quick-btn:hover{background:rgba(99,102,241,.3);color:#fff}
|
||
</style>
|
||
|
||
<button id="weval-bot-btn" onclick="toggleBot()">
|
||
<svg viewBox="0 0 24 24"><path d="M20 2H4c-1.1 0-2 .9-2 2v18l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm0 14H6l-2 2V4h16v12z"/></svg>
|
||
<div id="weval-bot-badge"></div>
|
||
</button>
|
||
|
||
<div id="weval-bot-panel">
|
||
<div id="weval-bot-head">
|
||
<div class="avatar">W</div>
|
||
<div class="info">
|
||
<div class="name">WEVAL Assistant</div>
|
||
<div class="status">En ligne - 62 produits</div>
|
||
</div>
|
||
<button id="weval-bot-close" onclick="toggleBot()">×</button>
|
||
</div>
|
||
<div id="weval-bot-msgs"></div>
|
||
<div id="weval-bot-input-area">
|
||
<input id="weval-bot-input" placeholder="Posez une question sur nos produits..." onkeypress="if(event.key==='Enter')sendBot()">
|
||
<button id="weval-bot-send" onclick="sendBot()">Envoyer</button>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
const PRODUCTS_KB = {
|
||
deliVerscore: {name:'DeliverScore',desc:'Audit délivrabilité email - SPF/DKIM/DMARC/listes de blocage. Score + recommandations IA.',price:'Gratuit + Pro $49/mo',url:'/products/deliverscore.html',category:'Email Intelligence'},
|
||
medreach: {name:'MedReach API',desc:'Base de 18596+ professionnels de santé vérifiés (Afrique, Europe, Moyen-Orient, Asie, Europe). API REST + export.',price:'Gratuit + Pro $299/mo',url:'/products/medreach.html',category:'Data'},
|
||
gpu: {name:'WEVIA Inference',desc:'IA-as-a-Service. WEVIA Deep, WEVIA sur GPU dédié. API IA Cloud-compatible.',price:'Gratuit + Pro $99/mo',url:'/products/gpu-inference.html',category:'IA'},
|
||
contentfactory: {name:'AI Content Factory',desc:'Génération de contenu IA - articles, fiches produits, LinkedIn. 6 templates.',price:'Gratuit + Pro $29/mo',url:'/products/content-factory.html',category:'IA'},
|
||
proposalai: {name:'ProposalAI',desc:'Generateur de propositions commerciales qualité Big4. Brief -> propale en 30 sec.',price:'Gratuit + Pro $19/mo',url:'/products/proposalai.html',category:'IA'},
|
||
blueprintai: {name:'BlueprintAI',desc:'Process docs, BPMN, CDC, blueprints L1/L2/L3, 8D, RACI.',price:'$25/mo',url:'/products/blueprintai.html',category:'IA'},
|
||
storeforge: {name:'StoreForge',desc:'E-commerce IA. Boutique en 5 min. Descriptions IA, chatbot WEVIA, paiement international.',price:'0-$29/mo',url:'/products/storeforge.html',category:'Commerce'},
|
||
leadforge: {name:'LeadForge',desc:'B2B Lead Intelligence sur mesure. Leads vérifiés tous secteurs. 0.30-0.$50/lead.',price:'0.30-0.$49/lead',url:'/products/workspace.html',category:'Data'},
|
||
mailwarm: {name:'MailWarm',desc:'Optimisation email automatique. 500+ seeds. Inbox 90%+ en 4-6 semaines.',price:'$29/compte/mo',url:'/products/workspace.html',category:'Email'},
|
||
sentinel: {name:'Sentinel Monitor',desc:'Cyber monitoring PME - SSL, ports, DNS, OWASP. Alertes Telegram.',price:'Gratuit + Pro $49/mo',url:'/products/workspace.html',category:'Security'},
|
||
outreachai: {name:'OutreachAI',desc:'Cold outreach IA. Upload leads -> IA personnalisé, envoi -> tracking.',price:'$199/mo',url:'/products/workspace.html',category:'Email'},
|
||
wevia: {name:'WEVIA White-Label',desc:'Chatbot IA clé en main. Widget embed 5 min. KB custom, memoire, vision.',price:'100-$299/mo',url:'/products/wevia-whitelabel.html',category:'IA'},
|
||
emailverify: {name:'EmailVerify',desc:'Validation email temps réel MX+SMTP+disposable.',price:'$49/mo',url:'/products/workspace.html',category:'Email Intelligence'},
|
||
blacklistguard: {name:'BlacklistGuard',desc:'Monitoring 100+ listes de blocage RBL + alertes.',price:'$29/mo',url:'/products/workspace.html',category:'Email Intelligence'},
|
||
reputationai: {name:'RéputationAI',desc:'Score réputation domaine + historique.',price:'$39/mo',url:'/products/workspace.html',category:'Email Intelligence'},
|
||
copyai: {name:'CopyAI WEVAL',desc:'Copywriting IA - emails, sujets, CTA. Cloud souveraine.',price:'$39/mo',url:'/products/workspace.html',category:'IA'},
|
||
dataharvest: {name:'DataInsight',desc:'Intelligence d\'enrichissement de donn\u00e9es B2B.',price:'$99/mo',url:'/products/workspace.html',category:'Data'},
|
||
smsforge: {name:'SMSForge',desc:'SMS marketing international (190+ pays).',price:'$49/mo',url:'/products/workspace.html',category:'Marketing'},
|
||
adscontrol: {name:'AdsControl',desc:'Multi-channel ads FB/Google/LinkedIn/TikTok.',price:'$99/mo',url:'/products/workspace.html',category:'Marketing'},
|
||
wevalcrm: {name:'WEVAL CRM',desc:'CRM leger pipeline + contacts + IA.',price:'Gratuit + Pro $29/mo',url:'/products/workspace.html',category:'Business'},
|
||
canvasai: {name:'CanvasAI',desc:'Design IA - visuels, bannieres, logos.',price:'$29/mo',url:'/products/workspace.html',category:'IA'},
|
||
devforge: {name:'DevForge AI',desc:'12 modules dev: specs, tests, code gen, API design, security review.',price:'$199/mo',url:'/products/workspace.html',category:'Dev'},
|
||
ethica: {name:'Ethica B2B',desc:'Plateforme HCP internationale. 5775+ médecins vérifiés.',price:'$299/mo',url:'/products/workspace.html',category:'Data'},
|
||
arsenal: {name:'Arsenal Framework',desc:'150+ ecrans. ERP Intelligence, Brain Engine, moteur envoi. Enterprise.',price:'2000-$9,999/mo',url:'/products/arsenal.html',category:'Flagship'},
|
||
wevads: {name:'WEVADS Platform',desc:'Infrastructure email complete. Brain Engine des centaines de configurations. 6.65M contacts.',price:'Enterprise',url:'/products/wevads.html',category:'Flagship'},
|
||
};
|
||
|
||
function getProductList() {
|
||
return Object.values(PRODUCTS_KB).map(p => `<b>${p.name}</b> - ${p.desc} (<a href="${p.url}">${p.price}</a>)`).join('<br><br>');
|
||
}
|
||
|
||
function findProducts(query) {
|
||
const q = query.toLowerCase();
|
||
const matches = [];
|
||
const keywords = {
|
||
email: ['deliVerscore','emailverify','blacklistguard','reputationai','mailwarm','outreachai'],
|
||
ia: ['gpu','contentfactory','proposalai','blueprintai','copyai','canvasai','devforge','wevia'],
|
||
data: ['medreach','leadforge','dataharvest','ethica'],
|
||
security: ['sentinel','blacklistguard'],
|
||
ecommerce: ['storeforge'],
|
||
marketing: ['smsforge','adscontrol','outreachai'],
|
||
crm: ['wevalcrm'],
|
||
sap: ['arsenal'],
|
||
enterprise: ['arsenal','wevads','wevia'],
|
||
gratuit: [],
|
||
prix: [],
|
||
maroc: ['medreach','ethica','smsforge','storeforge'],
|
||
};
|
||
|
||
for (const [kw, ids] of Object.entries(keywords)) {
|
||
if (q.includes(kw)) ids.forEach(id => { if (!matches.includes(id)) matches.push(id); });
|
||
}
|
||
|
||
// Also search in product names and descriptions
|
||
for (const [id, p] of Object.entries(PRODUCTS_KB)) {
|
||
if (p.name.toLowerCase().includes(q) || p.desc.toLowerCase().includes(q) || p.category.toLowerCase().includes(q)) {
|
||
if (!matches.includes(id)) matches.push(id);
|
||
}
|
||
}
|
||
|
||
return matches.map(id => PRODUCTS_KB[id]).filter(Boolean);
|
||
}
|
||
|
||
function botReply(userMsg) {
|
||
const q = userMsg.toLowerCase();
|
||
|
||
// Greetings
|
||
if (/^(bonjour|salut|hello|hi|hey|coucou)/.test(q)) {
|
||
return `Bonjour ! Je suis l'assistant WEVAL. Nous avons <b>62 produits SaaS</b> en production. Comment puis-je vous aider ?<div class="quick-btns"><span class="quick-btn" onclick="askBot('Quels sont vos produits?')">Voir les produits</span><span class="quick-btn" onclick="askBot('email délivrabilité')">Email</span><span class="quick-btn" onclick="askBot('intelligence artificielle')">IA</span><span class="quick-btn" onclick="askBot('prix')">Tarifs</span></div>`;
|
||
}
|
||
|
||
// List all
|
||
if (/tous|tout|liste|produit|service|catalogue|quoi/.test(q)) {
|
||
const cats = {};
|
||
Object.values(PRODUCTS_KB).forEach(p => { if (!cats[p.category]) cats[p.category]=[]; cats[p.category].push(p); });
|
||
let html = `Voici nos <b>${Object.keys(PRODUCTS_KB).length} produits</b> par categorie :<br><br>`;
|
||
for (const [cat, prods] of Object.entries(cats)) {
|
||
html += `<b>${cat}</b><br>`;
|
||
prods.forEach(p => { html += `• <a href="${p.url}">${p.name}</a> - ${p.price}<br>`; });
|
||
html += '<br>';
|
||
}
|
||
html += `<div class="quick-btns"><span class="quick-btn" onclick="askBot('email')">Email</span><span class="quick-btn" onclick="askBot('IA')">IA</span><span class="quick-btn" onclick="askBot('essayer gratuit')">Gratuit</span></div>`;
|
||
return html;
|
||
}
|
||
|
||
// Pricing
|
||
if (/prix|tarif|cout|combien|pricing|gratuit|free/.test(q)) {
|
||
const free = Object.values(PRODUCTS_KB).filter(p => p.price.toLowerCase().includes('gratuit'));
|
||
let html = `<b>Produits avec plan gratuit (${free.length}):</b><br>`;
|
||
free.forEach(p => { html += `• <a href="${p.url}">${p.name}</a> - ${p.price}<br>`; });
|
||
html += `<br>Tous les prix sont sur <a href="/products/">notre catalogue</a>. Besoin d'un devis personnalisé ?<div class="quick-btns"><span class="quick-btn" onclick="askBot('demo')">Demander une demo</span><span class="quick-btn" onclick="window.location.href='/booking.html'">Nous contacter</span></div>`;
|
||
return html;
|
||
}
|
||
|
||
// Demo / essai
|
||
if (/demo|essai|tester|try|commencer|start/.test(q)) {
|
||
return `Pour commencer gratuitement :<br><br>1. <a href="/products/workspace.html">Ouvrir le Workspace</a> et créer un compte<br>2. Vous aurez acces a tous les produits gratuits<br>3. Testez DeliverScore, WEVIA Inference, Content Factory...<br><br>Ou <a href="#cta">contactez-nous</a> pour une demo personnalisée !<div class="quick-btns"><span class="quick-btn" onclick="window.location.href='/products/workspace.html'">Ouvrir Workspace</span></div>`;
|
||
}
|
||
|
||
// Specific product search
|
||
const matches = findProducts(q);
|
||
if (matches.length > 0) {
|
||
let html = `J'ai trouve <b>${matches.length} produit(s)</b> correspondant :<br><br>`;
|
||
matches.slice(0, 6).forEach(p => {
|
||
html += `<b><a href="${p.url}">${p.name}</a></b><br>${p.desc}<br><i>${p.price}</i><br><br>`;
|
||
});
|
||
if (matches.length > 6) html += `...et ${matches.length - 6} autres.<br>`;
|
||
html += `<div class="quick-btns"><span class="quick-btn" onclick="window.location.href='${matches[0].url}'">Voir ${matches[0].name}</span><span class="quick-btn" onclick="askBot('prix')">Tarifs</span></div>`;
|
||
return html;
|
||
}
|
||
|
||
// Default - suggest contacting or browsing
|
||
return `Je n'ai pas trouve de produit spécifique pour "${userMsg}". Nos 62 produits couvrent : Email Intelligence, IA/GPU, Data, Security, Marketing, E-commerce et Dev.<br><br><div class="quick-btns"><span class="quick-btn" onclick="askBot('tous les produits')">Voir tout</span><span class="quick-btn" onclick="window.location.href='/booking.html'">Contacter WEVAL</span><span class="quick-btn" onclick="window.location.href='/products/workspace.html'">Workspace</span></div>`;
|
||
}
|
||
|
||
function toggleBot() {
|
||
const p = document.getElementById('weval-bot-panel');
|
||
p.classList.toggle('open');
|
||
if (p.classList.contains('open') && document.getElementById('weval-bot-msgs').children.length === 0) {
|
||
addMsg('bot', `Bonjour ! Je suis l'assistant produits WEVAL. Nous proposons <b>37 SaaS</b> en production. Que recherchez-vous ?<div class="quick-btns"><span class="quick-btn" onclick="askBot('Tous les produits')">Catalogue</span><span class="quick-btn" onclick="askBot('email')">Email</span><span class="quick-btn" onclick="askBot('intelligence artificielle')">IA</span><span class="quick-btn" onclick="askBot('gratuit')">Gratuit</span><span class="quick-btn" onclick="askBot('demo')">Demo</span></div>`);
|
||
}
|
||
document.getElementById('weval-bot-badge').style.display = 'none';
|
||
}
|
||
|
||
function addMsg(type, html) {
|
||
const msgs = document.getElementById('weval-bot-msgs');
|
||
const div = document.createElement('div');
|
||
div.className = 'bot-msg ' + type;
|
||
div.innerHTML = html;
|
||
msgs.appendChild(div);
|
||
msgs.scrollTop = msgs.scrollHeight;
|
||
}
|
||
|
||
function askBot(q) {
|
||
document.getElementById('weval-bot-input').value = q;
|
||
sendBot();
|
||
}
|
||
|
||
function sendBot() {
|
||
const input = document.getElementById('weval-bot-input');
|
||
const msg = input.value.trim();
|
||
if (!msg) return;
|
||
input.value = '';
|
||
addMsg('user', msg);
|
||
|
||
// Show typing
|
||
const msgs = document.getElementById('weval-bot-msgs');
|
||
const typing = document.createElement('div');
|
||
typing.className = 'bot-typing';
|
||
typing.innerHTML = '<span></span><span></span><span></span>';
|
||
msgs.appendChild(typing);
|
||
msgs.scrollTop = msgs.scrollHeight;
|
||
|
||
setTimeout(() => {
|
||
typing.remove();
|
||
addMsg('bot', botReply(msg));
|
||
}, 400 + Math.random() * 600);
|
||
}
|
||
</script>
|
||
</div>
|
||
|
||
<style>
|
||
.ev-trust{display:flex;gap:2rem;justify-content:center;flex-wrap:wrap;padding:1.5rem 4%;background:rgba(255,255,255,.02);border-top:1px solid rgba(255,255,255,.04);margin:2rem 0}
|
||
.ev-trust-i{display:flex;align-items:center;gap:.4rem;font-size:.8rem;color:#7a8ba5}.ev-trust-i strong{color:#edf2f7}
|
||
.ev-chat{max-width:800px;margin:3rem auto;padding:0 4%}.ev-cb{background:#0c1222;border:1px solid rgba(255,255,255,.06);border-radius:14px;overflow:hidden}
|
||
.ev-ch{padding:.8rem 1.2rem;border-bottom:1px solid rgba(255,255,255,.06);font-size:.9rem;font-weight:600}
|
||
.ev-cm{min-height:200px;max-height:350px;overflow-y:auto;padding:1rem}.ev-ce{text-align:center;padding:2rem;color:#7a8ba5;font-size:.82rem}
|
||
.ev-sg{display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;margin-top:.8rem}
|
||
.ev-sg button{padding:.35rem .7rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:16px;color:#edf2f7;font-size:.72rem;cursor:pointer;font-family:Outfit}
|
||
.ev-ci{padding:.8rem 1.2rem;border-top:1px solid rgba(255,255,255,.06);display:flex;gap:.5rem}
|
||
.ev-ci textarea{flex:1;resize:none;min-height:36px;max-height:100px;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.08);color:#edf2f7;border-radius:8px;padding:.5rem .7rem;font-family:Outfit;font-size:.82rem;outline:none}
|
||
.ev-ci button{background:#7c5cfc;color:#fff;border:none;border-radius:8px;padding:.5rem 1rem;font-weight:700;cursor:pointer;font-family:Outfit;font-size:.82rem}
|
||
.ev-mu{background:rgba(255,255,255,.05);border-radius:8px 8px 2px 8px;padding:.5rem .8rem;margin:6px 0;max-width:70%;margin-left:auto;font-size:.82rem;color:#edf2f7}
|
||
.ev-ma{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.04);border-radius:2px 8px 8px 8px;padding:.6rem .9rem;margin:6px 0;max-width:85%;font-size:.82rem;color:#edf2f7;line-height:1.6}
|
||
.ev-ma strong{color:#fff}
|
||
.ev-ld{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7c5cfc;margin:0 2px;animation:evp .8s infinite}.ev-ld:nth-child(2){animation-delay:.2s}.ev-ld:nth-child(3){animation-delay:.4s}
|
||
@keyframes evp{0%,100%{opacity:1}50%{opacity:.3}}
|
||
</style>
|
||
<div class="ev-trust">
|
||
<div class="ev-trust-i"><strong>44</strong> produits SaaS</div>
|
||
<div class="ev-trust-i"><strong>Cloud</strong> souverain</div>
|
||
<div class="ev-trust-i"><strong>API</strong> REST</div>
|
||
<div class="ev-trust-i"><strong>RGPD</strong> conforme</div>
|
||
<div class="ev-trust-i"><strong>France</strong> · Maroc · États-Unis · International</div>
|
||
</div>
|
||
<div class="ev-chat"><div class="ev-cb">
|
||
<div class="ev-ch"><span style="color:#7c5cfc">●</span> BlueprintAI — Assistant IA</div>
|
||
<div class="ev-cm" id="ev2-msgs"><div class="ev-ce" id="ev2-empty">Posez votre question sur BlueprintAI<div class="ev-sg">
|
||
<button onclick="ev2sg('Fonctionnalités principales')">Fonctionnalités</button>
|
||
<button onclick="ev2sg('Comment ca marche')">Comment ca marche</button>
|
||
<button onclick="ev2sg('Tarifs')">Tarifs</button>
|
||
</div></div></div>
|
||
<div class="ev-ci"><textarea id="ev2-i" rows="1" placeholder="Votre question..." onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();ev2send()}"></textarea><button onclick="ev2send()">Envoyer</button></div>
|
||
</div></div>
|
||
<script>
|
||
var ev2ctx="Tu es BlueprintAI, expert en génération de documents consulting. BPMN, cahiers des charges, etudes impact, RACI, SOP.";var ev2h=[];
|
||
function ev2esc(s){var d=document.createElement("div");d.textContent=s;return d.innerHTML}
|
||
function ev2md(m){return m.replace(/\*\*(.*?)\*\*/g,"<strong>$1</strong>").replace(/\n\n/g,"<br><br>")}
|
||
function ev2sg(q){document.getElementById("ev2-i").value=q;ev2send()}
|
||
async function ev2send(){var i=document.getElementById("ev2-i"),m=i.value.trim();if(!m)return;var a=document.getElementById("ev2-msgs"),es=document.getElementById("ev2-empty");if(es)es.remove();a.innerHTML+='<div class="ev-mu">'+ev2esc(m)+'</div>';i.value="";a.scrollTop=a.scrollHeight;var lid="ev2l"+Date.now();a.innerHTML+='<div class="ev-ma" id="'+lid+'"><span class="ev-ld"></span><span class="ev-ld"></span><span class="ev-ld"></span></div>';a.scrollTop=a.scrollHeight;try{ev2h.push({role:"user",content:m});var r=await fetch("/api/weval-ia-fast.php",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({message:"[INSTRUCTION SYSTEME: "+ev2ctx+"]\n\nDemande utilisateur: "+m,mode:"full",history:ev2h.slice(-6)})});var j=await r.json();var rp=j.response||j.error||"Erreur";ev2h.push({role:"assistant",content:rp});var el=document.getElementById(lid);if(el)el.outerHTML='<div class="ev-ma">'+ev2md(rp)+"</div>";}catch(ex){var el=document.getElementById(lid);if(el)el.innerHTML="Erreur: "+ex.message;}a.scrollTop=a.scrollHeight;}
|
||
</script>
|
||
<style>.dm-box{background:#0c1222;border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:1.5rem;margin:2rem auto;max-width:800px}.dm-box h3{font-size:1rem;font-weight:600;margin-bottom:1rem;display:flex;align-items:center;gap:.5rem}.dm-row{display:flex;gap:.6rem;margin-bottom:1rem}.dm-row input{flex:1;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:.6rem .8rem;color:#edf2f7;font-family:Outfit;font-size:.85rem;outline:none}.dm-row button{background:var(--a,#7c5cfc);color:#05080f;border:none;border-radius:8px;padding:.6rem 1.2rem;font-weight:700;cursor:pointer;font-family:Outfit;font-size:.85rem;white-space:nowrap}.dm-out{min-height:80px;padding:1rem;background:rgba(0,0,0,.2);border-radius:8px;font-size:.82rem;color:#edf2f7;line-height:1.6}.dm-out strong{color:#fff}.dm-out pre{background:rgba(0,0,0,.3);padding:.5rem;border-radius:6px;font-size:.75rem;margin:.4rem 0;overflow-x:auto}.dm-ld{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--a,#7c5cfc);margin:0 2px;animation:dmp .8s infinite}.dm-ld:nth-child(2){animation-delay:.2s}.dm-ld:nth-child(3){animation-delay:.4s}@keyframes dmp{0%,100%{opacity:1}50%{opacity:.3}}</style>
|
||
<div class="dm-box" id="demo"><h3>⚡ BlueprintAI — Demo Live</h3>
|
||
<div class="dm-row"><input id="dm-blueprintai" placeholder="Décrivez le document a générer" onkeydown="if(event.key==='Enter')dm_blueprintai()"><button onclick="dm_blueprintai()">Tester</button></div>
|
||
<div class="dm-out" id="dmo-blueprintai">Testez BlueprintAI en direct — aucune inscription.</div></div>
|
||
<script>
|
||
async function dm_blueprintai(){var q=document.getElementById("dm-blueprintai").value.trim();if(!q)return;var o=document.getElementById("dmo-blueprintai");o.innerHTML='<span class="dm-ld"></span><span class="dm-ld"></span><span class="dm-ld"></span>';try{var r=await fetch("/api/weval-ia-fast.php",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({message:"[INSTRUCTION SYSTEME: Reponds de facon structurée et professionnelle.]\n\nDemande utilisateur: Génère un blueprint consulting pour: "+q,mode:"full"})});var j=await r.json();o.innerHTML=(j.response||"Erreur").replace(/\*\*(.*?)\*\*/g,"<strong>$1</strong>").replace(/\n\n/g,"<br><br>");}catch(e){o.innerHTML="Erreur: "+e.message}}
|
||
</script>
|
||
<div id="cta" style="max-width:600px;margin:2rem auto;padding:0 4%">
|
||
<div style="background:#0c1222;border:1px solid rgba(99,102,241,.15);border-radius:14px;padding:1.5rem">
|
||
<h3 style="font-size:1rem;font-weight:700;margin-bottom:.8rem;color:#818cf8">Demander un accès</h3>
|
||
<input id="ct-name" type="text" placeholder="Votre nom" style="width:100%;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:.6rem;font-size:.85rem;color:#edf2f7;font-family:inherit;margin-bottom:.6rem;outline:none">
|
||
<input id="ct-email" type="email" placeholder="Email professionnel" style="width:100%;background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.08);border-radius:8px;padding:.6rem;font-size:.85rem;color:#edf2f7;font-family:inherit;margin-bottom:.6rem;outline:none">
|
||
<button onclick="ctS()" id="ct-btn" style="width:100%;background:#6366f1;color:#fff;border:none;border-radius:8px;padding:.7rem;font-weight:700;cursor:pointer;font-size:.9rem">Envoyer</button>
|
||
<div id="ct-ok" style="display:none;text-align:center;padding:1rem;color:#10b981;font-weight:600">Demande envoyee !</div>
|
||
</div></div>
|
||
<script>async function ctS(){var n=document.getElementById("ct-name").value.trim(),e=document.getElementById("ct-email").value.trim();if(!n||!e){alert("Nom et email requis");return;}document.getElementById("ct-btn").disabled=true;try{await fetch("/api/contact",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({name:n,email:e,source:location.pathname,ts:new Date().toISOString()})})}catch(x){}document.getElementById("ct-btn").style.display="none";document.getElementById("ct-ok").style.display="block";}</script>
|
||
<script defer src=/assets/dm-enhance.js></script></body>
|
||
<!-- WEVAL Self-Service Inject -->
|
||
<script>
|
||
if(window===window.top){
|
||
// Replace all contact mailto links with signup portal
|
||
document.querySelectorAll('a[href*="mailto:"]').forEach(a => {
|
||
if(a.classList.contains('btn-p') || a.classList.contains('btn-f') || a.classList.contains('btn-n') || a.classList.contains('btn-nav') || a.classList.contains('btn-primary') || a.classList.contains('btn-price-fill') || a.textContent.includes('Commencer') || a.textContent.includes('Commander') || a.textContent.includes('Essayer') || a.textContent.includes('Souscrire') || a.textContent.includes('Créer') || a.textContent.includes('Obtenir') || a.textContent.includes('Démarrer') || a.textContent.includes('Rejoindre')) {
|
||
a.href = '/products/workspace.html';
|
||
a.removeAttribute('target');
|
||
}
|
||
});
|
||
// Add floating CTA
|
||
const bar = document.createElement('div');
|
||
bar.innerHTML = '<div style="position:fixed;bottom:0;left:0;right:0;z-index:999;background:rgba(5,8,15,0.95);backdrop-filter:blur(10px);border-top:1px solid rgba(0,201,167,0.15);padding:0.6rem 4%;display:flex;justify-content:space-between;align-items:center"><div style="font-size:0.82rem;color:#7a8ba5"><strong style="color:#edf2f7">WEVAL Products</strong> · <span style="color:#00c9a7">Self-service</span> · Inscription en 30 secondes</div><a href="/products/workspace.html" style="background:#00c9a7;color:#05080f;padding:0.5rem 1.2rem;border-radius:6px;font-weight:700;font-size:0.82rem;text-decoration:none">Créer mon compte gratuit →</a></div>';
|
||
if(window.self===window.top){document.body.appendChild(bar);}
|
||
document.body.style.paddingBottom = '52px';
|
||
}
|
||
</script></html> |