Sascha/Aime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Glossar: Eintraege bearbeitbar (PUT /api/glossary/:id + GUI-Editier-Flow)

Browse Source 
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_0113vDKdSNtD3Dwcw4QMu9yV
This commit is contained in:
schakal00783
2026-07-16 23:55:27 +02:00
co-authored by Claude Fable 5
parent fdae4ce119
commit 1016eaa095
4 changed files with 43 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/web/src/main.js
+23 -6
View File
@@ -3,7 +3,8 @@ import './style.css';
const api = {
async get(u) { const r = await fetch(u); if (!r.ok) throw new Error((await r.json()).error || r.status); return r.json(); },
async post(u, b) { const r = await fetch(u, { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(b || {}) }); if (!r.ok) throw new Error((await r.json()).error || r.status); return r.json(); },
async del(u) { const r = await fetch(u, { method: 'DELETE' }); return r.json(); }
async del(u) { const r = await fetch(u, { method: 'DELETE' }); return r.json(); },
async put(u, b) { const r = await fetch(u, { method: 'PUT', headers: { 'content-type': 'application/json' }, body: JSON.stringify(b || {}) }); if (!r.ok) throw new Error((await r.json()).error || r.status); return r.json(); }
};
const app = document.querySelector('#app');
@@ -187,36 +188,52 @@ async function viewGlossary() {
const v = document.querySelector('#view');
v.innerHTML = `
<div class="card">
<h3>Begriff hinzufügen</h3>
<h3 id="gformtitle">Begriff hinzufügen</h3>
<div class="hint">Eigennamen &amp; Fachbegriffe, die die Spracherkennung verhört (z.B. „Aime" wird als „Amy" gehört). Die KI-Korrektur ersetzt lautähnliche Wörter dann durch die richtige Schreibweise.</div>
<label class="lbl">Begriff (korrekte Schreibweise)</label>
<input id="gterm" class="input" placeholder="z.B. Aime"/>
<label class="lbl">Verhörer / Soundalikes (optional, Komma-getrennt)</label>
<input id="gsound" class="input" placeholder="z.B. Amy, Ami"/>
<button id="gadd" class="btn primary">Hinzufügen</button>
<button id="gcancel" class="btn" style="display:none">Abbrechen</button>
</div>
<div class="card"><h3>Glossar</h3><div id="glist" class="list">Lade…</div></div>`;
const listEl = v.querySelector('#glist');
let editId = null; // id of the entry currently loaded into the form
const formTitle = v.querySelector('#gformtitle'), saveBtn = v.querySelector('#gadd'), cancelBtn = v.querySelector('#gcancel');
function setEdit(g) {
editId = g ? g.id : null;
formTitle.textContent = g ? `„${g.term}" bearbeiten` : 'Begriff hinzufügen';
saveBtn.textContent = g ? 'Speichern' : 'Hinzufügen';
cancelBtn.style.display = g ? '' : 'none';
v.querySelector('#gterm').value = g ? g.term : '';
v.querySelector('#gsound').value = g ? (g.soundalikes || '') : '';
if (g) v.querySelector('#gterm').focus();
}
async function load() {
try {
const gs = await api.get('/api/glossary');
listEl.innerHTML = gs.length ? gs.map(g => `
<div class="item"><div class="grow"><b>📖 ${escapeHtml(g.term)}</b>
${g.soundalikes ? `<div class="muted">↔ ${escapeHtml(g.soundalikes)}</div>` : ''}</div>
<button class="btn" data-edit="${g.id}">✏️</button>
<button class="btn danger" data-del="${g.id}">🗑</button></div>`).join('')
: '<div class="muted">Noch keine Begriffe. Oben hinzufügen.</div>';
listEl.querySelectorAll('[data-del]').forEach(b => b.onclick = async () => { await api.del('/api/glossary/' + b.dataset.del); load(); });
listEl.querySelectorAll('[data-del]').forEach(b => b.onclick = async () => { await api.del('/api/glossary/' + b.dataset.del); if (editId === +b.dataset.del) setEdit(null); load(); });
listEl.querySelectorAll('[data-edit]').forEach(b => b.onclick = () => setEdit(gs.find(g => g.id === +b.dataset.edit)));
} catch (e) { listEl.innerHTML = '<div class="err">' + e.message + '</div>'; }
}
await load();
v.querySelector('#gadd').onclick = async () => {
cancelBtn.onclick = () => setEdit(null);
saveBtn.onclick = async () => {
const term = v.querySelector('#gterm').value.trim();
if (!term) { toast('Bitte Begriff eingeben', true); return; }
const soundalikes = v.querySelector('#gsound').value.trim();
try {
await api.post('/api/glossary', { term, soundalikes });
if (editId != null) await api.put('/api/glossary/' + editId, { term, soundalikes });
else await api.post('/api/glossary', { term, soundalikes });
toast(`„${term}" gespeichert ✓`);
v.querySelector('#gterm').value = ''; v.querySelector('#gsound').value = '';
setEdit(null);
load();
} catch (e) { toast(e.message, true); }
};