Remmer/stiftung-management-system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add IBAN and Verwendungszweck columns to support list and fix chart growing bug

Browse Source 
- Enhanced 'Alle Unterstützungen' view with IBAN and Verwendungszweck columns for better payment tracking
- Updated export functions to handle both legacy 'selected_fields' and new 'fields' parameters
- Added IBAN and Verwendungszweck to default export field selections
- Improved destinataer list UI by adding Status column and removing obsolete study proof field
- Fixed infinite growing animation bug in 'Größen der Grundstücke (Top 30)' chart by replacing Chart.js with CSS-based implementation
- Removed Bootstrap h-100 class conflicts that caused chart resize loops
This commit is contained in:
Jan Remmer Siebels
2025-09-24 22:13:27 +02:00
parent d3ed13dda0
commit b00cf62d87
4 changed files with 106 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/templates/stiftung/destinataer_list.html
View File

@@ -100,7 +100,7 @@
<a href="?sort=vierteljaehrlicher_betrag&dir={% if sort == 'vierteljaehrlicher_betrag' and dir != 'desc' %}desc{% else %}asc{% endif %}{% if search_query %}&search={{ search_query }}{% endif %}{% if familienzweig_filter %}&familienzweig={{ familienzweig_filter }}{% endif %}{% if berufsgruppe_filter %}&berufsgruppe={{ berufsgruppe_filter }}{% endif %}{% if aktiv_filter %}&aktiv={{ aktiv_filter }}{% endif %}">Vierteljährlicher Betrag</a>
</th>
<th>
<a href="?sort=letzter_studiennachweis&dir={% if sort == 'letzter_studiennachweis' and dir != 'desc' %}desc{% else %}asc{% endif %}{% if search_query %}&search={{ search_query }}{% endif %}{% if familienzweig_filter %}&familienzweig={{ familienzweig_filter }}{% endif %}{% if berufsgruppe_filter %}&berufsgruppe={{ berufsgruppe_filter }}{% endif %}{% if aktiv_filter %}&aktiv={{ aktiv_filter }}{% endif %}">Letzter Studiennachweis</a>
<a href="?sort=aktiv&dir={% if sort == 'aktiv' and dir != 'desc' %}desc{% else %}asc{% endif %}{% if search_query %}&search={{ search_query }}{% endif %}{% if familienzweig_filter %}&familienzweig={{ familienzweig_filter }}{% endif %}{% if berufsgruppe_filter %}&berufsgruppe={{ berufsgruppe_filter }}{% endif %}{% if aktiv_filter %}&aktiv={{ aktiv_filter }}{% endif %}">Status</a>
</th>
<th>
<a href="?sort=unterstuetzung_bestaetigt&dir={% if sort == 'unterstuetzung_bestaetigt' and dir != 'desc' %}desc{% else %}asc{% endif %}{% if search_query %}&search={{ search_query }}{% endif %}{% if familienzweig_filter %}&familienzweig={{ familienzweig_filter }}{% endif %}{% if berufsgruppe_filter %}&berufsgruppe={{ berufsgruppe_filter }}{% endif %}{% if aktiv_filter %}&aktiv={{ aktiv_filter }}{% endif %}">Unterstützung bestätigt</a>
@@ -135,10 +135,10 @@
{% endif %}
</td>
<td>
{% if destinataer.letzter_studiennachweis %}
<span class="badge bg-info">{{ destinataer.letzter_studiennachweis|date:"d.m.Y" }}</span>
{% if destinataer.aktiv %}
<span class="badge bg-success"><i class="fas fa-check-circle me-1"></i>Aktiv</span>
{% else %}
<span class="text-muted">-</span>
<span class="badge bg-secondary"><i class="fas fa-pause-circle me-1"></i>Inaktiv</span>
{% endif %}
</td>
<td>

78
app/templates/stiftung/land_list.html
View File

@@ -99,14 +99,18 @@
</div>
</div>
<div class="col-lg-6 mb-3">
<div class="card shadow h-100">
<div class="card shadow">
<div class="card-header py-3 d-flex justify-content-between align-items-center">
<h6 class="m-0 font-weight-bold text-primary">
<i class="fas fa-chart-bar me-2"></i>Größen der Grundstücke (Top 30)
</h6>
</div>
<div class="card-body">
<canvas id="sizesChart" height="140"></canvas>
<div style="height: 140px; overflow: hidden;">
<div id="sizesChart" style="display: flex; align-items: end; height: 100%; gap: 2px; padding: 5px;">
<!-- Simple CSS bar chart will be populated by JavaScript -->
</div>
</div>
</div>
</div>
</div>
@@ -395,42 +399,50 @@
console.log('usageChart canvas not found');
}
// Bar chart for sizes
const ctx = document.getElementById('sizesChart');
if (ctx) {
console.log('Found sizesChart canvas');
// Simple CSS bar chart for sizes (no Chart.js)
const chartContainer = document.getElementById('sizesChart');
if (chartContainer) {
console.log('Found sizesChart container');
const labels = JSON.parse('{{ size_chart_labels_json|escapejs }}');
const dataVals = JSON.parse('{{ size_chart_values_json|escapejs }}');
console.log('Bar chart data:', {labels: labels.length, values: dataVals.length});
new Chart(ctx, {
type: 'bar',
data: {
labels: labels,
datasets: [{
label: 'Größe (qm)',
data: dataVals,
backgroundColor: 'rgba(0, 104, 55, 0.6)',
borderColor: '#006837',
borderWidth: 2
}]
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: {
x: { ticks: { autoSkip: true, maxTicksLimit: 10 } },
y: { beginAtZero: true }
},
plugins: {
legend: { display: false },
tooltip: { callbacks: { label: function(ctx) { return ctx.parsed.y.toLocaleString() + ' qm'; } } }
}
}
});
console.log('Bar chart created successfully');
if (dataVals.length > 0) {
const maxValue = Math.max(...dataVals);
chartContainer.innerHTML = ''; // Clear container
// Create bars
dataVals.forEach((value, index) => {
const barHeight = (value / maxValue) * 120; // Max height 120px
const bar = document.createElement('div');
bar.style.cssText = `
background-color: rgba(0, 104, 55, 0.8);
border: 1px solid #006837;
width: ${Math.max(100 / dataVals.length - 1, 8)}%;
height: ${barHeight}px;
min-height: 2px;
display: flex;
align-items: end;
justify-content: center;
font-size: 10px;
color: white;
text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
cursor: pointer;
`;
// Add tooltip on hover
bar.title = `${labels[index] || 'N/A'}: ${value.toLocaleString()} qm`;
chartContainer.appendChild(bar);
});
console.log('CSS bar chart created successfully');
} else {
chartContainer.innerHTML = '<div style="text-align: center; color: #666; padding: 20px;">Keine Daten verfügbar</div>';
}
} else {
console.log('sizesChart canvas not found');
console.log('sizesChart container not found');
}
} catch (e) {
console.error('Chart initialization error:', e);

22
app/templates/stiftung/unterstuetzungen_all.html
View File

@@ -117,7 +117,7 @@
<label class="form-check-label" for="field_empfaenger_name">Empfänger Name</label>
</div>
<div class="form-check form-check-sm">
<input class="form-check-input field-checkbox" type="checkbox" name="fields" value="verwendungszweck" id="field_verwendungszweck">
<input class="form-check-input field-checkbox" type="checkbox" name="fields" value="verwendungszweck" id="field_verwendungszweck" checked>
<label class="form-check-label" for="field_verwendungszweck">Verwendungszweck</label>
</div>
</div>
@@ -275,6 +275,8 @@
<th>Destinatär</th>
<th>Betrag</th>
<th>Fällig am</th>
<th>IBAN</th>
<th>Verwendungszweck</th>
<th>Konto</th>
<th>Status</th>
<th>Beschreibung</th>
@@ -296,6 +298,20 @@
</td>
<td>€{{ unterstuetzung.betrag|floatformat:2 }}</td>
<td>{{ unterstuetzung.faellig_am|date:"d.m.Y" }}</td>
<td>
{% if unterstuetzung.empfaenger_iban %}
<code class="text-dark">{{ unterstuetzung.empfaenger_iban }}</code>
{% else %}
<span class="text-muted">-</span>
{% endif %}
</td>
<td>
{% if unterstuetzung.verwendungszweck %}
{{ unterstuetzung.verwendungszweck|truncatechars:30 }}
{% else %}
<span class="text-muted">-</span>
{% endif %}
</td>
<td>
<span class="badge bg-secondary">{{ unterstuetzung.konto }}</span>
</td>
@@ -353,8 +369,8 @@ function selectDefaultFields() {
// Check default fields
const defaultFields = [
'destinataer_name', 'betrag', 'faellig_am', 'status',
'empfaenger_iban', 'empfaenger_name', 'beschreibung'
'destinataer_name', 'betrag', 'faellig_am', 'empfaenger_iban', 'verwendungszweck',
'status', 'empfaenger_name', 'beschreibung'
];
defaultFields.forEach(fieldName => {