145 lines
4.5 KiB
HTML
145 lines
4.5 KiB
HTML
{% extends 'layout.html' %}
|
||
|
||
{% block title %} Редактирование {% endblock %}
|
||
|
||
|
||
{% block style %}
|
||
table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
}
|
||
th, td {
|
||
padding: 12px;
|
||
text-align: left;
|
||
border-bottom: 1px solid #ddd;
|
||
}
|
||
th {
|
||
background-color: #f2f2f2;
|
||
}
|
||
.add {
|
||
display: inline-block;
|
||
margin-right: 10px;
|
||
padding: 8px 12px;
|
||
background-color: #007bff;
|
||
color: #fff;
|
||
border-radius: 4px;
|
||
text-decoration: none;
|
||
}
|
||
.add:hover {
|
||
background-color: #4da3ff;
|
||
}
|
||
.action-button {
|
||
padding: 6px 10px;
|
||
background-color: #28a745;
|
||
color: #fff;
|
||
border: none;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
margin-right: 5px;
|
||
}
|
||
.action-button.delete {
|
||
background-color: #dc3545;
|
||
}
|
||
.search-container {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
#searchInput {
|
||
width: 50%;
|
||
padding: 8px;
|
||
margin-bottom: 10px;
|
||
box-sizing: border-box;
|
||
border: 1px solid #ccc;
|
||
border-radius: 4px;
|
||
}
|
||
{% endblock %}
|
||
|
||
{% block body %}
|
||
<div class="search-container">
|
||
<input type="text" id="searchInput" onkeyup="searchTable()" placeholder="Поиск...">
|
||
</div>
|
||
<a href="{{ url_for('vm.add_virtual_machine') }}" class="add">Добавить ВМ</a>
|
||
<table id="vmTable">
|
||
<tr>
|
||
<th>#</th>
|
||
<th>Гипер</th>
|
||
<th>Адрес</th>
|
||
<th>Название</th>
|
||
<th>Операционная система</th>
|
||
<th>ОЗУ</th>
|
||
<th>ЦПУ</th>
|
||
<th>Состояние</th>
|
||
<th>Действия</th>
|
||
</tr>
|
||
{% for vm in virtual_machines %}
|
||
<tr>
|
||
<td>{{ loop.index }}</td>
|
||
<td>{{ vm.hyper }}</td>
|
||
<td>
|
||
{% if vm.ip_addres == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.ip_addres }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.name }}</td>
|
||
<td>{{ vm.os }}</td>
|
||
<td>
|
||
{% if vm.memory < 1024 %}
|
||
{{ vm.memory }} МБ
|
||
{% else %}
|
||
{{ (vm.memory // 1024) | int }} ГБ
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.cpu }}</td>
|
||
<td>
|
||
{% if vm.power_status == 'poweredOn' %}
|
||
<img src="{{ url_for('static', filename='on.png') }}" width="20" height="20">
|
||
{% elif vm.power_status == 'poweredOff' %}
|
||
<img src="{{ url_for('static', filename='off.png') }}" width="20" height="20">
|
||
{% else %}
|
||
Не определено
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
<div style="display: flex; align-items: center;">
|
||
<button class="action-button" onclick="window.location.href='{{ url_for('vm.edit_virtual_machine', id=vm.id) }}'">Редактировать</button>
|
||
<button class="action-button delete" onclick="confirmDelete('{{ url_for('vm.delete_virtual_machine', id=vm.id) }}')">Удалить</button>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</table>
|
||
|
||
<script>
|
||
function searchTable() {
|
||
var input, filter, table, tr, td, i, txtValue;
|
||
input = document.getElementById("searchInput");
|
||
filter = input.value.toUpperCase();
|
||
table = document.getElementById("vmTable");
|
||
tr = table.getElementsByTagName("tr");
|
||
|
||
for (i = 0; i < tr.length; i++) {
|
||
td = tr[i].getElementsByTagName("td");
|
||
for (var j = 0; j < td.length; j++) {
|
||
if (td[j]) {
|
||
txtValue = td[j].textContent || td[j].innerText;
|
||
if (txtValue.toUpperCase().indexOf(filter) > -1) {
|
||
tr[i].style.display = "";
|
||
break;
|
||
} else {
|
||
tr[i].style.display = "none";
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
function confirmDelete(url) {
|
||
if (confirm('Вы уверены, что хотите удалить данную ВМ?')) {
|
||
window.location.href = url;
|
||
}
|
||
}
|
||
</script>
|
||
{% endblock %}
|