{% extends "admin/layout.html" %}
{% block admin_title %}Dysk{% endblock %}
{% block admin_h1 %} Dysk{% endblock %}
{% block admin_sub %}Montowania i największe katalogi{% endblock %}
{% block admin_head %}
<style>
.disk-table { width:100%; font-size:0.8rem; border-collapse:collapse; margin-bottom:1rem; }
.disk-table th { background:#161b22; padding:0.35rem 0.5rem; text-align:left; border-bottom:2px solid var(--border);
 color:var(--muted); font-weight:600; }
.disk-table td { padding:0.28rem 0.5rem; border-bottom:1px solid #111; }
.disk-table tr:hover { background:#111; }
.disk-bar { display:inline-block; width:100px; height:6px; background:#21262d; border-radius:3px; margin-left:6px; vertical-align:middle; overflow:hidden; }
.disk-bar>div { height:100%; background:#58a6ff; }
.disk-bar.warn>div { background:#d29922; } .disk-bar.err>div { background:#f85149; }
</style>
{% endblock %}
{% block admin_content %}
<h3 style="margin:0.5rem 0">Montowania</h3>
<table class="disk-table"><thead><tr>
 <th>System plików</th><th>Rozmiar</th><th>Użyte</th><th>Wolne</th><th>%</th><th>Punkt montowania</th>
</tr></thead><tbody id="disk-tbody"></tbody></table>
<h3 style="margin:0.5rem 0">Największe katalogi na /</h3>
<table class="disk-table"><thead><tr><th>Rozmiar</th><th>Ścieżka</th></tr></thead>
<tbody id="top-tbody"></tbody></table>
<script>
async function loadDisk(){
 try{
 const r=await fetch('/admin/disk/api'); const d=await r.json();
 let html='';
 d.mounts.forEach(m=>{
 const p=parseInt(m.pct)||0;
 const cls=p>85?'err':p>75?'warn':'';
 html+=`<tr><td>${m.fs}</td><td>${m.size}</td><td>${m.used}</td><td>${m.avail}</td>
 <td>${m.pct}<span class="disk-bar ${cls}"><div style="width:${Math.min(p,100)}%"></div></span></td>
 <td>${m.mnt}</td></tr>`;
 });
 document.getElementById('disk-tbody').innerHTML=html;
 let html2='';
 d.top_dirs.forEach(t=>{ html2+=`<tr><td><b>${t.size}</b></td><td><code>${t.path}</code></td></tr>`; });
 document.getElementById('top-tbody').innerHTML=html2||'<tr><td colspan="2">brak</td></tr>';
 }catch(e){}
}
loadDisk(); setInterval(loadDisk, 15000);
</script>
{% endblock %}