377 lines
15 KiB
HTML
377 lines
15 KiB
HTML
{% extends 'layout.html' %}
|
||
|
||
{% block title %} Дашборд {% endblock %}
|
||
|
||
{% block style %}
|
||
h1 {
|
||
color: #333;
|
||
text-align: center;
|
||
margin-top: 20px;
|
||
}
|
||
|
||
body {
|
||
font-family: Arial, sans-serif;
|
||
margin: 0;
|
||
padding: 0;
|
||
background-color: #f0f0f0;
|
||
}
|
||
|
||
.table-container {
|
||
overflow-x: hidden;
|
||
}
|
||
|
||
table {
|
||
width: 100%;
|
||
margin-left: 0;
|
||
padding: 0;
|
||
border-collapse: collapse;
|
||
border-radius: 5px;
|
||
overflow: hidden;
|
||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
|
||
max-width: 100%;
|
||
}
|
||
|
||
th, td {
|
||
padding: 8px;
|
||
text-align: center;
|
||
border-bottom: 1px solid #ddd;
|
||
font-size: 11px;
|
||
width: 10%;
|
||
}
|
||
|
||
th {
|
||
background-color: #007bff;
|
||
color: #fff;
|
||
}
|
||
|
||
tr:hover {
|
||
background-color: #f5f5f5;
|
||
}
|
||
|
||
button {
|
||
border: none;
|
||
background-color: #007bff;
|
||
color: #fff;
|
||
padding: 2px 5px;
|
||
border-radius: 4px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
button:hover {
|
||
background-color: #0056b3;
|
||
}
|
||
|
||
a.add {
|
||
display: inline-block;
|
||
background-color: #007bff;
|
||
color: #ff1;
|
||
padding: 5px 10px;
|
||
border-radius: 5px;
|
||
text-align: center;
|
||
text-decoration: none;
|
||
margin-right: 10px;
|
||
}
|
||
|
||
a.add:hover {
|
||
background-color: #0056b3;
|
||
}
|
||
|
||
.search-container {
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
.button-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>
|
||
<div class="button-container">
|
||
<a href="{{ url_for('vm.add_virtual_machine') }}" class="add">Добавить ВМ</a>
|
||
<a href="/vms" class="add">Редактировать</a>
|
||
<a href="/manage" class="add">Управление</a>
|
||
</div>
|
||
|
||
<div class="table-container">
|
||
<table>
|
||
<thead>
|
||
<tr>
|
||
<th>#</th>
|
||
<th>Адрес</th>
|
||
<th>Название</th>
|
||
<th>Назначение</th>
|
||
<th>ОC</th>
|
||
<th>Состояние</th>
|
||
<th>Кто занял</th>
|
||
<th>Под задачей</th>
|
||
<th>Когда занято</th>
|
||
<th>Действия</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for vm in virtual_machines %}
|
||
{% if vm.status != 'Свободно' %}
|
||
<tr style="background-color: #ffcccc;">
|
||
<td><a href="/vm_info/{{ vm.name }}/{{ vm.hyper }}">{{ loop.index }}</a></td>
|
||
<td>
|
||
{% if vm.ip_addres == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.ip_addres }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.name }}</td>
|
||
<td>
|
||
{% if vm.appointment == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.appointment }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.os }}</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>
|
||
{% if vm.technical != True %}
|
||
{% if vm.who_borrowed == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.who_borrowed }}
|
||
{% endif %}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
{% if vm.technical != True %}
|
||
{{ vm.task }}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
{% if vm.technical != True %}
|
||
{{ vm.busy_date }}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
{% if vm.technical != True %}
|
||
{% if vm.status == 'Свободно' %}
|
||
<button onclick="openOccupationForm({{ vm.id }})">ЗАНЯТЬ</button>
|
||
{% else %}
|
||
<button onclick="releaseOccupation({{ vm.id }})">ОСВОБОДИТЬ</button>
|
||
{% endif %}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
</tr>
|
||
{% endif %}
|
||
{% endfor %}
|
||
{% for vm in virtual_machines %}
|
||
{% if vm.status == 'Свободно' and vm.technical != True %}
|
||
<tr>
|
||
<td><a href="/vm_info/{{ vm.name }}/{{ vm.hyper }}">{{ loop.index }}</a></td>
|
||
<td>
|
||
{% if vm.ip_addres == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.ip_addres }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.name }}</td>
|
||
<td>
|
||
{% if vm.appointment == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.appointment }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.os }}</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>
|
||
{% if vm.technical != True %}
|
||
{% if vm.who_borrowed == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.who_borrowed }}
|
||
{% endif %}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
{% if vm.technical != True %}
|
||
{{ vm.task }}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
{% if vm.technical != True %}
|
||
{{ vm.busy_date }}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
<td>
|
||
{% if vm.technical != True %}
|
||
{% if vm.status == 'Свободно' %}
|
||
<button onclick="openOccupationForm({{ vm.id }})">ЗАНЯТЬ</button>
|
||
{% else %}
|
||
<button onclick="releaseOccupation({{ vm.id }})">ОСВОБОДИТЬ</button>
|
||
{% endif %}
|
||
{% else %}
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
{% endif %}
|
||
</td>
|
||
</tr>
|
||
{% endif %}
|
||
{% endfor %}
|
||
{% for vm in virtual_machines %}
|
||
{% if vm.technical == True %}
|
||
<tr style="background-color: #ffff99;">
|
||
<td><a href="/vm_info/{{ vm.name }}/{{ vm.hyper }}">{{ loop.index }}</a></td>
|
||
<td>
|
||
{% if vm.ip_addres == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.ip_addres }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.name }}</td>
|
||
<td>
|
||
{% if vm.appointment == None %}
|
||
Данных нет
|
||
{% else %}
|
||
{{ vm.appointment }}
|
||
{% endif %}
|
||
</td>
|
||
<td>{{ vm.os }}</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>х</td>
|
||
<td>х</td>
|
||
<td>х</td>
|
||
<td>
|
||
<img src="{{ url_for('static', filename='sotp.png') }}" width="20" height="20">
|
||
</td>
|
||
</tr>
|
||
{% endif %}
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
|
||
<script>
|
||
function openOccupationForm(vmId) {
|
||
var task = prompt("Введите задачу:");
|
||
|
||
if (task !== null) {
|
||
var currentDate = new Date();
|
||
var busyDate = currentDate.toLocaleString();
|
||
|
||
var form = document.createElement('form');
|
||
form.method = 'post';
|
||
form.action = '/occupy/' + vmId;
|
||
|
||
|
||
var taskInput = document.createElement('input');
|
||
taskInput.type = 'hidden';
|
||
taskInput.name = 'task';
|
||
taskInput.value = task;
|
||
form.appendChild(taskInput);
|
||
|
||
var busyDateInput = document.createElement('input');
|
||
busyDateInput.type = 'hidden';
|
||
busyDateInput.name = 'busy_date';
|
||
busyDateInput.value = busyDate;
|
||
form.appendChild(busyDateInput);
|
||
|
||
document.body.appendChild(form);
|
||
form.submit();
|
||
}
|
||
}
|
||
|
||
function releaseOccupation(vmId) {
|
||
var confirmation = confirm("Вы уверены, что хотите освободить эту ВМ?");
|
||
if (confirmation) {
|
||
var form = document.createElement('form');
|
||
form.method = 'post';
|
||
form.action = '/release/' + vmId;
|
||
|
||
var statusInput = document.createElement('input');
|
||
statusInput.type = 'hidden';
|
||
statusInput.name = 'status';
|
||
statusInput.value = 'Свободно';
|
||
form.appendChild(statusInput);
|
||
|
||
document.body.appendChild(form);
|
||
form.submit();
|
||
}
|
||
}
|
||
|
||
function searchTable() {
|
||
var input, filter, table, tr, td, i, txtValue;
|
||
input = document.getElementById("searchInput");
|
||
filter = input.value.toUpperCase();
|
||
table = document.getElementsByTagName("table")[0];
|
||
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";
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
</script>
|
||
{% endblock %}
|