Files
virtuality/web/templates/operation_detail.html
T
Claude 4098c270a4 Интерфейс панели был полностью перерисован
Новый дизайн в стиле коммерческих продуктов, рассчитанный на обычного
пользователя:
- светлая и тёмная темы (следует системной), шрифт Inter и иконки
  Lucide вшиты в панель — работает без интернета;
- общий каркас base.html и компоненты _ui.html вместо 14 независимых
  страниц; адаптивная вёрстка для телефона;
- простой язык: «Работает / Выключена», «Автозапуск», «Доступ из
  интернета» вместо running, autostart, DNAT; технические данные
  убраны во вкладку «Для специалистов»;
- главная: загрузка процессора, памяти и хранилища, карточки машин с
  главным действием и меню остальных, приветственный сценарий для
  первой машины;
- мастер создания машины из трёх шагов с готовыми конфигурациями;
- страница машины с вкладками, переключателем автозапуска и порядком
  загрузки кнопками;
- «Сеть и доступ»: открытие SSH, сайта, RDP и т. д. из списка,
  ручные IP машин, понятная диагностика;
- загрузка образов перетаскиванием с прогрессом и оставшимся временем;
- подтверждения опасных действий в диалоге и уведомления;
- раздел «Помощь»;
- web/presenters.py переводит вывод virsh и /proc в данные для
  страниц; tests/dev_server.py запускает панель с имитацией virsh.

Также: исправлено определение модели CPU на x86 («207» вместо
названия процессора), история версии 0.10.0 и документация обновлены
под Ubuntu 26.04 LTS, в README добавлены скриншоты.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_019LEUXMcdZo7b87mjkUsPgg
2026-09-25 07:01:41 +00:00

64 строки
3.8 KiB
HTML

{% extends "base.html" %}
{% from "_ui.html" import icon, op_badge %}
{% set page_title = operation.title %}
{% set done = operation.status in ('success', 'error') %}
{% block page_header %}
<div class="page-header">
<div>
<div class="eyebrow"><a href="/operations">{{ icon('arrow-left', 'icon-sm') }} Все задачи</a></div>
<h1>{{ operation.title }}</h1>
<p class="lead">Начата {{ operation.created_at }}</p>
</div>
</div>
{% endblock %}
{% block content %}
<section class="grid grid-main">
<div class="stack">
<article class="card" data-operation-id="{{ operation.id }}" data-progress="{{ operation.progress|default(0) }}" data-status="{{ operation.status }}">
<div class="card-body stack-sm">
<div class="row-between">
<span data-op="status">{{ op_badge(operation.status, 'lg') }}</span>
<strong class="stat-value" style="margin:0;font-size:22px" data-op="pct">{{ operation.progress|default(0) }}%</strong>
</div>
<div class="progress lg {{ 'success' if operation.status == 'success' else 'danger' if operation.status == 'error' else '' }}" data-op="progress" style="height:10px"><span data-op="bar" style="width:{{ operation.progress|default(0) }}%"></span></div>
<p class="muted" data-op="message">{{ operation.message }}</p>
{% if operation.vm_name %}
<div class="row" data-op-done {% if operation.status != 'success' %}hidden{% endif %}>
<a class="btn btn-primary" href="/vm/{{ operation.vm_name }}/console" target="_blank" rel="noopener">{{ icon('monitor') }}Открыть экран машины</a>
<a class="btn" href="/vm/{{ operation.vm_name }}">Перейти к машине</a>
</div>
{% endif %}
</div>
</article>
<div>
<div class="terminal-head"><i></i><i></i><i></i><span style="margin-left:6px">Журнал выполнения</span></div>
<pre class="terminal tall" data-op="log">{{ operation.log_tail or 'Ожидаем вывод…' }}</pre>
</div>
</div>
<aside class="stack">
<article class="card">
<div class="card-header"><h2>Параметры</h2></div>
<div class="card-body" style="padding-top:6px;padding-bottom:6px">
{% if operation.vm_name %}<div class="summary-row"><span>Машина</span><strong>{{ operation.vm_name }}</strong></div>{% endif %}
{% if operation.vcpus %}<div class="summary-row"><span>Процессор</span><strong>{{ operation.vcpus }} {{ plural(operation.vcpus|int, 'ядро', 'ядра', 'ядер') }}</strong></div>{% endif %}
{% if operation.memory %}<div class="summary-row"><span>Память</span><strong>{{ operation.memory|format_mb }}</strong></div>{% endif %}
{% if operation.disk_size %}<div class="summary-row"><span>Диск</span><strong>{{ operation.disk_size }} ГБ</strong></div>{% endif %}
{% if operation.network_mode %}<div class="summary-row"><span>Сеть</span><strong>{{ 'Локальная сеть' if operation.network_mode == 'bridge' else 'Автоматически (NAT)' }}</strong></div>{% endif %}
{% if operation.source_path %}<div class="summary-row"><span>Файл</span><strong>{{ operation.source_path.split('/')[-1] }}</strong></div>{% endif %}
<div class="summary-row"><span>Запустил</span><strong>{{ operation.created_by|default('—') }}</strong></div>
</div>
</article>
{% if operation.cmd %}
<details class="advanced">
<summary>{{ icon('terminal', 'icon-sm') }}Команда<span class="chev">{{ icon('chevron-down', 'icon-sm') }}</span></summary>
<div class="advanced-body"><pre class="terminal" style="max-height:260px">{{ operation.cmd }}</pre></div>
</details>
{% endif %}
</aside>
</section>
{% endblock %}