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