mirror of
https://github.com/retspen/webvirtcloud
synced 2024-12-25 15:45:23 +00:00
modified 'create new instance' screen with compute details
This commit is contained in:
parent
96ea999926
commit
3cd4212cdd
3 changed files with 42 additions and 27 deletions
|
@ -49,6 +49,10 @@ class Compute(Model):
|
||||||
def cpu_count(self):
|
def cpu_count(self):
|
||||||
return self.proxy.get_node_info()[3]
|
return self.proxy.get_node_info()[3]
|
||||||
|
|
||||||
|
@cached_property
|
||||||
|
def cpu_usage(self):
|
||||||
|
return round(self.proxy.get_cpu_usage().get('usage'))
|
||||||
|
|
||||||
@cached_property
|
@cached_property
|
||||||
def ram_size(self):
|
def ram_size(self):
|
||||||
return self.proxy.get_node_info()[2]
|
return self.proxy.get_node_info()[2]
|
||||||
|
|
|
@ -39,8 +39,8 @@
|
||||||
<script src="{% static 'js/filter-table.js' %}"></script>
|
<script src="{% static 'js/filter-table.js' %}"></script>
|
||||||
{% if request.user.is_superuser %}
|
{% if request.user.is_superuser %}
|
||||||
<script>
|
<script>
|
||||||
function goto_compute() {
|
function goto_compute(compute) {
|
||||||
let compute = $("#compute_select").val();
|
//let compute = $("#compute_select").val();
|
||||||
window.location.href = "{% url 'instances:create_instance_select_type' 1 %}".replace(1, compute);
|
window.location.href = "{% url 'instances:create_instance_select_type' 1 %}".replace(1, compute);
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
|
|
||||||
<!-- Modal pool -->
|
<!-- Modal pool -->
|
||||||
<div class="modal fade" id="AddInstance" tabindex="-1" role="dialog" aria-labelledby="AddInstanceModal" aria-hidden="true">
|
<div class="modal fade" id="AddInstance" tabindex="-1" role="dialog" aria-labelledby="AddInstanceModal" aria-hidden="true">
|
||||||
<div class="modal-dialog">
|
<div class="modal-dialog modal-dialog-scrollable modal-lg">
|
||||||
<div class="modal-content">
|
<div class="modal-content">
|
||||||
<div class="modal-header">
|
<div class="modal-header">
|
||||||
<h5 class="modal-title">{% trans "Choose a compute for new instance" %}</h5>
|
<h5 class="modal-title">{% trans "Choose a compute for new instance" %}</h5>
|
||||||
|
@ -15,34 +15,45 @@
|
||||||
<form method="post" aria-label="Select compute for instance create form">
|
<form method="post" aria-label="Select compute for instance create form">
|
||||||
{% csrf_token %}
|
{% csrf_token %}
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<label class="col-sm-4 col-form-label">{% trans "Compute" %}</label>
|
<table class="table table-hover">
|
||||||
<div class="col-sm-6">
|
<thead>
|
||||||
<select class="form-select" id="compute_select">
|
<tr style="cursor:default;pointer-events:none">
|
||||||
<option>{% trans "Please select" %}</option>
|
<th>{% trans "Name" %}</th>
|
||||||
|
<th>{% trans "VCPU" %}
|
||||||
|
<th>{% trans "Cpu Usage" %}</th>
|
||||||
|
<th>{% trans "Memory" %}</th>
|
||||||
|
<th>{% trans "Mem Usage" %}</th>
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
{% for compute in computes %}
|
{% for compute in computes %}
|
||||||
<option {% if compute.status is not True %} class="font-italic text-muted" {% else %} value="{{ compute.id }}" {% endif %}>{{ compute.name }}</option>
|
{% if compute.status is True %}
|
||||||
{% empty %}
|
<tr style="cursor:pointer" onclick="goto_compute('{{ compute.id }}')">
|
||||||
<option value="None">{% trans "None" %}</option>
|
<td>{{ compute.name }}</td>
|
||||||
{% endfor %}
|
<td>{{ compute.cpu_count }}</td>
|
||||||
</select>
|
<td>
|
||||||
|
<div class="progress">
|
||||||
|
<div class="progress-bar bg-success" role="progressbar" style="width: {{ compute.cpu_usage }}%"
|
||||||
|
aria-valuenow="{{ compute.cpu_usage }}" aria-valuemin="0" aria-valuemax="100">{{ compute.cpu_usage }}%
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</td>
|
||||||
|
<td>{{ compute.ram_size|filesizeformat }}</td>
|
||||||
|
<td>
|
||||||
|
<div class="progress">
|
||||||
|
<div class="progress-bar bg-success" role="progressbar" style="width: {{ compute.ram_usage }}%"
|
||||||
|
aria-valuenow="{{ compute.ram_usage }}" aria-valuemin="0" aria-valuemax="100">{{ compute.ram_usage }}%
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
{% endif %}
|
||||||
|
{% endfor %}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
<div class="modal-footer">
|
|
||||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
|
|
||||||
{% trans "Close" %}
|
|
||||||
</button>
|
|
||||||
{% if computes %}
|
|
||||||
<button type="submit" class="btn btn-primary" name="choose" onclick='goto_compute()'>
|
|
||||||
{% trans "Choose" %}
|
|
||||||
</button>
|
|
||||||
{% else %}
|
|
||||||
<button class="btn btn-primary disabled">
|
|
||||||
{% trans "Choose" %}
|
|
||||||
</button>
|
|
||||||
{% endif %}
|
|
||||||
</div>
|
|
||||||
</div> <!-- /.modal-content -->
|
</div> <!-- /.modal-content -->
|
||||||
</div> <!-- /.modal-dialog -->
|
</div> <!-- /.modal-dialog -->
|
||||||
</div> <!-- /.modal -->
|
</div> <!-- /.modal -->
|
||||||
|
|
Loading…
Reference in a new issue