User requested the create form to look exactly like the detail page. Now uses the same two-column table-based card layout with matching card headers, gradient header bar, and field organization as the Stammdaten tab on the detail page. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
261 lines
14 KiB
HTML
261 lines
14 KiB
HTML
{% extends 'base.html' %}
|
|
{% load static %}
|
|
{% load help_tags %}
|
|
|
|
{% block title %}{{ title }} - Stiftungsverwaltung{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="container-fluid px-4">
|
|
|
|
{# ── Header (mirrors detail page style) ── #}
|
|
<div class="card shadow-sm mb-4 border-0" style="background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);">
|
|
<div class="card-body py-3">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto">
|
|
<div class="rounded-circle bg-primary text-white d-flex align-items-center justify-content-center" style="width:56px;height:56px;font-size:1.4rem;">
|
|
<i class="fas fa-user-plus"></i>
|
|
</div>
|
|
</div>
|
|
<div class="col">
|
|
<h4 class="mb-1">{{ title }}</h4>
|
|
<div class="text-muted small">Alle Felder ausfuellen und speichern</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<a href="{% url 'stiftung:destinataer_list' %}" class="btn btn-outline-secondary btn-sm">
|
|
<i class="fas fa-arrow-left me-1"></i>Zurueck
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<form method="post" novalidate>
|
|
{% csrf_token %}
|
|
|
|
{% if form.errors %}
|
|
<div class="alert alert-danger alert-dismissible fade show mb-3" role="alert">
|
|
<i class="fas fa-exclamation-triangle me-2"></i>Bitte korrigieren Sie die markierten Felder.
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="row g-3">
|
|
{# ── Left Column ── #}
|
|
<div class="col-lg-6">
|
|
{# Personal Data #}
|
|
<div class="card shadow-sm mb-3">
|
|
<div class="card-header py-2"><i class="fas fa-user me-2 text-primary"></i><strong>Persoenliche Daten</strong></div>
|
|
<div class="card-body py-2">
|
|
<table class="table table-sm table-borderless mb-0">
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-muted" style="width:140px;">Vorname *</td>
|
|
<td>
|
|
{{ form.vorname }}
|
|
{% if form.vorname.errors %}<div class="invalid-feedback d-block">{{ form.vorname.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Nachname *</td>
|
|
<td>
|
|
{{ form.nachname }}
|
|
{% if form.nachname.errors %}<div class="invalid-feedback d-block">{{ form.nachname.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Geburtsdatum</td>
|
|
<td>
|
|
{{ form.geburtsdatum }}
|
|
{% if form.geburtsdatum.errors %}<div class="invalid-feedback d-block">{{ form.geburtsdatum.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Familienzweig</td>
|
|
<td>
|
|
{{ form.familienzweig }}
|
|
{% if form.familienzweig.errors %}<div class="invalid-feedback d-block">{{ form.familienzweig.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Berufsgruppe</td>
|
|
<td>
|
|
{{ form.berufsgruppe }}
|
|
{% if form.berufsgruppe.errors %}<div class="invalid-feedback d-block">{{ form.berufsgruppe.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
{# Contact & Address #}
|
|
<div class="card shadow-sm mb-3">
|
|
<div class="card-header py-2"><i class="fas fa-address-book me-2 text-info"></i><strong>Kontakt & Adresse</strong></div>
|
|
<div class="card-body py-2">
|
|
<table class="table table-sm table-borderless mb-0">
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-muted" style="width:140px;">E-Mail</td>
|
|
<td>
|
|
{{ form.email }}
|
|
{% if form.email.errors %}<div class="invalid-feedback d-block">{{ form.email.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Telefon</td>
|
|
<td>
|
|
{{ form.telefon }}
|
|
{% if form.telefon.errors %}<div class="invalid-feedback d-block">{{ form.telefon.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">IBAN</td>
|
|
<td>
|
|
{{ form.iban }}
|
|
{% if form.iban.errors %}<div class="invalid-feedback d-block">{{ form.iban.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Strasse</td>
|
|
<td>
|
|
{{ form.strasse }}
|
|
{% if form.strasse.errors %}<div class="invalid-feedback d-block">{{ form.strasse.errors.0 }}</div>{% endif %}
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">PLZ / Ort</td>
|
|
<td>
|
|
<div class="row g-2">
|
|
<div class="col-4">{{ form.plz }}</div>
|
|
<div class="col-8">{{ form.ort }}</div>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{# ── Right Column ── #}
|
|
<div class="col-lg-6">
|
|
{# Financial #}
|
|
<div class="card shadow-sm mb-3">
|
|
<div class="card-header py-2"><i class="fas fa-euro-sign me-2 text-warning"></i><strong>Finanzen & Foerderung</strong></div>
|
|
<div class="card-body py-2">
|
|
<table class="table table-sm table-borderless mb-0">
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-muted" style="width:180px;">Quartalsbetrag</td>
|
|
<td>{{ form.vierteljaehrlicher_betrag }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Monatl. Bezuege</td>
|
|
<td>{{ form.monatliche_bezuege }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Jaehrl. Einkommen</td>
|
|
<td>{{ form.jaehrliches_einkommen }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Vermoegen</td>
|
|
<td>{{ form.vermoegen }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Haushaltsgroesse</td>
|
|
<td>{{ form.haushaltsgroesse }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Standardkonto</td>
|
|
<td>{{ form.standard_konto }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Finanz. Notlage</td>
|
|
<td>
|
|
<div class="form-check">{{ form.finanzielle_notlage }}<label class="form-check-label" for="{{ form.finanzielle_notlage.id_for_label }}">Ja</label></div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Unterstuetzung best.</td>
|
|
<td>
|
|
<div class="form-check">{{ form.unterstuetzung_bestaetigt }}<label class="form-check-label" for="{{ form.unterstuetzung_bestaetigt.id_for_label }}">Ja</label></div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
{# Study & Prerequisites #}
|
|
<div class="card shadow-sm mb-3">
|
|
<div class="card-header py-2"><i class="fas fa-graduation-cap me-2 text-secondary"></i><strong>Studium & Voraussetzungen</strong></div>
|
|
<div class="card-body py-2">
|
|
<table class="table table-sm table-borderless mb-0">
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-muted" style="width:180px;">Abkoemmling gem. Satzung</td>
|
|
<td>
|
|
<div class="form-check">{{ form.ist_abkoemmling }}<label class="form-check-label" for="{{ form.ist_abkoemmling.id_for_label }}">Ja</label></div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Ausbildungsstand</td>
|
|
<td>{{ form.ausbildungsstand }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Institution</td>
|
|
<td>{{ form.institution }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Studiennachweis erf.</td>
|
|
<td>
|
|
<div class="form-check">{{ form.studiennachweis_erforderlich }}<label class="form-check-label" for="{{ form.studiennachweis_erforderlich.id_for_label }}">Ja</label></div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="text-muted">Letzter Nachweis</td>
|
|
<td>{{ form.letzter_studiennachweis }}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
{# Description & Notes #}
|
|
<div class="card shadow-sm mb-3">
|
|
<div class="card-header py-2"><i class="fas fa-sticky-note me-2 text-secondary"></i><strong>Beschreibung & Notizen</strong></div>
|
|
<div class="card-body py-2">
|
|
<div class="mb-2">
|
|
<small class="text-muted">Projektbeschreibung</small>
|
|
{{ form.projekt_beschreibung }}
|
|
</div>
|
|
<div class="mb-2">
|
|
<small class="text-muted">Notizen</small>
|
|
{{ form.notizen }}
|
|
</div>
|
|
<div class="form-check">
|
|
{{ form.aktiv }}
|
|
<label class="form-check-label" for="{{ form.aktiv.id_for_label }}">{{ form.aktiv.label }}</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{# ── Save bar ── #}
|
|
<div class="card shadow-sm mt-2 mb-4 border-0" style="background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);">
|
|
<div class="card-body py-3">
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<a href="{% url 'stiftung:destinataer_list' %}" class="btn btn-outline-secondary btn-sm">
|
|
<i class="fas fa-times me-1"></i>Abbrechen
|
|
</a>
|
|
<button type="submit" class="btn btn-success">
|
|
<i class="fas fa-save me-1"></i>Speichern
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
{% endblock %}
|