earthjasonlin/mailova
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(dashboard): extract labels/data from tuple list for Chart.js

Browse Source
This commit is contained in:
Zichao Lin
2026-07-06 22:13:46 +08:00
parent f448a900f5
commit 643f1dc35a
1 changed files with 18 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
app/templates/dashboard.html
View File

@@ -77,29 +77,24 @@
</div>
<script>
(function() {
var labels, data, colors, elId;
{% for stat in sent_country_stats %}
labels = {{ stat.labels|tojson }};
data = {{ stat.data|tojson }};
colors = labels.map(function(l) { return '#f59e0b'; });
elId = 'chart-sent';
new Chart(document.getElementById(elId), {
var labels = {{ sent_country_stats|map(attribute=0)|list|tojson }};
var data = {{ sent_country_stats|map(attribute=1)|list|tojson }};
if (labels.length) {
new Chart(document.getElementById('chart-sent'), {
type: 'bar',
data: { labels: labels, datasets: [{ data: data, backgroundColor: colors, borderRadius: 4 }] },
data: { labels: labels, datasets: [{ data: data, backgroundColor: '#f59e0b', borderRadius: 4 }] },
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } } } }
});
{% endfor %}
{% for stat in received_country_stats %}
labels = {{ stat.labels|tojson }};
data = {{ stat.data|tojson }};
colors = labels.map(function(l) { return '#8b5cf6'; });
elId = 'chart-received';
new Chart(document.getElementById(elId), {
}
var rlabels = {{ received_country_stats|map(attribute=0)|list|tojson }};
var rdata = {{ received_country_stats|map(attribute=1)|list|tojson }};
if (rlabels.length) {
new Chart(document.getElementById('chart-received'), {
type: 'bar',
data: { labels: labels, datasets: [{ data: data, backgroundColor: colors, borderRadius: 4 }] },
data: { labels: rlabels, datasets: [{ data: rdata, backgroundColor: '#8b5cf6', borderRadius: 4 }] },
options: { responsive: true, plugins: { legend: { display: false } }, scales: { y: { beginAtZero: true, ticks: { stepSize: 1 } } } }
});
{% endfor %}
}
})();
</script>
{% endif %}