Feature/disk space (#199)
* new backend API to get disk info from psutil * Disk info div + disk space gauge div * styling for git disk space gauge * inital commit - jquery request to system-info endpoint * div disk_info created * get_system_info function is initiated once DOM is fully loaded. * styling for disk-gauge-bar added * get_system_info endpoint returns additionally an information about network, cpu_time and memory * new <div> for graphical output of system info * increased widht for disk-gauge-container * if condition testing an index of response and rendering an output within div for graphical output * div deleted
This commit is contained in:
@ -18,6 +18,7 @@ from fastapi.security import HTTPBasic, HTTPBasicCredentials
|
||||
from v2realbot.enums.enums import Env, Mode
|
||||
from typing import Annotated
|
||||
import os
|
||||
import psutil
|
||||
import uvicorn
|
||||
import orjson
|
||||
from queue import Queue, Empty
|
||||
@ -1025,7 +1026,24 @@ def get_metadata(model_name: str):
|
||||
# "last_modified": os.path.getmtime(model_path),
|
||||
# # ... other metadata fields ...
|
||||
# }
|
||||
|
||||
@app.get("/system-info")
|
||||
def get_system_info():
|
||||
"""Get system info, e.g. disk free space, used percentage ... """
|
||||
disk_total = round(psutil.disk_usage('/').total / 1024**3, 1)
|
||||
disk_used = round(psutil.disk_usage('/').used / 1024**3, 1)
|
||||
disk_free = round(psutil.disk_usage('/').free / 1024**3, 1)
|
||||
disk_used_percentage = round(psutil.disk_usage('/').percent, 1)
|
||||
memory_total = round(psutil.virtual_memory().total / 1024**3, 1)
|
||||
memory_perc = round(psutil.virtual_memory().percent, 1)
|
||||
cpu_time_user = round(psutil.cpu_times().user,1)
|
||||
cpu_time_system = round(psutil.cpu_times().system,1)
|
||||
cpu_time_idle = round(psutil.cpu_times().idle,1)
|
||||
network_sent = round(psutil.net_io_counters().bytes_sent / 1024**3, 6)
|
||||
network_recv = round(psutil.net_io_counters().bytes_recv / 1024**3, 6)
|
||||
return {"disk_space": {"total": disk_total, "used": disk_used, "free" : disk_free, "used_percentage" : disk_used_percentage},
|
||||
"memory": {"total": memory_total, "used_percentage": memory_perc},
|
||||
"cpu_time" : {"user": cpu_time_user, "system": cpu_time_system, "idle": cpu_time_idle},
|
||||
"network": {"sent": network_sent, "received": network_recv}}
|
||||
|
||||
# Thread function to insert data from the queue into the database
|
||||
def insert_queue2db():
|
||||
|
||||
@ -131,9 +131,27 @@
|
||||
|
||||
<!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.41.0/min/vs/editor/editor.main.js"></script> -->
|
||||
<!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.41.0/min/vs/loader.min.js"></script> -->
|
||||
<script src="/static/js/systeminfo.js"> </script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="main" class="mainConteiner flex-container content">
|
||||
<div id="system-info" class="flex-items">
|
||||
<label data-bs-toggle="collapse" data-bs-target="#disk-gauge-container" aria-expanded="true">
|
||||
<h4>System Info </h4>
|
||||
</label>
|
||||
<div id="system-info-output"> </div>
|
||||
<div id="graphical-output">
|
||||
<div id="disk-gauge-container">
|
||||
<span id="title"> Disk Space: </span>
|
||||
<span id="free-space">Free: -- GB</span> |
|
||||
<span id="total-space">Total: -- GB</span> |
|
||||
<span id="used-percent">Used: -- %</span>
|
||||
<div id="disk-gauge">
|
||||
<div id="disk-gauge-bar"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="chartContainer" class="flex-items">
|
||||
<label data-bs-toggle="collapse" data-bs-target="#chartContainerInner" aria-expanded="true">
|
||||
<h4>Chart</h4>
|
||||
@ -215,7 +233,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div id="hist-trades" class="flex-items">
|
||||
<div id="form-trades">
|
||||
<div id="form-trades">
|
||||
<label data-bs-toggle="collapse" data-bs-target="#trades-data">
|
||||
<h4>Trade History</h4>
|
||||
</label>
|
||||
@ -230,6 +248,7 @@
|
||||
<!-- <table id="trades-data-table" class="dataTable no-footer" style="width: 300px;display: contents;"></table> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="runner-table" class="flex-items">
|
||||
<label data-bs-toggle="collapse" data-bs-target="#runner-table-inner">
|
||||
<h4>Running Strategies</h4>
|
||||
|
||||
31
v2realbot/static/js/systeminfo.js
Normal file
31
v2realbot/static/js/systeminfo.js
Normal file
@ -0,0 +1,31 @@
|
||||
function get_system_info() {
|
||||
console.log('Button get system status clicked')
|
||||
$.ajax({
|
||||
url: '/system-info',
|
||||
type: 'GET',
|
||||
beforeSend: function (xhr) {
|
||||
xhr.setRequestHeader('X-API-Key',
|
||||
API_KEY); },
|
||||
success: function(response) {
|
||||
$.each(response, function(index, item) {
|
||||
if (index=="disk_space") {
|
||||
$('#disk-gauge-bar').css('width', response.disk_space.used_percentage + '%');
|
||||
$('#free-space').text('Free: ' + response.disk_space.free + ' GB');
|
||||
$('#total-space').text('Total: ' + response.disk_space.total + ' GB');
|
||||
$('#used-percent').text('Used: ' + response.disk_space.used_percentage + '%');
|
||||
} else {
|
||||
var formatted_item = JSON.stringify(item, null, 4)
|
||||
$('#system-info-output').append('<p>' + index + ': ' + formatted_item + '</p>');
|
||||
}
|
||||
});
|
||||
},
|
||||
error: function(xhr, status, error) {
|
||||
$('#disk-gauge-bar').html('An error occurred: ' + error + xhr.responseText + status);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$(document).ready(function(){
|
||||
get_system_info()
|
||||
});
|
||||
@ -994,3 +994,24 @@ pre {
|
||||
#datepicker:disabled {
|
||||
background-color: #f2f2f2;
|
||||
}
|
||||
|
||||
#disk-gauge-container {
|
||||
text-align: center;
|
||||
width: 400px;
|
||||
}
|
||||
|
||||
|
||||
#disk-gauge {
|
||||
width: 100%;
|
||||
height: 20px;
|
||||
background-color: #ddd;
|
||||
border-radius: 10px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#disk-gauge-bar {
|
||||
height: 100%;
|
||||
background-color: #4285F4;
|
||||
width: 0%; /* Initial state */
|
||||
border-radius: 10px;
|
||||
}
|
||||
Reference in New Issue
Block a user