1<!DOCTYPE html>2<html lang="fr">3<head>4<meta charset="utf-8">5<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, viewport-fit=cover, interactive-widget=resizes-content">6<meta name="theme-color" content="#F2F1EC">7<meta name="apple-mobile-web-app-capable" content="yes">8<meta name="apple-mobile-web-app-status-bar-style" content="default">9<meta name="apple-mobile-web-app-title" content="Admin-Ka">10<title>Admin-Ka — Console Groupe KA</title>11<link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='9' fill='%23F97316'/%3E%3Ctext x='16' y='22' font-size='14' font-family='-apple-system,sans-serif' fill='%231a1611' text-anchor='middle' font-weight='800'%3EKa%3C/text%3E%3C/svg%3E">12<link rel="apple-touch-icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' fill='%23F97316'/%3E%3Ctext x='16' y='22' font-size='14' font-family='sans-serif' fill='%231a1611' text-anchor='middle' font-weight='800'%3EKa%3C/text%3E%3C/svg%3E">13<link rel="stylesheet" href="/vendor/hljs-github.min.css">14<link rel="stylesheet" href="/style.css">15</head>16<body>1718<!-- ============ Connexion ============ -->19<div id="login" class="login hidden">20 <div class="login-box">21 <div class="ka-mark big">Ka</div>22 <h1 class="login-title">Admin<span class="tiret">-</span>Ka</h1>23 <p class="login-sub">Console Claude Code · Groupe KA</p>24 <input id="password" type="password" placeholder="Mot de passe" autocomplete="current-password">25 <button id="loginBtn" class="btn-cta">Se connecter</button>26 <div id="loginError" class="login-error"></div>27 </div>28 <div class="login-foot">M3U96a · MacLustr</div>29</div>3031<!-- ============ App ============ -->32<div id="app" class="app hidden">3334 <header class="header">35 <div class="brand">36 <span class="ka-mark">Ka</span>37 <span class="brand-name">Admin<span class="tiret">-</span>Ka</span>38 </div>39 <div id="connPill" class="conn-pill off"><span class="conn-dot"></span><span id="connText">hors ligne</span></div>40 </header>4142 <!-- Bannière notifications / alertes -->43 <div id="banners" class="banners"></div>4445 <!-- ======== Vue CHAT ======== -->46 <section id="view-chat" class="view">47 <div class="chatbar">48 <select id="projectSel" class="pill-select" title="Projet (repo + nœud)"></select>49 <button id="chipModel" class="chip" title="Modèle">opus</button>50 <button id="chipPerm" class="chip" title="Permissions">normal</button>51 <button id="chipMore" class="chip ghost" title="Options de session">⋯</button>52 </div>53 <div id="sessMeta" class="sess-meta hidden">54 <span id="metaModel"></span><span id="metaSid"></span><span id="metaCost"></span><span id="metaCtx"></span>55 </div>5657 <main id="messages" class="messages"></main>5859 <div id="welcome" class="welcome">60 <div class="ka-mark big">Ka</div>61 <h2>Console Claude Code</h2>62 <p>Le vrai Claude Code, lancé directement sur le nœud de chaque app du Groupe KA.</p>63 <div class="hints">64 <button class="hint">Quel modèle es-tu et dans quel répertoire travailles-tu ?</button>65 <button class="hint">Montre les 5 derniers commits</button>66 <button class="hint">État PM2 de l'app</button>67 </div>68 </div>6970 <footer class="composer">71 <div class="composer-inner">72 <button id="upgradeBtn" class="wand-btn" title="Améliorer le prompt (Opus 4.8 + savoir Groupe KA)"><svg viewBox="0 0 24 24"><path d="M5 3v4M3 5h4M6 17v4M4 19h4M13 3l2.5 6.5L22 12l-6.5 2.5L13 21l-2.5-6.5L4 12l6.5-2.5z" stroke="currentColor" stroke-width="1.7" fill="none" stroke-linejoin="round"/></svg></button>73 <textarea id="input" rows="1" placeholder="Demander à Claude Code…" enterkeyhint="send"></textarea>74 <button id="stopBtn" class="send-btn stop hidden" title="Arrêter"><svg viewBox="0 0 24 24"><rect x="7" y="7" width="10" height="10" rx="2" fill="currentColor"/></svg></button>75 <button id="sendBtn" class="send-btn" title="Envoyer"><svg viewBox="0 0 24 24"><path d="M12 19V6M6 11l6-6 6 6" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round" fill="none"/></svg></button>76 </div>77 <div id="slashHint" class="slash-hint hidden"></div>78 </footer>79 </section>8081 <!-- ======== Vue SESSIONS ======== -->82 <section id="view-sessions" class="view hidden">83 <div class="view-head">84 <h2>Sessions</h2>85 <button id="newSessBtn" class="btn-cta small">＋ Nouvelle</button>86 </div>87 <div id="sessList" class="sess-list"></div>88 </section>8990 <!-- ======== Vue PROMPTS (bank) ======== -->91 <section id="view-prompts" class="view hidden">92 <div class="view-head">93 <h2>Prompts</h2>94 <button id="newPromptBtn" class="btn-cta small">＋ Nouveau</button>95 </div>96 <div id="promptList" class="sess-list"></div>97 </section>9899 <!-- ======== Vue ÉCOSYSTÈME ======== -->100 <section id="view-eco" class="view hidden">101 <div class="view-head">102 <h2>Écosystème</h2>103 <div class="head-actions">104 <button id="incBtn" class="chip">Incidents</button>105 <span id="ecoStamp" class="eco-stamp"></span>106 </div>107 </div>108 <div id="ecoOverview" class="eco-overview"></div>109 <div id="ecoGrid" class="eco-grid"><div class="eco-loading">Chargement…</div></div>110 <h3 class="eco-subhead">Nœuds du cluster</h3>111 <div id="ecoNodes" class="node-grid"></div>112 </section>113114 <!-- ======== Vue RÉGLAGES ======== -->115 <section id="view-settings" class="view hidden">116 <div class="view-head"><h2>Réglages</h2></div>117 <div class="set-card">118 <div class="set-label">Modèle par défaut</div>119 <div class="seg" id="segModel">120 <button data-v="fable">Fable 5</button><button data-v="opus">Opus 5</button><button data-v="sonnet">Sonnet 5</button><button data-v="haiku">Haiku</button>121 </div>122 </div>123 <div class="set-card">124 <div class="set-label">Permissions par défaut</div>125 <div class="seg vert" id="segPerm">126 <button data-v="default">Normal — demande dans le chat</button>127 <button data-v="acceptEdits">acceptEdits — éditions auto</button>128 <button data-v="plan">Plan — proposer avant d'agir</button>129 <button data-v="bypass">⚠ Tout autoriser (bypass)</button>130 </div>131 </div>132 <div class="set-card">133 <div class="set-label">Conversation active</div>134 <div class="set-row"><span>Session Claude Code</span><span id="setSid" class="mono">—</span></div>135 <div class="set-row"><span>Coût cumulé</span><span id="setCost" class="mono">—</span></div>136 <div class="set-row"><span>Contexte utilisé</span><span id="setCtx" class="mono">—</span></div>137 <div class="set-actions">138 <button id="btnClear" class="btn-ghost">/clear — effacer le contexte</button>139 <button id="btnCompact" class="btn-ghost">/compact — compacter</button>140 </div>141 </div>142 <div class="set-card">143 <div class="set-row"><span>Backend</span><span id="setHost" class="mono">M3U96a:3300</span></div>144 <div class="set-row"><span>Version</span><span class="mono">2.0.0</span></div>145 </div>146 <button id="logoutBtn" class="btn-danger">Se déconnecter</button>147 </section>148149 <!-- ======== Vue SOCIAL ======== -->150 <section id="view-social" class="view hidden">151 <div class="view-head"><h2>🎨 Studio</h2><button id="stRefresh" class="btn-ghost small">↻ Galerie</button></div>152 <p class="soc-sub" style="margin:-4px 0 14px">Génère des visuels prêts à publier — télécharge-les et copie le texte. Rien n'est publié automatiquement.</p>153154 <div class="st-grid">155 <div class="soc-card st-gen">156 <h3>🖼️ Publication</h3>157 <textarea id="stPostPrompt" rows="2" placeholder="Sujet (optionnel). Ex : dernière propriété à vendre sur Immo-Ka."></textarea>158 <div class="soc-actions">159 <select id="stPostSite" class="soc-select"><option value="">Choix auto</option><option value="lou-ka">Lou·Ka</option><option value="immo-ka">Immo·Ka</option><option value="vrai-prix">Vrai-Prix</option><option value="auto-ka">Auto·Ka</option><option value="food-ka">Food·Ka</option><option value="fabri-ka">Fabri·Ka</option><option value="resto-ka">Resto·Ka</option><option value="sorti-ka">Sorti·Ka</option><option value="crea-ka">Créa·Ka</option><option value="job-ka">Job·Ka</option><option value="trouve-ka">Trouve·Ka</option></select>160 <button id="stPostGen" class="btn-cta small">✨ Générer une image</button>161 </div>162 </div>163 <div class="soc-card st-gen">164 <h3>🎬 Reel vidéo</h3>165 <textarea id="stReelPrompt" rows="2" placeholder="Sujet (optionnel). Ex : le dernier logement en annonce sur Lou-Ka."></textarea>166 <div class="soc-actions">167 <select id="stReelSite" class="soc-select"><option value="">Choix auto</option><option value="lou-ka">Lou·Ka</option><option value="immo-ka">Immo·Ka</option><option value="vrai-prix">Vrai-Prix</option><option value="auto-ka">Auto·Ka</option><option value="food-ka">Food·Ka</option><option value="fabri-ka">Fabri·Ka</option><option value="resto-ka">Resto·Ka</option><option value="sorti-ka">Sorti·Ka</option><option value="crea-ka">Créa·Ka</option><option value="job-ka">Job·Ka</option><option value="trouve-ka">Trouve·Ka</option></select>168 <button id="stReelGen" class="btn-cta small">🎬 Générer un reel</button>169 </div>170 <div class="soc-actions" style="margin-top:8px">171 <button id="stReel10" class="btn-ghost small">🔥 Générer 10 reels</button>172 <span id="stGenStatus" class="soc-sub"></span>173 </div>174 </div>175 </div>176177 <div class="view-head" style="margin-top:18px"><h2 style="font-size:17px">Galerie</h2><span id="stCount" class="soc-sub"></span></div>178 <div id="stGallery" class="st-gallery"><div class="soc-sub">Aucun visuel encore — génère ton premier post ou reel ci-dessus.</div></div>179 </section>180181<section id="view-visitors" class="view hidden">182 <div class="view-head"><h2>👥 Visiteurs</h2><span id="visLive" class="soc-sub"></span></div>183 <div id="visGlobal" class="vis-global"></div>184 <div id="visGrid" class="vis-grid"><div class="soc-sub">Chargement…</div></div>185 </section>186187 <!-- ======== Bottom nav ======== -->188 <nav class="bottomnav">189 <button data-view="chat" class="nav-btn active">190 <svg viewBox="0 0 24 24"><path d="M4 6a3 3 0 013-3h10a3 3 0 013 3v8a3 3 0 01-3 3H9l-4 4v-4a3 3 0 01-1-2.2z" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linejoin="round"/></svg>191 <span>Chat</span><i class="badge hidden"></i>192 </button>193 <button data-view="sessions" class="nav-btn">194 <svg viewBox="0 0 24 24"><path d="M5 5h14M5 12h14M5 19h9" stroke="currentColor" stroke-width="1.9" stroke-linecap="round"/></svg>195 <span>Sessions</span><i class="badge hidden"></i>196 </button>197 <button data-view="prompts" class="nav-btn">198 <svg viewBox="0 0 24 24"><path d="M7 3h10a2 2 0 012 2v16l-7-4-7 4V5a2 2 0 012-2z" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linejoin="round"/></svg>199 <span>Prompts</span><i class="badge hidden"></i>200 </button>201 <button data-view="eco" class="nav-btn">202 <svg viewBox="0 0 24 24"><path d="M4 17l4-6 4 3 4-8 4 5" stroke="currentColor" stroke-width="1.9" fill="none" stroke-linecap="round" stroke-linejoin="round"/><path d="M3 21h18" stroke="currentColor" stroke-width="1.9" stroke-linecap="round"/></svg>203 <span>Écosystème</span><i class="badge hidden"></i>204 </button>205 <button data-view="social" class="nav-btn"><svg viewBox="0 0 24 24"><path d="M4 5h16v11H4z M8 20h8" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round" stroke-linejoin="round"/><path d="M10 8l5 2.5-5 2.5z" fill="currentColor"/></svg><span>Studio</span><i class="badge hidden"></i></button>206 <button data-view="visitors" class="nav-btn"><svg viewBox="0 0 24 24"><circle cx="9" cy="8" r="3.2" stroke="currentColor" stroke-width="1.8" fill="none"/><path d="M3.5 19a5.5 5.5 0 0111 0" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round"/><path d="M16 5.2a3 3 0 010 5.6M18 19a5.5 5.5 0 00-3-4.9" stroke="currentColor" stroke-width="1.8" fill="none" stroke-linecap="round"/></svg><span>Visiteurs</span><i class="badge hidden"></i></button><button data-view="settings" class="nav-btn">207 <svg viewBox="0 0 24 24"><circle cx="12" cy="12" r="3.2" stroke="currentColor" stroke-width="1.8" fill="none"/><path d="M12 2.8v3M12 18.2v3M2.8 12h3M18.2 12h3M5.5 5.5l2.1 2.1M16.4 16.4l2.1 2.1M18.5 5.5l-2.1 2.1M7.6 16.4l-2.1 2.1" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>208 <span>Réglages</span><i class="badge hidden"></i>209 </button>210 </nav>211212 <!-- ======== Feuille détail (éco / options) ======== -->213 <div id="sheet" class="sheet hidden">214 <div id="sheetBack" class="sheet-back"></div>215 <div class="sheet-panel">216 <div class="sheet-grip"></div>217 <div id="sheetBody" class="sheet-body"></div>218 </div>219 </div>220</div>221222<script src="/vendor/marked.min.js"></script>223<script src="/vendor/highlight.min.js"></script>224<script src="/app.js"></script>225</body>226</html>227