Sprint 15: Suche, Ausweis, Teilen, Widget
- Volltext-Suche im Tagebuch (LIKE über Titel/Text/Tags, Debounce 350ms)
- Digitaler Heimtierausweis als druckbare HTML-Seite (/ausweis/{dog_id})
Enthält Impfungen, Medikamente, Allergien, Tierärzte, Chip-Nr.
- Hund teilen: Einladungslink-System (dog_shares-Tabelle, /teilen/{token})
Geteilte Hunde erscheinen in der Hundeliste, Tagebuch/Gesundheit lesbar
- Widget-Seite /#widget: zufälliges Tagebuchbild + nächste Erinnerung
Als PWA-Shortcut im Manifest verankert
- SW-Cache by-v144, APP_VER 117
This commit is contained in:
parent
d5f09cd16b
commit
34f29f9d0a
16 changed files with 917 additions and 35 deletions
|
|
@ -188,6 +188,16 @@ window.Page_dog_profile = (() => {
|
|||
<button class="btn btn-primary w-full" id="dp-edit-btn">
|
||||
Profil bearbeiten
|
||||
</button>
|
||||
<div style="display:flex;gap:var(--space-2)">
|
||||
<button class="btn btn-secondary" style="flex:1" id="dp-ausweis-btn">
|
||||
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#identification-card"></use></svg>
|
||||
Ausweis
|
||||
</button>
|
||||
<button class="btn btn-secondary" style="flex:1" id="dp-share-btn">
|
||||
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#share-network"></use></svg>
|
||||
Teilen
|
||||
</button>
|
||||
</div>
|
||||
<button class="btn btn-secondary w-full" id="dp-add-dog-btn">
|
||||
+ Weiteren Hund anlegen
|
||||
</button>
|
||||
|
|
@ -240,6 +250,14 @@ window.Page_dog_profile = (() => {
|
|||
_showChipEdit(dog);
|
||||
});
|
||||
|
||||
document.getElementById('dp-ausweis-btn')?.addEventListener('click', () => {
|
||||
window.open(`/ausweis/${dog.id}`, '_blank');
|
||||
});
|
||||
|
||||
document.getElementById('dp-share-btn')?.addEventListener('click', () => {
|
||||
_showShareModal(dog);
|
||||
});
|
||||
|
||||
// Edit- und Add-Klicks laufen über Event-Delegation in init() — keine direkten Listener nötig.
|
||||
}
|
||||
|
||||
|
|
@ -275,6 +293,102 @@ window.Page_dog_profile = (() => {
|
|||
});
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------
|
||||
// TEILEN
|
||||
// ----------------------------------------------------------
|
||||
async function _showShareModal(dog) {
|
||||
UI.modal.open({
|
||||
title: `${_esc(dog.name)} teilen`,
|
||||
body: `
|
||||
<p style="font-size:var(--text-sm);color:var(--c-text-secondary);margin-bottom:var(--space-4)">
|
||||
Erstelle einen Einladungslink, den du per WhatsApp, Signal oder E-Mail teilen kannst.
|
||||
Die eingeladene Person sieht Tagebuch und Gesundheitsakte nach dem Annehmen.
|
||||
</p>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Berechtigung</label>
|
||||
<select class="form-control" id="share-role-select">
|
||||
<option value="editor">Mitschreiben (Tagebuch & Gesundheit bearbeiten)</option>
|
||||
<option value="viewer">Nur lesen</option>
|
||||
</select>
|
||||
</div>
|
||||
<div id="share-link-result" style="display:none;margin-top:var(--space-4)">
|
||||
<label class="form-label">Einladungslink</label>
|
||||
<div style="display:flex;gap:var(--space-2);align-items:center">
|
||||
<input class="form-control" id="share-link-input" type="text" readonly
|
||||
style="font-size:var(--text-xs)">
|
||||
<button class="btn btn-secondary btn-sm" id="share-link-copy">
|
||||
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#clipboard-text"></use></svg>
|
||||
</button>
|
||||
</div>
|
||||
<p style="font-size:var(--text-xs);color:var(--c-text-muted);margin-top:var(--space-2)">
|
||||
Dieser Link kann einmalig angenommen werden.
|
||||
</p>
|
||||
</div>
|
||||
<div id="share-list-wrap" style="margin-top:var(--space-4)"></div>`,
|
||||
footer: `
|
||||
<button class="btn btn-secondary" onclick="UI.modal.close()">Schließen</button>
|
||||
<button class="btn btn-primary" id="share-create-btn">Link erstellen</button>`,
|
||||
});
|
||||
|
||||
_loadShareList(dog.id);
|
||||
|
||||
document.getElementById('share-create-btn').addEventListener('click', async () => {
|
||||
const role = document.getElementById('share-role-select').value;
|
||||
const btn = document.getElementById('share-create-btn');
|
||||
UI.setLoading(btn, true);
|
||||
try {
|
||||
const res = await API.sharing.create(dog.id, role);
|
||||
const link = `${location.origin}${res.invite_path}`;
|
||||
const inp = document.getElementById('share-link-input');
|
||||
inp.value = link;
|
||||
document.getElementById('share-link-result').style.display = 'block';
|
||||
document.getElementById('share-link-copy').onclick = async () => {
|
||||
await navigator.clipboard.writeText(link).catch(() => {});
|
||||
UI.toast.success('Link kopiert!');
|
||||
};
|
||||
UI.setLoading(btn, false);
|
||||
_loadShareList(dog.id);
|
||||
} catch (e) {
|
||||
UI.setLoading(btn, false);
|
||||
UI.toast.error(e.message || 'Fehler');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async function _loadShareList(dogId) {
|
||||
const wrap = document.getElementById('share-list-wrap');
|
||||
if (!wrap) return;
|
||||
try {
|
||||
const shares = await API.sharing.list(dogId);
|
||||
if (!shares.length) { wrap.innerHTML = ''; return; }
|
||||
wrap.innerHTML = `
|
||||
<div style="font-size:var(--text-xs);color:var(--c-text-muted);margin-bottom:var(--space-2)">
|
||||
Aktive Einladungen
|
||||
</div>` +
|
||||
shares.map(s => `
|
||||
<div style="display:flex;align-items:center;gap:var(--space-2);
|
||||
padding:var(--space-2) var(--space-3);background:var(--c-surface);
|
||||
border-radius:var(--radius-md);margin-bottom:var(--space-1)">
|
||||
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#user"></use></svg>
|
||||
<div style="flex:1;font-size:var(--text-sm)">
|
||||
${s.shared_with_name
|
||||
? `<strong>${_esc(s.shared_with_name)}</strong> · ${s.role}`
|
||||
: `<em style="color:var(--c-text-muted)">Ausstehend</em> · ${s.role}`}
|
||||
</div>
|
||||
<button class="btn btn-link btn-sm share-revoke-btn" data-share-id="${s.id}"
|
||||
style="color:var(--c-danger);padding:0">
|
||||
<svg class="ph-icon" aria-hidden="true"><use href="/icons/phosphor.svg#x"></use></svg>
|
||||
</button>
|
||||
</div>`).join('');
|
||||
wrap.querySelectorAll('.share-revoke-btn').forEach(btn => {
|
||||
btn.addEventListener('click', async () => {
|
||||
await API.sharing.revoke(dogId, parseInt(btn.dataset.shareId));
|
||||
_loadShareList(dogId);
|
||||
});
|
||||
});
|
||||
} catch (e) { /* ignore */ }
|
||||
}
|
||||
|
||||
// ----------------------------------------------------------
|
||||
// NEU ANLEGEN (direkt auf der Seite, kein Modal)
|
||||
// ----------------------------------------------------------
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue