Files
carddav-proxy/public/index.html

55 lines
1.8 KiB
HTML

<!doctype html>
<html lang="de">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>CardDAV Proxy - Kontakt Suche</title>
<style>
body { font-family: Arial, sans-serif; margin: 24px; }
input { padding: 8px; width: 360px; }
button { padding: 8px 12px; }
table { border-collapse: collapse; width: 100%; margin-top: 16px; }
th, td { border: 1px solid #ddd; padding: 8px; vertical-align: top; }
th { background: #f3f3f3; text-align: left; }
.muted { color: #777; }
</style>
</head>
<body>
<h2>CardDAV Kontakt-Suche</h2>
<p class="muted">Quelle: Zoho CardDAV via Proxy</p>
<input id="q" placeholder="Name, E-Mail, Telefon..." />
<button onclick="search()">Suchen</button>
<span id="info" class="muted"></span>
<table>
<thead>
<tr><th>Name</th><th>Organisation</th><th>E-Mail</th><th>Telefon</th></tr>
</thead>
<tbody id="rows"></tbody>
</table>
<script>
async function search() {
const q = document.getElementById('q').value.trim();
const info = document.getElementById('info');
info.textContent = ' lade...';
const r = await fetch('/api/search?q=' + encodeURIComponent(q));
const j = await r.json();
const body = document.getElementById('rows');
body.innerHTML = '';
if (!r.ok || !j.ok) {
info.textContent = ' Fehler: ' + (j.error || r.status);
return;
}
info.textContent = ` ${j.count} Treffer`;
for (const c of j.contacts) {
const tr = document.createElement('tr');
tr.innerHTML = `<td>${(c.fullName || '').replaceAll('<','&lt;')}</td><td>${(c.org || '').replaceAll('<','&lt;')}</td><td>${(c.emails || []).join('<br>')}</td><td>${(c.tels || []).join('<br>')}</td>`;
body.appendChild(tr);
}
}
search();
</script>
</body>
</html>