mirror of
https://github.com/retspen/webvirtcloud
synced 2026-11-08 19:26:48 +00:00
050d071ff9
As the storage and network pages; plan reviewed with Codex. - The list is grouped by type (bridges, bonds, VLANs, ethernet; a type the host has none of is left out), three cards a row, with a search of their names, MACs and networks (table_filter.js, which now takes any element with data-search as a row); a card per interface: its link as the kernel reports it (up green, down grey, another state or unknown told as such, no red card for a link that is merely down), MAC, MTU, speed when known, the members it reports and the libvirt networks that use it, linked. - An interface's page: an Interface card (type, libvirt's own state where it manages interfaces, link, start mode, MAC, MTU, speed, STP, networks using it); on a host whose libvirt changes interfaces, a card per family with how it is addressed and its addresses; the members of a bridge, bond or VLAN with their link and speed, or that none is reported; for a bridge, the running VMs' cards on it, directly or through a network using it, with their tap and MAC, linked (wvmInterface.get_vms: one domain listing). Not the bridge's delay: netcf tells it in seconds, the udev backend in hundredths. Start or Stop in its heading, Delete in its menu, disabled while it runs, on hosts that can change interfaces only. - A host whose libvirt only reads interfaces says so once, with that it does not tell their addresses, instead of "None" on every page. - The New interface dialog is one form, as the New pool and New network ones (choice_dialog.js, radio_card.html): Bridge or Ethernet, a bridge's member from the devices it can take, an ethernet interface's device from the ones the host does not define yet, a static address's fields with its choice; a refused interface, or one libvirt refuses, opens it again with what was entered; a made one opens its page. - networks_by_device maps the libvirt networks to their bridges or interfaces on the page's own connection.
75 lines
4.6 KiB
HTML
75 lines
4.6 KiB
HTML
{% extends "base.html" %}
|
||
{% load i18n %}
|
||
{% load static %}
|
||
{% load bootstrap_icons %}
|
||
|
||
{% block title %}{% trans "Interfaces" %} - {{ compute.name }}{% endblock %}
|
||
|
||
{% block page_heading %}{{ compute.name }} - {% trans "Interfaces" %}{% endblock page_heading %}
|
||
|
||
{% block page_heading_extra %}
|
||
{% if changeable %}{% include 'create_iface_block.html' %}{% endif %}
|
||
{% endblock page_heading_extra %}
|
||
|
||
{% block content %}
|
||
{% include "computes/host_nav.html" with section="interfaces" %}
|
||
|
||
{% if changeable is False %}{% include 'interfaces_unchangeable.html' %}{% endif %}
|
||
{% if not ifaces_all %}
|
||
<div class="alert alert-warning shadow-sm">
|
||
{% bs_icon 'exclamation-triangle' %} {% trans "libvirt lists no interfaces of this host." %}
|
||
</div>
|
||
{% else %}
|
||
<input id="filter" class="form-control w-auto mb-3" type="search" placeholder="{% trans "Search interfaces" %}" aria-label="{% trans "Search interfaces" %}">
|
||
{# a card per interface, as the networks', under its type; a type's heading shows while any of its cards does #}
|
||
{% for title, ifaces in iface_groups %}{% if ifaces %}
|
||
<section class="searchable">
|
||
<h2 class="h5 mb-3" data-group-header>{{ title }} <span class="badge text-bg-light border align-middle">{{ ifaces|length }}</span></h2>
|
||
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-3 mb-4">
|
||
{% for iface in ifaces %}
|
||
<div class="col" data-search="{{ iface.name }} {{ iface.mac|default:"" }}{% for net in iface.networks %} {{ net }}{% endfor %}">
|
||
<div class="card h-100">
|
||
<div class="card-header d-flex flex-wrap align-items-center gap-2">
|
||
<a class="fw-semibold me-auto text-break" href="{% url 'interface' compute.id iface.name %}">{{ iface.name }}</a>
|
||
{% include "link_badge.html" with link=iface.link %}
|
||
</div>
|
||
<ul class="list-group list-group-flush flex-grow-1">
|
||
{# the same rows on every card of a type, a dash for what is not known #}
|
||
<li class="list-group-item py-1 d-flex justify-content-between align-items-baseline gap-3">
|
||
<span class="text-body-secondary">{% trans "MAC" %}</span>
|
||
<span class="font-monospace text-break text-end">{{ iface.mac|default:"–" }}</span>
|
||
</li>
|
||
<li class="list-group-item py-1 d-flex justify-content-between align-items-baseline gap-3">
|
||
<span class="text-body-secondary">{% trans "MTU" %}</span><span>{{ iface.mtu|default:"–" }}</span>
|
||
</li>
|
||
{% if iface.type == "ethernet" or iface.type == "bond" %}
|
||
<li class="list-group-item py-1 d-flex justify-content-between align-items-baseline gap-3">
|
||
<span class="text-body-secondary">{% trans "Speed" %}</span><span>{% if iface.speed %}{{ iface.speed }} Mb/s{% else %}–{% endif %}</span>
|
||
</li>
|
||
{% endif %}
|
||
{% if iface.type != "ethernet" %}
|
||
<li class="list-group-item py-1 d-flex justify-content-between align-items-baseline gap-3">
|
||
<span class="text-body-secondary">{% trans "Members" %}</span>
|
||
<span>{% if iface.members %}{% blocktrans count counter=iface.members|length %}{{ counter }} reported{% plural %}{{ counter }} reported{% endblocktrans %}{% else %}–{% endif %}</span>
|
||
</li>
|
||
{% endif %}
|
||
<li class="list-group-item py-1 d-flex justify-content-between align-items-baseline gap-3">
|
||
<span class="text-body-secondary">{% trans "Used by" %}</span>
|
||
<span class="text-end">{% for net in iface.networks %}<a href="{% url 'network' compute.id net %}">{% blocktrans %}network {{ net }}{% endblocktrans %}</a>{% if not forloop.last %}, {% endif %}{% empty %}–{% endfor %}</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
{% endfor %}
|
||
</div>
|
||
</section>
|
||
{% endif %}{% endfor %}
|
||
<div role="status">
|
||
<div id="no-match" class="text-center text-body-secondary py-4" hidden>{% trans "No interface matches the search." %}</div>
|
||
</div>
|
||
{% endif %}
|
||
{% endblock %}
|
||
|
||
{% block script %}
|
||
{% if ifaces_all %}<script src="{% static 'js/table_filter.js' %}"></script>{% endif %}
|
||
{% endblock %}
|