{% extends 'base.html' %}{% block content %}<p class="eyebrow">TELEMETRIA VPS</p><h1>CPU, pamięć i dysk</h1><section class="cards compact"><article><span>CPU teraz</span><strong>{{current.cpu_percent or 0}}%</strong></article><article><span>RAM teraz</span><strong>{{current.ram_percent or 0}}%</strong><small>{{current.ram_used_mb or 0}} / {{current.ram_total_mb or 0}} MB</small></article><article><span>Dysk teraz</span><strong>{{current.disk_percent or 0}}%</strong><small>{{ '%.1f'|format((current.disk_used_mb or 0) / 1024) }} / {{ '%.1f'|format((current.disk_total_mb or 0) / 1024) }} GB</small></article></section><section class="panel"><canvas id="system"></canvas></section><script>const d={{samples|tojson}};new Chart(document.getElementById('system'),{type:'line',data:{labels:d.map(x=>x.label),datasets:[{label:'CPU %',data:d.map(x=>x.cpu_percent),borderColor:'#60a5fa',tension:.25,pointRadius:0},{label:'RAM %',data:d.map(x=>x.ram_percent),borderColor:'#34d399',tension:.25,pointRadius:0},{label:'Dysk %',data:d.map(x=>x.disk_percent),borderColor:'#f2c34d',tension:.25,pointRadius:0}]},options:{plugins:{legend:{labels:{color:'#dce9fa'}}},scales:{x:{ticks:{color:'#8fa5c1',maxTicksLimit:12},grid:{color:'#1d3048'}},y:{min:0,max:100,ticks:{color:'#8fa5c1'},grid:{color:'#1d3048'}}}}});</script>{% endblock %}