Files
stiftung-management-system/app/templates/stiftung/destinataer_detail.html

973 lines
57 KiB
HTML

{% extends 'base.html' %}
{% load static %}
{% block title %}{{ destinataer.get_full_name }} - Destinatär - Stiftungsverwaltung{% endblock %}
{% block content %}
<div class="row">
<div class="col-12">
<!-- Header -->
<div class="d-flex justify-content-between align-items-center mb-4">
<h1 class="h3">
<i class="fas fa-users text-primary me-2"></i>
Destinatär: {{ destinataer.get_full_name }}
</h1>
<div>
<a href="{% url 'stiftung:foerderung_create' %}?destinataer={{ destinataer.pk }}" class="btn btn-success me-2">
<i class="fas fa-gift me-2"></i>Neue Förderung
</a>
<!-- Edit Mode Toggle Buttons -->
<button id="edit-btn" class="btn btn-warning me-2" onclick="enableEditMode()">
<i class="fas fa-edit me-2"></i>Bearbeiten
</button>
<button id="save-btn" class="btn btn-success me-2" onclick="saveChanges()" style="display: none;">
<i class="fas fa-save me-2"></i>Speichern
</button>
<button id="cancel-btn" class="btn btn-secondary me-2" onclick="cancelEdit()" style="display: none;">
<i class="fas fa-times me-2"></i>Abbrechen
</button>
<a href="{% url 'stiftung:destinataer_list' %}" class="btn btn-outline-secondary">
<i class="fas fa-arrow-left me-2"></i>Zurück zur Liste
</a>
</div>
</div>
<div class="row">
<!-- Main Content -->
<div class="col-lg-8">
<!-- Edit Form (invisible wrapper) -->
<form id="edit-form" method="post" action="{% url 'stiftung:destinataer_update' pk=destinataer.pk %}" style="display: contents;">
{% csrf_token %}
<!-- Persönliche Informationen -->
<div class="card shadow mb-4">
<div class="card-header bg-primary text-white">
<h5 class="card-title mb-0">
<i class="fas fa-user me-2"></i>Persönliche Informationen
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<!-- Vorname -->
<p class="mb-3">
<strong>Vorname:</strong>
<span class="view-mode">{{ destinataer.vorname }}</span>
<input type="text" name="vorname" value="{{ destinataer.vorname }}" class="form-control edit-mode" style="display: none;" required>
</p>
<!-- Nachname -->
<p class="mb-3">
<strong>Nachname:</strong>
<span class="view-mode">{{ destinataer.nachname }}</span>
<input type="text" name="nachname" value="{{ destinataer.nachname }}" class="form-control edit-mode" style="display: none;" required>
</p>
<!-- Geburtsdatum -->
<p class="mb-3">
<strong>Geburtsdatum:</strong>
<span class="view-mode">
{% if destinataer.geburtsdatum %}
{{ destinataer.geburtsdatum|date:"d.m.Y" }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="date" name="geburtsdatum" value="{% if destinataer.geburtsdatum %}{{ destinataer.geburtsdatum|date:'Y-m-d' }}{% endif %}" class="form-control edit-mode" style="display: none;">
</p>
<!-- Familienzweig -->
<p class="mb-3">
<strong>Familienzweig:</strong>
<span class="view-mode">
<span class="badge bg-info">{{ destinataer.get_familienzweig_display }}</span>
</span>
<select name="familienzweig" class="form-select edit-mode" style="display: none;">
<option value="">Bitte wählen...</option>
<option value="hagemann" {% if destinataer.familienzweig == 'hagemann' %}selected{% endif %}>Hagemann</option>
<option value="bechstein" {% if destinataer.familienzweig == 'bechstein' %}selected{% endif %}>Bechstein</option>
<option value="other" {% if destinataer.familienzweig == 'other' %}selected{% endif %}>Sonstige</option>
</select>
</p>
</div>
<div class="col-md-6">
<!-- Status -->
<p class="mb-3">
<strong>Status:</strong>
<span class="view-mode">
{% if destinataer.aktiv %}
<span class="badge bg-success">Aktiv</span>
{% else %}
<span class="badge bg-secondary">Inaktiv</span>
{% endif %}
</span>
<div class="edit-mode" style="display: none;">
<div class="form-check">
<input type="checkbox" name="aktiv" id="aktiv" class="form-check-input" {% if destinataer.aktiv %}checked{% endif %}>
<label class="form-check-label" for="aktiv">Aktiv</label>
</div>
</div>
</p>
<!-- Berufsgruppe -->
<p class="mb-3">
<strong>Berufsgruppe:</strong>
<span class="view-mode">
<span class="badge bg-secondary">{{ destinataer.get_berufsgruppe_display }}</span>
</span>
<select name="berufsgruppe" class="form-select edit-mode" style="display: none;">
<option value="">Bitte wählen...</option>
<option value="student_studentin" {% if destinataer.berufsgruppe == 'student_studentin' %}selected{% endif %}>Student/Studentin</option>
<option value="auszubildende" {% if destinataer.berufsgruppe == 'auszubildende' %}selected{% endif %}>Auszubildende/r</option>
<option value="berufsanfaenger" {% if destinataer.berufsgruppe == 'berufsanfaenger' %}selected{% endif %}>Berufsanfänger/in</option>
<option value="sonstige" {% if destinataer.berufsgruppe == 'sonstige' %}selected{% endif %}>Sonstige</option>
</select>
</p>
</div>
</div>
</div>
</div>
<!-- Kontaktinformationen -->
<div class="card shadow mb-4">
<div class="card-header bg-info text-white">
<h5 class="card-title mb-0">
<i class="fas fa-address-book me-2"></i>Kontaktinformationen
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<!-- E-Mail -->
<p class="mb-3">
<strong>E-Mail:</strong>
<span class="view-mode">
{% if destinataer.email %}
<a href="mailto:{{ destinataer.email }}">{{ destinataer.email }}</a>
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="email" name="email" value="{{ destinataer.email }}" class="form-control edit-mode" style="display: none;" placeholder="max@example.com">
</p>
<!-- Telefon -->
<p class="mb-3">
<strong>Telefon:</strong>
<span class="view-mode">
{% if destinataer.telefon %}
{{ destinataer.telefon }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="tel" name="telefon" value="{{ destinataer.telefon }}" class="form-control edit-mode" style="display: none;" placeholder="+49 123 456789">
</p>
</div>
<div class="col-md-6">
<!-- IBAN -->
<p class="mb-3">
<strong>IBAN:</strong>
<span class="view-mode">
{% if destinataer.iban %}
{{ destinataer.iban }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="text" name="iban" value="{{ destinataer.iban }}" class="form-control edit-mode" style="display: none;" placeholder="DE89 3704 0044 0532 0130 00">
</p>
</div>
</div>
<!-- Adresse (full width) -->
<div class="row">
<div class="col-12">
<p class="mb-3">
<strong>Adresse:</strong>
<span class="view-mode">
{% if destinataer.adresse %}
<br>{{ destinataer.adresse|linebreaks }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<textarea name="adresse" class="form-control edit-mode" style="display: none;" rows="3" placeholder="Straße Nr.&#10;PLZ Ort">{{ destinataer.adresse }}</textarea>
</p>
</div>
</div>
</div>
</div>
<!-- Berufliche Informationen -->
<div class="card shadow mb-4">
<div class="card-header bg-success text-white">
<h5 class="card-title mb-0">
<i class="fas fa-briefcase me-2"></i>Berufliche Informationen
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<!-- Ausbildungsstand -->
<p class="mb-3">
<strong>Ausbildungsstand:</strong>
<span class="view-mode">
{% if destinataer.ausbildungsstand %}
{{ destinataer.ausbildungsstand }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="text" name="ausbildungsstand" value="{{ destinataer.ausbildungsstand }}" class="form-control edit-mode" style="display: none;" placeholder="z.B. Bachelor, Master, Ausbildung">
</p>
<!-- Institution -->
<p class="mb-3">
<strong>Institution/Organisation:</strong>
<span class="view-mode">
{% if destinataer.institution %}
{{ destinataer.institution }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="text" name="institution" value="{{ destinataer.institution }}" class="form-control edit-mode" style="display: none;" placeholder="Universität, Unternehmen, etc.">
</p>
</div>
<div class="col-md-6">
<!-- Projektbeschreibung -->
<p class="mb-3">
<strong>Projektbeschreibung:</strong>
<span class="view-mode">
{% if destinataer.projekt_beschreibung %}
<br>{{ destinataer.projekt_beschreibung|linebreaks }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<textarea name="projekt_beschreibung" class="form-control edit-mode" style="display: none;" rows="4" placeholder="Beschreibung des Studiums/Projekts">{{ destinataer.projekt_beschreibung }}</textarea>
</p>
</div>
</div>
</div>
</div>
<!-- Finanzielle Informationen -->
<div class="card shadow mb-4">
<div class="card-header bg-warning text-dark">
<h5 class="card-title mb-0">
<i class="fas fa-euro-sign me-2"></i>Finanzielle Informationen
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<!-- Jährliches Einkommen -->
<p class="mb-3">
<strong>Jährliches Einkommen:</strong>
<span class="view-mode">
{% if destinataer.jaehrliches_einkommen %}
<span class="text-primary fw-bold">€{{ destinataer.jaehrliches_einkommen|floatformat:2 }}</span>
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="number" name="jaehrliches_einkommen" value="{{ destinataer.jaehrliches_einkommen }}" class="form-control edit-mode" style="display: none;" step="0.01" placeholder="0.00">
</p>
<!-- Vermögen -->
<p class="mb-3">
<strong>Vermögen:</strong>
<span class="view-mode">
{% if destinataer.vermoegen %}
€{{ destinataer.vermoegen|floatformat:2 }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="number" name="vermoegen" value="{{ destinataer.vermoegen }}" class="form-control edit-mode" style="display: none;" step="0.01" placeholder="0.00">
</p>
<!-- Haushaltsgröße -->
<p class="mb-3">
<strong>Haushaltsgröße:</strong>
<span class="view-mode">
{% if destinataer.haushaltsgroesse %}
{{ destinataer.haushaltsgroesse }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="number" name="haushaltsgroesse" value="{{ destinataer.haushaltsgroesse }}" class="form-control edit-mode" style="display: none;" min="1" placeholder="1">
</p>
</div>
<div class="col-md-6">
<!-- Finanzielle Notlage -->
<p class="mb-3">
<strong>Finanzielle Notlage:</strong>
<span class="view-mode">
{% if destinataer.finanzielle_notlage %}
<span class="badge bg-danger">
<i class="fas fa-exclamation-triangle me-1"></i>Ja
</span>
{% else %}
<span class="badge bg-success">
<i class="fas fa-check me-1"></i>Nein
</span>
{% endif %}
</span>
<div class="edit-mode" style="display: none;">
<div class="form-check">
<input type="checkbox" name="finanzielle_notlage" id="finanzielle_notlage" class="form-check-input" {% if destinataer.finanzielle_notlage %}checked{% endif %}>
<label class="form-check-label" for="finanzielle_notlage">Finanzielle Notlage</label>
</div>
</div>
</p>
<!-- Vierteljährlicher Betrag -->
<p class="mb-3">
<strong>Vierteljährlicher Betrag:</strong>
<span class="view-mode">
{% if destinataer.vierteljaehrlicher_betrag %}
<span class="fw-bold">€{{ destinataer.vierteljaehrlicher_betrag|floatformat:2 }}</span>
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="number" name="vierteljaehrlicher_betrag" value="{{ destinataer.vierteljaehrlicher_betrag }}" class="form-control edit-mode" style="display: none;" step="0.01" placeholder="0.00">
</p>
<!-- Unterstützung bestätigt -->
<p class="mb-3">
<strong>Unterstützung bestätigt:</strong>
<span class="view-mode">
{% if destinataer.unterstuetzung_bestaetigt %}
<span class="badge bg-success">Ja</span>
{% else %}
<span class="badge bg-secondary">Nein</span>
{% endif %}
</span>
<div class="edit-mode" style="display: none;">
<div class="form-check">
<input type="checkbox" name="unterstuetzung_bestaetigt" id="unterstuetzung_bestaetigt" class="form-check-input" {% if destinataer.unterstuetzung_bestaetigt %}checked{% endif %}>
<label class="form-check-label" for="unterstuetzung_bestaetigt">Unterstützung bestätigt</label>
</div>
</div>
</p>
<!-- Standardkonto -->
<p class="mb-3">
<strong>Standardkonto:</strong>
<span class="view-mode">
{% if destinataer.standard_konto %}
{{ destinataer.standard_konto }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="text" name="standard_konto" value="{{ destinataer.standard_konto }}" class="form-control edit-mode" style="display: none;" placeholder="Kontobezeichnung">
</p>
</div>
</div>
</div>
</div>
<!-- Studiennachweis / Voraussetzungen -->
<div class="card shadow mb-4">
<div class="card-header bg-light">
<h5 class="card-title mb-0">
<i class="fas fa-graduation-cap me-2"></i>Studiennachweis & Voraussetzungen
</h5>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-6">
<!-- Ist Abkömmling -->
<p class="mb-3">
<strong>Abkömmling gem. Satzung:</strong>
<span class="view-mode">
{% if destinataer.ist_abkoemmling %}
<span class="badge bg-success">Ja</span>
{% else %}
<span class="badge bg-secondary">Nein</span>
{% endif %}
</span>
<div class="edit-mode" style="display: none;">
<div class="form-check">
<input type="checkbox" name="ist_abkoemmling" id="ist_abkoemmling" class="form-check-input" {% if destinataer.ist_abkoemmling %}checked{% endif %}>
<label class="form-check-label" for="ist_abkoemmling">Ist Abkömmling</label>
</div>
</div>
</p>
<!-- Studiennachweis erforderlich -->
<p class="mb-3">
<strong>Studiennachweis erforderlich:</strong>
<span class="view-mode">
{% if destinataer.studiennachweis_erforderlich %}
<span class="badge bg-info">Ja</span>
{% else %}
<span class="badge bg-secondary">Nein</span>
{% endif %}
</span>
<div class="edit-mode" style="display: none;">
<div class="form-check">
<input type="checkbox" name="studiennachweis_erforderlich" id="studiennachweis_erforderlich" class="form-check-input" {% if destinataer.studiennachweis_erforderlich %}checked{% endif %}>
<label class="form-check-label" for="studiennachweis_erforderlich">Studiennachweis erforderlich</label>
</div>
</div>
</p>
</div>
<div class="col-md-6">
<!-- Letzter Studiennachweis -->
<p class="mb-3">
<strong>Letzter Nachweis:</strong>
<span class="view-mode">
{% if destinataer.letzter_studiennachweis %}
{{ destinataer.letzter_studiennachweis|date:"d.m.Y" }}
{% else %}
<em class="text-muted">Nicht angegeben</em>
{% endif %}
</span>
<input type="date" name="letzter_studiennachweis" value="{% if destinataer.letzter_studiennachweis %}{{ destinataer.letzter_studiennachweis|date:'Y-m-d' }}{% endif %}" class="form-control edit-mode" style="display: none;">
</p>
</div>
</div>
</div>
</div>
<!-- Notes Section -->
<div class="card shadow mb-4">
<div class="card-header bg-secondary text-white">
<h5 class="card-title mb-0">
<i class="fas fa-sticky-note me-2"></i>Notizen
</h5>
</div>
<div class="card-body">
<p class="mb-0">
<span class="view-mode">
{% if destinataer.notizen %}
{{ destinataer.notizen|linebreaks }}
{% else %}
<em class="text-muted">Keine Notizen vorhanden</em>
{% endif %}
</span>
<textarea name="notizen" class="form-control edit-mode" style="display: none;" rows="4" placeholder="Notizen und Bemerkungen">{{ destinataer.notizen }}</textarea>
</p>
</div>
</div>
</form>
<!-- Förderungen -->
{% if foerderungen %}
<div class="card shadow mb-4">
<div class="card-header bg-secondary text-white">
<h5 class="card-title mb-0">
<i class="fas fa-gift me-2"></i>Förderungen ({{ foerderungen.count }})
</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover">
<thead class="table-light">
<tr>
<th>Jahr</th>
<th>Betrag</th>
<th>Kategorie</th>
<th>Status</th>
<th>Verwendungsnachweis</th>
<th>Aktionen</th>
</tr>
</thead>
<tbody>
{% for foerderung in foerderungen %}
<tr>
<td>{{ foerderung.jahr }}</td>
<td><span class="text-success fw-bold">€{{ foerderung.betrag|floatformat:2 }}</span></td>
<td>{{ foerderung.get_kategorie_display }}</td>
<td>
{% if foerderung.status == 'bewilligt' %}
<span class="badge bg-success">Bewilligt</span>
{% elif foerderung.status == 'abgelehnt' %}
<span class="badge bg-danger">Abgelehnt</span>
{% elif foerderung.status == 'in_bearbeitung' %}
<span class="badge bg-warning">In Bearbeitung</span>
{% else %}
<span class="badge bg-secondary">{{ foerderung.get_status_display }}</span>
{% endif %}
</td>
<td>
{% if foerderung.verwendungsnachweis %}
<span class="badge bg-success">
<i class="fas fa-check me-1"></i>Ja
</span>
{% else %}
<span class="badge bg-warning">
<i class="fas fa-times me-1"></i>Nein
</span>
{% endif %}
</td>
<td>
<a href="{% url 'stiftung:foerderung_detail' pk=foerderung.pk %}"
class="btn btn-sm btn-outline-primary">
<i class="fas fa-eye"></i>
</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% endif %}
<!-- Unterstützungen -->
{% if unterstuetzungen %}
<div class="card shadow mb-4">
<div class="card-header bg-info text-white">
<div class="d-flex justify-content-between align-items-center">
<h5 class="card-title mb-0">
<i class="fas fa-hand-holding-usd me-2"></i>Unterstützungen ({{ unterstuetzungen.count }})
</h5>
<a href="{% url 'stiftung:unterstuetzung_create' %}?destinataer={{ destinataer.pk }}"
class="btn btn-light btn-sm">
<i class="fas fa-plus me-1"></i>Neue Unterstützung
</a>
</div>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-hover">
<thead class="table-light">
<tr>
<th>Fällig am</th>
<th>Betrag</th>
<th>Status</th>
<th>Beschreibung</th>
<th>Aktionen</th>
</tr>
</thead>
<tbody>
{% for unterstuetzung in unterstuetzungen %}
<tr>
<td>{{ unterstuetzung.faellig_am|date:"d.m.Y" }}</td>
<td><span class="text-success fw-bold">€{{ unterstuetzung.betrag|floatformat:2 }}</span></td>
<td>
{% if unterstuetzung.status == 'ausgezahlt' %}
<span class="badge bg-success">Ausgezahlt</span>
{% elif unterstuetzung.status == 'in_bearbeitung' %}
<span class="badge bg-warning">In Bearbeitung</span>
{% elif unterstuetzung.status == 'geplant' %}
<span class="badge bg-secondary">Geplant</span>
{% else %}
<span class="badge bg-danger">{{ unterstuetzung.get_status_display }}</span>
{% endif %}
</td>
<td>{{ unterstuetzung.beschreibung|truncatechars:40 }}</td>
<td>
<a href="{% url 'stiftung:unterstuetzung_detail' pk=unterstuetzung.pk %}"
class="btn btn-sm btn-outline-primary">
<i class="fas fa-eye"></i>
</a>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
</div>
</div>
{% endif %}
<!-- Verknüpfte Dokumente -->
<div class="card shadow mb-4">
<div class="card-header bg-success text-white d-flex justify-content-between align-items-center">
<h5 class="card-title mb-0">
<i class="fas fa-file-alt me-2"></i>Verknüpfte Dokumente
</h5>
<a href="{% url 'stiftung:dokument_management' %}" class="btn btn-light btn-sm">
<i class="fas fa-plus me-1"></i>Dokument verknüpfen
</a>
</div>
<div class="card-body">
{% if verknuepfte_dokumente %}
<div class="table-responsive">
<table class="table table-hover">
<thead>
<tr>
<th>Dokument</th>
<th>Kontext</th>
<th>Beschreibung</th>
<th>Aktionen</th>
</tr>
</thead>
<tbody>
{% for dokument in verknuepfte_dokumente %}
<tr>
<td>
<strong>{{ dokument.titel }}</strong>
<br>
<small class="text-muted">ID: {{ dokument.paperless_document_id }}</small>
</td>
<td>
<span class="badge bg-secondary">{{ dokument.get_kontext_display }}</span>
</td>
<td>
{% if dokument.beschreibung %}
{{ dokument.beschreibung|truncatewords:10 }}
{% else %}
<span class="text-muted">Keine Beschreibung</span>
{% endif %}
</td>
<td>
<div class="btn-group" role="group">
<a href="{{ dokument.get_paperless_url }}" target="_blank" class="btn btn-sm btn-outline-primary" title="In Paperless öffnen">
<i class="fas fa-external-link-alt"></i>
</a>
<a href="{{ dokument.get_paperless_thumbnail_url }}" target="_blank" class="btn btn-sm btn-outline-info" title="Thumbnail anzeigen">
<i class="fas fa-image"></i>
</a>
<a href="{% url 'stiftung:dokument_update' dokument.pk %}" class="btn btn-sm btn-outline-warning" title="Bearbeiten">
<i class="fas fa-edit"></i>
</a>
<a href="{% url 'stiftung:dokument_delete' dokument.pk %}" class="btn btn-sm btn-outline-danger" title="Verknüpfung löschen">
<i class="fas fa-unlink"></i>
</a>
</div>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
{% else %}
<div class="text-center py-4">
<i class="fas fa-file-alt fa-3x text-muted mb-3"></i>
<h5 class="text-muted">Keine Dokumente verknüpft</h5>
<p class="text-muted">Verknüpfen Sie Dokumente aus Paperless mit diesem Destinatär.</p>
<a href="{% url 'stiftung:dokument_management' %}" class="btn btn-success">
<i class="fas fa-plus me-2"></i>Erstes Dokument verknüpfen
</a>
</div>
{% endif %}
</div>
</div>
<!-- Notizen -->
<div class="card shadow mb-4">
<div class="card-header bg-light d-flex justify-content-between align-items-center">
<h5 class="card-title mb-0">
<i class="fas fa-sticky-note me-2"></i>Notizen
</h5>
<a class="btn btn-sm btn-primary" href="{% url 'stiftung:destinataer_notiz_create' pk=destinataer.pk %}">
<i class="fas fa-plus me-1"></i>Notiz hinzufügen
</a>
</div>
<div class="card-body">
{% if notizen_eintraege %}
<div class="list-group">
{% for n in notizen_eintraege %}
<div class="list-group-item">
<div class="d-flex justify-content-between">
<div>
<strong>{{ n.erstellt_am|date:"d.m.Y H:i" }}</strong>
{% if n.erstellt_von %}<span class="text-muted">— {{ n.erstellt_von.username }}</span>{% endif %}
</div>
{% if n.datei %}
<a href="{{ n.datei.url }}" target="_blank" class="btn btn-sm btn-outline-secondary"><i class="fas fa-paperclip"></i> Anhang</a>
{% endif %}
</div>
{% if n.titel %}<div class="mt-1"><em>{{ n.titel }}</em></div>{% endif %}
{% if n.text %}<div class="mt-1">{{ n.text|linebreaks }}</div>{% endif %}
</div>
{% endfor %}
</div>
{% else %}
<p class="text-muted mb-0">Keine Notizen vorhanden.</p>
{% endif %}
</div>
</div>
</div>
<!-- Sidebar -->
<div class="col-lg-4">
<!-- Statistiken -->
<div class="card shadow mb-4">
<div class="card-header bg-primary text-white">
<h6 class="card-title mb-0">
<i class="fas fa-chart-bar me-2"></i>Statistiken
</h6>
</div>
<div class="card-body">
<div class="text-center">
<div class="row">
<div class="col-6">
<div class="border-end">
<h4 class="text-primary">{{ foerderungen.count }}</h4>
<small class="text-muted">Förderungen</small>
</div>
</div>
<div class="col-6">
<h4 class="text-success">
{% if foerderungen %}
{% with total_betrag=foerderungen|length %}
€{{ total_betrag|floatformat:0 }}
{% endwith %}
{% else %}
€0
{% endif %}
</h4>
<small class="text-muted">Gesamtbetrag</small>
</div>
</div>
</div>
</div>
</div>
<!-- Aktionen -->
<div class="card shadow mb-4">
<div class="card-header bg-success text-white">
<h6 class="card-title mb-0">
<i class="fas fa-tools me-2"></i>Aktionen
</h6>
</div>
<div class="card-body">
<div class="d-grid gap-2">
<a href="{% url 'stiftung:destinataer_update' pk=destinataer.pk %}" class="btn btn-warning">
<i class="fas fa-edit me-2"></i>Bearbeiten
</a>
<a href="{% url 'stiftung:destinataer_export' pk=destinataer.pk %}" class="btn btn-success">
<i class="fas fa-download me-2"></i>Export
</a>
<a href="{% url 'stiftung:destinataer_delete' pk=destinataer.pk %}" class="btn btn-danger">
<i class="fas fa-trash me-2"></i>Löschen
</a>
</div>
</div>
</div>
<!-- Informationen -->
<div class="card shadow">
<div class="card-header bg-info text-white">
<h6 class="card-title mb-0">
<i class="fas fa-info-circle me-2"></i>Informationen
</h6>
</div>
<div class="card-body">
<p><strong>ID:</strong> {{ destinataer.id }}</p>
<p><strong>Erstellt:</strong> {{ destinataer.id|slice:":8" }}</p>
{% if destinataer.aktiv %}
<p><strong>Status:</strong> <span class="badge bg-success">Aktiv</span></p>
{% else %}
<p><strong>Status:</strong> <span class="badge bg-secondary">Inaktiv</span></p>
{% endif %}
</div>
</div>
</div>
</div>
</div>
</div>
{% endblock %}
{% block javascript %}
<style>
.edit-mode input,
.edit-mode textarea,
.edit-mode select {
margin-top: 0.25rem;
}
.edit-mode .form-check {
margin-top: 0.25rem;
}
.edit-mode-active .view-mode {
display: none !important;
}
.edit-mode-active .edit-mode {
display: block !important;
}
.card-body p {
margin-bottom: 1rem;
}
.edit-notification {
position: fixed;
top: 20px;
right: 20px;
z-index: 1050;
max-width: 300px;
}
</style>
<script>
let originalFormData = {};
let isEditMode = false;
// Store original form data when page loads
document.addEventListener('DOMContentLoaded', function() {
storeOriginalData();
});
function storeOriginalData() {
const form = document.getElementById('edit-form');
const formData = new FormData(form);
originalFormData = {};
// Store all form field values
for (let [key, value] of formData.entries()) {
originalFormData[key] = value;
}
// Also store checkbox states
const checkboxes = form.querySelectorAll('input[type="checkbox"]');
checkboxes.forEach(checkbox => {
originalFormData[checkbox.name] = checkbox.checked;
});
}
function enableEditMode() {
isEditMode = true;
// Hide view elements and show edit elements
document.body.classList.add('edit-mode-active');
// Toggle buttons
document.getElementById('edit-btn').style.display = 'none';
document.getElementById('save-btn').style.display = 'inline-block';
document.getElementById('cancel-btn').style.display = 'inline-block';
// Show notification
showNotification('Bearbeitungsmodus aktiviert', 'info');
// Focus first input
const firstInput = document.querySelector('.edit-mode input, .edit-mode textarea, .edit-mode select');
if (firstInput) {
firstInput.focus();
}
}
function cancelEdit() {
// Restore original values
const form = document.getElementById('edit-form');
// Restore text inputs, textareas, and selects
Object.keys(originalFormData).forEach(key => {
const element = form.querySelector(`[name="${key}"]`);
if (element) {
if (element.type === 'checkbox') {
element.checked = originalFormData[key];
} else {
element.value = originalFormData[key] || '';
}
}
});
disableEditMode();
showNotification('Änderungen verworfen', 'warning');
}
function disableEditMode() {
isEditMode = false;
// Show view elements and hide edit elements
document.body.classList.remove('edit-mode-active');
// Toggle buttons
document.getElementById('edit-btn').style.display = 'inline-block';
document.getElementById('save-btn').style.display = 'none';
document.getElementById('cancel-btn').style.display = 'none';
}
function saveChanges() {
const form = document.getElementById('edit-form');
const formData = new FormData(form);
// Show loading state
const saveBtn = document.getElementById('save-btn');
const originalText = saveBtn.innerHTML;
saveBtn.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>Speichern...';
saveBtn.disabled = true;
// Submit form via AJAX
fetch(form.action, {
method: 'POST',
body: formData,
headers: {
'X-Requested-With': 'XMLHttpRequest',
}
})
.then(response => response.json())
.then(data => {
if (data.success) {
// Update the page with new data
location.reload(); // Simple approach - reload the page to show updated data
} else {
// Show errors
showNotification('Fehler beim Speichern: ' + (data.error || 'Unbekannter Fehler'), 'danger');
// Reset button
saveBtn.innerHTML = originalText;
saveBtn.disabled = false;
}
})
.catch(error => {
console.error('Error:', error);
showNotification('Fehler beim Speichern der Änderungen', 'danger');
// Reset button
saveBtn.innerHTML = originalText;
saveBtn.disabled = false;
});
}
function showNotification(message, type = 'info') {
// Remove existing notifications
const existing = document.querySelector('.edit-notification');
if (existing) {
existing.remove();
}
// Create notification
const notification = document.createElement('div');
notification.className = `alert alert-${type} alert-dismissible fade show edit-notification`;
notification.innerHTML = `
${message}
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
`;
document.body.appendChild(notification);
// Auto-remove after 3 seconds
setTimeout(() => {
if (notification.parentNode) {
notification.remove();
}
}, 3000);
}
// Keyboard shortcuts
document.addEventListener('keydown', function(e) {
if (isEditMode) {
// ESC to cancel
if (e.key === 'Escape') {
cancelEdit();
}
// Ctrl+S to save (prevent default browser save)
if (e.ctrlKey && e.key === 's') {
e.preventDefault();
saveChanges();
}
}
});
</script>
{% endblock %}