Kazeia-central/kazeia_central/web/app.js

325 lines
29 KiB
JavaScript

"use strict";
/* Kazeia-central — shell d'application (clinique-apaisé, sans build). */
const S = { initialized: false, unlocked: false, devices: [], selected: null, section: "flotte" };
// ---- helpers --------------------------------------------------------------
const $ = (s, r = document) => r.querySelector(s);
function elFrom(html) { const t = document.createElement("template"); t.innerHTML = html.trim(); return t.content.firstChild; }
async function api(path, opts) {
const r = await fetch("/api" + path, opts);
if (!r.ok) { let d = r.status; try { d = (await r.json()).detail || d; } catch {} const e = new Error(d); e.status = r.status; throw e; }
return r.status === 204 ? null : r.json();
}
function toast(msg, kind = "info", ms = 3800) {
const t = elFrom(`<div class="toast ${kind}">${msg}</div>`); $("#toasts").appendChild(t);
setTimeout(() => t.remove(), ms);
}
const esc = (s) => (s == null ? "" : String(s)).replace(/[&<>"]/g, c => ({ "&": "&amp;", "<": "&lt;", ">": "&gt;", '"': "&quot;" }[c]));
const badge = (txt, cls = "") => `<span class="badge ${cls}">${esc(txt)}</span>`;
const dot = (cls) => `<span class="dot ${cls}"></span>`;
const fmtTs = (ms) => ms ? new Date(ms).toLocaleString("fr-FR") : "—";
const scopeBadge = (s) => badge(s || "?", { exclusive: "warn", global: "ok", pending: "" }[s] || "");
function deviceLabel(serial) { const d = S.devices.find(x => x.serial === serial); return d && d.label ? d.label : serial; }
async function withBusy(btn, fn) { const o = btn.textContent; btn.disabled = true; btn.innerHTML = `<span class="spinner"></span>`; try { return await fn(); } finally { btn.disabled = false; btn.textContent = o; } }
// ---- sections -------------------------------------------------------------
const SECTIONS = [
{ group: "🔧 Technique", domain: "tech" },
{ id: "flotte", ic: "🛰", label: "Flotte", render: renderFlotte },
{ id: "voix", ic: "🎙", label: "Voix", render: renderVoix },
{ id: "updates", ic: "⬆", label: "Mises à jour", render: renderUpdates },
{ id: "config", ic: "⚙", label: "Config & moteur", render: () => stub("Config & moteur", "Config sampling (température, presets…) et prompts moteur, avec push par tablette. Dépend des méthodes call() base64-JSON côté app patiente (PROVIDER_RPC_SPEC).") },
{ id: "audit", ic: "📋", label: "Audit", render: renderAudit },
{ group: "⚕️ Médical / clinique", domain: "med" },
{ id: "patients", ic: "👤", label: "Patients & profils", render: renderPatients },
{ id: "conversations", ic: "💬", label: "Conversations", render: renderConversations },
{ id: "rag", ic: "📚", label: "RAG thérapeutique", render: () => stub("Corpus RAG thérapeutique", "Authoring du corpus clinique + test retrieval + publication OTA. Dépend de rag_upsert_json côté app patiente.") },
{ id: "questionnaires", ic: "📝", label: "Questionnaires", render: () => stub("Questionnaires cliniques", "Passation d'échelles/questionnaires cliniques au patient et suivi des scores dans le temps. À concevoir avec toi.") },
];
// ---- boot + shell ---------------------------------------------------------
boot();
async function boot() {
try { const st = await api("/lock-status"); S.initialized = st.initialized; S.unlocked = st.unlocked; }
catch (e) { $("#app").innerHTML = `<div class="gate"><div class="panel"><div class="logo">Kazeia<span class="dot">·</span>central</div><p class="err">serveur injoignable : ${esc(e.message)}</p></div></div>`; return; }
if (!S.unlocked) return renderGate();
await renderShell();
}
function renderGate() {
const first = !S.initialized;
$("#app").innerHTML = `<div class="gate"><div class="panel">
<div class="logo">Kazeia<span class="dot">·</span>central</div>
<p>${first ? "Choisis un mot de passe opérateur (première fois)" : "Déverrouille le coffre opérateur"}</p>
<input id="pw" type="password" placeholder="mot de passe" autofocus>
<button class="btn-primary" id="gobtn">${first ? "Initialiser" : "Déverrouiller"}</button>
<div id="gerr" class="err" style="margin-top:10px"></div>
</div></div>`;
const go = async () => {
try { await api("/unlock", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ password: $("#pw").value }) }); S.unlocked = true; await renderShell(); }
catch (e) { $("#gerr").textContent = e.message; }
};
$("#gobtn").onclick = go;
$("#pw").onkeydown = (e) => { if (e.key === "Enter") go(); };
}
async function renderShell() {
$("#app").innerHTML = `
<div class="topbar">
<span class="brand">Kazeia<span class="dot">·</span>central</span>
<span class="ctx">Tablette : <select id="devsel"></select></span>
<span class="spacer"></span>
<span class="lockpill on" id="lockpill">🔓 coffre ouvert</span>
<button class="btn-sm btn-ghost" onclick="lockStore()">verrouiller</button>
</div>
<nav class="sidebar" id="sidebar"></nav>
<main><div id="content"></div></main>`;
$("#sidebar").innerHTML = SECTIONS.map(s => s.group
? `<div class="nav-label ${s.domain === "med" ? "dom-med" : "dom-tech"}">${s.group}</div>`
: `<div class="nav-item" data-id="${s.id}"><span class="ic">${s.ic}</span>${s.label}</div>`).join("");
$("#sidebar").querySelectorAll(".nav-item").forEach(n => n.onclick = () => { S.section = n.dataset.id; renderSection(); });
await loadDevices();
renderSection();
}
async function loadDevices() {
try { S.devices = await api("/devices"); } catch (e) { S.devices = []; toast("erreur adb : " + e.message, "err"); }
if (S.devices.length && !S.selected) S.selected = S.devices[0].serial;
const sel = $("#devsel");
if (sel) {
sel.innerHTML = `<option value="">— aucune —</option>` + S.devices.map(d =>
`<option value="${d.serial}" ${d.serial === S.selected ? "selected" : ""}>${esc(d.label || d.serial)} ${d.state !== "device" ? "(" + d.state + ")" : ""}</option>`).join("");
sel.onchange = () => { S.selected = sel.value || null; renderSection(); };
}
}
function renderSection() {
document.querySelectorAll(".nav-item").forEach(n => n.classList.toggle("active", n.dataset.id === S.section));
const sec = SECTIONS.find(s => s.id === S.section) || SECTIONS.find(s => s.render);
const c = $("#content"); c.innerHTML = `<div class="empty"><span class="spinner"></span></div>`;
Promise.resolve(sec.render(c)).catch(e => { c.innerHTML = `<div class="card"><div class="err">${esc(e.message)}</div></div>`; });
}
function pageHead(title, sub, actions = "") {
return `<div class="page-head"><div><h1>${title}</h1>${sub ? `<div class="sub">${sub}</div>` : ""}</div><div class="actions">${actions}</div></div>`;
}
function stub(title, desc) {
return `${pageHead(title)}<div class="card"><div class="empty"><div class="big">🚧</div><p>${esc(desc)}</p><p class="muted">Section prévue par l'architecture — non encore implémentée.</p></div></div>`;
}
// ---- FLOTTE ---------------------------------------------------------------
async function renderFlotte(c) {
const rep = await api("/fleet/overview").catch(e => ({ error: e.message }));
const rows = Array.isArray(rep) ? rep : [];
const head = pageHead("Flotte", `${S.devices.length} tablette(s)`,
`<button class="btn-sm" onclick="renderSection()">↻ Rafraîchir</button>`);
const table = rep.error ? `<div class="err">${esc(rep.error)}</div>` : rows.length ? `<table>
<tr><th>tablette</th><th>état</th><th>RAM</th><th>MAJ</th><th>RAG</th><th>profils</th><th>sessions</th><th>crashes</th></tr>
${rows.map(r => { const o = r.result || {}; const sel = r.serial === S.selected;
return `<tr style="cursor:pointer;${sel ? "background:var(--primary-soft)" : ""}" onclick="selectDevice('${r.serial}')">
<td><b>${esc(r.label || r.serial)}</b><div class="muted mono">${esc(r.serial)}</div></td>
${r.ok === false ? `<td colspan="7" class="err">${esc(r.error)}</td>` : `
<td>${dot(o.online ? "ok" : "off")} ${o.online ? "en ligne" : "hors-ligne"}</td>
<td>${o.mem_available_mb ?? "—"} Mo</td>
<td>${esc(o.update_phase || "—")}${o.app_update_available ? " ⬆" : ""}</td>
<td>${dot(o.rag_ready ? "ok" : "idle")} ${o.rag_docs ?? 0}</td>
<td>${o.profiles ?? 0}</td><td>${o.sessions ?? 0}</td>
<td>${o.crashes ? `<span class="err">${o.crashes}</span>` : 0}</td>`}</tr>`; }).join("")}
</table>` : `<div class="empty">aucune tablette branchée</div>`;
c.innerHTML = head + `<div class="card full">${table}</div><div id="devdetail"></div>`;
if (S.selected) renderDeviceDetail($("#devdetail"), S.selected);
}
function selectDevice(serial) { S.selected = serial; const sel = $("#devsel"); if (sel) sel.value = serial; renderSection(); }
async function renderDeviceDetail(host, serial) {
host.innerHTML = `<div class="page-head" style="margin-top:22px"><h1 style="font-size:16px">Détail · ${esc(deviceLabel(serial))}</h1></div><div class="grid" id="ddgrid"><div class="empty"><span class="spinner"></span></div></div>`;
const get = (p, fn) => api(`/devices/${serial}/${p}`).then(fn).catch(e => `<div class="card"><h3>${p}</h3><div class="err">${esc(e.message)}</div></div>`);
const cards = await Promise.all([
get("state", s => card("État runtime", kv("pid", s.pid) + kv("uptime (s)", s.uptime_seconds) + kv("PSS (Mo)", s.pss_mb) + kv("RAM dispo (Mo)", s.mem_available_mb))),
get("updates", u => card("Mises à jour", kv("phase", u.phase) + kv("MAJ dispo", u.app_update_available ? "oui" : "non") + kv("version", u.app_version_name || "—"))),
get("rag/status", r => card("RAG", kv("état", (r.ready ? "prêt" : "non prêt")) + kv("modèle", r.model || "—") + kv("docs", r.doc_count ?? 0))),
get("profiles", ps => card("Profils (" + ps.length + ")", ps.length ? `<table><tr><th>nom</th><th>voix</th><th>PIN</th><th>tours</th></tr>${ps.map(p => `<tr><td>${esc(p.display_name || p.id)}</td><td>${esc(p.voice_id || "—")}</td><td>${p.has_pin ? "🔒" : "—"}</td><td>${p.turn_count ?? 0}</td></tr>`).join("")}</table>` : `<span class="muted">aucun</span>`, "full")),
get("conversations", cs => card("Conversations (" + cs.length + ")", cs.length ? `<table><tr><th>profil</th><th>session</th><th>tours</th><th>début</th></tr>${cs.map(x => `<tr><td>${esc(x.profile_id)}</td><td class="mono">${esc(x.session_id)}</td><td>${x.turn_count ?? 0}</td><td>${fmtTs(x.started_at)}</td></tr>`).join("")}</table>` : `<span class="muted">aucune session</span>`, "full")),
get("crashes", cr => card("Crashes (" + cr.length + ")", cr.length ? cr.map(x => kv(x.component || "?", x.message || "")).join("") : `<span class="muted">aucun</span>`)),
]);
$("#ddgrid").innerHTML = cards.join("");
}
const card = (title, body, cls = "") => `<div class="card ${cls}"><h3>${title}</h3>${body}</div>`;
const kv = (k, v) => `<div class="kv"><span class="k">${k}</span><span class="v">${v ?? "—"}</span></div>`;
// ---- MISES À JOUR ---------------------------------------------------------
async function renderUpdates(c) {
const rep = await api("/fleet/overview").catch(e => ({ error: e.message }));
const rows = Array.isArray(rep) ? rep : [];
c.innerHTML = pageHead("Mises à jour", "OTA piloté par tablette",
`<button class="btn-sm" id="chk">Vérifier le parc</button> <button class="btn-sm btn-primary" id="inst">Installer le parc</button>`)
+ `<div class="card full">${rep.error ? `<div class="err">${esc(rep.error)}</div>` : `<table><tr><th>tablette</th><th>phase</th><th>MAJ dispo</th><th>version</th></tr>
${rows.map(r => { const o = r.result || {}; return `<tr><td><b>${esc(r.label || r.serial)}</b></td><td>${esc(o.update_phase || "—")}</td><td>${o.app_update_available ? badge("disponible", "warn") : "—"}</td><td>${esc(o.app_version_name || "—")}</td></tr>`; }).join("")}</table>`}</div>`;
$("#chk").onclick = (e) => withBusy(e.target, async () => { const r = await api("/fleet/update-check", { method: "POST" }); toast(`${r.filter(x => x.ok).length}/${r.length} ont accepté la vérification`, "ok"); });
$("#inst").onclick = (e) => { if (!confirm("Lancer l'installation OTA sur tout le parc ?")) return; withBusy(e.target, async () => { const r = await api("/fleet/update-install", { method: "POST" }); toast(`installation lancée sur ${r.filter(x => x.ok).length}/${r.length}`, "ok"); }); };
}
// ---- AUDIT ----------------------------------------------------------------
async function renderAudit(c) {
const log = await api("/audit").catch(e => ({ error: e.message }));
const rows = Array.isArray(log) ? log : [];
c.innerHTML = pageHead("Audit", "piste d'accès opérateur (§8)") + `<div class="card full">${log.error ? `<div class="err">${esc(log.error)}</div>` : rows.length ? `<table><tr><th>date</th><th>acteur</th><th>action</th><th>cible</th></tr>
${rows.map(a => `<tr><td>${fmtTs(a.ts)}</td><td>${esc(a.actor || "—")}</td><td>${badge(a.action, "primary")}</td><td class="mono">${esc(a.target || "—")}</td></tr>`).join("")}</table>` : `<div class="empty">aucune entrée</div>`}</div>`;
}
// ---- VOIX -----------------------------------------------------------------
async function renderVoix(c) {
const serial = S.selected;
const reqs = [api("/voices/catalog").catch(e => ({ error: e.message })), api("/voices/autosync").catch(e => ({ error: e.message }))];
if (serial) reqs.push(api(`/voices/${serial}`).catch(e => ({ error: e.message })), api(`/voices/${serial}/admin`).catch(e => ({ error: e.message })));
const [cat, auto, tablet, admin] = await Promise.all(reqs);
const cv = Array.isArray(cat) ? cat : [];
const catCard = card(`Catalogue voix — flotte (${cv.length})`, cat.error ? `<div class="err">${esc(cat.error)}</div>` :
cv.length ? `<table><tr><th>voix</th><th>portée</th><th>verrou</th><th>déployée sur</th><th></th></tr>
${cv.map(v => `<tr><td><b>${esc(v.name || v.voice_id)}</b><div class="muted mono">${esc(v.voice_id)}</div></td>
<td>${scopeBadge(v.scope)}</td>
<td>${v.locked_profile_id ? "🔒 " + esc(v.owner_name || v.locked_profile_id) : `<span class="muted">généraliste</span>`}</td>
<td class="muted">${(v.deployed_serials || []).map(deviceLabel).map(esc).join(", ") || "—"}</td>
<td style="white-space:nowrap">${v.locked_profile_id ? `<button class="btn-sm" onclick="unlockVoice('${v.voice_id}')">déverrouiller</button>` : `<button class="btn-sm" onclick="lockVoicePrompt('${v.voice_id}')">verrouiller</button>`}
${v.has_wav ? `<button class="btn-sm" onclick="reenrollVoice(this,'${v.voice_id}')">ré-enrôler</button>` : ""}</td></tr>`).join("")}
</table>` : `<div class="empty">catalogue vide — enregistre des voix via l'app admin puis synchronise</div>`, "full");
const autoCard = card("Déclencheur automatique", auto.error ? `<div class="err">${esc(auto.error)}</div>` :
`<div class="kv"><span class="k">état</span><span class="v">${dot(auto.enabled ? "ok" : "idle")} ${auto.enabled ? "armé" : "désarmé"}</span></div>
<div style="display:flex;gap:10px;align-items:center;margin-top:10px">
<button onclick="toggleAutosync(${!auto.enabled})">${auto.enabled ? "Désarmer" : "Armer"}</button>
<label class="chk"><input type="checkbox" id="auto_del" ${auto.delete_source ? "checked" : ""}> supprimer le WAV device après</label></div>`);
let cards = catCard + autoCard;
if (!serial) {
cards += card("Par tablette", `<div class="empty">Choisis une tablette (en haut) pour voir ce qui y est chargé et les voix chargeables dessus.</div>`, "full");
} else {
const av = Array.isArray(admin) ? admin : [];
const adminCard = card(`Voix admin à enrôler — ${esc(deviceLabel(serial))} (${av.length})`, admin.error ? `<div class="err">${esc(admin.error)}</div>` :
(av.length ? `<table><tr><th>nom</th><th>portée</th><th>propriétaire</th><th>statut</th></tr>${av.map(v => `<tr><td><b>${esc(v.name || v.voice_id)}</b></td><td>${scopeBadge(v.scope)}</td><td>${esc(v.owner_name || v.owner_profile_id || "—")}</td><td>${esc(v.status)}</td></tr>`).join("")}</table>` : `<div class="empty">aucune voix admin en attente</div>`)
+ `<div style="display:flex;gap:10px;align-items:center;margin-top:12px"><button class="btn-primary" onclick="syncAdmin(this,'${serial}')">Synchroniser (enrôler + déployer)</button><label class="chk"><input type="checkbox" id="sync_del"> supprimer le WAV device après</label></div>`, "full");
const loaded = (tablet && tablet.deployed) || [], loadable = (tablet && tablet.deployable) || [];
const tabCard = card(`${esc(deviceLabel(serial))} — chargées (${loaded.length}) · chargeables (${loadable.filter(v => v.deployable).length})`, tablet && tablet.error ? `<div class="err">${esc(tablet.error)}</div>` :
`<table><tr><th>voix</th><th>portée</th><th>état</th><th></th></tr>
${loaded.map(v => `<tr><td>${dot("ok")} ${esc(v.name || v.voice_id)}${v.in_catalog === false ? ` <span class="muted">(hors catalogue)</span>` : ""}</td><td>${v.scope ? scopeBadge(v.scope) : "—"}</td><td>chargée</td><td>${v.in_catalog !== false ? `<button class="btn-sm" onclick="undeployVoice(this,'${serial}','${v.voice_id}')">retirer</button>` : ""}</td></tr>`).join("")}
${loadable.map(v => `<tr><td class="muted">${esc(v.name || v.voice_id)}</td><td>${scopeBadge(v.scope)}</td><td class="muted">${v.deployable ? "chargeable" : esc(v.reason || "—")}</td><td>${v.deployable ? `<button class="btn-sm btn-primary" onclick="deployVoice(this,'${serial}','${v.voice_id}')">charger</button>` : ""}</td></tr>`).join("")}
</table>`, "full");
cards += adminCard + tabCard;
}
c.innerHTML = pageHead("Voix", "catalogue de flotte · enrôlement OmniVoice") + `<div class="grid">${cards}</div>`;
}
// ---- actions voix ---------------------------------------------------------
async function toggleAutosync(on) { try { await api("/voices/autosync", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ enabled: on, delete_source: $("#auto_del") && $("#auto_del").checked || false }) }); toast(on ? "auto-enrôlement armé" : "désarmé", "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } }
async function syncAdmin(btn, serial) { const del = $("#sync_del") && $("#sync_del").checked || false; await withBusy(btn, async () => { try { const r = await api(`/voices/${serial}/admin/sync`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ delete_source: del }) }); toast(`${r.filter(x => x.ok && x.deployed).length}/${r.length} voix déployée(s)`, "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } }); }
async function deployVoice(btn, serial, vid) { await withBusy(btn, async () => { try { const r = await api(`/voices/${serial}/deploy`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ voice_id: vid }) }); r.deployed ? toast("voix chargée", "ok") : toast("non chargée : " + (r.reason || ""), "err"); renderSection(); } catch (e) { toast(e.message, "err"); } }); }
async function undeployVoice(btn, serial, vid) { await withBusy(btn, async () => { try { await api(`/voices/${serial}/undeploy`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ voice_id: vid }) }); toast("voix retirée", "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } }); }
async function reenrollVoice(btn, vid) { if (!confirm(`Ré-enrôler « ${vid} » (fix §7) et re-pousser sur ses tablettes ?`)) return; await withBusy(btn, async () => { try { const r = await api(`/voices/catalog/${vid}/reenroll`, { method: "POST" }); toast("ré-enrôlé · re-déployé : " + ((r.redeployed || []).join(", ") || "—"), "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } }); }
async function lockVoicePrompt(vid) { const p = prompt(`Verrouiller « ${vid} » sur quel profil patient ? (profile_id)`); if (!p) return; try { await api(`/voices/catalog/${vid}/lock`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ profile_id: p }) }); toast("voix verrouillée", "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } }
async function unlockVoice(vid) { try { await api(`/voices/catalog/${vid}/unlock`, { method: "POST" }); toast("voix déverrouillée", "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } }
// ---- PATIENTS (médical) ---------------------------------------------------
const LANGS = ["fr", "en", "de", "es", "it", "pt", "nl", "ar", "zh", "ja", "ko"];
async function renderPatients(c) {
const serial = S.selected;
if (!serial) { c.innerHTML = pageHead("Patients & profils") + `<div class="card"><div class="empty"><div class="big">👤</div><p>Choisis une tablette (en haut) pour voir ses patients.</p></div></div>`; return; }
const list = await api(`/patients/${serial}`).catch(e => ({ error: e.message }));
const ps = Array.isArray(list) ? list : [];
const table = list.error ? `<div class="err">${esc(list.error)}</div>` : ps.length ? `<table>
<tr><th>patient</th><th>voix</th><th>langue</th><th>fiche</th><th>tours</th><th></th></tr>
${ps.map(p => `<tr><td><b>${esc(p.full_name || p.display_name || p.profile_id)}</b><div class="muted mono">${esc(p.profile_id)}</div></td>
<td>${esc(p.voice_id || "—")}</td><td>${p.language ? badge(p.language, "primary") : `<span class="muted">—</span>`}</td>
<td>${p.has_fiche ? badge("remplie", "ok") : `<span class="muted">vide</span>`}</td><td>${p.turn_count ?? 0}</td>
<td><button class="btn-sm" onclick="openPatient('${serial}','${p.profile_id}')">ouvrir</button></td></tr>`).join("")}
</table>` : `<div class="empty">aucun profil patient sur cette tablette</div>`;
c.innerHTML = pageHead("Patients & profils", esc(deviceLabel(serial))) + `<div class="card full">${table}</div><div id="patdetail"></div>`;
}
const finput = (id, label, val) => `<label style="display:flex;align-items:center;gap:10px;margin:5px 0"><span style="width:150px;color:var(--muted);font-size:13px">${label}</span><input id="${id}" value="${esc(val || "")}" style="flex:1"></label>`;
const ftext = (id, label, val) => `<div style="margin:8px 0"><div class="muted" style="font-size:12px;margin-bottom:3px">${label}</div><textarea id="${id}" rows="3" style="width:100%;font:inherit;padding:8px 11px;border:1px solid var(--line-strong);border-radius:8px;resize:vertical">${esc(val || "")}</textarea></div>`;
const subhead = (t) => `<div class="muted" style="font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin:12px 0 6px;font-weight:700">${t}</div>`;
async function openPatient(serial, pid) {
const host = $("#patdetail"); host.innerHTML = `<div class="empty"><span class="spinner"></span></div>`;
let d; try { d = await api(`/patients/${serial}/${pid}`); } catch (e) { host.innerHTML = `<div class="card"><div class="err">${esc(e.message)}</div></div>`; return; }
const prof = d.profile || {}, f = d.fiche || {}, civ = f.civil || {}, con = f.contact || {}, cli = f.clinical || {};
const curLang = d.language || prof.language || "fr";
host.innerHTML = `<div class="page-head" style="margin-top:22px"><h1 style="font-size:16px">Patient · ${esc(prof.display_name || pid)}</h1></div><div class="grid">
${card("Profil on-device (tablette)", kv("nom affiché", esc(prof.display_name || "—")) + kv("voix", esc(prof.voice_id || "—")) + kv("PIN", prof.has_pin ? "🔒 défini" : "—")
+ `<div class="kv"><span class="k">langue du pipeline</span><span class="v"><select id="lang">${LANGS.map(l => `<option ${l === curLang ? "selected" : ""}>${l}</option>`).join("")}</select> <button class="btn-sm btn-primary" onclick="pushLanguage(this,'${serial}','${pid}')">pousser</button></span></div>`
+ (prof.system_prompt_override ? `<div class="muted" style="margin-top:8px;font-size:12px">prompt override : ${esc((prof.system_prompt_override || "").slice(0, 90))}…</div>` : ""))}
${card("Fiche clinique <span class='badge'>chiffrée · PC uniquement</span>",
subhead("Identité civile") + finput("civ_name", "Nom complet", civ.full_name) + finput("civ_birth", "Naissance", civ.birth_date) + finput("civ_sex", "Sexe", civ.sex)
+ subhead("Contact / référent") + finput("con_ref", "Soignant référent", con.referent) + finput("con_fam", "Proche / famille", con.family) + finput("con_tel", "Téléphone", con.phone)
+ subhead("Clinique") + finput("cli_path", "Pathologie / contexte", cli.pathology) + finput("cli_treat", "Traitement", cli.treatment) + finput("cli_all", "Allergies", cli.allergies) + ftext("cli_notes", "Notes cliniques", cli.notes)
+ `<div style="margin-top:12px"><button class="btn-primary" onclick="saveFiche(this,'${serial}','${pid}')">Enregistrer la fiche</button></div>`, "full")}
</div>`;
}
async function saveFiche(btn, serial, pid) {
const gv = (id) => (($("#" + id) || {}).value || "").trim();
const fiche = {
civil: { full_name: gv("civ_name"), birth_date: gv("civ_birth"), sex: gv("civ_sex") },
contact: { referent: gv("con_ref"), family: gv("con_fam"), phone: gv("con_tel") },
clinical: { pathology: gv("cli_path"), treatment: gv("cli_treat"), allergies: gv("cli_all"), notes: gv("cli_notes") },
};
const language = ($("#lang") || {}).value || null;
await withBusy(btn, async () => { try { await api(`/patients/${serial}/${pid}/fiche`, { method: "PUT", headers: { "content-type": "application/json" }, body: JSON.stringify({ fiche, language }) }); toast("fiche enregistrée (chiffrée)", "ok"); } catch (e) { toast(e.message, "err"); } });
}
async function pushLanguage(btn, serial, pid) {
const language = ($("#lang") || {}).value;
await withBusy(btn, async () => { try { await api(`/patients/${serial}/${pid}/language`, { method: "PUT", headers: { "content-type": "application/json" }, body: JSON.stringify({ language }) }); toast(`langue « ${language} » poussée sur la tablette`, "ok"); } catch (e) { toast(e.message, "err"); } });
}
// ---- CONVERSATIONS (médical, RGPD) ----------------------------------------
async function renderConversations(c) {
const serial = S.selected;
if (!serial) { c.innerHTML = pageHead("Conversations") + `<div class="card"><div class="empty"><div class="big">💬</div><p>Choisis une tablette (en haut).</p></div></div>`; return; }
const list = await api(`/conversations/${serial}`).catch(e => ({ error: e.message }));
const ss = Array.isArray(list) ? list : [];
const table = list.error ? `<div class="err">${esc(list.error)}</div>` : ss.length ? `<table>
<tr><th>session</th><th>patient</th><th>tours</th><th>début</th><th></th></tr>
${ss.map(s => `<tr><td class="mono">${esc(s.session_id)}</td><td>${esc(s.profile_id || "—")}</td><td>${s.turns}</td>
<td class="muted">${fmtTs(s.started_at)}</td>
<td style="white-space:nowrap"><button class="btn-sm" onclick="openSession('${serial}','${s.session_id}')">lire</button>
<button class="btn-sm" onclick="exportSession('${serial}','${s.session_id}')">JSON</button>
<button class="btn-sm" onclick="purgeSession(this,'${serial}','${s.session_id}')">purger</button></td></tr>`).join("")}
</table>` : `<div class="empty">aucune conversation archivée — clique « Rapatrier depuis la tablette »</div>`;
c.innerHTML = pageHead("Conversations", esc(deviceLabel(serial)) + " · archive clinique chiffrée (RGPD)",
`<button class="btn-primary" onclick="collectConversations(this,'${serial}')">Rapatrier depuis la tablette</button>`)
+ `<div class="card full">${table}</div><div id="convview"></div>`;
}
async function collectConversations(btn, serial) {
await withBusy(btn, async () => { try {
const r = await api(`/conversations/${serial}/collect`, { method: "POST", headers: { "content-type": "application/json" }, body: "{}" });
toast(`${r.archived} tour(s) archivé(s) sur ${r.exported} exporté(s)${r.purged ? " · fichier device purgé" : ""}`, "ok");
renderSection();
} catch (e) { toast(e.message, "err"); } });
}
async function openSession(serial, sid) {
const host = $("#convview"); host.innerHTML = `<div class="empty"><span class="spinner"></span></div>`;
let turns; try { turns = await api(`/conversations/${serial}/${sid}`); } catch (e) { host.innerHTML = `<div class="card"><div class="err">${esc(e.message)}</div></div>`; return; }
host.innerHTML = `<div class="page-head" style="margin-top:22px"><h1 style="font-size:16px">Session ${esc(sid)}</h1><div class="actions"><button class="btn-sm" onclick="exportSession('${serial}','${sid}')">Exporter JSON</button></div></div>
<div class="card full">${turns.length ? turns.map(t => { const me = t.role === "PATIENT";
return `<div style="display:flex;justify-content:${me ? "flex-start" : "flex-end"};margin:7px 0">
<div style="max-width:72%;padding:9px 13px;border-radius:12px;background:${me ? "var(--surface-2)" : "var(--primary-soft)"};border:1px solid var(--line)">
<div class="muted" style="font-size:11px;margin-bottom:2px">${me ? "Patient" : "Kazeia"} · ${fmtTs(t.ts)}</div>${esc(t.text || "")}</div></div>`; }).join("") : `<div class="empty">aucun tour</div>`}</div>`;
}
function exportSession(serial, sid) { window.open(`/api/conversations/${serial}/${sid}/export`, "_blank"); }
async function purgeSession(btn, serial, sid) {
if (!confirm(`Purger définitivement la session ${sid} de l'archive centrale ? (RGPD, irréversible)`)) return;
await withBusy(btn, async () => { try { const r = await api(`/conversations/${serial}/purge`, { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify({ session_id: sid }) }); toast(`${r.deleted} tour(s) purgé(s)`, "ok"); renderSection(); } catch (e) { toast(e.message, "err"); } });
}
// ---- store ----------------------------------------------------------------
async function lockStore() { try { await api("/lock", { method: "POST" }); S.unlocked = false; renderGate(); } catch (e) { toast(e.message, "err"); } }