pixeldrain/fnx_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rearrange admin panel to reduce clutter

Browse Source
This commit is contained in:
Fornax
2024-04-22 22:57:18 +02:00
parent 58e4507f16
commit cf0494d29c
2 changed files with 58 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

110
svelte/src/admin_panel/Home.svelte
View File

@@ -203,6 +203,7 @@ onDestroy(() => {
</a> </a>
<section> <section>
<h3>Process stats</h3>
<table> <table>
<tr> <tr>
<td>DB Time</td> <td>DB Time</td>
@@ -214,63 +215,56 @@ onDestroy(() => {
</tr> </tr>
</table> </table>
<h3>Cache nodes</h3>
</section>
<PeerTable peers={status.peers.reduce((acc, val) => {if (val.role === "cache") {acc.push(val)}; return acc}, [])}/>
<section>
<h3>Storage nodes</h3>
</section>
<PeerTable peers={status.peers.reduce((acc, val) => {if (val.role === "storage") {acc.push(val)}; return acc}, [])}/>
<section>
<h3>Pixelstore stats</h3> <h3>Pixelstore stats</h3>
<table> <div class="table_scroll">
<thead> <table>
<tr> <thead>
<td>Source</td> <tr>
<td>Reads</td> <td>Source</td>
<td>Reads %</td> <td>Reads</td>
<td>Reads / s</td> <td>Reads %</td>
<td>Total size</td> <td>Reads / s</td>
<td>Size %</td> <td>Total size</td>
<td>Size / s</td> <td>Size %</td>
</tr> <td>Size / s</td>
</thead> </tr>
<tbody> </thead>
<tr> <tbody>
<td>Local cache</td> <tr>
<td>{status.local_reads}</td> <td>Local cache</td>
<td>{((status.local_reads / total_reads) * 100).toPrecision(3)}%</td> <td>{status.local_reads}</td>
<td>{status.local_reads_per_sec.toPrecision(4)}/s</td> <td>{((status.local_reads / total_reads) * 100).toPrecision(3)}%</td>
<td>{formatDataVolume(status.local_read_size, 4)}</td> <td>{status.local_reads_per_sec.toPrecision(4)}/s</td>
<td>{((status.local_read_size / total_read_size) * 100).toPrecision(3)}%</td> <td>{formatDataVolume(status.local_read_size, 4)}</td>
<td>{formatDataVolume(status.local_read_size_per_sec, 4)}/s</td> <td>{((status.local_read_size / total_read_size) * 100).toPrecision(3)}%</td>
</tr> <td>{formatDataVolume(status.local_read_size_per_sec, 4)}/s</td>
<tr> </tr>
<td>Neighbour</td> <tr>
<td>{status.neighbour_reads}</td> <td>Neighbour</td>
<td>{((status.neighbour_reads / total_reads) * 100).toPrecision(3)}%</td> <td>{status.neighbour_reads}</td>
<td>{status.neighbour_reads_per_sec.toPrecision(4)}/s</td> <td>{((status.neighbour_reads / total_reads) * 100).toPrecision(3)}%</td>
<td>{formatDataVolume(status.neighbour_read_size, 4)}</td> <td>{status.neighbour_reads_per_sec.toPrecision(4)}/s</td>
<td>{((status.neighbour_read_size / total_read_size) * 100).toPrecision(3)}%</td> <td>{formatDataVolume(status.neighbour_read_size, 4)}</td>
<td>{formatDataVolume(status.neighbour_read_size_per_sec, 4)}/s</td> <td>{((status.neighbour_read_size / total_read_size) * 100).toPrecision(3)}%</td>
</tr> <td>{formatDataVolume(status.neighbour_read_size_per_sec, 4)}/s</td>
<tr> </tr>
<td>Reed-solomon</td> <tr>
<td>{status.remote_reads}</td> <td>Reed-solomon</td>
<td>{((status.remote_reads / total_reads) * 100).toPrecision(3)}%</td> <td>{status.remote_reads}</td>
<td>{status.remote_reads_per_sec.toPrecision(4)}/s</td> <td>{((status.remote_reads / total_reads) * 100).toPrecision(3)}%</td>
<td>{formatDataVolume(status.remote_read_size, 4)}</td> <td>{status.remote_reads_per_sec.toPrecision(4)}/s</td>
<td>{((status.remote_read_size / total_read_size) * 100).toPrecision(3)}%</td> <td>{formatDataVolume(status.remote_read_size, 4)}</td>
<td>{formatDataVolume(status.remote_read_size_per_sec, 4)}/s</td> <td>{((status.remote_read_size / total_read_size) * 100).toPrecision(3)}%</td>
</tr> <td>{formatDataVolume(status.remote_read_size_per_sec, 4)}/s</td>
</tbody> </tr>
</table> </tbody>
</table>
</div>
<p> <p>
Cache threshold: {status.cache_threshold.toFixed(3)} Cache threshold: {formatDataVolume(status.cache_threshold, 4)}
</p> </p>
<h3>Socket statistics</h3> <h3>Socket stats</h3>
<table> <table>
<thead> <thead>
<tr> <tr>
@@ -295,6 +289,16 @@ onDestroy(() => {
</tr> </tr>
</tbody> </tbody>
</table> </table>
<h3>Cache nodes</h3>
</section>
<PeerTable peers={status.peers.reduce((acc, val) => {if (val.role === "cache") {acc.push(val)}; return acc}, [])}/>
<section>
<h3>Storage nodes</h3>
</section>
<PeerTable peers={status.peers.reduce((acc, val) => {if (val.role === "storage") {acc.push(val)}; return acc}, [])}/>
<section>
<h3>Query statistics</h3> <h3>Query statistics</h3>
<div class="table_scroll" style="text-align: left;"> <div class="table_scroll" style="text-align: left;">
<table> <table>

2
svelte/src/util/Formatting.svelte
View File

@@ -28,7 +28,7 @@ export const formatDataVolume = (amt, precision) => {
} else if (amt >= 1e3-1) { } else if (amt >= 1e3-1) {
return (amt/1e3).toPrecision(precision) + " kB"; return (amt/1e3).toPrecision(precision) + " kB";
} }
return amt + " B" return amt.toPrecision(precision) + " B"
} }
export const formatDataVolumeBits = (amt, precision) => { export const formatDataVolumeBits = (amt, precision) => {
amt = amt*8 amt = amt*8